Web-Dev-For-Beginners/translations/id

Pengembangan Web untuk Pemula - Kurikulum

Pelajari dasar-dasar pengembangan web dengan kursus komprehensif selama 12 minggu dari Microsoft Cloud Advocates. Setiap dari 24 pelajaran mendalami JavaScript, CSS, dan HTML melalui proyek langsung seperti terarium, ekstensi browser, dan permainan luar angkasa. Terlibat dengan kuis, diskusi, dan tugas praktis. Tingkatkan keterampilan Anda dan optimalkan retensi pengetahuan Anda dengan pedagogi berbasis proyek yang efektif. Mulailah perjalanan coding Anda hari ini!

Bergabunglah dengan Komunitas Discord Azure AI Foundry

Ikuti langkah-langkah ini untuk memulai menggunakan sumber daya ini:

1. Fork Repository: Klik
2. Klon Repository: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
3. Bergabunglah dengan Azure AI Foundry Discord dan temui ahli serta pengembang lainnya

🌐 Dukungan Multi-Bahasa

Didukung melalui GitHub Action (Otomatis & Selalu Terbaru)

Arab | Bengali | Bulgaria | Burma (Myanmar) | Cina (Sederhana) | Cina (Tradisional, Hong Kong) | Cina (Tradisional, Macau) | Cina (Tradisional, Taiwan) | Kroasia | Ceko | Denmark | Belanda | Estonia | Finlandia | Perancis | Jerman | Yunani | Ibrani | Hindi | Hongaria | Indonesia | Italia | Jepang | Kannada | Korea | Lituania | Melayu | Malayalam | Marathi | Nepali | Pidgin Nigeria | Norwegia | Persia (Farsi) | Polandia | Portugis (Brasil) | Portugis (Portugal) | Punjabi (Gurmukhi) | Rumania | Rusia | Serbia (Sirilik) | Slowakia | Slovenia | Spanyol | Swahili | Swedia | Tagalog (Filipina) | Tamil | Telugu | Thai | Turki | Ukraina | Urdu | Vietnam

Lebih Suka Kloning Lokal?

Repository ini memiliki lebih dari 50 terjemahan bahasa yang secara signifikan meningkatkan ukuran unduhan. Untuk mengkloning tanpa terjemahan, gunakan sparse checkout:

git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners
git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'

Ini memberi Anda semua yang Anda butuhkan untuk menyelesaikan kursus dengan unduhan yang jauh lebih cepat.

Jika Anda ingin mendukung bahasa tambahan, daftar bahasa yang didukung tersedia di sini

🧑‍🎓 Apakah Anda seorang pelajar?

Kunjungi halaman Student Hub di mana Anda akan menemukan sumber daya pemula, paket pelajar, dan bahkan cara mendapatkan voucher sertifikat gratis. Ini adalah halaman yang ingin Anda tandai dan periksa dari waktu ke waktu karena kami mengganti konten setiap bulan.

📣 Pengumuman - Tantangan mode GitHub Copilot Agent baru untuk diselesaikan!

Tantangan Baru ditambahkan, cari "GitHub Copilot Agent Challenge 🚀" di sebagian besar bab. Itu adalah tantangan baru bagi Anda untuk diselesaikan menggunakan GitHub Copilot dan mode Agent. Jika Anda belum pernah menggunakan mode Agent sebelumnya, mode ini mampu tidak hanya menghasilkan teks tetapi juga membuat dan mengedit file, menjalankan perintah, dan banyak lagi.

📣 Pengumuman - Proyek Baru untuk dibangun menggunakan Generative AI

Proyek AI Assistant baru saja ditambahkan, lihat proyek

📣 Pengumuman - Kurikulum Baru tentang Generative AI untuk JavaScript baru saja dirilis

Jangan lewatkan kurikulum Generative AI baru kami!

Kunjungi https://aka.ms/genai-js-course untuk memulai!

• Pelajaran mencakup segala sesuatu dari dasar hingga RAG.
• Berinteraksilah dengan karakter sejarah menggunakan GenAI dan aplikasi pendamping kami.
• Narasi yang menyenangkan dan menarik, Anda akan melakukan perjalanan waktu!

Setiap pelajaran mencakup tugas untuk diselesaikan, pemeriksaan pengetahuan, dan tantangan untuk membimbing Anda mempelajari topik seperti:

• Prompting dan rekayasa prompt
• Pembuatan aplikasi teks dan gambar
• Aplikasi pencarian

