Membuat Formulir Web (Tutorial)

Bahasa: Jerman

Membuat formulir web untuk situs web (Tutorial Praktis)

Bagaimana cara membuat formulir web untuk situs web Anda - dijelaskan langkah demi langkah! Apakah Anda ingin menanyakan nama, alamat email, password, checkbox, tanggal, daftar, atau dropdown: Pelajari dalam tutorial praktis ini bagaimana Anda bisa mencapai formulir web yang sepenuhnya fungsional dari formulir HTML pertama Anda.

Membuat formulir web - dari dasar hingga formulir berfungsi
Membuat dan membaca bidang untuk memasukkan email, kata sandi, dan sebagainya dengan benar
Membuat checkbox, radiobutton, dropdown, input teks multiline, dan lainnya
Tutorial praktis, enam jam lengkap dari pengembang Stephan Haewß
Dengan file proyek untuk mendapatkan informasi konten yang ditunjukkan
Ideal untuk pengembang web, desainer web, dan pengembang front-end

Dari pengisian nama dan alamat email yang sederhana hingga formulir kontak yang lebih kompleks dengan fungsi unggah: Di sini kamu akan belajar membuat formulir web secara komprehensif untuk situs webmu!

Zugriff auf alle Inhalte

In der Mitgliedschaft ab * € monatlich

oder

Inhalt in den Warenkorb

Sofort-Download nach Kauf: einmalig * €

detail

Isi: 6 h Pelatihan video
Lisensi: pribadi dan komersial Hak penggunaan
Bonus: termasuk bahan kerja

Kategori

Desain web, CMS, & pengembangan

Dibuat dengan cinta:

Stephan Haewß

Membuat formulir web - Pengantar

Gratis

Membuat formulir web: 1.1 | Pengantar dan Gambaran

Di sini kamu akan mengetahui tentang apa yang terjadi dalam kursus dan apa yang bisa kamu harapkan.

Membuat formulir web: 1.2 | Formulir HTML - mengapa dan bagaimana menggunakannya?

Membuat formulir web: 1.2 | Formulir HTML - Mengapa dan bagaimana digunakan?

Mengapa seseorang harus menggunakan formulir HTML dan bagaimana cara umumnya?

Membuat formulir web: 1.3 | Membuat proyek pertama

Di sini proyek akan dibuat di mana formulir pertama akan diintegrasikan.

Membuat formulir web: 1.4 | Formulir HTML pertama

Kamu membuat formulir sederhana pertamamu dan mempelajari struktur dasarnya.

Formulir

Membuat formulir web: 2.1 | Mengapa menggunakan formulir atau tag formulir?

Kami akan menjelaskan berbagai kemungkinan penggunaan formulir HTML dalam aplikasi web.

Unduh file proyek

Membuat formulir web: 2.2 | Membaca data formulir dengan JavaScript

Kamu akan belajar bagaimana cara membaca dan memproses data yang dimasukkan oleh pengguna dengan JavaScript.

Membuat formulir web: 2.3 | Pempercantik formulir dan tipe masukan lainnya

Membuat formulir web: 2.3 | Peningkatan tampilan formulir dan tipe input tambahan

Saya akan membahas tentang opsi desain formulir dan memperkenalkan berbagai jenis kolom input kepada Anda.

Validasi input dan penanganan peristiwa untuk formulir

Membuat formulir web: 3.1 | Validasi pertama dengan masukan email

Membuat formulir web: 3.1 | Validasi pertama dengan input email

Anda mengimplementasikan validasi email sederhana untuk memastikan bahwa data yang dimasukkan sesuai dengan format email.

Membuat formulir web: 3.2 | Tipe input number dan atribut

Membuat Formulir Web: 3.2 | Jenis Input number dan Atribut

Kami mempelajari tentang masukan numerik dan atribut-atribut terkait untuk membatasi nilai-nilai yang mungkin.

Membuat formulir web: 3.3 | Merespons perubahan di elemen input

Membuat formulir web: 3.3 | Merespons perubahan pada elemen input

Kamu belajar bagaimana menangani peristiwa di JS yang terjadi saat mengubah konten kotak masukan.

Membuat formulir web: 3.4 | Merespons perubahan dengan addEventListener

Kami akan mendalami topik penanganan peristiwa dan menggunakan addEventListener untuk reaksi yang lebih fleksibel.

Membuat formulir web: 3.5 | Overview: Elemen input

Membuat formulir web: 3.5 | Gambaran: Elemen input

Ringkasan lengkap berbagai jenis input dan sifat-sifatnya.

Membuat formulir web: 3.6 | Atribut: readonly, disabled, placeholder, minlength, maxlength

Kami akan menjelaskan atribut-atribut penting untuk mengontrol perilaku kotak masukan.

Membuat formulir web: 3.7 | Atribut: pola dan diperlukan

