Panduan pemula mutlak untuk mempelajari pengembangan web pada tahun 2018

Apakah Anda mencoba mempelajari pengembangan web, tetapi tidak yakin harus mulai dari mana?

Anda mungkin sudah mencoba mencari di Google untuk belajar, dan ada banyak sumber di luar sana. Tetapi banyak dari mereka memasukkan terlalu banyak informasi.

Saat ini, yang Anda butuhkan adalah dasar-dasar pengembangan web - penjelasan umum dengan beberapa arah ke mana harus pergi berikutnya.

Dan itulah mengapa saya menulis panduan langsung ini tentang cara menjadi pengembang web ...

Jika Anda seorang pembuat kode pemula, panduan ini cocok untuk Anda!

Inilah yang dicakup oleh panduan ini:

  • Penjelasan tentang area dasar dalam pengembangan web,
  • Ikhtisar bahasa dan kerangka kerja pemrograman,
  • Dan sumber daya yang direkomendasikan untuk membantu Anda belajar.

Ini diarahkan untuk pemula, dengan tautan dan informasi bermanfaat untuk memberi Anda awal dalam riset Anda sendiri.

Inilah yang akan kita lalui.

Daftar Isi

* Termasuk tautan Lompat, sehingga Anda dapat melompat-lompat jika mau!

Bagian 1: Kami akan memulai dengan dasar-dasarnya:

  • Apakah pengembangan web itu: menjelaskan apa yang sebenarnya terjadi ketika Anda memuat situs web di browser Anda.
  • HTML, CSS, dan JavaScript: fondasi setiap situs web.
  • Alat yang berguna: menggunakan editor kode dan Git
  • Apa itu front-end dan back-end?

Bagian 2: Lalu kita akan masuk ke keterampilan front-end yang lebih menengah:

  • Desain responsif: memastikan situs web Anda terlihat bagus di komputer, tablet, dan ponsel.
  • Grunt, Gulp, dan WebPack: menggunakan alat bangun untuk melakukan beberapa pekerjaan untuk Anda!
  • Pengantar kerangka kerja front-end JavaScript: React, Vue, dan Angular

Bagian 3: Diikuti oleh keterampilan back-end:

  • Ikhtisar bahasa back-end yang paling umum digunakan dan bagaimana mereka menumpuk.
  • Pengenalan cepat ke basis data dan bahasa basis data apa yang harus Anda pelajari.
  • Dasar-dasar pengaturan situs web di server.

Epilog: Sumber belajar

  • Daftar singkat kursus, tutorial, dan buku online yang direkomendasikan.

Sekarang, sebelum kita membahas segala hal tentang situs web ... mari kita mulai dengan Anda!

Apa tujuan akhir Anda dalam mempelajari kode?

Dalam bukunya 7 Kebiasaan Orang yang Sangat Efektif, Stephen R. Covey menegaskan bahwa untuk menjadi sukses, Anda harus "mulai dengan akhir dalam pikiran."

Pertimbangkan alasan Anda sendiri untuk masuk ke pengkodean ... Untuk apa tujuan Anda?

Apa tujuan utama Anda?

Apakah Anda mencari hobi yang menyenangkan, perubahan karier, pekerjaan yang fleksibel di mana Anda bisa lebih dekat dengan keluarga Anda?

Seluruh pendekatan Anda terhadap pengembangan web harus dipusatkan untuk mencapai impian yang satu ini.

Anda bahkan dapat mencoba menuliskan tujuan Anda, dan meletakkannya di suatu tempat di mana Anda akan melihatnya setiap hari, seperti cermin kamar mandi Anda atau di sebelah komputer Anda.

Saat Anda membaca artikel ini, ingatlah tujuan Anda, dan biarkan itu menentukan keputusan apa yang Anda buat: bahasa mana yang harus dipelajari, bahkan bagaimana Anda memilih untuk belajar.

Dengan itu, mari kita mulai dengan dasar-dasarnya!

Bagian 1: Dasar-dasarnya

Ini mungkin tampak jelas, tetapi saya tetap akan mengatakannya:

Pada intinya, pengembangan web adalah tentang membangun situs web.

Situs web dapat berupa situs satu halaman yang sederhana, atau bisa juga aplikasi web yang sangat kompleks.

Jika Anda dapat melihatnya di web di browser, itu ada hubungannya dengan pengembangan web.

Berikut adalah penjelasan sederhana tentang cara kerja situs web di internet:

  1. Situs web pada dasarnya adalah sekelompok file yang disimpan di komputer yang disebut server.
  2. Server adalah komputer yang digunakan untuk meng-host situs web, artinya mereka menyimpan file situs web. Server-server ini terhubung ke jaringan raksasa yang disebut World Wide Web (untuk menggunakan istilah 90-an), atau Internet.
  3. Browser adalah program yang Anda jalankan di komputer Anda. Mereka memuat file situs web melalui koneksi internet Anda. Komputer Anda juga dikenal sebagai klien, yang terhubung ke server.

Bacaan lebih lanjut

  • Bagaimana cara kerja Internet? - Jaringan Pengembang Mozilla
  • Apa perbedaan antara halaman web, situs web, server web, dan mesin pencari? - Jaringan Pengembang Mozilla

3 komponen yang membentuk setiap situs web

Seperti disebutkan di atas, situs web terdiri dari file, terutama file HTML, CSS, dan JavaScript.

Mari kita cermati masing-masing dari mereka:

HTML atau HyperText Markup Language

HTML adalah dasar dari semua situs web. Ini adalah jenis file utama yang dimuat di browser Anda ketika Anda melihat situs web.

Anda benar-benar dapat membuat situs web yang sangat mendasar hanya menggunakan HTML dan tidak ada jenis file lainnya.

Itu tidak akan terlihat sangat menarik, tetapi itu adalah minimum yang Anda butuhkan untuk sebuah situs web untuk menjadi sebuah situs web.

(Jika Anda tertarik pada dasar-dasar HTML, Anda dapat melihat tutorial video / blog yang saya miliki tentang itu.)

CSS atau Cascading Style Sheets

Tanpa CSS, situs web akan terlihat sama menariknya dengan dokumen Word.

Dengan CSS, Anda dapat menambahkan warna dari semua jenis, font yang menarik, dan tata letak situs web dengan cara apa pun sesuka Anda.

Anda bahkan dapat menambahkan animasi dan menggambar bentuk menggunakan CSS yang lebih canggih.

JavaScript

JavaScript adalah bahasa pemrograman yang memungkinkan Anda berinteraksi dengan elemen di situs web dan memanipulasi mereka.

Sementara CSS menambah gaya ke HTML, JavaScript menambahkan interaktivitas dan membuat situs web lebih dinamis.

Misalnya, Anda dapat menggunakan JavaScript untuk menggulir ke bagian atas halaman saat Anda mengklik tombol, atau untuk membuat tampilan slide dengan tombol untuk menavigasi gambar.

Untuk bekerja dengan file HTML, CSS, dan JavaScript, Anda harus menggunakan program di komputer Anda yang disebut editor kode.

Yang membawa kita ke poin berikutnya:

Editor kode mana yang harus Anda gunakan?

Ini adalah pertanyaan yang sangat umum, terutama jika Anda baru memulai.

Editor kode terbaik untuk Anda akan sangat bergantung pada jenis kode apa yang Anda tulis.

Jika Anda melakukan terutama HTML, CSS, dan JavaScript, Anda bisa membuat kode di Windows Notepad atau TextEdit untuk Mac jika Anda mau.

Tapi apa yang menyenangkan dalam hal itu?

Program editor kode seperti Sublime atau VS Code hadir dengan banyak fitur yang hanya membuat pengkodean menjadi lebih mudah.

