Langkah — langkah untuk menjadi Front-End developer

Halo semuanya. Di tulisan ini, aku mau berbagi langkah-langkah yang bisa kita lakukan untuk menjadi front-end developer. untuk disclaimer ini bukan aturan baku tapi semoga dapat membantu kamu yang ingin menjadi front-end dev

Perlu diketahui,aku juga bukan sesepuh dibidang front-end development. tetapi aku cuma ingin berbagi sesuatu yang sudah aku pelajari selama ini.

Awal Perjalanan Front-End Developer

Ada 5 langkah utama yang dapat kamu ikuti agar kamu bisa sampai kepada tujuan kamu menjadi seorang front-end developer.

Perlu diketahui juga, Front-end developer adalah profesi yang sangat dibutuhkan di dalam sebuah perusahaan atau agency. Kamu juga bisa menjadi freelancer ( pekerja lepas ) untuk menghasilkan income.

Langkah Pertama : Fundamental Desain

Kamu mungkin akan berpikir “front-end developer kan merubah desain menjadi code, emang harus bisa desain yah?” atau “kok belajar fundamental desain sih? kan kita bukan desainer” dan lain-lain.

Yap, kenapa belajar fundamental desain itu penting bagi front-end developer karena front-end developer tidak hanya merubah desain menjadi code.

Dia juga harus memahami dasar desain itu sendiri supaya desain yang telah dibuat oleh UI desainer juga dapat diimplementasikan dengan baik.

Kamu tidak harus belajar sampai kelas advance di tahap ini cukup ketahui dasar-dasar nya saja.

Fundamental desain :

Color & Contrast : Pelajari kombinasi warna, gradient, dan kontras.

White Space : ruang kosong yang dibutuhkan sehingga desain terlihat rapi dan elegan.

Visual hierarchy : salah satu prinsip utama yang dapat membuat website anda mencapai tujuan yang diinginkan.

Complexity vs Simplicity : kompleksitas dan kesederhanaan

Consistency : konsistensi sangat dibutuhkan untuk memberikan memori kepada user supaya dapat di akses dengan mudah

Langkah Kedua : Desain dan Prototype UI

Ada pepatah mengatakan “Janganlah berlari jika kamu belum bisa berjalan”. Desain dulu baru coding.

Topik ini mungkin sering diperdebatkan di medium.com “apakah web developer harus bisa desain UI dan prototype”.

Menurutku, tidak ada salahnya seoarang web developer bisa desain UI dan itu juga bisa menjadi nilai tambah. Jika kamu bekerja di sebuah perusahaan besar dan memiliki budget yang cukup untuk merekrut UI designer maka kamu tidak harus menguasai UI desain dan prototyping.

Tetapi, Jika kamu seorang freelancer atau pekerja di sebuah perusahaan yang tidak bisa hiring UI designer maka kamu akan mempunyai nilai lebih dibanding developer lainnya. Pelajari dasar-dasar desain UI saja. Dan juga jika kamu mendesain terlebih dahulu ketika ditengah-tengah ada perubahan maka kamu bisa merubahnya dengan mudah.

Tetapi, jika kamu langsung coding tanpa ada desain maka kamu akan kesulitan saat ingin merubahnya. Dan juga mendesain terlebih dahulu bisa memberikan gambaran kepada calon klien.

Banyak sekali tutorial-tutorial yang beredar di youtube atau jika kamu ingin berbayar dan bersertifikat kunjungi udemy.com, dari situ kamu akan belajar dimentoring dan terstruktur.

Kebanyakan tools yang digunakan untuk mendesain UI gratis, kamu bisa menggunakannya kapanpun dan dimanapun.

Tools untuk desain UI :

1. Adobe XD ( Win 10 & Mac only)
2. Sketch (Mac only)
3. Figma
4. Invision App
5. (Tulis di kolom komentar jika ada tambahan)

Alternatif: Jika kamu memang tidak ingin belajar desain kamu bisa mencari UI kit aatau desain template website yang ada di internet. Kamu bisa menggunakannya untuk latihan atau kamu juga bisa memodifikasinya.

Jika kamu memiliki cukup budget, kamu bisa merekrut UI designer sehingga kamu bisa bekerja sama dengannya untuk mengerjakan project.

Langkah Ketiga : Belajar HTML & CSS