Kunjungi https://aka.ms/genai-js-course untuk memulai!

🌱 Memulai

Guru, kami telah menyertakan beberapa saran tentang cara menggunakan kurikulum ini. Kami ingin mendengar umpan balik Anda di forum diskusi kami!

Pelajar, untuk setiap pelajaran, mulai dengan kuis pra-ceramah dan ikuti dengan membaca materi ceramah, menyelesaikan berbagai aktivitas, dan periksa pemahaman Anda dengan kuis pasca-ceramah.

Untuk meningkatkan pengalaman belajar Anda, hubungkan dengan rekan Anda untuk mengerjakan proyek bersama! Diskusi sangat dianjurkan di forum diskusi kami di mana tim moderator kami akan siap menjawab pertanyaan Anda.

Untuk memperdalam pendidikan Anda, kami sangat merekomendasikan menjelajahi Microsoft Learn untuk materi studi tambahan.

📋 Menyiapkan lingkungan Anda

Kurikulum ini memiliki lingkungan pengembangan yang siap digunakan! Saat Anda memulai, Anda dapat memilih menjalankan kurikulum dalam Codespace (lingkungan berbasis browser tanpa perlu instalasi), atau secara lokal di komputer Anda menggunakan editor teks seperti Visual Studio Code.

Buat repository Anda

Agar Anda mudah menyimpan pekerjaan Anda, disarankan agar Anda membuat salinan repository ini sendiri. Anda dapat melakukannya dengan mengklik tombol Use this template di bagian atas halaman. Ini akan membuat repository baru di akun GitHub Anda dengan salinan kurikulum.

Ikuti langkah-langkah ini:

1. Fork Repository: Klik tombol "Fork" di sudut kanan atas halaman ini.
2. Klon Repository: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git

Menjalankan kurikulum di Codespace

Dalam salinan repository ini yang Anda buat, klik tombol Code dan pilih Open with Codespaces. Ini akan membuat Codespace baru untuk Anda bekerja di dalamnya.

Menjalankan kurikulum secara lokal di komputer Anda

Untuk menjalankan kurikulum ini secara lokal di komputer Anda, Anda memerlukan editor teks, browser, dan alat baris perintah. Pelajaran pertama kami, Pendahuluan tentang Bahasa Pemrograman dan Alat-Alat Dagang, akan memandu Anda melalui berbagai opsi untuk masing-masing alat ini agar Anda dapat memilih yang paling cocok untuk Anda.

Rekomendasi kami adalah menggunakan Visual Studio Code sebagai editor Anda, yang juga memiliki Terminal bawaan. Anda dapat mengunduh Visual Studio Code di sini.

1. Klon repository Anda ke komputer Anda. Anda dapat melakukannya dengan mengklik tombol Code dan menyalin URL:

   CodeSpace Kemudian, buka Terminal di dalam Visual Studio Code dan jalankan perintah berikut, ganti <your-repository-url> dengan URL yang baru saja Anda salin:

   git clone <your-repository-url>
   

2. Buka folder di Visual Studio Code. Anda dapat melakukannya dengan mengklik File > Open Folder dan memilih folder yang baru saja Anda kloning.

Ekstensi Visual Studio Code yang direkomendasikan:

• Live Server - untuk pratinjau halaman HTML di dalam Visual Studio Code
• Copilot - untuk membantu Anda menulis kode lebih cepat

📂 Setiap pelajaran mencakup:

• sketchnote opsional
• video tambahan opsional
• kuis pemanasan sebelum pelajaran
• pelajaran tertulis
• untuk pelajaran berbasis proyek, panduan langkah demi langkah untuk membangun proyek
• pemeriksaan pengetahuan
• tantangan
• bacaan tambahan
• tugas
• kuis pasca pelajaran

Catatan tentang kuis: Semua kuis terdapat dalam folder Quiz-app, total 48 kuis dengan tiga pertanyaan masing-masing. Kuis tersedia di sini aplikasi kuis dapat dijalankan secara lokal atau diterapkan ke Azure; ikuti instruksi di folder quiz-app.

🗃️ Pelajaran

	Nama Proyek	Konsep yang Diajarkan	Tujuan Pembelajaran	Pelajaran Terkait	Penulis
