Pelajari Web Development Sebagai Pemula - Pemrograman Web

Ingin belajar Web Development  sebagai pemula, tetapi tidak yakin harus mulai dari mana?

Sulit untuk mengetahui cara terbaik untuk mempelajari pengkodean, karena ada banyak sekali sumber daya di luar sana. Namun saat ini, yang Anda butuhkan hanyalah dasar-dasar pengembangan web– penjelasan umum dengan beberapa arahan tentang tujuan selanjutnya.

Pertama, berikut adalah langkah-langkah yang harus Anda ikuti sebagai Web Development  pemula.

Gambar Pelajari Web Development Sebagai Pemula - Pemrograman Web (ulin00)

Langkah-langkah untuk mempelajari dasar-dasar Development Web:

1. Pelajari dasar-dasar cara kerja situs web, front-end vs back-end, dan menggunakan editor kode
2. Pelajari HTML dasar, CSS, dan JavaScript
3. Pelajari alat: manajer paket, alat build, kontrol versi
4. Pelajari Sass, desain responsif, kerangka JavaScript
5. Pelajari dasar-dasar back-end: server dan database, bahasa pemrograman

Saya merekomendasikan melakukan Langkah 1, 2, dan 3 secara berurutan. Kemudian, bergantung pada apakah Anda ingin lebih fokus pada front-end atau back-end, Anda dapat melakukan langkah 4a atau 4b dalam urutan apa pun.

Menurut saya pribadi, sebaiknya developer web front-end mengetahui setidaknya sedikit back-end, dan sebaliknya. Setidaknya, mempelajari dasar-dasar keduanya akan membantu Anda mengetahui apakah Anda lebih menyukai pengembangan web front-end atau back-end !!!

(Road Map) Peta jalan untuk mempelajari Development Web (infografis)

Berikut adalah infografis bermanfaat yang menunjukkan kepada Anda semua langkah dalam peta jalan untuk mempelajari pengembangan web sebagai pemula!

RoadMap FrontEnd