Mereka memungkinkan Anda untuk indentasi beberapa baris teks ke kanan atau kiri, dan dapat menyorot teks dengan cara yang berbeda tergantung pada bahasa apa file tersebut berada.

Contoh highlight sintaks dalam VS Code

Untuk bahasa back-end (kita akan membahasnya di bagian selanjutnya) Anda akan memerlukan editor kode yang lebih kuat yang disebut IDE (Lingkungan Pengembangan Terpadu). IDE memiliki fitur yang memungkinkan Anda melakukan debug dan mengkompilasi (memproses) kode Anda.

Berikut ini beberapa editor kode populer:

VS Code: Visual Studio versi ringan ini, IDE utama Microsoft, baru berusia beberapa tahun tetapi sudah sangat populer, karena kecepatannya, kemudahan penggunaannya, dan fitur-fiturnya yang kuat. VS Code adalah editor pilihan pribadi saya, jadi saya mungkin agak bias

Atom: Dibuat oleh GitHub dan diiklankan sebagai "editor teks yang dapat diretas," Atom adalah editor yang sangat disukai. Salah satu kekuatan utamanya adalah kemampuan penyesuaiannya. Anda dapat menginstal paket dan tema yang akan menambah fitur ke program.

Luhur: Program yang sangat populer yang telah ada untuk sementara waktu. Seperti Atom, Anda dapat menginstal paket dan tema, dan juga memiliki kinerja cepat. Berbeda dengan dua editor lainnya, lisensi Sublime berharga $ 70 (tetapi gratis untuk dicoba).

Saya sarankan mencoba beberapa atau semua editor ini, untuk perbandingan. Kemudian pilih satu dan patuhi itu, pelajari fitur-fiturnya dan tombol pintas.

Kontrol versi

Sekarang Anda memiliki editor kode Anda, dan Anda mulai menulis kode.

Namun apa yang terjadi jika Anda membuat kesalahan dalam kode Anda, dan menekan Ctrl-Z untuk membatalkan jutaan kali tidak berhasil untuk Anda? Apa yang kamu kerjakan?

Jawabannya, adalah kontrol versi!

Kontrol versi seperti memiliki titik penyimpanan untuk file kode Anda.

Jika Anda merasa akan membuat beberapa perubahan kode yang dapat merusak segalanya, Anda dapat membuat titik penyimpanan baru (disebut komit).

Kemudian jika Anda menghancurkan situs web Anda, Anda dapat mengembalikan kode Anda kembali ke keadaan sebelumnya.

Ini bisa menjadi penyelamat jika Anda pernah melakukan kesalahan yang sangat ingin Anda batalkan.

Kontrol versi terdengar hebat! Bagaimana cara kerjanya?

Menggunakan sistem kontrol versi (VCS) melibatkan penyimpanan file kode Anda dan seluruh riwayat perubahan dalam apa yang disebut repositori.

Biasanya Anda akan menggunakan satu repositori per situs web atau proyek.

Kemudian Anda menyimpan repositori online di tempat yang dikenal sebagai repositori pusat, dan juga menyimpan versi di komputer Anda di repositori lokal.

Saat Anda membuat perubahan di komputer Anda, Anda bisa membuat commit dan kemudian mendorongnya ke repositori pusat.

Proses ini memungkinkan Anda memiliki banyak orang yang bekerja pada set kode yang sama, bahkan mengubah file yang sama.

Git adalah VCS paling populer saat ini

Sistem kontrol versi utama saat ini adalah Git. Pesaing utamanya adalah Subversion (SVN), sistem yang lebih tua.

Tetapi sebagian besar pengkodean bootcamp dan tutorial akan menggunakan Git, jadi itulah yang saya sarankan agar Anda pelajari.

Bacaan lebih lanjut

  • Tutorial cepat tentang dasar-dasar penggunaan Git
  • Panduan mendalam untuk menggunakan GitHub

Sekarang, saat kami mulai menjelaskan bahasa dan kerangka kerja aktual yang digunakan, kami akan menggunakan istilah yang mungkin pernah Anda jumpai: ujung depan dan ujung belakang.

Ujung depan adalah semua tentang bagaimana situs web terlihat, secara visual.

Sarah Maes via GIPHY

Ujung depan (atau sisi klien) mengacu pada apa yang dimuat oleh browser pengguna, juga disebut klien.

Ini akan menjadi HTML dan CSS yang kami mulai bicarakan. JavaScript awalnya hanya bahasa front-end, tetapi saat ini Anda dapat menggunakan JavaScript sebagai bahasa sisi-server, atau back-end, juga.

Pekerjaan front-end sangat berkaitan dengan membuat situs web terlihat bagus.

Selain itu, ini juga melibatkan membuat situs berperilaku dengan cara yang masuk akal bagi pengguna (juga disebut UX atau pengalaman pengguna).

Jika Anda menikmati mengutak-atik CSS Anda untuk memastikan situs ini pixel sempurna, dan menambahkan animasi JavaScript halus yang membantu pengguna, maka Anda mungkin akan menikmati pengembangan front-end.

Bagian belakang adalah semua tentang fungsi dan memastikan semuanya berfungsi.

Sementara ujung depan adalah tentang penampilan dan perilaku visual dari situs web, ujung belakang adalah tentang membuat semuanya bekerja di belakang layar.

Jika Anda bekerja dalam pengembangan back-end, Anda akan melakukan tugas-tugas seperti menangani permintaan ke server dan basis data.

Beberapa contoh pekerjaan back-end akan menyimpan data ketika seseorang mengisi formulir pada halaman kontak, atau mengambil data untuk menampilkan posting blog dalam kategori tertentu yang diminta pengguna.

Pekerjaan back-end juga dapat melibatkan pengaturan situs web pada server, penanganan penyebaran, dan pengaturan database SQL.

Jika ide untuk mengatur semua bagian fungsional situs web terdengar menyenangkan bagi Anda, Anda dapat menikmati pekerjaan back-end!

Menyatukan kedua sisi

Nama front-end dan back-end muncul karena front-end adalah apa yang dapat Anda lihat di browser Anda.

Dan back-end adalah bagian yang tidak dapat Anda lihat, tetapi menangani banyak pengangkatan berat dan fungsionalitas yang membantu front-end.

Anda dapat berpikir tentang ujung depan sebagai etalase bisnis, satu-satunya bagian yang akan dilihat oleh sebagian besar pelanggan. Bagian belakangnya seperti pusat produksi, distribusi, dan operasi yang membantu toko berjalan.

Keduanya melayani fungsi terpisah yang sama-sama penting.

Ujung depan, ujung belakang, atau tumpukan penuh?

Dalam pengembangan web, Anda bisa fokus hanya pada ujung depan, atau ujung belakang saja. Atau Anda dapat menangani keduanya, yang disebut pengembangan tumpukan penuh.

Apa yang Anda pilih untuk fokus terutama harus bergantung pada dua hal:

  • Preferensi pribadi Anda: Tidak semua orang menyukai bagian depan dan belakang.
  • Ketersediaan pekerjaan: Jelajahi daftar pekerjaan lokal Anda dan terlibatlah dengan pertemuan koding lokal untuk mengetahui jenis pekerjaan apa yang ada.

Layak disebutkan bahwa jika Anda menikmati bagian depan dan belakang, menjadi pengembang tumpukan penuh akan membuat Anda lebih mudah dipasarkan.

Masuk akal - semakin banyak teknologi yang dapat Anda gunakan, semakin banyak tugas yang dapat Anda lakukan.

Stack Overflow melaporkan dalam survei pengguna pada 2017 mereka bahwa 63,7% diidentifikasi sebagai tumpukan penuh, 24,4% sebagai back-end, dan 11,9% sebagai pengembang front-end:

