18 KiB

Raw Blame History

Pengembangan Website untuk pemula - Kurikulum

Azure Cloud Advocates di Microsoft dengan senang hati menawarkan kurikulum 12 minggu 24 pelajaran tentang JavaScript, CSS, dan dasar-dasar HTML. Setiap pelajaran mencakup kuis sebelum dan sesudah pelajaran, instruksi tertulis untuk menyelesaikan pelajaran, solusi, tugas, dan banyak lagi. Pedagogi berbasis proyek kami memungkinkan Anda untuk belajar sambil membangun, cara yang terbukti untuk keterampilan baru untuk 'stick'.

Terima kasih yang sebesar-besarnya kepada penulis kami Jen Looper, Chris Noring, Christopher Harrison, Jasmine Greenaway, Yohan Lasorsa, Floor Drees, dan seniman sketchnote Tomomi Imura!

Mulai

Guru, kita punya termasuk beberapa saran tentang bagaimana menggunakan kurikulum ini. Kami akan menyukai tanggapan Anda di forum diskusi kami! Pelajar, untuk menggunakan kurikulum ini sendiri, bagilah seluruh repo dan selesaikan latihannya sendiri, dimulai dengan kuis pra-kuliah, kemudian membaca kuliah dan menyelesaikan sisa kegiatan. Cobalah untuk membuat proyek dengan memahami pelajaran daripada menyalin kode solusi; namun kode tersebut tersedia di folder /solutions di setiap pelajaran berorientasi proyek. Ide lain adalah membentuk kelompok belajar dengan teman-teman dan membahas isinya bersama-sama. Untuk studi lebih lanjut, kami merekomendasikan Belajar Microsoft dan dengan menonton video yang disebutkan di bawah ini.

Gif oleh Mohit Jaisal

🎥 Klik gambar di atas untuk melihat video tentang proyek dan orang-orang yang membuatnya!

Pedagogi

Kami telah memilih dua prinsip pedagogis saat membangun kurikulum ini: memastikan bahwa itu berbasis proyek dan termasuk kuis yang sering. Pada akhir seri ini, siswa akan membuat game mengetik, terarium virtual, ekstensi browser 'hijau', game tipe 'penyerbu ruang', dan aplikasi perbankan tipe bisnis, dan akan mempelajari dasar-dasar JavaScript , HTML, dan CSS bersama dengan rantai alat modern dari pengembang web saat ini.

🎓 Anda dapat mengambil beberapa pelajaran pertama dalam kurikulum ini sebagai Pelajari Jalur di Microsoft Learn! Dengan memastikan bahwa konten selaras dengan proyek, proses dibuat lebih menarik bagi siswa dan retensi konsep akan ditambah. Kami juga menulis beberapa pelajaran awal dalam dasar-dasar JavaScript untuk memperkenalkan konsep, dipasangkan dengan video dari "Beginners Series to: JavaScript" kumpulan video tutorial, yang beberapa penulisnya berkontribusi pada kurikulum ini.

Selain itu, kuis berisiko rendah sebelum kelas menetapkan niat siswa untuk mempelajari suatu 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 mulai kecil dan menjadi semakin kompleks pada akhir siklus 12 minggu.

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

Temukan kami Code of Conduct, Contributing, dan Translation pedoman. Kami menyambut umpan balik konstruktif Anda!

Setiap pelajaran termasuk:

catatan sketsa opsional
video tambahan opsional
kuis pemanasan sebelum pelajaran
pelajaran tertulis
untuk pelajaran berbasis proyek, panduan langkah demi langkah tentang cara membangun proyek
cek pengetahuan
sebuah tantangan
bacaan tambahan
penugasan
kuis setelah pelajaran

Catatan tentang kuis: Semua kuis terkandung di aplikasi ini, untuk 48 total kuis dari tiga pertanyaan masing-masing. Mereka ditautkan dari dalam pelajaran tetapi aplikasi kuis dapat dijalankan secara lokal; ikuti petunjuk di quiz-app folder. Mereka secara bertahap dilokalisasi.

Pelajaran

	Nama Project	Konsep yang Diajarkan	Tujuan pembelajaran	Linked Lesson	Author
