You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Web-Dev-For-Beginners/translations/id
softchris 2973498524
🌐 Update translations via Co-op Translator
2 days ago
..
1-getting-started-lessons 🌐 Update translations via Co-op Translator 6 days ago
2-js-basics 🌐 Update translations via Co-op Translator 6 days ago
3-terrarium 🌐 Update translations via Co-op Translator 6 days ago
4-typing-game 🌐 Update translations via Co-op Translator 6 days ago
5-browser-extension 🌐 Update translations via Co-op Translator 6 days ago
6-space-game 🌐 Update translations via Co-op Translator 6 days ago
7-bank-project 🌐 Update translations via Co-op Translator 6 days ago
8-code-editor/1-using-a-code-editor 🌐 Update translations via Co-op Translator 6 days ago
9-chat-project 🌐 Update translations via Co-op Translator 2 days ago
docs 🌐 Update translations via Co-op Translator 1 week ago
lesson-template 🌐 Update translations via Co-op Translator 1 week ago
quiz-app 🌐 Update translations via Co-op Translator 1 week ago
CODE_OF_CONDUCT.md 🌐 Update translations via Co-op Translator 1 week ago
CONTRIBUTING.md 🌐 Update translations via Co-op Translator 1 week ago
README.md 🌐 Update translations via Co-op Translator 6 days ago
SECURITY.md 🌐 Update translations via Co-op Translator 1 week ago
SUPPORT.md 🌐 Update translations via Co-op Translator 1 week ago
_404.md 🌐 Update translations via Co-op Translator 1 week ago
for-teachers.md 🌐 Update translations via Co-op Translator 1 week ago

README.md

GitHub license
GitHub contributors
GitHub issues
GitHub pull-requests
PRs Welcome

GitHub watchers
GitHub forks
GitHub stars

Open in Visual Studio Code

Microsoft Azure AI Foundry Discord

Ikuti langkah-langkah berikut untuk mulai menggunakan sumber daya ini:

  1. Fork Repositori: Klik GitHub forks
  2. Clone Repositori: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
  3. Bergabung dengan Azure AI Foundry Discord dan temui para ahli serta pengembang lainnya

Pengembangan Web untuk Pemula - Kurikulum

Pelajari dasar-dasar pengembangan web dengan kursus 12 minggu yang komprehensif dari Microsoft Cloud Advocates. Setiap dari 24 pelajaran membahas JavaScript, CSS, dan HTML melalui proyek langsung seperti terrarium, ekstensi browser, dan permainan luar angkasa. Ikuti kuis, diskusi, dan tugas praktis. Tingkatkan keterampilan Anda dan optimalkan pemahaman Anda dengan pendekatan pembelajaran berbasis proyek kami yang efektif. Mulailah perjalanan coding Anda hari ini!

🌐 Dukungan Multi-Bahasa

Didukung melalui GitHub Action (Otomatis & Selalu Terbaru)

French | Spanish | German | Russian | Arabic | Persian (Farsi) | Urdu | Chinese (Simplified) | Chinese (Traditional, Macau) | Chinese (Traditional, Hong Kong) | Chinese (Traditional, Taiwan) | Japanese | Korean | Hindi | Bengali | Marathi | Nepali | Punjabi (Gurmukhi) | Portuguese (Portugal) | Portuguese (Brazil) | Italian | Polish | Turkish | Greek | Thai | Swedish | Danish | Norwegian | Finnish | Dutch | Hebrew | Vietnamese | Indonesian | Malay | Tagalog (Filipino) | Swahili | Hungarian | Czech | Slovak | Romanian | Bulgarian | Serbian (Cyrillic) | Croatian | Slovenian | Ukrainian | Burmese (Myanmar)

Jika Anda ingin menambahkan bahasa terjemahan lainnya, daftar bahasa yang didukung tersedia di sini

🧑‍🎓 Apakah Anda seorang pelajar?

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

📣 Pengumuman - Proyek Baru untuk Dibangun Menggunakan Generative AI

Proyek Asisten AI 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!

Background

  • Pelajaran mencakup semuanya dari dasar hingga RAG.
  • Berinteraksi dengan tokoh sejarah menggunakan GenAI dan aplikasi pendamping kami.
  • Narasi yang menyenangkan dan menarik, Anda akan melakukan perjalanan waktu!

character

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

  • Teknik prompting dan prompt engineering
  • 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 sangat menghargai umpan balik Anda di forum diskusi kami!

Pelajar, untuk setiap pelajaran, mulailah dengan kuis pra-kuliah dan lanjutkan dengan membaca materi kuliah, menyelesaikan berbagai aktivitas, dan periksa pemahaman Anda dengan kuis pasca-kuliah.

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

Untuk melanjutkan pendidikan Anda, kami sangat merekomendasikan menjelajahi Microsoft Learn untuk bahan belajar tambahan.

📋 Menyiapkan Lingkungan Anda

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

Buat Repositori Anda

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

Ikuti langkah-langkah berikut:

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

Menjalankan Kurikulum di Codespace

Di salinan repositori Anda yang telah dibuat, klik tombol Code dan pilih Open with Codespaces. Ini akan membuat Codespace baru untuk Anda bekerja.

!Codespace./images/createcodespace.png)

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, Pengenalan Bahasa Pemrograman dan Alat yang Digunakan, akan memandu Anda melalui berbagai opsi untuk masing-masing alat ini agar Anda dapat memilih yang paling sesuai 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. Clone repositori 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, mengganti <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

Buka Folder dan pilih folder yang baru saja Anda kloning. Rekomendasi ekstensi Visual Studio Code:

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

📂 Setiap pelajaran mencakup:

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

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

🗃️ Pelajaran

