Cara Mengirimkan Formulir Login Kustom dalam Beberapa Menit – Tanpa Sponsor Coding
Diterbitkan: 2019-02-14Jika Anda dapat membuat formulir login pengguna untuk produk atau aplikasi Anda dalam hitungan menit – dan tanpa pengkodean – Anda pasti melakukan sesuatu yang ilegal atau ajaib. Atau, Anda dapat menggunakan Mason, platform pengembangan fitur yang dirancang agar tim dapat bekerja sama untuk merancang, membangun, dan menerapkan fitur front-end.
Mari kita jelaskan dulu apa itu Mason. Kemudian, kami akan menunjukkan kepada Anda betapa mudahnya membuat, mendesain, dan menerapkan formulir login hanya dalam hitungan menit.
Mason adalah platform front-end-as-a-service tempat Anda dapat merancang, membangun, dan menerapkan fitur yang berfungsi penuh untuk aplikasi perangkat lunak. Anda diberi kendali penuh dalam mengelola pengalaman front-end di basis kode Anda, sehingga memungkinkan untuk membuat fitur langsung dalam hitungan menit.
Mason secara efektif menghilangkan kebutuhan untuk menyediakan dokumentasi untuk pengembangan dan harus menunggu siklus penerapan berikutnya; sehingga menghilangkan minggu jika tidak bulan dari jadwal kerja Anda. Anda akan menggabungkan prototyping, QA, dan engineering turun untuk bergerak secepat kilat.
Inilah cara Anda menggunakan Mason:
- Pilih komponen atau komponen dari platform yang akan Anda gunakan untuk merancang fitur yang ingin Anda buat; dalam hal ini login pengguna tunggal atau alur login dengan berbagai perintah dan opsinya.
- Pilih templat untuk digunakan atau buat sendiri. Apa pun itu, Anda dapat menyesuaikannya hingga piksel akhir.
- Rebut pengembang selama beberapa menit, minta mereka membantu Anda menghubungkan titik akhir API Anda, tekan "Terbitkan" dan fitur yang baru Anda buat langsung aktif dalam hitungan detik. Sekarang, Anda dapat mengekspor fitur Anda dan dengan satu baris kode, masukkan ke basis kode Anda.
Cara Membuat Form Login Tanpa Menulis Kode
Seperti yang akan Anda lihat dari tutorial video, sama sekali tidak sulit. Yang harus Anda lakukan adalah menekan Play, duduk, dan bersiap untuk terkesan dengan betapa mudahnya itu.
Jika Anda ingin membaca petunjuk sekali lagi untuk memastikan Anda melakukannya dengan benar, kami akan mengulanginya untuk keuntungan Anda.
Anda akan menggunakan Mason Canvas dan Mason Builder untuk membuat formulir login pengguna.
Mason Canvas adalah papan tulis virtual tempat Anda membuat desain front-end secara visual. Tidak ada pengkodean yang terlibat, dan Anda tidak perlu menyerahkan desain Anda ke tim pengembangan.
Mason Builder memungkinkan Anda membuat dan menyesuaikan fitur untuk situs web atau aplikasi dan menghubungkannya ke backend yang sudah ada.
Penting untuk dicatat bahwa setiap kali Anda membuat perubahan pada fitur, itu secara otomatis diterjemahkan ke dalam HTML/CSS yang valid; kode yang tidak memerlukan proses debug yang dapat memperlambat siklus penerapan.
Dengan alat ini di tangan, Anda siap untuk melanjutkan dengan mengikuti petunjuk langkah demi langkah ini:
Langkah 1. Bentuk Formulir Login Anda
Saat Anda masuk ke akun Mason Anda, Anda akan melihat tombol "+Fitur Baru". Mengkliknya akan menampilkan berbagai opsi. Klik pada opsi "Kanvas".
+Fitur Baru → Kanvas
Selanjutnya, klik pada tab "Elemen" (di sebelah kiri Anda), dan pergi ke bagian "Formulir". Pilih formulir dan seret dan jatuhkan ke Wadah yang sudah berada di Kanvas.
Elemen → Bentuk → bentuk seret dan lepas dari Kanvas
Klik pada ruang putih di sekitar formulir untuk memilih Wadah. Setelah melakukannya, Anda akan melihat bilah di sebelah kanan Anda. Penting: Periksa bilah untuk memastikan ketinggian diatur 100% sebelum melanjutkan.
Anda sekarang hanya memiliki 3 klik untuk membentuk formulir login Anda! Sudah selesai dilakukan dengan baik!
Pilih formulir input "Data" di dalam formulir Anda dan klik tab "Klon" di bagian atas untuk menambahkan bidang input sebanyak yang Anda perlukan. Anda kemudian ingin beralih ke tab "Atribut" pada bilah di sebelah kanan Anda untuk memilih jenis input yang Anda butuhkan untuk setiap bidang – teks, nomor, URL, dll.
Data → Klon → tambahkan kolom input
Data → Atribut → pilih jenis input untuk setiap kolom input
Langkah 2: Menyesuaikan Formulir Anda
Menyesuaikan formulir menggunakan Mason pada dasarnya adalah hal yang mudah. Pilih formulir Anda sekali lagi dan cari bilah sisi "Penataan Gaya". "Penataan gaya" memungkinkan Anda menata formulir sesuai keinginan Anda, termasuk mengubah batas pengeditan berwarna, mengubah ukuran atau latar belakang, dan banyak lagi.
Setelah mencapai gaya yang Anda inginkan, pindah ke tombol "Kirim", yang juga dapat Anda sesuaikan.
Yang tersisa hanyalah menekan "Terbitkan".
Jangan lupa untuk menekan "Simpan" secara berkala juga untuk menyimpan pekerjaan Anda!
Langkah 3: Saatnya Membuat Formulir Anda Sepenuhnya Berfungsi
Untuk membuat formulir Anda berfungsi penuh, Anda harus pergi ke Konfigurasi dan pilih "Sumber data". Di sinilah Anda mengisi Titik Akhir API Anda. Pengembang di tim Anda dapat membantu Anda dengan ini hanya dalam beberapa menit jika Anda bukan pengguna produk teknis.
Jika Anda tidak yakin apa itu Titik Akhir API, itu adalah alamat (URL) yang memungkinkan pengguna mengakses aplikasi Anda (dalam hal ini, masuk).
Sumber data → isi API Endpoint
Langkah Selanjutnya: Kembali ke bagian “Formulir” dan pilih “Posting” sebagai metode pengiriman Anda. Yang tersisa hanyalah menekan "Publikasikan" dan klik tombol "Pratinjau" untuk memverifikasi bahwa semuanya sudah beres.
Bagian formulir → Posting → Publikasikan → Pratinjau
Langkah 4: Menguji Formulir Masuk
Karena Anda mengikuti petunjuk ini, Anda dapat yakin bahwa semuanya berfungsi, tetapi tidak ada salahnya untuk memeriksanya. Anda dapat melakukannya dengan memeriksa permintaan jaringan dengan alat pengembang Chrome.
Cukup buka "Periksa - Jaringan" di mana Anda dapat melihat permintaan yang dibuat browser. Dengan mengisi beberapa kredensial pengujian, Anda dapat memverifikasi bahwa formulir Anda berfungsi sesuai rencana.
Hal Keren Lainnya yang Dapat Dilakukan Mason dan Mengapa Anda Harus Mencobanya
Di mana merancang dan membangun bagian fungsional untuk UI dapat dengan mudah memakan waktu berminggu-minggu atau bahkan berbulan-bulan, Anda dapat mencapai hasil yang sama dalam hitungan menit dengan Mason dan menguji kreasi Anda dalam hitungan detik – menghemat waktu, uang, dan sumber daya dalam prosesnya.
Dan, Anda juga menerima manfaat tambahan ini:
- Perputaran secepat kilat dalam memberikan solusi fungsional akan memukau klien Anda jauh melebihi harapan mereka.
- Anda tidak akan terjebak pada satu proyek selama berminggu-minggu. Sebagai gantinya, Anda dapat melakukan pekerjaan ekstra dan memberi ruang bagi klien baru.
- Fitur yang Anda buat akan konsisten dengan panduan gaya merek. Jika sesuatu berubah, seperti warna atau font, ubah saja di dalam Mason, tekan Publish, dan perubahan Anda akan didorong langsung ke fitur front end yang sudah berfungsi.
Mason berorientasi pada tim. Dengan melakukan semua pekerjaan di front-end, anggota tim Anda merasa diberdayakan, dan kolaborasi antara anggota tim, klien, dan pemangku kepentingan proyek lainnya menjadi kebiasaan.
Yang terbaik dari semuanya, siklus waktu henti dan penerapan yang pernah Anda alami dapat menjadi sejarah karena setiap individu yang berwenang dapat masuk, membuat perubahan, dan membuat fitur yang diperbarui menjadi hidup.
Tingkatkan produktivitas tim Anda setidaknya dengan faktor 10-Mason terbuka dan siap untuk Anda, dan gratis untuk memulai, jadi klik di sini untuk mencobanya!