Membuat formulir web: 3.7 | Atribut: pola dan dibutuhkan

Kamu akan belajar bagaimana melakukan validasi kompleks dengan ekspresi reguler dan atribut required.

Membuat Formulir Web: 3.8 | Atribut spellcheck

Kami akan menunjukkan cara mengaktifkan atau menonaktifkan pengecekan ejaan dalam formulir Anda.

Membuat formulir web: 3.9 | Jenis input password

Anda akan belajar cara membuat kolom password.

Kotak centang

Membuat formulir web: 4.1 | Checkbox - Dasar-dasar

Kami akan mulai dengan dasar-dasar kotak centang dan cara penggunaannya.

Membuat formulir web: 4.2 | Menggunakan checkbox dalam JS

Kamu akan belajar cara membaca dan mengatur kondisi kotak centang dengan JavaScript.

Membuat formulir web: 4.3 | Menyatukan tampilan checkbox

Membuat formulir web: 4.3 | Mengatur gaya checkbox

Saya akan menunjukkan berbagai cara untuk menyesuaikan tampilan kotak centang.

Jenis-jenis input form dan bidang yang diperluas

Membuat formulir web: 5.1 | Tombol Radio

Saya akan menjelaskan cara kerja tombol radio dan bagaimana cara menggunakannya dalam formulir Anda.

Membuat formulir web: 5.2 | Unggah Berkas

Anda belajar cara mengizinkan pengguna mengunggah file.

Membuat formulir web: 5.3 | Input Berkas dengan JS

Kamu memperdalam pengetahuanmu tentang pengunggahan file dan belajar cara mengedit file yang dipilih dengan JavaScript.

Membuat formulir web: 5.4 | Kolom input tersembunyi

Membuat formulir web: 5.4 | Kolom masukan tersembunyi

Saya membahas penggunaan field input tersembunyi untuk pengiriman informasi tambahan.

Membuat formulir web: 5.5 | Memasukkan angka

Membuat formulir web: 5.5 | Input angka

Kami merangkum berbagai cara untuk memasukkan angka.

Membuat formulir web: 5.6 | Range Slider

Kamu akan belajar cara memungkinkan pengguna memilih rentang nilai dengan penggeser rentang dan cara mengimplementasikan penggeser.

Membuat formulir web: 5.7 | Input tanggal dan waktu

Saya akan menunjukkan cara mengimplementasikan input tanggal dan waktu dalam formulir Anda.

Membuat formulir web: 5.8 | Email dan URL

Kami fokus pada kolom input khusus untuk alamat email dan URL.

Membuat formulir web: 5.9 | Warna

Anda akan belajar cara memilih warna melalui kotak pemilihan warna.

Membuat formulir web: 5.10 | Jenis search dan tel

Saya akan memperkenalkan kepada Anda kotak masukan untuk kata kunci pencarian dan nomor telepon.

Membuat formulir web: 5.11 | Input teks multi-baris dengan textarea

Kamu akan mempelajari cara mengimplementasikan masukan teks multi-baris dengan elemen textarea.

Membuat formulir web: 5.12 | Daftar dengan pilihan<select>

Saya akan menjelaskan bagaimana membuat daftar pilihan dari elemen pilihan-.

Struktur formulir yang diperluas dan validasi dengan JavaScript dan Framework

Membuat formulir web: 6.1 | Pengelompokan opsi

Kamu akan belajar cara mengelompokkan pilihan dalam daftar pilihan.

Membuat formulir web: 6.2 | Daftar usulan dengan datalist

Membuat formulir web: 6.2 | Daftar saran dengan datalist

Saya akan menunjukkan cara membuat daftar saran untuk kolom masukan.

Membuat formulir web: 6.3 | Atribut autocomplete

Kamu akan belajar cara mengaktifkan pengisian otomatis input.

Membuat formulir web: 6.4 | Bagian formulir dengan Fieldsets

Saya akan menjelaskan cara mengelola formulir Anda dengan elemen fieldset.

Membuat formulir web: 6,5 | Validasi lewat JavaScript

Membuat formulir web: Validasi melalui JavaScript

Pengantar lengkap tentang validasi formulir sisi klien dengan JavaScript.

Membuat formulir web: 6.6 | Penanganan sisi server dengan Node.JS dan Express

Membuat formulir web: 6.6 | Pengolahan sisi server dengan Node.JS dan Express

Saya akan menunjukkan cara menerima data formulir yang dikirimkan ke server menggunakan Node.js dan Express .

Unduh file proyek

Membuat formulir web: Menerima data formulir dengan handler GET

Membuat formulir web: 6.7 | Menerima data formulir dengan penangan GET

Kamu akan belajar cara menerima data formulir dengan metode GET.

Membuat formulir web: 6.8 | Menerima data formulir dengan POST Handler