Sumber: Survei Stack Overflow 2017

Namun sekali lagi, ini akan sangat tergantung pada perusahaan. Beberapa perusahaan dapat menggunakan pengembang tumpukan penuh, di mana yang lain membagi bagian belakang dan ujung depan.

Beberapa juga memiliki pengembang front-end mereka ke dalam desain, di mana para pengembang akan merancang dan membangun ujung depan aplikasi.

Bagian 2: Membuat keterampilan front-end Anda bersinar

Setelah Anda mendapatkan dasar-dasar HTML, CSS, dan JavaScript turun, Anda dapat mulai masuk ke keterampilan yang lebih maju di front-end.

Bagian ini akan membahas praktik dan alat yang akan membantu Anda membangun lebih banyak keterampilan yang dapat dipasarkan sebagai pengembang web.

Desain responsif adalah suatu keharusan di dunia yang ramah mobile ini

Ketika situs web pertama kali ada, hanya ada satu cara untuk melihatnya: di komputer Anda.

Ponsel cerdas dan data seluler belum benar-benar ada. Saat membuat situs web, Anda hanya perlu khawatir tentang tampilannya di komputer.

Sekarang, menurut Statcounter.com, lebih banyak orang menggunakan ponsel mereka daripada komputer desktop mereka untuk menjelajah internet.

Jadi kita perlu memastikan bahwa semua situs web kita berfungsi dan terlihat bagus dalam segala hal mulai dari monitor terbesar hingga ponsel terkecil.

Praktek ini dikenal sebagai desain responsif. Disebut demikian karena desainnya dapat "merespons" perangkat apa pun yang melihatnya.

Anda dapat menguji seberapa responsif situs web dengan secara manual mengubah lebar jendela browser Anda dan melihat bagaimana desain terlihat pada lebar besar dan kecil.

Membangun situs web yang benar-benar responsif melibatkan banyak perencanaan dalam tahap desain untuk mempertimbangkan bagaimana semuanya akan terlihat di semua perangkat. Dan pada tahap pengembangan web, ini melibatkan penggunaan kueri media untuk mengontrol properti CSS mana yang digunakan pada lebar tertentu.

Kerangka kerja dapat membantu Anda membangun situs web yang responsif dengan cepat

Seperti yang Anda bayangkan, pengkodean semua CSS dari situs web responsif membutuhkan banyak pekerjaan.

Jika Anda tidak dapat meluangkan banyak waktu tambahan, Anda dapat mencoba menggunakan kerangka kerja responsif seperti Bootstrap atau Zurb Foundation.

Contoh halaman yang dapat Anda buat dengan Bootstrap

Keindahan dari kerangka kerja ini adalah bahwa mereka dikemas dengan CSS dan JavaScript khusus. Mereka telah melakukan banyak pekerjaan untuk Anda dengan elemen pra-styling seperti tajuk dan tombol.

Mereka juga datang dengan komponen JavaScript (pada dasarnya plugin kecil) seperti jendela pop-up modal dan bilah navigasi.

Karena Anda menggunakan sesuatu yang sudah diuji, itu akan membuat membangun situs web Anda jauh lebih mudah. Satu-satunya peringatan adalah bahwa Anda tidak harus terlalu bergantung pada kerangka kerja.

Tidak ada pengganti untuk mengetahui cara membangun situs web responsif dari awal.

Bacaan lebih lanjut

  • Contoh desain responsif dari Designmodo.com
  • Dasar-dasar Desain Web Responsif dari Google
  • Tutorial Bootstrap 4 dari W3Schools
  • Tutorial Zurb Foundation

Sass akan menghemat waktu dan sakit kepala Anda saat menulis CSS

Setelah Anda mendapatkan dasar-dasar CSS, saya akan mulai belajar Sass, karena itu sangat mengagumkan.

Bahkan dalam nama! Sass adalah singkatan dari "Style Sheet yang Menakjubkan Secara Sintaksis". Dan itu dijelaskan di situs webnya sebagai "perpanjangan dari CSS."

Itu membuat penulisan gaya CSS Anda lebih mudah, lebih intuitif, dan lebih cepat.

Jangan salah paham, CSS itu hebat. Tetapi ketika Anda masuk ke dalamnya, Anda akan menyadari bahwa CSS vanilla biasa bisa menjadi sangat membosankan. Dan, jika Anda tidak super terorganisir dalam cara Anda menulis gaya Anda, gaya CSS Anda dapat dengan cepat menjadi kusut dengan frustasi.

Apa yang dilakukan Sass adalah memberi Anda lebih banyak kekuatan dan kendali.

Berikut adalah beberapa contoh bagaimana Sass akan membuat hidup Anda lebih mudah:

  • Mixin: Alih-alih menyalin dan menempel kode CSS untuk elemen tertentu jutaan kali, Anda dapat menggunakan mixins. Mereka memungkinkan Anda untuk menulis satu set gaya untuk elemen hanya sekali, dan menggunakan kembali sebanyak yang Anda inginkan.
  • Bersarang: Alih-alih menulis semua kelas induk dari gaya tertentu, Anda dapat membuat sarang semua anak di dalam gaya orangtua. Ini juga mengurangi banyak pekerjaan duplikat.
Ini adalah contoh penggunaan bersarang di Sass.

Singkatnya, menggunakan Sass akan menghemat waktu dan gangguan Anda. Sepadan dengan usaha yang diperlukan untuk mempelajarinya!

Bacaan lebih lanjut

  • Memulai dengan Sass
  • Sass Basics

Satu catatan: karena browser tidak dapat membaca file Sass sendiri, Anda harus mengkompilasi file Sass Anda ke dalam CSS.

Untuk melakukan ini, Anda harus menggunakan sesuatu yang disebut alat bangun dan menjalankannya di komputer Anda.

Yang membawa kita ke bagian selanjutnya….

Lagipula, apa yang dimaksud dengan alat bantu bangunan ini?

Anda mungkin pernah mendengar satu atau beberapa istilah berikut: npm, Webpack, Grunt, Gulp, Bower, Yarn ... daftarnya menjadi sangat panjang!

Alat-alat ini sering digambarkan sebagai alat bangun, pelari tugas, manajer tugas, atau "SEKARANG apa yang harus saya instal ?!"

Beberapa alat melakukan pekerjaan kasar Anda (pun intended!) Untuk Anda

Alat bangun seperti Grunt, Gulp, dan Webpack umumnya digunakan untuk melakukan beberapa tugas berikut:

  • Memproses file Sass ke dalam CSS
  • Menggabungkan (menggabungkan) beberapa file CSS atau beberapa file JavaScript ke dalam satu file CSS atau JavaScript besar.
  • Meminimalkan (mengompresi) CSS, JavaScript, dan bahkan file gambar
  • Secara otomatis menyegarkan peramban Anda dengan CSS yang diperbarui atau kode JavaScript

Tentu, banyak dari tugas ini yang bisa Anda lakukan sendiri dengan tangan.

Tetapi harus melakukannya berulang kali setiap kali Anda membuat perubahan kecil CSS atau JavaScript akan melelahkan.

Alat bangun mana yang harus Anda gunakan?

Saat ini, Webpack mengambil alih lapangan, tetapi Grunt dan Gulp masih digunakan.

Saya pasti akan belajar Webpack, tetapi tidak ada salahnya untuk belajar Grunt atau Gulp (Gulp lebih cepat dan sepertinya sedikit lebih mudah untuk bangun dan berjalan).

Alat lain menginstal paket (plugin) untuk Anda

Selain itu, untuk menyelesaikan semua tugas itu, Anda umumnya perlu mengunduh dan menginstal plugin atau paket.