Chart Created by Github 
User Kamranahmedse (https://github.com/kamranahmedse)

                                                                    RoadMap BackEnd

Chart Created by Github 
User Kamranahmedse (https://github.com/kamranahmedse)

Sekarang, mari langsung ke langkah pertama!

1.  Apa itu Web Development?

Sebelum kita masuk ke pengkodean yang sebenarnya, pertama-tama mari kita lihat beberapa informasi umum tentang apa itu pengembangan web: cara kerja situs web, perbedaan antara depan dan belakang, dan menggunakan editor kode.

Bagaimana cara kerja situs web?

Semua situs web, pada dasarnya, hanyalah sekumpulan file yang disimpan di komputer yang disebut server. Server ini terhubung ke internet. Anda kemudian dapat memuat situs web tersebut melalui browser (seperti Chrome, Firefox, atau Safari) di komputer atau ponsel Anda. Browser Anda juga disebut klien dalam situasi ini.

Jadi, setiap kali Anda berada di internet, Anda (klien) mendapatkan dan memuat data (seperti foto kucing) dari server, serta mengirimkan data kembali ke server ( muat foto kucing moar! ) Ini kembali dan bolak-balik antara klien dan server adalah dasar dari internet.

Apa pun yang dapat Anda akses di browser Anda adalah sesuatu yang dibuat oleh pengembang web. Beberapa contohnya adalah situs web bisnis kecil dan blog di sisi yang lebih sederhana, hingga aplikasi web yang sangat kompleks seperti AirBnb, Facebook dan Twitter.

Apa perbedaan antara front-end dan back-end?

Istilah pengembang web "ujung depan", "ujung belakang", dan "tumpukan penuh" menggambarkan bagian dari hubungan klien / server yang Anda kerjakan.

“Front end” berarti Anda berurusan terutama dengan sisi klien. Ini disebut "ujung depan" karena itulah yang dapat Anda lihat di browser. Sebaliknya, "back end" adalah bagian dari situs web yang tidak dapat Anda lihat, tetapi menangani banyak logika dan fungsionalitas yang diperlukan agar semuanya berfungsi.

Salah satu cara Anda dapat berpikir tentang ini adalah bahwa pengembangan web front-end seperti bagian "depan rumah" dari sebuah restoran. Ini adalah bagian di mana pelanggan datang untuk melihat dan merasakan restoran– dekorasi interior, tempat duduk, dan tentu saja, menyantap makanan.

Di sisi lain, pengembangan web back-end seperti bagian "belakang rumah" dari restoran. Di sinilah pengiriman dan inventaris dikelola, dan semua proses untuk membuat makanan terjadi. Ada banyak hal di balik layar yang tidak akan dilihat pelanggan, tetapi mereka akan mengalami (dan semoga menikmati) produk akhirnya - makanan yang lezat!

Selain ilustrasi yang menyenangkan, pengembangan web bagian depan dan belakang memiliki fungsi yang berbeda tetapi sangat penting.

Menggunakan editor kode

Saat Anda membangun situs web, alat paling penting yang akan Anda gunakan adalah editor kode atau IDE (Integrated Development Environment). Alat ini memungkinkan Anda untuk menulis markup dan kode yang akan membentuk situs web.

Ada beberapa opsi bagus di luar sana, tetapi saat ini editor kode paling populer adalah VS Code. Kode VS adalah versi yang lebih ringan dari Visual Studio, IDE utama Microsoft. Cepat, gratis, mudah digunakan, dan Anda dapat menyesuaikannya dengan tema dan ekstensi.

Editor kode lainnya adalah Teks Sublim, Atom, dan Vim.

Jika Anda baru memulai, saya sarankan untuk memeriksa VS Code, yang Anda bisa unduh dari situs web mereka.

Sekarang setelah kita membahas beberapa konsep yang lebih luas tentang apa itu pengembangan web, mari masuk ke lebih banyak detailnya– dimulai dari bagian depan.

2. Bagian Front-end

Bagian depan situs web terdiri dari tiga jenis file: HTML, CSS, dan JavaScript. File-file ini adalah apa yang dimuat di browser, di sisi klien.

Mari kita lihat lebih dekat satu per satu.

HTML

HTML, atau HyperText Markup Language, adalah dasar dari semua situs web. Ini adalah jenis file utama yang dimuat di browser Anda saat Anda melihat situs web. File HTML berisi semua konten di halaman, dan menggunakan tag untuk menunjukkan berbagai jenis konten.

Misalnya, Anda bisa menggunakan tag untuk membuat judul judul, paragraf, daftar berpoin, gambar, dan sebagainya. Tag HTML sendiri memang memiliki beberapa gaya yang dilampirkan, tetapi mereka cukup mendasar, seperti yang akan Anda lihat di dokumen Word.

Baru mulai menggunakan HTML? Periksatutorial ini tentang membangun situs web yang sangat sederhana hanya dengan menggunakan HTML.

CSS

CSS, atau Cascading Style Sheets, memungkinkan Anda menata konten HTML agar terlihat bagus dan mewah. Anda dapat menambahkan warna, font khusus, dan tata letak elemen situs web Anda seperti yang Anda inginkan. Anda bahkan dapat membuat animasi dan bentuk dengan CSS!

Ada banyak kedalaman pada CSS, dan terkadang orang cenderung mengabaikannya sehingga mereka dapat beralih ke hal-hal seperti JavaScript. Namun, saya tidak bisa melebih-lebihkan pentingnya memahami cara mengubah desain menjadi tata letak situs web menggunakan CSS. Jika Anda ingin berspesialisasi di front-end, penting untuk memiliki keterampilan CSS yang benar-benar kuat.

JavaScript

JavaScript adalah bahasa pemrograman yang dirancang untuk berjalan di browser. Dengan menggunakan JavaScript, Anda dapat membuat situs web Anda dinamis, artinya akan menanggapi masukan yang berbeda dari pengguna, atau sumber lain.

Misalnya, Anda dapat membuat tombol "Kembali ke Atas" yang ketika pengguna mengkliknya, mereka akan menggulir kembali ke atas halaman. Atau Anda dapat membuat widget cuaca yang akan menampilkan cuaca hari ini berdasarkan lokasi pengguna di dunia.

Terutama jika Anda ingin mengembangkan keterampilan Anda nanti dengan kerangka kerja JavaScript seperti React, Anda akan lebih memahami jika Anda meluangkan waktu untuk mempelajari JavaScript vanilla biasa terlebih dahulu. Ini adalah bahasa yang sangat menyenangkan untuk dipelajari, dan ada banyak hal yang dapat Anda lakukan dengannya!

bagaimana sudah dapat pandangan kan tentang Web Development ??? pasti bagi yang gak kuliah jurusan IT bingung belajar dari mana. Dan untuk yang kuliah jurusan IT gimana susah payahnya belajar Web Development masih semangat bukan ??? pantauin saja dipostingan - postingan berikutnya. terimakasih dan semoga bermanfaat buat kalian.