Jika kamu ingin berganti karir atau meningkatkan kemampuanmu di bidang karir yang
sekarang, tech skill adalah hal yang bisa kamu lakukan dengan cepat.
Selain tiga alasan utama seperti bayaran lebih besar, kerja kreatif, dan jadwal yang
fleksibel, ada banyak alasan lain mengapa bekerja di bidang teknologi sangat menarik.
Tapi apa maksudnya bekerja di bidang teknologi? Jika kamu ingin tahu lebih banyak
tentang apa saja bagian dari bidang teknologi, kamu bisa melihatnya di sini.
Sementara itu, artikel ini akan fokus membahas tentang front-end developer.
Pekerjaan front-end developer adalah membangun website menggunakan HTML, CSS,
dan JavaScript. Front-end developer adalah orang-orang yang membuat design dan
mengembangkannya sampai sebuah website dapat berjalan.
Mempelajari front-end development adalah cara yang paling cepat untuk berkarir di
bidang teknologi. Kamu akan mempunyai skill dasar yang spesifik sehingga membuatmu
menarik bagi perusahaan, tetapi skill tersebut juga cukup luas sehingga kamu tetap
mempunyai banyak pilihan pekerjaan. Percayalah, permintaan pekerjaan
terhadap front-end developer sangat banyak.
Bagi sebagian orang, hal di atas sudah cukup untuk membuat mereka yakin untuk
memulai belajar coding. Tetapi akan lebih baik jika kamu dapat memvisualisasikan
segala hal secara spesifik sebelum kamu memulai sesuatu. Sebuah gambaran umum
tentang skill apa saja yang kamu butuhkan untuk menjadi seorang front-end
developer tentu akan sangat membantu.
Melihat dari kualifikasi yang diinginkan perusahaan dalam iklan lowongan kerja, ada
beberapa skill yang umum disebutkan, diantaranya HTML, CSS, dan JavaScript.
Kebanyakan dari kamu pasti juga sudah tahu ketiga hal tersebut. Tetapi, bagaimana
dengan hal-hal lain yang belum banyak diketahui, seperti version control, platform,
atau framework?
Kamu akan terbiasa dengan istilah-istilah di atas saat mulai belajar tech skill. Untuk
memudahkanmu, berikut 10 skill penting yang diperlukan setiap front-end developer.\
1. HTML/CSS
Dua hal tersebut selalu ada dalam kualifikasi pekerjaan front-end developer.
HyperText Markup Language (HTML) adalah bahasa markup standar yang digunakan
untuk membuat halaman web. Bahasa markup adalah sebuah cara untuk
membuat notes dalam dokumen digital. HTML adalah hal paling dasar yang kamu
butuhkan untuk mengembangkan website.
Cascading Style Sheets (CSS) adalah bahasa pemograman yang digunakan untuk
mepresentasikan file HTML yang telah kamu buat. HTML berfungsi membangun
fondasi dari website kamu, sedangkan CSS digunakan untuk mengatur layout website,
warna, font, dan semua style lain.
Kedua bahasa pemograman ini adalah skill dasar yang sangat penting untuk
seorang front-end developer. Singkatnya, tanpa HTML dan CSS, tidak akan ada web
development.
2. JavaScript/jQuery
Salah satu tool dasar lain untuk front-end development adalah JavaScript. JavaScript
menentukan fungsi-fungsi yang ada di dalam sebuah website.
Jika kamu hanya ingin membangun website yang sederhana, maka HTML dan CSS
sudah cukup. Tetapi jika kamu membutuhkan fitur interaktif seperti audio, video, game,
atau animasi, maka kamu membutuhkan JavaScript untuk mengimplementasikannya.
Iya benar, tetapi perlu kamu ketahui bahwa CSS dan JavaScript merupakan sebuah
bagian besar dalam front-end development sehingga akan menjadi dasar dari skill-
skill lain yang kamu perlukan.
Framework dari CSS dan JavaScript adalah koleksi dari file CSS atau JavaScript yang
membantu kamu melakukan tugas tertentu melalui pembagian common functionality.
Sebagai contoh, saat kamu log in ke sebuah website atau mencari sebuah blog, kamu
tidak mendapat teks dokumen yang kosong, sebelumnya telah ada kode JavaScript di
dalamnya.
Kamu juga dapat menggunakan beberapa framework secara bersamaan. Misalnya yang
umum dilakukan yaitu menggabungkan Bootstrap dengan AngularJS. Content
website diatur oleh Angular, sedangkan tampilan oleh Bootstrap.
Kamu akan selalu bekerja menggunakan CSS dan JavaScript, oleh karena itu,
penguasaan atas framework-framework yang ada, akan menjadikan
kamu developer yang lebih efisien.
4. Preprocessor CSS
Meskipun CSS adalah skill yang sangat esensial, namun terkadang banyak batasan di
dalamnya. Beberapa batasan tersebut adalah CSS tidak bisa mendefinisikan variabel,
fungsi, atau melakukan operasi aritmatika.
Hal di atas bisa menjadi masalah saat skala project semakin berkembang. Kamu akan
merasa menghabiskan banyak waktu untuk menulis baris-baris kode yang sebenarnya
bisa dikerjakan secara lebih singkat. Sama seperti framework CSS dan
JavaScript, Preprocessor CSS adalah sebuah tool yang akan membuat hidupmu
sebagai developer lebih mudah dan fleksibel.
Beberapa contoh Preprocessor CSS adalah Sass, LESS, atau Stylus. Kamu bisa menulis
atau mengubah kode secara jauh lebih simpel. Kemudian preprocessor CSS tersebut
akan mengubah kode ke dalam bentuk CSS yang nantinya akan bekerja di website kamu.
Sebagai contoh, kamu ingin mengubah shade warna biru yang kamu gunakan di
beberapa bagian website. Menggunakan preprocessor CSS, kamu hanya perlu mengganti
satu hex value melainkan harus mengubahnya berkali-kali dalam kode CSS-mu.
5. Version Control/Git
Kamu pasti telah mengalami banyak revisi setelah semua kerja keras dengan marking
up menggunakan HTML, styling dengan CSS, dan memprogram dengan JavaScript. Jika
kemudian ada yang salah saat kamu sedang menyelesaikan sebuah project, tentu kamu
tidak ingin mengulangnya dari awal lagi. Version control adalah sebuah proses melacak
dan mengontrol perubahan-perubahan kode kamu sehingga kamu tidak perlu
mengulangi semuanya dari awal.
Salah satu software untuk melakukan version control adalah Git. Ini adalah tool untuk
melacak perubahan-perubahan yang telah kamu lakukan sehingga kamu bisa kembali ke
versi kerja kamu yang sebelumnya dan menemukan apa yang salah tanpa merusaknya.
Ini adalah skill yang akan sangat berguna bagi kamu dan calon perusahaanmu nanti.
6. Responsive Design
Apakah kamu masih ingat masa di mana membuka website hanya dapat dilakukan
melalui PC? Kebanyakan orang mungkin sudah lupa hal tersebut karena pada saat ini
sangat banyak media untuk membuka website. Dari PC dalam berbagai
ukuran, handphone, dan tablet.
Pernahkah kamu menyadari bahwa website yang kamu buka menyesuaikan ukurannya
sendiri tanpa perlu kamu atur lagi? Ini dilakukan melalui responsive design. Memahami
prinsip-prinsip responsive design dan bagaimana mengimplementasikannya
saat coding adalah kunci dari front-end development.
Perlu diingat bahwa responsive design adalah bagian dari framework CSS, contohnya
bootstrap. Skill-skill tersebut saling berhubungan, dan kamu bisa mempelajarinya secara
beriringan.
7. Testing/Debugging
Dari website lokal yang sangat sederhana sampai website untuk bank internasional,
selalu tidak lepas dari yang namanya bug. Agar website bisa berjalan dengan baik, maka
kamu selalu harus menghilangkan bug yang ada. Jadi, kemampuan untuk
menemukan bug dan melakukan debug adalah skillyang sangat esensial untuk front-end
developer.
Ada beberapa metode untuk melakukan testing web development, yaitu functional
testing dan unit testing.
Testing adalah bagian yang sangat penting dari proses front-end development.
Untungnya ada program yang bisa membantu mempercepat dan menyederhanakan
proses testing, antara lain Mocha dan Jasmine.
Sama seperti testing dan debugging di atas, semua web browser modern dilengkapi
dengan developer tools. Tool ini membantu kamu untuk melakukan test dan
merapikan website secara sepesifik di dalam browser tersebut.
Hal di atas akan bervariasi dari satu browser ke browser lainnya, tetapi umumnya
terdiri dari inspector dan console JavaScript. Inspectormemungkinkan kamu untuk
melihat bagaimana HTML dan CSS terhubung dengan komponen-komponen di
dalam browser. Kamu juga bisa mengedit HTML dan CSS secara langsung
di browser tersebut.
Kamu mungkin sudah menyadari bahwa HTML, CSS dan JavaScript adalah tiga alat
utama untuk front-end development. Dan kemudian, skill-skill lain adalah penunjang
agar kamu dapat memanfaatkan HTML, CSS, dan JavaScript secara lebih efisien. Begitu
juga halnya dengan automation toolsdan web performance.
Kamu bisa membangun website secanggih apapun, tetapi jika peformanya kurang baik,
maka semua akan menjadi sia-sia. Peforma web adalah jumlah waktu yang diperlukan
oleh website kamu untuk loading. Jika kamu mengalami hal tersebut, ada beberapa cara
yang dapat kamu lakukan antara lain: optimalisasi gambar dan meminimalisir CSS dan
JavaScript tanpa mengganggu fungsinya.
Program-program yang dapat membantu kamu melakukan hal ini, antara lain: Grunt
dan gulp.
Salah satu hal yang bisa memperbagus tampilan website adalah penggunaan Graphic
User Interfaces (GUIs). Siapa yang mau mengklik baris kode di layar? Lebih menarik
untuk melihat dan klik menu yang interaktif.
GUI memang dapat sangat membantu untuk web development dan coding, serta mereka
juga mudah digunakan. Tetapi, GUI juga mempunyai batasan-batasan untuk beberapa
aplikasi. Ada saatnya di mana kamu tetap butuh untuk membuka sebuah terminal di
komputermu agar dapat menuliskan command line.
Meskipun sebagian besar kerjamu menggunakan GUI, kamu akan tetap dipercaya jika
kamu menguasai command line.
SOFT SKILL
Di luar hard skill yang disebutkan di atas, kamu juga tidak boleh melupakan soft
skill seperti komunikasi dan kemampuan bekerja di dalam tim. Soft skillini sangat
diperlukan baik di bidang industri teknologi, maupun di semua bidang lainnya. Jangan
lupa untuk selalu mengasah profesionalitasmu seiring kamu menjalani karir di bidang
yang paling inovatif ini!