Di sinilah alat seperti npm (Node Package Manager), Bower, atau Yarn berguna. Ini adalah alat yang memungkinkan Anda untuk menginstal paket dengan cepat ke komputer Anda dengan mengetikkan perintah ke dalam baris perintah komputer Anda.

Mereka adalah alat untuk memberi Anda lebih banyak alat, pada dasarnya!

Karena npm adalah manajer paket yang dominan saat ini, Anda pasti harus belajar cara menggunakannya.

Bower adalah salah satu alat pengelola paket pertama, tetapi secara resmi sudah usang - pencipta Bower.io sekarang merekomendasikan menggunakan Benang.

Yarn adalah alat yang sangat mirip dengan npm yang dibuat oleh Google, Facebook, dan lainnya yang menjanjikan untuk memperbaiki beberapa masalah yang dimiliki npm.

Meskipun Yarn adalah minoritas, saya masih merekomendasikan untuk memeriksanya, karena tampaknya semakin populer.

Bacaan lebih lanjut

  • Cara mengatur Webpack +2.0 dari awal
  • Javascript Tooling - Evolusi dan Masa Depan JS & Front-end Build Tools
  • NPM vs Benang Cheat Sheet

Semua orang menyukai kerangka kerja JavaScript

Anda mungkin memperhatikan banyak kerangka kerja JavaScript, pustaka, toolkit, dan sebagainya saat dilemparkan ... Anda tahu, nama-nama yang semuanya diakhiri dengan ".JS?"

Mari kita mundur selangkah dan mendefinisikan apa itu kerangka kerja JavaScript.

Bergantung pada siapa Anda berbicara, kerangka istilah, pustaka, dan / atau perangkat mungkin atau tidak bisa saling dipertukarkan. (Ini masih dalam perdebatan.)

Tapi mereka semua pada dasarnya adalah alat yang, kejutan, melakukan beberapa pekerjaan untuk Anda.

Kerangka kerja adalah struktur yang sudah dibangun sebelumnya yang Anda bangun.

Secara umum, kerangka kerja adalah sistem bagian kerja yang dibuat oleh orang lain.

Untuk menggunakan framework, Anda menginstalnya ke file situs web Anda sendiri. Kemudian Anda bekerja dari struktur yang ada, menambahkannya untuk mencapai apa yang ingin Anda lakukan.

Menggunakan kerangka kerja seperti membeli rumah tulang kosong yang dilengkapi dengan semua komponen struktural (fondasi, rangka, atap), tetapi tidak sepenuhnya lengkap.

Anda masih harus masuk dan memasang air dan listrik, serta memasang lemari, mengecat dinding, dan menghias.

Beberapa contoh kerangka kerja front-end JavaScript adalah React, Vue, dan Angular.

Perpustakaan adalah seperangkat alat yang dibuat sebelumnya yang Anda tambahkan ke struktur Anda sendiri.

Sebagai perbandingan, perpustakaan adalah kumpulan komponen individu yang dapat Anda ambil dan sambungkan ke sistem Anda sendiri.

Ini adalah perbedaan utama antara kerangka kerja dan perpustakaan:
Sementara kerangka kerja adalah struktur yang dibuat sebelumnya, perpustakaan bukan struktur dalam dirinya sendiri. Mereka menyediakan fungsionalitas tambahan untuk sistem yang ada.

Untuk melanjutkan analogi pembangunan rumah, Anda bisa memikirkan perpustakaan seperti peralatan yang Anda pilih untuk ditambahkan ke rumah Anda.

Mesin seperti oven, pancuran, dan pendingin udara semuanya menjalankan fungsi yang berbeda, tetapi Anda harus memasangnya di rumah yang sudah ada agar bisa berguna.

Salah satu contoh perpustakaan, menggunakan kategorisasi di atas, adalah jQuery.

jQuery adalah pustaka JavaScript yang tidak memiliki struktur apa pun, tetapi memiliki lebih dari 300 fungsi berbeda yang dapat Anda gunakan.

Sekali lagi, definisi-definisi ini tidak disetujui oleh semua orang.

Bereaksi dan jQuery mengategorikan diri mereka sebagai perpustakaan, dan Angular dan Vue menyebut diri mereka kerangka kerja.

Namun untuk pemahaman pribadi saya sendiri, ada baiknya memisahkan alat menjadi dua ember kerangka kerja umum (sistem) dan perpustakaan (alat).

Yang membawa kita ke poin berikutnya ...

Tiga besar dalam kerangka kerja JavaScript: Angular, React, dan Vue

Di awal 2010 ada ledakan kerangka kerja yang berakhiran “.js,” yang hampir baru setiap bulan.

Namun saat kami mendekati tahun 2020, lapangan telah terbuka dan kami pergi dengan tiga pemenang besar: Angular, React, dan Vue.

Kerangka kerja JavaScript mungkin sudah mulai sebagai tren, tetapi mereka pasti ada di sini untuk tinggal.

Angular, React, dan Vue semuanya berkembang, dan JavaScript sendiri sangat populer saat ini - ini adalah teknologi yang paling banyak digunakan untuk tahun kelima yang berjalan dalam survei tahunan Stack Overflow.

Selain itu, Stack Overflow menerbitkan tren teknologi berdasarkan berapa banyak pertanyaan yang diajukan per bulan.

Anda dapat melihat bahwa Angular memiliki volume terbanyak, dan baik Angular maupun React memiliki pertumbuhan yang cukup curam selama setahun terakhir.

Sumber: Stack Overflow - Tren Kerangka JavaScript

Survei State of JavaScript menunjukkan bahwa Bereaksi memimpin dalam jumlah pengembang yang telah menggunakannya dan menyukainya, sementara Angular tampaknya tidak begitu menarik atau memiliki banyak keinginan untuk digunakan kembali.

Vue memiliki jumlah penggunaan aktual yang lebih rendah, tetapi memimpin paket dalam hal menjadi teknologi yang ingin dicoba pengembang di masa depan. Jadi layak Vue bisa menjadi pemain yang lebih besar dalam beberapa tahun ke depan.

Namun saya pikir ketiganya bertahan, setidaknya untuk beberapa tahun ke depan.

TL, DR: Kerangka kerja mana yang harus saya pelajari saat ini?

Itu tergantung - jika Anda ingin mendapatkan pekerjaan pengembang web penuh waktu, saya akan menelusuri daftar pekerjaan lokal Anda untuk melihat kerangka kerja mana yang paling banyak disebut.

Jika Anda baru belajar sekarang tanpa akhir yang spesifik, Vue adalah tempat yang baik untuk memulai bagi pemula. Ringan dan didokumentasikan dengan cukup baik.

Namun, saya pribadi tidak hanya akan belajar Vue. Ini akan menjadi ide yang baik untuk akhirnya menambahkan Bereaksi atau Angular ke sabuk alat Anda, tergantung pada keinginan Anda.

Bacaan lebih lanjut

  • Kerangka JavaScript Terbaik, Perpustakaan dan Alat untuk digunakan pada tahun 2017
  • Panduan Noob untuk Memilih Kerangka JavaScript

Bagian 3: Ayo masuk ke back-end

Bahasa mana yang harus Anda pelajari terlebih dahulu?

Ada banyak bahasa back-end. Banyak dari mereka telah ada selama beberapa waktu, beberapa bahkan sebelum internet ada!

Ini dapat menyulitkan untuk memilih bahasa yang akan digunakan. Untuk mempersempit pilihan Anda, saya sarankan menerapkan prinsip-prinsip berikut untuk keputusan Anda:

  • Pilih bahasa yang dapat dipelajari: ia memiliki kurva belajar yang masuk akal, didokumentasikan dengan baik, dan / atau memiliki sistem dukungan online yang bagus.
  • Pilih bahasa yang relevan dengan tujuan karier Anda.
  • Pilih bahasa yang menyenangkan. Mempelajari pengembangan web cukup sulit - tidak ada gunanya memaksa diri Anda untuk belajar bahasa yang benar-benar tidak Anda sukai.