Nama Proyek Konsep yang Diajarkan Tujuan Pembelajaran Tautan Pelajaran Penulis
01 Memulai Pengantar Pemrograman dan Alat yang Digunakan Mempelajari dasar-dasar di balik sebagian besar bahasa pemrograman dan perangkat lunak yang membantu pengembang profesional bekerja Pengantar Bahasa Pemrograman dan Alat yang Digunakan Jasmine
02 Memulai Dasar-dasar GitHub, termasuk bekerja dalam tim Cara menggunakan GitHub dalam proyek Anda, cara berkolaborasi dengan orang lain pada basis kode Pengantar GitHub Floor
03 Memulai Aksesibilitas Mempelajari dasar-dasar aksesibilitas web Dasar-dasar Aksesibilitas Christopher
04 Dasar JS Tipe Data JavaScript Dasar-dasar tipe data dalam JavaScript Tipe Data Jasmine
05 Dasar JS Fungsi dan Metode Mempelajari fungsi dan metode untuk mengelola alur logika aplikasi Fungsi dan Metode Jasmine dan Christopher
06 Dasar JS Membuat Keputusan dengan JS Mempelajari cara membuat kondisi dalam kode menggunakan metode pengambilan keputusan Membuat Keputusan Jasmine
07 Dasar JS Array dan Loop Bekerja dengan data menggunakan array dan loop dalam JavaScript Array dan Loop Jasmine
08 Terrarium HTML dalam Praktik Membangun HTML untuk membuat terrarium online, dengan fokus pada pembuatan tata letak Pengantar HTML Jen
09 Terrarium CSS dalam Praktik Membangun CSS untuk menata terrarium online, dengan fokus pada dasar-dasar CSS termasuk membuat halaman responsif Pengantar CSS Jen
10 Terrarium Penutupan JavaScript, Manipulasi DOM Membangun JavaScript untuk membuat terrarium berfungsi sebagai antarmuka drag/drop, dengan fokus pada penutupan dan manipulasi DOM Penutupan JavaScript, Manipulasi DOM Jen
11 Typing Game Membangun Game Mengetik Mempelajari cara menggunakan event keyboard untuk menggerakkan logika aplikasi JavaScript Anda Pemrograman Berbasis Event Christopher
12 Green Browser Extension Bekerja dengan Browser Mempelajari cara kerja browser, sejarahnya, dan cara membuat elemen pertama dari ekstensi browser Tentang Browser Jen
13 Green Browser Extension Membangun formulir, memanggil API, dan menyimpan variabel di local storage Membangun elemen JavaScript dari ekstensi browser Anda untuk memanggil API menggunakan variabel yang disimpan di local storage API, Formulir, dan Local Storage Jen
14 Green Browser Extension Proses latar belakang di browser, kinerja web Menggunakan proses latar belakang browser untuk mengelola ikon ekstensi; mempelajari kinerja web dan beberapa optimasi Tugas Latar Belakang dan Kinerja Jen
15 Space Game Pengembangan Game Lanjutan dengan JavaScript Mempelajari tentang Pewarisan menggunakan Kelas dan Komposisi serta pola Pub/Sub, sebagai persiapan untuk membangun game Pengantar Pengembangan Game Lanjutan Chris
16 Space Game Menggambar di Canvas Mempelajari tentang Canvas API, yang digunakan untuk menggambar elemen ke layar Menggambar di Canvas Chris
17 Space Game Menggerakkan elemen di layar Menemukan cara elemen dapat bergerak menggunakan koordinat kartesian dan Canvas API Menggerakkan Elemen Chris
18 Space Game Deteksi Tabrakan Membuat elemen bertabrakan dan bereaksi satu sama lain menggunakan keypress serta menyediakan fungsi cooldown untuk kinerja game Deteksi Tabrakan Chris
19 Space Game Menjaga Skor Melakukan perhitungan matematika berdasarkan status dan kinerja game Menjaga Skor Chris
20 Space Game Mengakhiri dan Memulai Ulang Game Mempelajari cara mengakhiri dan memulai ulang game, termasuk membersihkan aset dan mereset nilai variabel Kondisi Akhir Chris
21 Banking App Template HTML dan Routing di Aplikasi Web Mempelajari cara membuat kerangka arsitektur situs web multipage menggunakan routing dan template HTML Template HTML dan Routing Yohan
22 Banking App Membangun Formulir Login dan Registrasi Mempelajari cara membangun formulir dan menangani rutinitas validasi Formulir Yohan
23 Banking App Metode Mengambil dan Menggunakan Data Cara aliran data masuk dan keluar dari aplikasi Anda, cara mengambilnya, menyimpannya, dan membuangnya Data Yohan
24 Banking App Konsep Manajemen State Mempelajari cara aplikasi Anda mempertahankan state dan cara mengelolanya secara programatis Manajemen State Yohan
25 Browser/VScode Code Bekerja dengan VScode Mempelajari cara menggunakan editor kode Menggunakan Editor Kode VScode Chris
26 AI Assistants Bekerja dengan AI Mempelajari cara membangun asisten AI Anda sendiri Proyek Asisten AI 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 bergaya space-invader, dan aplikasi perbankan untuk bisnis. Pada akhir seri, siswa akan memiliki pemahaman yang kuat tentang pengembangan web.

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

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

Selain itu, kuis dengan risiko rendah sebelum kelas menetapkan niat siswa untuk mempelajari topik, sementara 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 yang kecil dan menjadi semakin kompleks pada akhir siklus 12 minggu.

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

Kunjungi Kode Etik dan panduan Kontribusi kami. Kami menyambut umpan balik konstruktif Anda!

🧭 Akses Offline

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

📘 PDF

PDF dari semua pelajaran dapat ditemukan di sini.

🎒 Kursus Lainnya

Tim kami juga memproduksi kursus lainnya! Lihat:

Lisensi

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


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