01	Mulai	Perkenalan pada Programming dan Tools dari Perdagangan	Pelajari dasar-dasar di balik sebagian besar bahasa pemrograman dan tentang perangkat lunak yang membantu pengembang profesional melakukan pekerjaan mereka	Pengantar Programming Languages dan Tools dari Perdagangan	Jasmine
02	Mulai	Dasar-dasar GitHub, termasuk bekerja dengan tim	Cara menggunakan GitHub dalam proyek Anda, cara berkolaborasi dengan orang lain dalam basis kode	Intro di GitHub	Floor
03	Mulai	Aksesibilitas	Pelajari dasar-dasar aksesibilitas web	Accessibility Fundamentals	Christopher
04	JS Basics	JavaScript Data Types	Dasar-dasar tipe data JavaScript	Data Types	Jasmine
05	JS Basics	Fungsi dan Metode	Pelajari tentang fungsi dan metode untuk mengelola alur logika aplikasi	Functions and Methods	Jasmine and Christopher
06	JS Basics	Membuat Keputusan dengan JS	Pelajari cara membuat kondisi dalam kode Anda menggunakan metode pengambilan keputusan	Making Decisions	Jasmine
07	JS Basics	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 terarium online, dengan fokus membangun tata letak	Introduction to HTML	Jen
09	Terrarium	CSS dalam Praktek	Bangun CSS untuk menata terarium online, dengan fokus pada dasar-dasar CSS termasuk membuat halaman responsif	Introduction to CSS	Jen
10	Terrarium	Penutupan JavaScript, manipulasi DOM	Bangun JavaScript untuk membuat fungsi terarium sebagai antarmuka seret/lepas, dengan fokus pada penutupan dan manipulasi DOM	JavaScript Closures, DOM manipulation	Jen
11	Typing Game	Buat Game Mengetik	Pelajari cara menggunakan peristiwa keyboard untuk mendorong logika aplikasi JavaScript Anda	Event-Driven Programming	Christopher
12	Green Browser Extension	Bekerja dengan Browser	Pelajari cara kerja browser, riwayatnya, dan cara membuat perancah elemen pertama dari 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 pengoptimalan yang harus dilakukan	Background Tasks and Performance	Jen
15	Space Game	Pengembangan Game Lebih Lanjut dengan JavaScript	Pelajari tentang Warisan menggunakan Kelas dan Komposisi serta pola Pub/Sub, sebagai persiapan untuk membuat game	Introduction to Advanced Game Development	Chris
16	Space Game	Menggambar ke kanvas	Pelajari tentang Canvas API, yang digunakan untuk menggambar elemen ke layar	Drawing to Canvas	Chris
17	Space Game	Memindahkan elemen di sekitar layar	Temukan bagaimana elemen bisa mendapatkan gerakan menggunakan koordinat kartesius dan Canvas API	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	Menjaga skor	Lakukan perhitungan matematika berdasarkan status dan kinerja game	Keeping Score	Chris
20	Space Game	Mengakhiri dan memulai kembali permainan	Pelajari tentang mengakhiri dan memulai kembali game, termasuk membersihkan aset dan menyetel ulang nilai variabel	The Ending Condition	Chris
21	Banking App	Template dan Rute HTML di Aplikasi Web	Pelajari cara membuat perancah arsitektur situs web multihalaman menggunakan perutean dan templat HTML	HTML Templates and Routes	Yohan
22	Banking App	Buat Formulir Login dan Registrasi	pelajari tentang membuat formulir dan menangani rutinitas validasi	Forms	Yohan
23	Banking App	Metode Mengambil dan Menggunakan Data	Bagaimana data mengalir masuk dan keluar dari aplikasi Anda, cara mengambilnya, menyimpannya, dan membuangnya	Data	Yohan
24	Banking App	Konsep Manajemen Negara	Pelajari cara aplikasi Anda mempertahankan status dan cara mengelolanya secara terprogram	State Management	Yohan

Akses Luring

Anda dapat menjalankan dokumentasi ini secara luring dengan menggunakan Docsify. Fork repo ini, install Docsify di mesin lokal Anda, dan kemudian di folder root repo ini, ketik docsify serve. Situs web akan disajikan pada port 3000 di localhost Anda: localhost:3000.

PDF

PDF dari semua pelajaran dapat ditemukan di sini

Kurikulum lainnya

Tim kami menghasilkan kurikulum lain! Periksa:

18 KiB Raw Blame History