01	Memulai	Pengantar Pemrograman dan Alat Kerja	Pelajari dasar-dasar yang mendasari sebagian besar bahasa pemrograman dan perangkat lunak yang membantu pengembang profesional melakukan pekerjaannya	Intro to Programming Languages and Tools of the Trade	Jasmine
02	Memulai	Dasar-dasar GitHub, termasuk bekerja dengan tim	Cara menggunakan GitHub dalam proyek Anda, cara berkolaborasi dengan orang lain pada basis kode	Intro to GitHub	Floor
03	Memulai	Aksesibilitas	Pelajari dasar-dasar aksesibilitas web	Accessibility Fundamentals	Christopher
04	Dasar JS	Tipe Data JavaScript	Dasar-dasar tipe data JavaScript	Data Types	Jasmine
05	Dasar JS	Fungsi dan Metode	Pelajari tentang fungsi dan metode untuk mengelola alur logika aplikasi	Functions and Methods	Jasmine dan Christopher
06	Dasar JS	Membuat Keputusan dengan JS	Pelajari cara membuat kondisi dalam kode Anda menggunakan metode pengambilan keputusan	Making Decisions	Jasmine
07	Dasar JS	Array dan Loop	Bekerja dengan data menggunakan array dan loop dalam JavaScript	Arrays and Loops	Jasmine
08	Terrarium	HTML dalam Praktek	Bangun HTML untuk membuat terrarium online, fokus pada membangun tata letak	Introduction to HTML	Jen
09	Terrarium	CSS dalam Praktek	Bangun CSS untuk memformat terrarium online, fokus pada dasar-dasar CSS termasuk membuat halaman responsif	Introduction to CSS	Jen
10	Terrarium	Penutupan JavaScript, manipulasi DOM	Bangun JavaScript untuk membuat terrarium berfungsi sebagai antarmuka seret/jatuh, fokus pada closures dan manipulasi DOM	JavaScript Closures, DOM manipulation	Jen
11	Typing Game	Membuat Game Mengetik	Pelajari cara menggunakan event keyboard untuk menggerakkan logika aplikasi JavaScript Anda	Event-Driven Programming	Christopher
12	Green Browser Extension	Bekerja dengan Browser	Pelajari cara kerja browser, sejarahnya, dan cara membuat kerangka elemen pertama ekstensi browser	About Browsers	Jen
13	Green Browser Extension	Membangun formulir, memanggil API dan menyimpan variabel di penyimpanan lokal	Bangun elemen JavaScript dari ekstensi browser Anda untuk memanggil API menggunakan variabel yang disimpan di penyimpanan lokal	APIs, Forms, and Local Storage	Jen
14	Green Browser Extension	Proses latar belakang di browser, kinerja web	Gunakan proses latar belakang browser untuk mengelola ikon ekstensi; pelajari tentang kinerja web dan beberapa optimasi untuk membuat	Background Tasks and Performance	Jen
15	Space Game	Pengembangan Game Tingkat Lanjut dengan JavaScript	Pelajari tentang Pewarisan menggunakan Kelas dan Komposisi serta pola Pub/Sub, sebagai persiapan untuk membangun sebuah game	Introduction to Advanced Game Development	Chris
16	Space Game	Menggambar ke kanvas	Pelajari tentang API Canvas, digunakan untuk menggambar elemen pada layar	Drawing to Canvas	Chris
17	Space Game	Memindahkan elemen di sekitar layar	Temukan bagaimana elemen dapat bergerak menggunakan koordinat kartesius dan API Canvas	Moving Elements Around	Chris
18	Space Game	Deteksi tabrakan	Buat elemen bertabrakan dan bereaksi satu sama lain menggunakan penekanan tombol dan menyediakan fungsi cooldown untuk memastikan kinerja game	Collision Detection	Chris
19	Space Game	Menyimpan skor	Lakukan perhitungan matematika berdasarkan status dan kinerja game	Keeping Score	Chris
20	Space Game	Mengakhiri dan memulai ulang game	Pelajari tentang mengakhiri dan memulai ulang game, termasuk membersihkan aset dan mengatur ulang nilai variabel	The Ending Condition	Chris
21	Banking App	Template HTML dan Rute dalam Aplikasi Web	Pelajari cara membuat kerangka arsitektur situs web multipage menggunakan routing dan template HTML	HTML Templates and Routes	Yohan
22	Banking App	Membuat Formulir Login dan Pendaftaran	Pelajari tentang membangun formulir dan menangani rutin validasi	Forms	Yohan
23	Banking App	Metode Mengambil dan Menggunakan Data	Bagaimana data mengalir masuk dan keluar dari aplikasi Anda, bagaimana mengambilnya, menyimpannya, dan membuangnya	Data	Yohan
24	Banking App	Konsep Manajemen State	Pelajari bagaimana aplikasi Anda mempertahankan state dan cara mengelolanya secara programatik	State Management	Yohan
25	Browser/VScode Code	Bekerja dengan VScode	Pelajari cara menggunakan editor kode	Use VScode Code Editor	Chris
26	AI Assistants	Bekerja dengan AI	Pelajari cara membangun asisten AI Anda sendiri	AI Assistant project	Chris