Satu hal penting yang perlu diingat adalah Anda tidak perlu mempelajari setiap bahasa.
Faktanya, jika Anda seorang pemula, saya sangat menyarankan Anda fokus pada satu bahasa terlebih dahulu.

Semua bahasa pemrograman berbagi beberapa prinsip umum.

Misalnya, Anda dapat menulis loop "untuk" dalam JavaScript, PHP, C # dan Python.

Setelah Anda mengambil prinsip-prinsip dasar pemrograman dalam bahasa pertama Anda, akan lebih mudah untuk mentransfer konsep-konsep tersebut ke bahasa lain.

Saya harap ini menghilangkan sedikit tekanan dari memilih bahasa back-end pertama Anda untuk belajar

Mari kita lihat beberapa bahasa back-end paling populer.

Jawa

Java adalah bahasa yang stabil yang sangat banyak digunakan dan telah ada sejak lama. Ini telah memegang posisi teratas pada indeks TIOBE sejak tahun 2001. (TIOBE adalah peringkat bahasa pemrograman berdasarkan jumlah pencarian.)

Sumber: Ben Putano di Stackify.com

Selain itu, Jawa berada di peringkat ketiga dalam peringkat Stack Overflow bahasa yang paling umum digunakan dan memiliki pertanyaan dengan tag tertinggi kedua di Stack Overflow.

Sumber: Bahasa Pemrograman Paling Umum, Survei Pengembang Stack Overflow 2017

Banyak perusahaan teknologi besar menggunakan Java di situs web mereka: Google, YouTube, Facebook, Amazon, dan Twitter.

Salah satu alasannya adalah Java cepat, dan dapat ditingkatkan untuk menangani situs web besar. Ini juga merupakan bahasa yang konsisten yang memungkinkan pemeliharaan yang lebih mudah untuk proyek jangka panjang.

Twitter pada awalnya dibangun dengan Ruby on Rails. Tetapi pada 2015 mereka harus bisa mendukung pertumbuhan besar mereka, jadi mereka beralih ke Scala, bahasa yang berjalan di Java Virtual Machine.

C # (C Sharp)

C # dibuat oleh Microsoft untuk menjadi pesaing bagi Java. Anda dapat melihat bahwa C # memuncak pada Track Overflow's Trends pada tahun 2009 dan telah menurun sejak saat itu.

Sumber: Tren Overflow tren untuk bahasa back-end

Tapi saya belum menghitung C # dulu.

Ini adalah bahasa yang kuat, berorientasi objek yang memiliki jumlah tag Stack Overflow ketiga tertinggi. Itu juga berada di urutan ketiga dalam penelitian Stackify ke dalam bahasa yang paling banyak dicari dalam daftar pekerjaan Memang di bulan Desember 2017.

Sumber: Ben Putano di Stackify.com

C # digunakan dalam berbagai aplikasi, seperti aplikasi desktop Windows dan pemrograman Android.

Itu juga banyak digunakan dalam pengembangan game, melalui mesin game Unity. Jadi jika Anda tertarik pada pengembangan Android atau game, C # akan menjadi pilihan yang bagus untuk belajar.

Node.js

Seperti yang disebutkan sebelumnya, JavaScript telah menjadi bahasa yang paling umum digunakan yang dilaporkan oleh pengguna Stack Overflow selama lima tahun terakhir.

Banyak dari ini berkaitan dengan Node.js, yang menduduki puncak daftar kerangka kerja dan pustaka yang paling banyak digunakan pada tahun 2017.

Sumber: Kerangka dan Perpustakaan Paling Umum, Survei Pengembang Stack Overflow 2017

Node.js, yang digambarkan sendiri sebagai "JavaScript runtime," pada dasarnya adalah JavaScript yang berjalan di bagian belakang.

Awalnya dimaksudkan untuk berfungsi sebagai alternatif yang lebih efisien untuk server HTTP Apache. Sejak dirilis pada 2009, Node.js terus meningkat dalam penggunaan, karena sifatnya yang cepat dan ringan.

Pengembang node sering menggunakan kerangka Express saat membangun aplikasi web. Express.js adalah "kerangka kerja web minimalis" untuk Node.js.

Dengan menggunakan Node dan Express di ujung belakang, dan Angular atau Bereaksi di ujung depan, ini berarti Anda bisa menjadi pengembang penuh tumpukan JavaScript.

Tumpukan ini, atau kombinasi teknologi, sangat populer saat ini, terutama dengan startup.

Python

Python pertama kali muncul di tahun 1991 dan sering menjadi "bahasa pertama" bagi banyak siswa pemrograman.

Karena keterbacaan dan penggunaan kata kunci bahasa Inggris, itu umumnya dianggap bahasa yang mudah dipelajari.

Ada beberapa kerangka kerja Python yang bisa Anda gunakan:

  • Django (fitur pre-built, lebih banyak lonceng dan peluit), dan
  • Labu (lebih minimal dan fleksibel).

Popularitas Python telah meningkat dalam beberapa tahun terakhir. Pada tulisan ini, ia berada di peringkat # 4 pada indeks TIOBE.

Dan pada tahun 2017 itu berada di peringkat kedua dalam jumlah permintaan tarik di GitHub, menurut laporan Ulasan Tahun 2017 mereka.

Sumber: Ben Putano di Stackify.com

Stack Overflow melaporkan pada September lalu bahwa sains data, pembelajaran mesin, dan penelitian akademis merupakan alasan utama pertumbuhan yang cepat ini.

Bahkan jika Anda bukan seorang ilmuwan data, dapat bekerja dengan dan memanipulasi data menjadi keterampilan yang berguna.

Seperti yang ditulis Alexus Strong dari Code Academy:

"Python menarik bagi kita di bidang non-teknis karena menempatkan analisis data [...] dalam jangkauan lengan."

Jika Anda ingin tahu tentang ilmu data atau pembelajaran mesin, Python mungkin merupakan taruhan yang sangat bagus untuk Anda, karena bidang ini kemungkinan akan berkembang di tahun-tahun mendatang.

Rubi

Ruby pertama kali dirilis pada 1995. Itu mulai mendapat banyak perhatian di awal 2000-an ketika Basecamp startup menemukan kerangka kerja Ruby on Rails.

Dikombinasikan dengan sintaks yang mudah dipahami pemula Ruby dan mudah dibaca, Rails membuat pembuatan aplikasi web sangat cepat dan mudah.

Ruby on Rails semakin populer dan menjadi kerangka pilihan bagi para startup. (Codepen.io, GitHub, dan Shopify semua menggunakan Ruby on Rails.)

Namun, Ruby tidak pernah menjadi salah satu pemukul berat. Tahun lalu ia berada di tempat kesepuluh di peringkat bahasa yang paling umum digunakan Stack Overflow, dan indeks TIOBE.

Selain itu, Ruby on Rails tidak skala dengan sangat baik, yang mengarah ke startup tersebut akhirnya beralih ke bahasa lain ketika mereka menjadi sangat besar (seperti Twitter beralih ke Jawa, seperti yang kami sebutkan di atas).

Ini mungkin bukan topping peringkat, tetapi Ruby masih bisa menjadi pilihan yang baik untuk belajar bahasa pertama Anda.

Jika Anda tertarik pada dunia startup atau area geografis Anda memiliki banyak pekerjaan Ruby, saya akan mempertimbangkan mempelajari Ruby dan Ruby on Rails.

PHP