Membuat formulir web: 6.8 | Menerima data formulir dengan handler POST

Saya akan menjelaskan bagaimana Anda menerima data formulir menggunakan metode POST.

Membuat formulir web: 6.9 | Membuat formulir dan elemen formulir di React - Membuat proyek

Kita akan mulai membuat proyek React dan mengintegrasikan formulir.

Unduh file proyek

Membuat formulir web: 6.10 | Elemen Input dalam React

Kamu akan belajar cara menggunakan berbagai elemen input di React.

Membuat formulir web: 6.11 | Elemen Pilihan dan Textarea dalam React

Membuat formulir web: 6.11 | Elemen Select dan Textarea dalam React

Kami akan membahas elemen select- dan textarea- di React.

Membuat formulir web: 6.12 | Formulir dengan Alpine.js

Saya akan menunjukkan cara menangani formulir dengan kerangka kerja JavaScript Alpine.js.

Unduh file proyek

Membuat formulir web: 6.13 | Formulir dengan VueJs

Saya akan menjelaskan cara mengintegrasikan formulir ke dalam aplikasi Vue.js.

Unduh file proyek

Detail tentang isi

Formulir Web dan Bidang Masukan Mereka – Dijelaskan Langkah demi Langkah
Kamu ingin memperluas pengetahuanmu dalam Mengembangkan Formulir Web? Dalam tutorial ini, kamu akan belajar cara membuat formulir fungsional dengan HTML, JavaScript, serta skrip dan pustaka sisi server. Baik itu hanya permintaan nama dan email sederhana atau formulir kontak yang kompleks – setelah kursus ini, kamu akan mampu untuk memprogram formulir web pribadi dengan bidang masukan yang diperlukan dan menyematkannya ke dalam situs web kamu.
Video tutorial selama lebih dari enam jam dari pengembang perangkat lunak dan tutor Stephan Haewß ditujukan untuk semua orang yang ingin membuat formulir web, pengembang yang menggunakan formulir dalam kerangka kerja JS-UI, dan pengembang web yang ingin meminta masukan pengguna tanpa menggunakan banyak JavaScript. Optimal bagi pengembang web, desainer web, pengembang depan, pemula dan mahir – dan mudah dipahami bahkan bagi mereka yang sudah memiliki pengetahuan dasar HTML.

Dasar-Dasar HTML untuk Formulir di Situs Web Anda

Jika kamu belum memiliki pengetahuan atau hanya sedikit pengetahuan dalam bidang formulir web, mulailah pelajaran ini dengan dasar-dasarnya. Kamu akan belajar segala hal penting tentang struktur dan tentang elemen-elemen berbeda dalam formulir HTML. Pelajari berbagai bidang masukan seperti kotak centang, tombol radio, unggahan berkas, bidang kata sandi, dan teks beserta atribut-atribut dan kemungkinan validasinya. Peroleh kemampuan untuk membuat formulir yang ramah pengguna dan dapat diakses oleh berbagai elemen formulir.

Formulir Web Dinamis, Pengolahan Sisi Server & Formulir di Kerangka Kerja JavaScript Modern

Interaksi dengan elemen formulir dapat dikendalikan secara spesifik dengan JavaScript untuk menciptakan pengalaman yang dinamis dan ramah pengguna. Dengan demikian, masukan dapat dibaca, diedit, dan divalidasi secara otomatis jika diperlukan. Melalui validasi di sisi klien, data yang salah atau tidak lengkap dapat ditangkap langsung oleh pengguna sebelum dikirim ke server. Hal ini meningkatkan kualitas data dan mengurangi kemungkinan kesalahan. Aspek penting lainnya adalah penyesuaian dinamis formulir dengan masukan dan interaksi pengguna. Semua aspek ini dibahas dalam video tutorial tersebut.

Selain itu, kamu akan mempelajari Mengirim dan Menerima Data Formulir ke server serta pengolahan di sisi server contohnya dengan Node.js dan Express. Selain itu, kamu juga akan melihat penggunaan formulir web di kerangka kerja JavaScript modern, seperti integrasi formulir dalam aplikasi React dan pembuatan formulir reaktif dengan React Hooks dan komponen. Dapatkan tips penting tentang styling formulir dan elemen formulir serta keamanan data.

Ini yang Akan Kamu Pelajari dalam Tutorial Praktis Ini

Manfaatkan kursus ini untuk menguasai pengetahuan dalam mengembangkan formulir HTML. Pelajari berbagai bidang masukan dan kekhususan mereka. Ketahui cara mengontrol elemen formulir dengan JavaScript dan cara menerapkan atribut dan validasi. Selain itu, pelajari cara mengintegrasikan formulir ke dalam kerangka kerja JavaScript modern seperti React, VueJs, dan AlpineJs.