🏫 Pedagogi

Kurikulum kami dirancang dengan dua prinsip pedagogi utama:

• pembelajaran berbasis proyek
• kuis yang sering

Program ini mengajarkan dasar-dasar JavaScript, HTML, dan CSS, serta alat dan teknik terbaru yang digunakan oleh pengembang web saat ini. Siswa akan memiliki kesempatan untuk mengembangkan pengalaman langsung dengan membangun game mengetik, terrarium virtual, ekstensi browser ramah lingkungan, game gaya space-invader, dan aplikasi perbankan untuk bisnis. Pada akhir seri, siswa akan memiliki pemahaman yang kuat tentang pengembangan web.

🎓 Anda dapat mengambil beberapa pelajaran pertama dalam kurikulum ini sebagai Learn Path di Microsoft Learn!

Dengan memastikan bahwa konten sesuai dengan proyek, proses dibuat lebih menarik bagi siswa dan retensi konsep akan meningkat. Kami juga menulis beberapa pelajaran pemula dalam dasar-dasar JavaScript untuk memperkenalkan konsep, dipasangkan dengan video dari koleksi tutorial video "Beginners Series to: JavaScript", beberapa penulisnya berkontribusi pada kurikulum ini.

Selain itu, kuis dengan taruhan rendah sebelum kelas menetapkan niat siswa untuk mempelajari suatu topik, sedangkan kuis kedua setelah kelas memastikan retensi lebih lanjut. Kurikulum ini dirancang agar fleksibel dan menyenangkan serta dapat diambil secara keseluruhan atau sebagian. Proyek dimulai dari kecil dan menjadi semakin kompleks pada akhir siklus 12 minggu.

Meskipun kami sengaja menghindari memperkenalkan kerangka kerja JavaScript untuk fokus pada keterampilan dasar yang diperlukan sebagai pengembang web sebelum mengadopsi kerangka kerja, langkah selanjutnya yang baik untuk menyelesaikan kurikulum ini adalah belajar tentang Node.js melalui koleksi video lain: "Beginner Series to: Node.js".

Kunjungi pedoman Code of Conduct dan Contributing kami. Kami menyambut umpan balik konstruktif Anda!

🧭 Akses Offline

Anda dapat menjalankan dokumentasi ini secara offline dengan menggunakan Docsify. Fork repo ini, instal Docsify di mesin lokal Anda, lalu di folder root repo ini, ketik docsify serve. Situs web akan dilayani pada port 3000 di localhost Anda: localhost:3000.

📘 PDF

PDF dari semua pelajaran dapat ditemukan di sini.

🎒 Kursus Lainnya

Tim kami menghasilkan kursus lain! Lihat:

LangChain

---

Azure / Edge / MCP / Agen

---

Seri AI Generatif

---

Pembelajaran Inti

---

Seri Copilot

Mendapatkan Bantuan

Jika Anda mengalami kesulitan atau memiliki pertanyaan tentang membangun aplikasi AI. Bergabunglah dengan sesama pelajar dan pengembang berpengalaman dalam diskusi tentang MCP. Ini adalah komunitas yang mendukung dimana pertanyaan disambut dan pengetahuan dibagikan dengan bebas.

Jika Anda memiliki umpan balik produk atau menemukan kesalahan saat membangun kunjungi:

Lisensi

Repositori ini dilisensikan di bawah lisensi MIT. Lihat file LICENSE untuk informasi lebih lanjut.

---

Penafian:
Dokumen ini telah diterjemahkan menggunakan layanan terjemahan AI Co-op Translator. Meskipun kami berupaya untuk memberikan terjemahan yang akurat, harap diingat bahwa terjemahan otomatis mungkin mengandung kesalahan atau ketidakakuratan. Dokumen asli dalam bahasa aslinya harus dianggap sebagai sumber yang otoritatif. Untuk informasi yang penting, disarankan menggunakan penerjemahan profesional oleh manusia. Kami tidak bertanggung jawab atas kesalahpahaman atau penafsiran yang keliru yang timbul dari penggunaan terjemahan ini.