PHP adalah bahasa yang banyak orang suka benci.

Namun, terlepas dari banyaknya pertanyaan Quora yang menanyakan apakah PHP mati, faktanya tetap bahwa PHP adalah bahasa back-end yang paling banyak digunakan saat ini.

Penelitian yang dilakukan oleh W3Techs.com menunjukkan bahwa 83% dari semua situs web menggunakan PHP. (Bahasa tertinggi berikutnya, ASP.NET, hanya terdiri dari 14%.)

Sumber: W3Techs.com

Sistem manajemen konten (CMS) adalah alasan utama untuk pangsa pasar PHP yang besar. Tiga CMS teratas - WordPress, Joomla, dan Drupal - semuanya dibangun dengan PHP.

WordPress sendiri memiliki pangsa pasar CMS terbesar, yang merupakan 29,5% dari semua situs web.

Jika Anda suka bekerja dengannya, pengembangan WordPress mungkin merupakan area fokus yang bagus untuk menyesuaikan situs web dan membuat plugin atau tema.

Selain sistem manajemen konten, PHP memiliki beberapa kerangka kerja yang membuat pengembangan lebih mudah dan lebih cepat. Laravel, kerangka kerja yang keluar pada tahun 2011, saat ini adalah yang paling populer.

Bacaan lebih lanjut

  • Panduan Pemula untuk Pengembangan Back-End (Upwork.com)
  • Kerangka kerja web sisi server (Jaringan Pengembang Mozilla)
  • Apa Bahasa Pemrograman Terbaik untuk Saya?

Bekerja dengan data dan basis data

Sumber: Sherchle via GIPHY

Database bisa tampak menakutkan jika Anda tidak terbiasa dengannya.

Namun, jika Anda memikirkannya, Anda mungkin pernah bekerja dan menggunakan data dalam kehidupan Anda sendiri di beberapa titik.

Jika Anda pernah menggunakan Excel untuk mengatur data, atau membuat bagan untuk melacak tujuan Anda, maka Anda telah melakukan fungsi serupa (walaupun jauh lebih sederhana) seperti yang dilakukan database.

Apa yang perlu saya pelajari untuk menggunakan basis data?

Untungnya, Anda tidak perlu belajar banyak bahasa yang berbeda. Bahasa basis data utama adalah SQL (diucapkan sekuel).

SQL (Structured Query Language) dibuat pada tahun 1970-an oleh IBM, dan digunakan dalam basis data relasional.

Model relasional adalah cara menyusun data menjadi baris dan kolom (berpikir seperti spreadsheet Excel).

Setiap kolom ditujukan untuk jenis data tertentu, dan mungkin mengharuskan data diformat dengan benar. Dan setiap baris, atau catatan, berisi ID atau kunci unik selain kolom, atau bidang, nilai.

Anda dapat melihat ini di bawah ini:

Spreadsheet sederhana mirip dengan bagaimana data disimpan dalam sebuah tabel. Kolom Sewa akan membutuhkan nilai numerik.

Catatan tersebut kemudian disimpan dalam beberapa koleksi yang disebut tabel. Dan kumpulan tabel (antara lain) membentuk seluruh skema database, atau struktur.

Jenis utama sistem basis data SQL adalah:

  • MySQL (digunakan untuk aplikasi PHP dan open source)
  • Microsoft SQL Server (umumnya digunakan untuk aplikasi .NET)
  • PostgreSQL (open source)

NoSQL

Meskipun SQL adalah tipe database yang dominan, ada tipe lain: NoSQL (mis. Non-SQL). Seperti namanya, database NoSQL dalam beberapa hal berlawanan dengan yang SQL tradisional.

NoSQL tidak bersifat relasional, dan tidak memberlakukan jenis struktur yang sama seperti yang dilakukan SQL. Sebagai gantinya, Anda dapat menyimpan segala jenis data dalam jenis sistem yang lebih bebas dan lebih fleksibel.

Ini menciptakan proses yang jauh lebih cepat dan jauh lebih baik dalam meningkatkan aplikasi yang besar dan kompleks. Kelemahannya adalah Anda mengorbankan konsistensi data.

Seperti yang ditulis Craig Buckler dari Sitepoint:

NoSQL lebih fleksibel dan memaafkan, tetapi bisa menyimpan data apa pun di mana saja dapat menyebabkan masalah konsistensi.

NoSQL semakin populer pada tahun 2000-an karena perusahaan teknologi besar seperti Facebook dan Amazon membutuhkan cara cepat untuk memanipulasi dan menyimpan data.

MongoDB adalah sistem NoSQL yang paling umum digunakan. Jenis top lainnya adalah Cassandra, Elasticsearch, dan Couchbase, menurut Hackernoon.

SQL vs NoSQL?

Anda dapat menjalankan seluruh diskusi tentang apakah NoSQL mengganti SQL, atau mana yang lebih baik. Yang benar adalah bahwa kedua jenis database memiliki kekuatan dan kelemahan mereka.

Seperti yang lainnya, pilihan yang tepat akan berubah tergantung pada proyek, dan pekerjaan. Secara pribadi, saya akan merekomendasikan mempelajari dasar-dasar SQL dan NoSQL.

Bacaan lebih lanjut

  • Sejarah SQL - TheBalance.com
  • SQLCourse.com - tutorial online gratis tentang SQL
  • Perbedaan SQL vs NoSQL - XplentyBlog
  • Dijelaskan NoSQL - MongoDB

Membuat situs web di server

Seperti yang kami sebutkan di awal, server hanyalah komputer yang menyimpan file situs web dan sumber daya lain seperti basis data.

Agar situs web dapat diakses secara publik di internet, situs web tersebut harus diinstal pada server.

Berikut adalah beberapa hal yang harus Anda kerjakan untuk membuat situs web langsung:

Nama domain dan sertifikat SSL

Nama domain adalah alamat situs web, seperti Google.com, Wikipedia.org atau Dartmouth.edu.

Untuk mendapatkannya, Anda harus memilih yang tersedia, lalu membelinya dari pendaftar nama domain seperti Namecheap.com atau Google Domains.

Perusahaan-perusahaan ini mendaftarkan domain dengan ICANN (Internet Corporation untuk Nama dan Nomor yang Ditugaskan).

ICANN adalah organisasi terpusat yang mengawasi dan mengelola area DNS (domain name system) dan IP (protokol internet) dari internet global.

Selain nama domain, Anda juga harus mendapatkan sertifikat SSL (Lapisan Soket Aman) untuk domain Anda. SSL akan mengenkripsi lalu lintas di situs web Anda, yang akan membantu melindunginya dari serangan dunia maya.

Ruang server host web

Setelah Anda memiliki nama domain Anda ke AwesomeStupendousAmazingSite.com, Anda harus membeli ruang server.