Sekarang kita memasuki tahap koding. Menguasai HTML dan CSS adalah hal yang wajib bagi Front-End Developer. Karena dari HTML & CSS saja website sudah bisa terbentuk dan berfungsi secara tampilan.

HTML singkatan dari Hypertext Markup Language, HTML berfungsi untuk membangun kerangka website dan memberikan konten web. Dengan Bahasa markup ini kamu bisa menyusun layout, memberikan text, gambar, video dan lain-lain.

Namun, dengan HTML saja, website tersebut masih belum sempurna secara desain. Kamu harus mempelajari CSS untuk membuat website lebih indah dan sesuai dengan desain yang telah dibuat.

CSS adalah cascading style sheet, berfungsi untuk mempercantik website, membuat responsive website, dan lain-lain. Banyak sekali tutorial-tutorial yang tersebar di internet. Kamu bisa mempelajarinya di w3schools.com. Situs tersebut memiliki dokumentasi yang lengkap dan juga terstruktur.

Berikut daftar tools yang bisa kamu gunakan:

1. Visual Studio Code
2. Sublime text
3. Notepad++
4. (Tulis di kolom komentar jika ada tambahan)

Langkah Keempat : Belajar Javascript

Javascript adalah Bahasa pemrograman level tinggi. Untuk front-end dev sendiri berfungsi untuk membuat website lebih dinamis dan interaktif. Contoh : membuat slider, animasi, pop up, alert , dan lain-lain

Setelah menguasai html dan css, kamu harus mempelajari javascript karena penggunaaan bahasa ini sangatlah luas. Dari sinilah, kamu akan mempelajari dasar logika pemrograman. Langkah ini mungkin sedikit lebih sulit karena kamu juga harus mengerti algoritma pemrograman.

Kamu akan terbiasa jika kamu terus membaca dokumentasi-dokumentasi javascript. Karena dengan membaca dokumentasi, kamu akan mengetahui sintaks dasar dan kegunaan dari built-in function javascript.

Untuk media belajar, cobalah buka channel web pemrograman unpas. Di channel tersebut, kamu akan belajar dasar pemrograman dengan javascript dari tingkat dasar sampai tingkat lanjutan. Atau jika kamu ingin langsung terjun ke studi kasus, kamu bisa mencari tutorial di udemy.com, lebih terstruktur dan ada grup diskusi. Tapi, kamu harus menyisihkan uang jajanmu karena tutorial di udemy.com berbayar.

Langkah Terakhir : Belajar Framework/Library JS

Langkah terakhir ini mungkin akan menjadi perjalanan panjang kamu selama menjadi front-end developer. Karena teknologi front-end seiring waktu terus berkembang dan kamu harus selalu update ilmu supaya selalu relevan di dunia kerja.

Framework adalah kerangka kerja yang memudahkan developer untuk mengembangkan sebuah web app yang kompleks.

Library adalah kode yang telah disederhanakan sehingga dapat memudahkan dan menyingkat waktu pengembangan.

Framework/library digunakan untuk membuat web app yang kompleks. Kamu juga bisa membuat SPA( Single Page Application ).

Udemy.com adalah salah satu platform yang tepat untuk mempelajari framework atau library js. Karena kamu akan diajari dari tingkat basic sampai ke tingkat advance. Ada juga platform dari Indonesia, pintaar.com, disana juga ada course framework / library js yang bisa kamu gunakan.

Kesimpulan

Jadi kesimpulannya, jika kamu ingin menjadi front-end developer kamu harus memulainya dengan belajar fundamental desain dan UI.

Setelah itu, kamu harus menguasai html dan css, kamu dapat menguasainya dengan cepat karena tidak terlalu susah. Asalkan, kamu niat dan terus membiasakan diri untuk berkarya.

Dan tahap selanjutnya, kamu harus mempelajari javascript dan framework/library nya. Dengan teknologi tersebut, kamu akan bisa membuat web app yang kompleks.

Penutup

Yap, sampai disini dulu untuk artikel kali ini. Semoga bermanfaat buat kamu yang ingin menjadi Front-end Developer.

Terimakasih sudah membaca sampai akhir, Harapannya, artikel ini dapat membuka wacana bagi para pembaca. Jangan lupa untuk tulis pendapat kamu di kolom komentar ya, dan jika kamu suka, kamu bisa pencet tombol share supaya temen-temen kamu bisa membaca dan mengambil manfaat.

Sampai jumpa di artikel selanjutnya.