halo halo teman-teman semua Diantara Kalian ada nggak yang lagi pengen belajar membuat sebuah website atau belajar teknologi web design atau web programming apalagi disaat seperti ini disaat pandemi ini adalah waktu yang tepat untuk upgrade skill diri kita upgrade dengan skill yang saat ini lagi dibutuhkan nah tapi kalian bingung mulainya dari mana harus belajar apa dulu nggak usah khawatir teman-temannya di video kali ini kita akan bahas Bagaimana jalur belajar untuk menjadi seorang web developer saya Sadiqah gali dan Kalian sedang nonton channel web programming Unpas sebenarnya teman-teman video seperti ini udah pernah saya buat pada tahun 2019 yang lalu kalian bisa cek melalui tombol yang ada di atas kanan video ini videonya cukup populer dan cukup banyak juga teman-teman yang nonton ya tetapi saya lihat di kolom komentarnya itu banyak juga dari temen-temen yang merasa kebingungan bahkan frustasi untuk belajar karena kelihatannya Apa yang harus kita pelajari untuk menjadi seorang web developer itu banyak banget Padahal memang untuk menjadi seorang web developer cukup banyak yang harus ajari jadi malah menurunkan minat atau semangat mereka untuk melanjutkan belajarnya nanti teman-teman sebetulnya untuk membuat sebuah website yang utuh yang enak dilihat dan sudah bisa menampilkan informasi yang tepat yaitu kita gak perlu mempelajari semua materinya terlebih dahulu ada materi-materi minimal yang harus kita pelajari agar kita dapat membuat website yang utuh tadi Nah di video kali ini kita akan lihat urutan materi minimalnya seperti apa yang harus kita pelajari Sehingga nantinya kalian bisa menentukan sendiri Apakah kalian akan melanjutkan untuk mempelajari materi-materi yang lebih dalam atau kalian Mungkin berfikir Wah ini bukan bidang saya ya jadinya saya video ini cocok banget untuk kalian yang bener-bener mau mulai belajar web programming dari awal nggak masalah kalau kalian enggak memiliki latarbelakang it karena materi-materi yang akan kita pelajari nanti itu akan dimulai dari dasar banget ya dari nol Tapi sebelum kita masuk ke videonya saya ucapkan terima kasih dulu pada sponsor kita untuk video kita kali ini yaitu niagahoster buka jadi teman-teman niagahoster itu adalah sebuah dan penyedia hosting unlimited terbaik di Indonesia yang memiliki layanan yang beragam mulai dari shoot hosting unlimited Cloud hosting vps domain sampai dengan pembuatan website Keunggulan utama dari niagahoster ini adalah hostingnya yang supercepat dan juga memiliki keamanan ekstra agar website kita dapat terlindungi dari serangan hacker Malware ataupun virus selain harganya yang terjangkau niagahoster memberikan jaminan server uptime nyaris 100% yang artinya website kita akan selalu online setiap saat dan selain itu juga niagahoster ini memiliki tim support yang siap sedia membantu kita jika kita memiliki kesulitan langsung contact aja melalui fitur live chatnya yang tersedia selama 24jam dan saat ini Jika kalian membutuhkan web hosting niagahoster sedang memberikan diskon yang sangat besar sampai dengan 75% untuk salah satu layanannya yaitu paket personal dan menurut saya paket hosting personal ini adalah paket yang paling value for money buat kita karena dengan harga yang sangat terjangkau ini atau fitur yang lengkap banget jika kalian membeli paket ini langsung selama tiga tahun kalian yang seharusnya membayar sebesar 3,8 jutaan ini kalian hanya perlu membayar sebesar 950.000 and aja belum termasuk pajak dan kerennya lagi ini sudah termasuk nama domain gratis sesuai pilihan kalian sendiri nah jadi jika sudah ditambahkan pajak sepuluh persennya adalah sekitar 1 jutaan lebih dan Jika kalian ingin dapat potongan Lagi sebelum kalian check-out kalian bisa masukkan kode kupon web pun pas untuk mendapatkan potongan sebesar 10% dari lumayan kan total yang harus kalian bayarkan hanya sebesar 1080039 itu kalian tinggal bayar aja dengan pilihan metode pembayaran yang sangat banyak ini Jadi tunggu apalagi buat kalian yang sedang mencari web hosting untuk website atau aplikasi kalian Langsung aja kunjungi link ada di deskripsi video ini untuk informasi lebih lanjut baik teman-teman jadi di video kali ini pun sama dengan video sebelumnya itu terinspirasi dari websitenya road map Dota dan teman-temannya ini buatan dari seorang developer yang namanya kamran Ahmed ya dia udah membuatkan jalur belajar yang sangat lengkap Jadi kalau kalian bandingkan dengan video yang 2019 ini jauh lebih lengkap lagi Jadi mungkin kalau misalkan pemula atau yang baru belajar web baca ini yang mungkin akan sedikit kebingungan nah terus ada lagi inspirasi dari video ini yaitu dari channel YouTubenya Jessica old atau chord steker ya Ini dia bikin web developer roadmap 2021 ini saya ambil inspirasi atau saya ambil Bagaimana cara dia menjelaskan dalam bentuk mind map Nah kalau kalian pengin lihat detailnya karena memang kalian pengen lihat yang lengkapnya nanti link untuk dua sumber ini akan saya cantumkan di deskripsi jadi silahkan kalian lihat saja saya akan kita lihat ini adalah roadmap atau jalur belajar khusus saya buatkan untuk channel web programming Unpas ini versi web punya layak Nah untuk link ke mind map ini atau ke jalur belajar ini akan saya sertakan juga di deskripsi video beserta dengan file PDF yang super Nanti kalian lebih gampang lihatnya terus nanti cara bacanya adalah kalau misalkan kalian yang ada satu topik yang ada ceklisnya itu artinya kita punya videonya di channel web programming Unpas Jadi selain kalian bisa baca urutan materinya kalian bisa Klik aja nanti langsung diarahkan ke playlist pembelajaran yang sesuai dia teman-temannya begitu pula dengan PDF nyapdf jadi bisa kalian klik juga ya kita lihat mulai dari mana kita akan belajar web development Jadi kalau kalian klik tanda tambah disini ini kita lihat kita harus belajar dulu mengenai internet dan teknologi web ya Apa itu internet terus bisa ngapain aja internet terus istilah-istilah atau terminologi apa saja yang harus kita pahami dulu sebelum kita bisa bikin website ya sebelum kita bisa bikin website kita tahu dulu web itu apa web browser itu apa www tuh apa gitu ya Nah ini kalian bisa Klik aja disini nanti diarahkan ke video yang terkait ya Jadi kita harus paham dulu nih mengenai terminologi-terminologi di teknologi web kalau udah paham baru kita mulai masuk ke persiapan nah kalian harus nyiapin tools atau khas atau software Mbak sebelum nanti kita mulai istilahnya modding gitu ya membuat website ada beberapa ya Angeles kalian harus siapin kode editor Karena untuk bikin web itu enggak bisa kalian pakai Microsoft Word ada software khusus yang memang digunakan untuk mengetikkan baris-baris kode namanya kode editor ada banyak kolektor yang bisa kalian pilih di channel ini saya sudah belikan tutorial untuk penggunaan dua kode editor yang cukup populer ada Visual Studio code dan Sableng teks Sableng teks ini udah lama nggak saya gunakan jadi saya gunakan sejak tahun 2011-2012 sampai sekitar 2 tahun yang lalu lain setelah itu saya gunakan Visual Studio code jadi silahkan kalian kalau mau belajar Gimana cara pakai kreditor diklik aja tapi di luar dua itu ada lagi yang lain ya karena juga bisa gunakan atom Fame bahkan yang lainnya banyak sekali lalu Kalian juga harus paham mengenai web browser itu ya karena sekarang sebagai seorang web developer website yang akan kita buat itu digunakan oleh user-user Ya kemungkinan orang lain kita nggak bisa tahu Hai orang lain tuh pake browser apa sehingga kita harus paham juga perilaku yang dimiliki oleh tiap-tiap browser jadi Saran saya kalau kalian mau jadi seorang web developer minimal di komputer kalian di-install berbagai macam web browser sehingga Setelah kalian nanti bikin website kalian bisa lihat apakah website yang kalian buat ini tampil bagus di tiap-tiap web browser atau tidak karena perilaku dari tiap-tiap web browser bisa sedikit berbeda ya tapi untuk development ya itu nanti kita akan gunakan Google Chrome dan mungkin aja kalian harus belajar design tools itu karena seorang web developer ini nantinya diharuskan memiliki kemampuan untuk menterjemahkan design yang sudah dibuat kedalam codingnya biasanya terus desain yang digunakan kau ada figma Adobe XD atau mungkin Photoshop pengetahuan mengenai ini membantu kita ketika kita mau menerjemahkan desain menjadi tampilan antarmuka dan kebetulan di channel web programming Unpas dulu Mada materi mengenai jadi silahkan kalian boleh cari banyak sekali sumber-sumber yang menjelaskan mengenai penggunaan untuk sini jadi siapin dulu siapkan dulu totos yang dibutuhkan barusan jutnya kita masuk nih ke materi pertama mengenai html atau hypertext markup language Ini adalah bahasa pertama yang harus kalian pelajari ketika mau membuat sebuah website ya karena website sekeren apapun yang kalian lihat website yang memiliki teknologi yang macam-macam itu pasti tetep aja kerangka dasarnya struktur dasarnya itu dibuat pakai html ya jadi nggak bisa diskip harus kalian pelajari materinya juga sebetulnya Enggak banyak ya kita akan belajar mengenai tag dan atribut ada elemen apa aja sih di dalam html Gita kita tahu deheading tahu ada paragraf kita tahu addlink les gambar dan lain sebagainya kita pelajari disini kita belajar mengenai for beserta validasinya kapan kita menyimpan text field Kapan kita menyimpan select atau combobox apa bedanya radio button dengan checkbox nah ini kita akan pelajari disini lalu juga kalau dibutuhkan kalian akan belajar mengenai table ya bagaimana merepresentasikan khas secara tabular dasarnya kita harus pelajari mengenai semantik html Kapan kita menggunakan tag yang tepat untuk struktur html kita dengan tidak kaitannya erat dengan accessibility dan juga shioya search engine optimization jadi ini yang harus kalian pelajari pertama silahkan diklik aja nih tanda ceklisnya Nanti kalian akan diarahkan ke playlist pembelajaran mengenai html setelah diklik Nanti kalian Tonton aja videonya ada 13 video mengenai html itu aja jarang akses materinya sebagai kesini selanjutnya Setelah kalian belajar html itu kita belajar CSS itu tadi belajar struktur halamannya sekarang kita belajar bagaimana cara menghias halamannya supaya jadi tampil lebih menarik lagi ada warnanya rata letaknya bisa kita atur dan lain sebagainya apa aja yang harus kita pelajari di CSS dasar kita mempelajari mengenai yang disebut dengan selector bagaimana kita menyeleksi elemen html ini bisa sangat mudah bisa jadi sangat kompleks sini seru nih Lalu setelah itu kita Carita Properti apa saja yang ada di dalam CSS untuk memodifikasi tiap elemennya yang sudah kita seleksi dan propertinya ini sebetulnya ada banyak ya teman-temannya cuman kalian tak perlu menghafal semuanya cukup ingat-ingat aja yang sering digunakan karena nanti semakin sering kalian menggunakan CSS pasti lama-lama hafal dan Kalian juga nggak perlu khawatir karena saat ini sudah banyak dipermudah oleh kode editor kita dan yang penting juga kalian belajar mengenai spesifikasi t ini bagaimana membuat selector kita ini bisa menyeleksi elemen yang tepat itu kadang seorang pemula yang baru belajar web itu kebingungan ini perasaan elemennya udah bener saya kasih warna tapi ke warnanya Enggak berubah ternyata bobotnya atau spesifikasinya masih kalah gitu ya Dan ini kita pelajari semuanya di materi CSS dasar sayurnya setelah paham CSS dasar apalagi kalian harus paham mengenai CSS layout Ting ini sangat penting teman-teman untuk belajar bagaimana menempatkan elemen yang tadi sudah kita pilih di sini ke posisi yang sesuai dengan keinginan kita itu belajar CSS lewat ingini topik yang cukup banyak karena menurut saya inti dari kweni bagaimana kita melayout elemen-elemen yang udah kita bikin pakai html kita belajar display dan dimensi box model posisi on kita belajar responsive web design dan juga ini teknologi-teknologi yang lebih barulah ya kita belajar CSS unit flexbox dan Grid system video CSS layout ingini meng-cover 4 materi ini selanjutnya ada playlist berikutnya mengenai CSS unit flexbox dan grip ini video terpisah Jadi kalian bisa ikutin aja playlistnya satu persatu Oke Setelah kalian paham mengenai ksleo Ting di sini harusnya kalian udah bisa membuat website yang sangat sederhana banyak latihan-latihan yang saya berikan disini untuk membuat Website jadi satu halaman selanjutnya ini tambahan aja kalian belajar mengenai css3 atau teknologi CSS yang terkini ya ini terkait dengan transisi dan animasi untuk membuat Website kalian lebih interaktif lagi Jadi kalau tidak ada animasinya ada transisinya Kalau masnya digeser anti berubah warna menggunakan transisi ini tambahan aja untuk membuat Website kita lebih menariknya udah beres nih CSS Selanjutnya apa yang kita pelajari kita belajar CSS Framework segitu ya sebelumnya kita membuat HTML dan CSS ini dari nol kita ngetik in semua baris-baris kodenya satu persatu ternyata ada orang yang sudah membuatkan Framework untuk mempermudah dan mempercepat apa yang sudah kita lakukan sebelumnya ada macam-macam CSS Framework eh yang akan dipelajari lewat channel reprogramming Unpas sini ada remotenya namanya bootstrap dan material lain tapi diluar itu kalian bisa cek ada yang lain dan Harusnya kalau kalian udah ngikutin playlist di CSS Framework ini udah banyak website yang kalian buat selanjutnya udah beres nih kalau udah bisa bikin website harusnya di sini apa yang harus kalian pelajari kita harus belajar menggunakan version control system website yang tadinya hanya tersimpan di komputer Kian yang kalian simpan secara manual di file system kalian kita harus kelola source code nya menggunakan sebuah version control disini kita akan belajar mengenai Gates dan pengetahuan mengenai gate ini menurut saya sangat-sangat penting teman-teman mau apapun Nanti kalian memilih jalur kedepannya menjadi floem developer mau jadi BKM developer apapun yang berhubungan dengan source code atau codingan kalian itu kalian harus bisa kelola menggunakan version control System yang ada banyak selain Gita piang akan dipelajari di channel ini adalah gitu apa aja yang dipelajari kita mengelola source code supaya lebih selesai itu rapih ya baik itu penyimpanannya versioning nya enggak duplikat duplikat kita kelola lalu kita hubungkan juga source code yang ada di komputer kita ke sebuah layanan yang namanya get help much sekarang sosok kalian sudah tidak hanya tersimpan di komputer kalian tapi tersimpan juga di layanan yang namanya kitabnya untuk mempermudah kolaborasi untuk mempermudah fablice juga nantinya Karena sekarang rasanya semua programmer itu pasti pakai version control dan terakhir kita akan belajar Gimana caranya hosting website kita menggunakan Git hpcs semuanya ada di playlist ini kenapa ya karena pada akhirnya kalian pengin website kalian tuh diakses semua orang kan nggak mungkin ada di komputer kalian aja nah salah satu caranya itu bisa menggunakan ghpjb dan sebetulnya Ada cara lain yang enggak hanya pakai get HP Jazz Kalian juga bisa menggunakan layanan share hosting seperti yang ditawarkan oleh sponsor kita di video ini yaitu niagahoster kejadian Nanti kalian websitenya bisa punya nama kalian sendiri misalkan Sadiqah galih.com yang isinya itu menampilkan website kalian jadi sampai sini harusnya kalian udah punya website yang bisa ditunjukkan ke dunia gitu jadi tunjukin ke semua orang bahwa kalian tuh bisa bikin website minimal website portfolio untuk diri kalian sendiri jadi sampai sini harusnya kalian udah punya tuh website dengan nama kalian yang kalau orang klik orang bisa tahu siapa kalian bisa apa aja udah pernah bikin apa aja pamerin semua di website yang kalian bikin ini Jadi sebetulnya ini nah materi minimal yang harus kalian kuasai jadi sampai sini kalian tinggal Rasakan Sendiri kira-kira bidang web development ini cocok nggak untuk diri kalian itu karena ini adalah materi minimal yang harus dimiliki Nah setelah misalkan kalian merasa sepertinya adalah jalan yang tepat gitu ya Nah baru mulai kita belajar yang agak susah ini kita belajar programming disini ini saya sudah sediakan playlist mengenai dasar pemrograman menggunakan Java script ini fokusnya ada di dasar pemrograman yang teman-teman javascript itu kita gunakan hanya sebagai contoh bahasa saja karena banyak banget bahasa pemograman yang ada tapi bahasa momen tersebut memiliki perilaku yang mirip-mirip layar perilakunya seperti ini teman-teman jadi dengan kalian ngikutin playlist ini kalian bakalan tahu apa situ programming Kenapa kita harus modding gitu ya Apa itu bahasa pemograman kita akan tahu nilai tipe data operator variabel struktur kendali ya if else for while kita Hai apa itu function array dan objek jadi ini adalah komponen-komponen yang ada di dalam programming ini bisa kalian terapkan nanti kalau kalian belajar bahasa yang lain ketika kalau udah Wah ternyata seru juga nih programming begitu kalian pindah ke bahasa yang lain ya masakan kalian belajar Java belajar PHP Python di semua bahasa itu pasti punya tipe data operator variabel dan lainnya Walaupun mungkin ada juga karakteristik yang berbeda jadi ini menurut saya adalah materi-materi minimal yang harus kalian pahami dulu itu sebelum nanti lebih lanjut lagi belajar mengenai materi yang lainnya jadi kalau bisa saya zoom.out yang kalian tanya dulu Kediri kalian setelah melalui materi-materi ini kira-kira gimana nih mau lanjut belajar ya Oh ternyata web development bukan bidang yang cocok untuk saya jadi ceknya sampai sini aja kalau misalkan kalian ingin lebih detil lagi sebetulnya ini saya sudah buatkan sedikit di sini ada kalian bisa pilih mau from mau be'en tapi sepertinya ini belum saya lengkapi ya kalian tulis saja di kolom komentar Kalau misalkan kalian Hai bagian-bagian ini kita lengkapi lagi karena materi untuk peranan dan beken di channel ini belum lengkap ya Jadi kita masih fokus di fundamentalnya aja gitu ya teman-temannya jadi mudah-mudahan dengan adanya video ini bisa membuat kalian tuh nggak bingung lagi mau mulai belajar web dari mana dan harapan saya video ini juga enggak Malah membuat kalian jadi frustasi karena banyak materi yang harus kalian pelajari dari Mungkin itu saja untuk video kita kali ini dan sebelum saya akhiri saya kembali mengucapkan terima kasih kepada niagahoster yang udah sponsorin video ini dan jangan lupa teman-teman saat ini niagahoster lagi ngadain promo yang sangat spesial jadi ada diskon sampai dengan 75% bentuk layanan web hostingnya dan ini sudah termasuk nama domain dan jangan lupa juga kalian bisa masukkan kode kuponnya web pun pas saat kalian check-out untuk dapetin lagi Diskon tambahan sebesar 10% nya itu akan yang lagi cari-cari hosting untuk Website kalian kalian bisa gunakan niagahoster sebagai penyedia layanan web hostingnya Oke teman-teman jadi mungkin itu untuk videonya Sekali lagi saya ucapkan terima kasih buat teman-teman yang sudah nonton silakan bagikan video nih ke temen-temen kalian saudara-saudara kalian atau siapapun yang pengen belajar untuk membuat Website dari awal ya jadi Selamat belajar semangat terus belajarnya jangan menyerah kita ketemu lagi divideo berikutnya Saya cantik cagalli pamit dan seperti biasa jangan lupa titik koma lalu [Musik] [Tepuk tangan] [Musik]