Ada beberapa tingkatan rencana hosting web:

  • Server bersama: Opsi termurah, dapat berkisar dari beberapa dolar hingga $ 12-20 per bulan. Seperti kedengarannya, Anda berbagi ruang server Anda dengan "tetangga" situs web lainnya. Kelemahannya adalah keterjangkauannya, dan sisi buruknya adalah kecepatan yang lebih lambat dan kemungkinan downtime jika Anda melebihi penggunaan Anda untuk bulan itu. Host populer adalah SiteGround, Bluehost, dan WP Engine.
  • Server cloud: Cloud hosting adalah opsi yang relatif baru. Ini terdiri dari sistem sejumlah besar server fisik yang sumber dayanya semuanya dibagikan. Setiap "penyewa" individu kemudian diberikan server virtual yang menarik sumber daya dari kumpulan kolektif. Pengaturan ini memungkinkan lebih banyak fleksibilitas untuk bandwidth dan dapat meningkatkan dengan sangat cepat. Satu perusahaan, Digital Ocean, berurusan secara eksklusif dengan server cloud. Harga tergantung pada spesifikasi server Anda, dan dapat berkisar dari beberapa dolar per bulan hingga hampir $ 1000.
  • VPS (Virtual Private Server): VPS mirip dengan cloud hosting di mana setiap penyewa memiliki server virtual mereka sendiri, dan semua penyewa berbagi satu server fisik. Ini lebih baik daripada hosting bersama karena Anda dialokasikan sepotong sumber daya server Anda sendiri. Opsi ini sedikit lebih mahal, antara $ 20-60 per bulan (menurut BlueHost).
  • Server khusus: Server ini memberi Anda satu server fisik lengkap untuk Anda sendiri. Seperti yang Anda bayangkan, opsi ini adalah yang paling kuat tetapi juga yang paling mahal. Mereka sering juga adalah server yang dikelola, yang berarti perusahaan akan menjalankan pemeliharaan dan melakukan tugas-tugas lain untuk Anda. Dedicated hosting biasanya akan menjalankan pasangan Anda hingga beberapa ratus dolar per bulan, sesuai dengan harga SiteGround.

Pengaturan dan pemeliharaan server

Setelah Anda memiliki nama domain dan ruang server, Anda harus menyiapkan situs di server.

Ini melibatkan mengarahkan nama domain Anda ke alamat IP unik server Anda, menyiapkan file dan database situs web Anda (jika perlu), dan konfigurasi lainnya.

Berapa banyak pekerjaan yang harus Anda lakukan tergantung pada jenis paket server yang Anda beli dari host web Anda. Paket bersama yang paling sederhana sering kali datang dengan fitur satu-klik yang secara otomatis akan menginstal WordPress, Drupal, atau situs lain untuk Anda.

Server lain, seperti Digital Ocean, sangat minim dan mengharuskan Anda untuk mengatur semuanya secara manual.

Menyebarkan file ke server Anda

Anda mungkin bertanya-tanya bagaimana cara Anda mendapatkan file dari komputer Anda sendiri ke server Anda. Anda dapat melakukannya dengan menggunakan protokol, yang pada dasarnya adalah metode pengangkutan file atau data lain ke dan dari server.

Catatan:
HTTP, cara browser Anda memuat situs web, juga merupakan protokol– HTTP adalah singkatan dari Hypertext Transfer Protocol.

Cara paling sederhana adalah dengan menggunakan protokol yang disebut FTP (File Transfer Protocol). Namun tidak disarankan untuk menggunakan FTP lagi, karena tidak aman (terenkripsi).

Saat ini kebanyakan orang menggunakan protokol FTPS (FTP over SSL) atau SFTP (Secure Shell FTP) yang lebih aman.

Agar FTP / SFTP berfungsi, Anda harus membuat akun di server Anda. Anda kemudian akan terhubung ke server menggunakan alamat IP server, dan login nama pengguna dan kata sandi untuk otentikasi.

Untuk mentransfer file melalui FTP / SFTP Anda dapat menggunakan program seperti Filezilla atau CyberDuck. Ini memiliki GUI (antarmuka pengguna grafis) yang membuatnya relatif mudah untuk mengunggah dan mengunduh file ke dan dari komputer Anda dan server Anda.

Alat penyebaran

Seperti yang Anda bayangkan, keharusan mengunggah file ke server secara manual setiap kali Anda membuat satu perubahan kode kecil bisa membosankan. Selain itu, banyak hal dapat membingungkan jika beberapa orang mengerjakan file yang sama dan mengunggah secara bersamaan.

Untungnya, Anda dapat mengatur penyebaran yang menautkan ke repositori Git Anda.

Alat penyebaran menyimpan pengaturan FTP / SFTP Anda, dan ketika Anda mendorong perubahan di Git ke cabang master Anda, misalnya, alat akan mentransfer file untuk Anda. Dengan begitu Anda tidak perlu mengingat file mana yang Anda ubah, mengurangi jumlah kesalahan yang Anda buat.

Untuk situs web yang lebih kompleks yang memiliki tim dengan beberapa orang, ada alat dan sistem penyebaran yang lebih maju yang dapat Anda gunakan untuk membuat penyebaran Anda lebih terstruktur.

Sistem ini berada di luar ruang lingkup artikel ini, tetapi mereka termasuk praktik seperti integrasi berkelanjutan.

Bacaan lebih lanjut

  • Proses Registrasi Nama Domain - WHOIS
  • 8 Jenis Layanan Web Hosting Populer - TheBalance.com
  • 6 Klien FTP Terbaik - WP Beginner
  • Integrasi berkelanjutan vs pengiriman berkelanjutan vs penyebaran berkelanjutan - Atlassian

Selamat !!

Anda telah berhasil!

Sekarang sebelum kita melanjutkan ke daftar sumber daya, harap dicatat bahwa bagian berikut berisi beberapa tautan afiliasi. Ini berarti saya akan menerima komisi kecil dari perusahaan jika Anda membeli melalui tautan.

Ini adalah cara mudah agar Anda dapat mendukung penulisan jenis artikel ini, tanpa biaya tambahan untuk diri sendiri. (Saya juga menyertakan tautan non-afiliasi, jika Anda lebih suka menggunakannya).

Epilog: Sumber belajar yang direkomendasikan

Seperti yang saya yakin Anda tahu, ada satu ton sumber daya yang dapat Anda gunakan untuk mempelajari kode.

Saya telah menyertakan beberapa tutorial, buku, dan sumber daya online paling populer dan direkomendasikan di sini.

Kursus pengembangan web lengkap

Ada beberapa kursus online yang mencakup semua atau sangat dekat dengan semua bidang pengembangan web.

Jika Anda tidak ingin melompat-lompat dan hanya ingin fokus pada satu tempat untuk mempelajari semuanya, saya akan merekomendasikan satu atau lebih dari yang berikut:

freeCodeCamp adalah organisasi nirlaba yang menawarkan pendidikan gratis bagi calon pengembang web.

Kurikulum mereka adalah serangkaian program komprehensif mulai dari depan ke belakang (menggunakan Node dan Express) dan banyak lagi!

Banyak orang telah mendapatkan pekerjaan penuh waktu setelah menggunakan freeCodeCamp. Anda juga dapat berkontribusi untuk proyek sumber terbuka melalui GitHub.

Salah satu manfaat utama dari freeCodeCamp adalah bahwa itu sangat berpusat pada komunitas, dengan papan pesan dan grup Facebook, sehingga Anda bisa mendapatkan banyak dukungan saat Anda belajar.

Anda dapat membaca beberapa review dari freeCodeCamp di Quora dan Reddit.

Bootcamp Pengembang Web Colt Steele (tautan afiliasi / tautan non-afiliasi)

Colt adalah mantan instruktur bootcamp coding yang ingin menawarkan bootcamp lengkap untuk sebagian kecil dari harga.

Dia akhirnya menciptakan salah satu kursus pengembang web paling populer dan bernilai tinggi di Udemy, dan dengan alasan yang bagus.

Kursusnya membawa Anda dari dasar-dasar melalui pengembangan tumpukan penuh (menggunakan Node dan Express sebagai back-end), dengan banyak konten dan sering diperbarui.

Anda dapat membaca ulasan tentang kursusnya di halaman Udemy, serta di posting forum freeCodeCamp.

Udacity menawarkan kursus gratis dan program berbayar yang disebut Nanodegrees.

Nanodegrees dibangun dari kursus gratis– mereka adalah program intensif (12 jam / minggu) di mana Anda membangun proyek portofolio dan memiliki lebih banyak interaksi dan dukungan masyarakat.

