Daftar Isi:
- Apa yang Dilakukan Pengembang Front-End
- Kuasai Dasar-dasar
- Alat Pengembangan Web Dasar
- Teknologi Pendukung Pengembangan Web Dasar
Semua yang perlu Anda ketahui untuk menjadi pengembang web front-end!
Jika Anda ingin belajar coding dengan tujuan menjadi front-end developer, ada banyak hal yang perlu Anda ketahui agar sukses dan mendapatkan pekerjaan. Anda harus mulai dengan memahami dasar-dasar pengembangan web, lalu menambah keterampilan Anda dengan alat dan sumber daya tambahan yang digunakan sebagian besar pengembang web.
Jika Anda telah melakukan penelitian dan Anda yakin bahwa pengembangan front-end adalah cara yang tepat untuk Anda, lihat alat yang juga perlu Anda kuasai. Mengetahui alat dan sumber daya ini tidak hanya akan membantu Anda dalam proses pengembangan web, tetapi juga akan membantu Anda mengalahkan persaingan saat melamar pekerjaan.
Terakhir, jika Anda tidak 100% yakin apakah belajar kode adalah sesuatu yang ingin Anda coba, berikut adalah 10 alasan mengapa Anda harus belajar kode.
Apa yang Dilakukan Pengembang Front-End
Pertama-tama Anda harus tahu persis apa itu web developer front-end. Secara umum, pengembangan web terdiri dari tiga jenis pekerjaan yang tersegmentasi:
- Pengembang Front-End. Orang ini (juga disebut pengembang web front-end atau insinyur front-end) adalah pengembang web yang bekerja dengan ujung depan situs web dan aplikasi web, yang mencakup semua yang dilihat dan digunakan oleh pengguna di browser halaman web.. Pengembang front-end biasanya berfokus pada desain.
- Pengembang Back-End. Orang ini bertanggung jawab atas bagian belakang atau sisi server situs web dan aplikasi web. Bagian belakang adalah tempat semua data dimanipulasi dan diperbarui. Pengembang back end biasanya adalah pemikir logis.
- Pengembang Full-Stack. Orang ini adalah ninja spesial yang ahli di ujung depan dan belakang. Jika Anda senang bekerja dengan hal-hal yang "cantik" serta "sangat canggih", pekerjaan ini mungkin cocok untuk Anda…
Juga, dahulu kala di galaksi yang sangat jauh… ada judul yang dikenal sebagai Desainer Web. Perancang web tidak benar-benar harus berurusan dengan belajar kode sama sekali, dan hanya berfokus pada aspek desain halaman web.
Hari-hari ini, karena situs web dan aplikasi web telah menjadi jauh lebih fungsional dan interaktif, pasar kerja menuntut layanan dari orang-orang yang tahu bagaimana merancang dan membuat kode.
Masih ada beberapa pekerjaan yang tersedia untuk perancang web, tetapi sebagian besar perancang web mencoba belajar kode untuk peluang, gaji, dan keamanan pekerjaan yang lebih baik. Dalam banyak hal, pekerjaan front-end developer dapat dianggap sebagai desainer web yang mahir dengan bahasa pemrograman, mungkin JavaScript.
HTML adalah kerangka halaman web, CSS adalah kulitnya, dan JavaScript adalah otaknya.
Kuasai Dasar-dasar
Anda benar-benar harus memiliki pemahaman yang kuat tentang tiga teknologi dasar yang digunakan dalam pengembangan web, yaitu:
- HTML: ini adalah blok bangunan dasar pertama dari semua halaman web, ini memberikan struktur pada halaman web. HTML adalah bahasa pengkodean, tetapi ini bukan bahasa pemrograman lengkap, melainkan bahasa mark-up. Bahasa markup memungkinkan Anda untuk "menandai" teks untuk tujuan pemrosesan.
- CSS: ini adalah blok bangunan dasar kedua dari semua halaman web, yang bertanggung jawab atas "tampilan dan nuansa" halaman web. CSS juga bukan bahasa pemrograman.
- JavaScript: adalah blok bangunan ketiga dan bahasa pemrograman aktual pertama yang dipelajari sebagian besar pengembang web. JavaScript berjalan di browser komputer, dan memungkinkan fungsionalitas halaman web.
Jika Anda membayangkan tiga blok bangunan pengembangan web seperti yang Anda bayangkan seseorang, Anda dapat memikirkannya seperti ini: HTML adalah tulang dan kerangka halaman web, CSS menyediakan kulit, dan JavaScript adalah otaknya.
Anda dapat mengambil celah dalam mempelajari kode sekarang dengan mengikuti kursus kilat HTML oleh Brad Traversy, yang merupakan WHIZ dalam mengajarkan teknologi pengembangan web:
Alat Pengembangan Web Dasar
- Editor Teks: kami menulis kode menggunakan editor teks, dan Anda harus memilih salah satunya dan menjadi terbiasa dengan semua kemampuannya. Beberapa editor teks populer saat ini meliputi: Atom, Sublime Text, Brackets, Visual Studio Code, dan MS Notepad dan Mac Text Edit yang bagus.
- Alat Pengembang Peramban: Google Chrome dan Mozilla Firefox keduanya dilengkapi dengan alat pengembang internal yang memungkinkan Anda melihat dan memanipulasi kode situs web apa pun di peramban Anda.
- Alat-alat ini bagus untuk tujuan debugging, dan tentu saja… Anda adalah satu-satunya orang yang dapat melihat perubahan yang Anda buat ke situs web dengan alat pengembang, karena Anda hanya memanipulasi situs seperti yang muncul di dalam browser Anda sendiri.
- Sistem Kontrol Versi: Sistem kontrol versi memungkinkan Anda mengelola perubahan pada proyek web Anda. Ini memungkinkan Anda untuk kembali ke versi proyek yang berbeda tanpa mengganggu proyek yang diterapkan sampai Anda menyempurnakan versi yang sedang Anda kerjakan. Ada beberapa sistem kontrol versi yang digunakan, tetapi Git sejauh ini adalah yang paling dominan.
- Command Line (Terminal): Penguasaan baris perintah secara menyeluruh diperlukan untuk pengembangan web profesional. Baris perintah terlihat menakutkan, tetapi membuat pengunggahan paket perangkat lunak baru menjadi mudah, dan juga membuatnya sangat mudah untuk dinavigasi melalui file dan folder. Anda bisa belajar menguasai baris perintah dalam sehari.
Teknologi Pendukung Pengembangan Web Dasar
- CSS Preprocessor: teknologi ini membuat penulisan dan pemeliharaan CSS menjadi mudah. Sejauh ini, preprocessor CSS yang paling umum adalah SASS, dan dapat dipelajari dalam satu hari
- Kerangka Kerja CSS: Saat membuat tugas CSS yang kompleks lebih sedikit memakan waktu untuk membuatnya, kerangka kerja CSS yang perlu Anda ketahui adalah Twitter Bootstrap.
- CSS Flexbox & CSS Grid: Keduanya adalah tata letak model web CSS yang secara signifikan membantu membuat halaman web Anda responsif seluler.
- Alat Bundling: Webpack dan Browserify dengan Gulp digunakan untuk membantu memuat halaman Anda lebih cepat ke dalam browser. Alat-alat ini berfungsi untuk memperkecil atau mempersingkat konten Anda untuk waktu pemuatan yang lebih cepat.
- Library & Framework JavaScript: library dan framework memungkinkan Anda menambahkan interaksi JavaScript ke halaman web dengan cepat, lebih mudah, dan lebih efisien. Mereka juga membantu menyederhanakan aspek JavaScript yang lebih kompleks. Beberapa library dan framework populer meliputi: JQuery, React, dan Angular.
Seperti yang Anda lihat, ada banyak hal yang perlu Anda pelajari untuk menjadi pengembang web front-end. Kabar baiknya adalah SEMUA alat, sumber daya, dan teknologi ini dapat dipelajari secara gratis. Anda sudah dapat melihat bahwa ada banyak sekali sumber daya gratis di YouTube saja…
Jika Anda membutuhkan pembelajaran yang lebih komprehensif, semua alat ini dapat dipelajari dengan mudah menggunakan sumber belajar online seperti Team Treehouse. Ada juga kursus tunggal yang tersedia, seperti kursus Pengembangan Front-End Lengkap atau Modern React on Udemy.