Mereka tidak murah, saat ini $ 199 / bln dan mungkin Anda membutuhkan waktu antara 6 hingga 10 jam untuk menyelesaikannya.

Jika Anda tertarik, berikut adalah beberapa ulasan tentang program Nanodegree Udacity di Quora dan Hacker News, dan Quora menjawab tentang perbedaan antara kursus gratis Udacity vs Nanodegree.

Sumber daya lainnya

Team Treehouse adalah situs web yang sangat populer untuk belajar coding. Mereka tidak memiliki konten gratis, tetapi mereka menggunakan model berlangganan.

Treehouse menawarkan paket bulanan berjenjang ($ 25 atau $ 55 / bln saat ini) dan Anda dapat mengambil kursus tanpa batas.

Anda bahkan dapat menjeda keanggotaan Anda jika Anda ingin istirahat selama beberapa bulan, dan melanjutkannya lagi ketika Anda siap.

Selain kursus individual, mereka juga memiliki trek terstruktur seperti Java Web Development atau Front End Web Development yang memandu Anda melalui serangkaian kursus yang dipilih.

Udemy (tautan afiliasi / tautan non-afiliasi)

Udemy adalah salah satu platform pembelajaran online terbesar, dan memiliki kursus tidak hanya dalam pengkodean, tetapi bidang profesional dan hobi lainnya.

Anda membayar untuk setiap kursus secara individual, dan mereka sering melakukan penjualan di mana saja berkisar antara $ 10-20 masing-masing.

Tentu saja, karena banyaknya kursus dan instruktur, kualitasnya bervariasi, jadi Anda harus melakukan riset sebelum membeli.

Saya sarankan memeriksa peringkat dan ulasan di halaman kursus Udemy dan di tempat lain secara online.

Wes Bos adalah instruktur pengembangan web yang telah menciptakan beberapa kursus yang sangat populer.

Satu kursus yang pasti akan saya periksa adalah JavaScript30 (tautan afiliasi / tautan non-afiliasi). Ini adalah tantangan coding JavaScript JavaScript selama 30 hari (yang berarti tidak ada kerangka kerja atau pustaka).

Dia juga memiliki kursus premium tentang React, Node, dan JavaScript yang lebih canggih di situs webnya.

Jika Anda ingin tahu, berikut adalah beberapa ulasan tentang kursusnya di Reddit dan forum freeCodeCamp.

Microsoft Virtual Academy (MVA) memiliki koleksi kursus online gratis mulai dari C # dan Python hingga SQL Server dan area lain seperti pengembangan game.

Beberapa program populer mereka adalah Pengantar Pemrograman dengan program Python, C # Fundamentals dan SQL Database Fundamentals.

Berikut adalah beberapa ulasan tentang kursus MVA di Reddit dan LinkedIn.

SoloLearn memiliki pendekatan unik untuk mempelajari pengkodean: Anda dapat belajar tidak hanya dari situs web mereka, tetapi juga pada aplikasi seluler gratis mereka.

Beberapa program mereka yang paling populer adalah Python, C ++, dan Java.

Mereka juga memiliki jenis papan pesan StackOverflow yang cukup aktif dengan pertanyaan dan diskusi.

Jika Anda penasaran, Anda dapat memeriksa beberapa ulasan tentang SoloLearn on Reddit dan Quora.

Buku

Jika Anda menikmati belajar dari buku-buku, atau ingin beberapa di tangan sebagai referensi, berikut adalah daftar pendek buku yang saya pikir akan baik untuk pemula.

Beberapa di antaranya gratis dan tersedia online untuk Anda baca, yang lain adalah buku kertas tradisional.

HTML dan CSS oleh Jon Duckett
(tautan afiliasi / tautan non-afiliasi)

JavaScript dan JQuery oleh Jon Duckett
(tautan afiliasi / tautan non-afiliasi)

Buku-buku Jon Duckett sangat mungkin merupakan buku paling populer untuk pengembang web pemula.

Mereka bukan hanya buku teks biasa, tetapi buku yang dirancang dengan indah yang menggunakan foto dan ilustrasi untuk mengajarkan konsep pengkodean.

Front-End Developer Handbook adalah buku online gratis dari Frontend Masters dan ditulis oleh Cody Lindley.

Ini diperbarui setiap tahun dan Anda dapat menganggapnya sebagai panduan "keadaan pengembangan web front-end" dengan informasi, sumber daya, tren, dan alat baru yang terkait dengan bidang ini.

Eloquent JavaScript adalah buku pemula tentang pemrograman yang berfokus pada JavaScript.

Anda dapat membacanya secara online secara gratis di situs web, yang memiliki alat konsol yang rapi di mana Anda dapat menulis dan menguji kode saat Anda membaca.

Jika Anda ingin salinan fisik, buku ini juga tersedia di Amazon (tautan afiliasi / tautan non-afiliasi).

Pikiran penutup

Apakah mungkin untuk belajar sendiri pengembangan web dengan sumber daya online? Saya yakin jawabannya adalah ya.

Namun itu tidak akan mudah sama sekali. Belajar dan menguasai segala sesuatu itu sulit, dan belajar kode tidak berbeda.

Dengan mengingat hal itu, jika Anda ingin menempuh jalan itu, berikut adalah beberapa saran:

Tetap fokus.

Saat Anda belajar sendiri, mungkin tergoda untuk beralih dari satu tutorial ke tutorial lainnya. Terutama ketika Anda mulai memukul penghalang jalan.

Tapi ini bisa menghasilkan pembelajaran yang sangat dangkal, ketika Anda benar-benar perlu mengembangkan pengetahuan keterampilan yang lebih dalam.

Cobalah mengikuti kursus / buku yang sedang Anda kerjakan, kecuali jika Anda benar-benar tidak menyukainya. Berkelahi melalui penghalang jalan akan membantu Anda mengembangkan pemahaman materi yang lebih lengkap.

Dan semakin banyak masalah yang tampaknya mustahil Anda atasi, semakin Anda terbiasa menghadapi tantangan.

Setiap kursus hanyalah langkah pertama dalam perjalanan belajar Anda.

Hanya mengambil tutorial atau kursus tidak berarti Anda akan menjadi master pada saat Anda selesai. Anda harus belajar dan berlatih berulang kali sebelum benar-benar “mendapatkannya”.

Cobalah membaca tutorial untuk yang kedua kalinya, atau bahkan mempelajari materi yang sama dengan kursus atau buku yang berbeda.

Anda akan melihat bagaimana orang yang berbeda menjelaskan konsep yang sama, dan itu mungkin membantu pengetahuan untuk tetap melekat di otak Anda.

Dan, tentu saja, tidak ada pengganti untuk pengalaman praktis.

Saat Anda belajar, cobalah untuk mempraktikkan keterampilan yang Anda pelajari sendiri. Bangun proyek acak, buat situs web gratis untuk teman atau nirlaba. Semakin sering Anda memecahkan masalah, semakin Anda akan memahaminya.

Terima kasih sudah membaca!

Saya sangat berharap Anda menemukan artikel ini bermanfaat!

Jangan ragu untuk meninggalkan komentar di bawah ini dengan pemikiran atau umpan balik.

Jika Anda sedang belajar pengembangan web saat ini, saya juga senang mendengar tentang:

  • Apa tujuan akhir Anda, dan
  • Masalah # 1 yang Anda temui saat belajar.

Ingin lebih? Artikel lain yang saya tulis yang mungkin menarik bagi Anda:

Bagaimana tidak payah dalam coding

Belajar kode sama seperti belajar bahasa asing

Apakah Anda tertarik belajar kode? Saya menulis tentang pengkodean dan produktivitas di situs saya, coder-coder.com.

Daftar di sini untuk mendapatkan email tentang artikel baru.