28 KiB

Raw Permalink Blame History

Ikuti langkah-langkah berikut untuk mula menggunakan sumber ini:

Fork Repositori: Klik
Clone Repositori: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
Sertai Azure AI Foundry Discord dan berhubung dengan pakar serta pembangun lain

Pembangunan Web untuk Pemula - Kurikulum

Pelajari asas pembangunan web dengan kursus komprehensif 12 minggu kami oleh Microsoft Cloud Advocates. Setiap daripada 24 pelajaran meneroka JavaScript, CSS, dan HTML melalui projek praktikal seperti terrarium, sambungan pelayar, dan permainan angkasa. Sertai kuiz, perbincangan, dan tugasan praktikal. Tingkatkan kemahiran anda dan optimalkan pemahaman anda dengan pedagogi berasaskan projek kami yang berkesan. Mulakan perjalanan pengaturcaraan anda hari ini!

🌐 Sokongan Pelbagai Bahasa

Disokong melalui GitHub Action (Automatik & Sentiasa Dikemas Kini)

Jika anda ingin menambah bahasa terjemahan lain, senarai bahasa yang disokong boleh didapati di sini

🧑‍🎓 Adakah anda seorang pelajar?

Lawati Halaman Pelajar di mana anda akan menemui sumber untuk pemula, pakej pelajar, dan juga cara untuk mendapatkan baucar sijil percuma. Halaman ini patut ditandai dan diperiksa dari semasa ke semasa kerana kandungan akan dikemas kini setiap bulan.

📣 Pengumuman - Projek Baru untuk Dibina Menggunakan Generative AI

Projek Pembantu AI baru sahaja ditambah, lihat projek

📣 Pengumuman - Kurikulum Baru tentang Generative AI untuk JavaScript baru sahaja dilancarkan

Jangan lepaskan kurikulum Generative AI kami yang baru!

Lawati https://aka.ms/genai-js-course untuk bermula!

Pelajaran yang merangkumi segalanya dari asas hingga RAG.
Berinteraksi dengan watak sejarah menggunakan GenAI dan aplikasi pendamping kami.
Naratif yang menyeronokkan dan menarik, anda akan mengembara masa!

Setiap pelajaran termasuk tugasan untuk diselesaikan, ujian pengetahuan, dan cabaran untuk membimbing anda mempelajari topik seperti:

Prompting dan kejuruteraan prompt
Penjanaan aplikasi teks dan imej
Aplikasi carian

Lawati https://aka.ms/genai-js-course untuk bermula!

🌱 Bermula

Guru, kami telah menyediakan beberapa cadangan tentang cara menggunakan kurikulum ini. Kami menghargai maklum balas anda di forum perbincangan kami!

Pelajar, untuk setiap pelajaran, mulakan dengan kuiz pra-kuliah dan teruskan dengan membaca bahan kuliah, melengkapkan pelbagai aktiviti, dan periksa pemahaman anda dengan kuiz pasca-kuliah.

Untuk meningkatkan pengalaman pembelajaran anda, berhubung dengan rakan sebaya untuk bekerjasama dalam projek! Perbincangan digalakkan di forum perbincangan kami di mana pasukan moderator kami akan tersedia untuk menjawab soalan anda.

Untuk melanjutkan pendidikan anda, kami sangat mengesyorkan meneroka Microsoft Learn untuk bahan kajian tambahan.

📋 Menyediakan Persekitaran Anda

Kurikulum ini mempunyai persekitaran pembangunan yang sedia untuk digunakan! Apabila anda bermula, anda boleh memilih untuk menjalankan kurikulum dalam Codespace (persekitaran berasaskan pelayar, tiada pemasangan diperlukan), atau secara tempatan di komputer anda menggunakan editor teks seperti Visual Studio Code.

Cipta repositori anda

Untuk memudahkan anda menyimpan kerja anda, disarankan agar anda mencipta salinan repositori ini. Anda boleh melakukannya dengan mengklik butang Use this template di bahagian atas halaman. Ini akan mencipta repositori baru dalam akaun GitHub anda dengan salinan kurikulum.

Ikuti langkah-langkah berikut:

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

Menjalankan kurikulum dalam Codespace

Dalam salinan repositori anda yang telah anda cipta, klik butang Code dan pilih Open with Codespaces. Ini akan mencipta Codespace baru untuk anda bekerja.

!Codespace./images/createcodespace.png)

Menjalankan kurikulum secara tempatan di komputer anda

Untuk menjalankan kurikulum ini secara tempatan di komputer anda, anda memerlukan editor teks, pelayar, dan alat baris perintah. Pelajaran pertama kami, Pengenalan kepada Bahasa Pengaturcaraan dan Alat Perdagangan, akan membimbing anda melalui pelbagai pilihan untuk setiap alat ini supaya anda boleh memilih yang paling sesuai untuk anda.

Cadangan kami adalah menggunakan Visual Studio Code sebagai editor anda, yang juga mempunyai Terminal terbina dalam. Anda boleh memuat turun Visual Studio Code di sini.

Clone repositori anda ke komputer anda. Anda boleh melakukannya dengan mengklik butang Code dan menyalin URL:

!CodeSpace

Kemudian, buka Terminal dalam Visual Studio Code dan jalankan arahan berikut, menggantikan <your-repository-url> dengan URL yang baru anda salin:
```
git clone <your-repository-url>
```
Buka folder dalam Visual Studio Code. Anda boleh melakukannya dengan mengklik File

Buka Folder dan pilih folder yang baru sahaja anda klon. Sambungan Visual Studio Code yang disyorkan:

Live Server - untuk melihat pratonton halaman HTML dalam Visual Studio Code

Copilot - untuk membantu anda menulis kod dengan lebih pantas

📂 Setiap pelajaran merangkumi:

sketchnote pilihan
video tambahan pilihan
kuiz pemanasan sebelum pelajaran
pelajaran bertulis
untuk pelajaran berasaskan projek, panduan langkah demi langkah tentang cara membina projek
semakan pengetahuan
cabaran
bacaan tambahan
tugasan
kuiz selepas pelajaran

Nota tentang kuiz: Semua kuiz terdapat dalam folder Quiz-app, sejumlah 48 kuiz dengan tiga soalan setiap satu. Kuiz ini boleh diakses di sini dan aplikasi kuiz boleh dijalankan secara tempatan atau diterapkan ke Azure; ikuti arahan dalam folder quiz-app.

🗃️ Pelajaran

	Nama Projek	Konsep yang Diajarkan	Objektif Pembelajaran	Pelajaran Berkaitan	Penulis
01	Memulakan Asas	Pengenalan kepada Pengaturcaraan dan Alat yang Digunakan	Belajar asas di sebalik kebanyakan bahasa pengaturcaraan dan tentang perisian yang membantu pembangun profesional melakukan kerja mereka	Pengenalan kepada Bahasa Pengaturcaraan dan Alat yang Digunakan	Jasmine
02	Memulakan Asas	Asas GitHub, termasuk bekerja dalam pasukan	Cara menggunakan GitHub dalam projek anda, cara bekerjasama dengan orang lain dalam pangkalan kod	Pengenalan kepada GitHub	Floor
03	Memulakan Asas	Kebolehaksesan	Belajar asas kebolehaksesan web	Asas Kebolehaksesan	Christopher
04	Asas JS	Jenis Data JavaScript	Asas jenis data JavaScript	Jenis Data	Jasmine
05	Asas JS	Fungsi dan Kaedah	Belajar tentang fungsi dan kaedah untuk mengurus aliran logik aplikasi	Fungsi dan Kaedah	Jasmine dan Christopher
06	Asas JS	Membuat Keputusan dengan JS	Belajar cara mencipta syarat dalam kod anda menggunakan kaedah membuat keputusan	Membuat Keputusan	Jasmine
07	Asas JS	Array dan Gelung	Bekerja dengan data menggunakan array dan gelung dalam JavaScript	Array dan Gelung	Jasmine
08	Terrarium	HTML dalam Amalan	Membina HTML untuk mencipta terrarium dalam talian, dengan fokus pada membina susun atur	Pengenalan kepada HTML	Jen
09	Terrarium	CSS dalam Amalan	Membina CSS untuk menggayakan terrarium dalam talian, dengan fokus pada asas CSS termasuk menjadikan halaman responsif	Pengenalan kepada CSS	Jen
10	Terrarium	Penutupan JavaScript, manipulasi DOM	Membina JavaScript untuk menjadikan terrarium berfungsi sebagai antara muka seret/lepas, dengan fokus pada penutupan dan manipulasi DOM	Penutupan JavaScript, manipulasi DOM	Jen
11	Permainan Menaip	Membina Permainan Menaip	Belajar cara menggunakan acara papan kekunci untuk memacu logik aplikasi JavaScript anda	Pengaturcaraan Berasaskan Acara	Christopher
12	Pelanjutan Pelayar Hijau	Bekerja dengan Pelayar	Belajar cara pelayar berfungsi, sejarahnya, dan cara membina elemen pertama pelanjutan pelayar	Tentang Pelayar	Jen
13	Pelanjutan Pelayar Hijau	Membina borang, memanggil API dan menyimpan pembolehubah dalam storan tempatan	Membina elemen JavaScript pelanjutan pelayar anda untuk memanggil API menggunakan pembolehubah yang disimpan dalam storan tempatan	API, Borang, dan Storan Tempatan	Jen
14	Pelanjutan Pelayar Hijau	Proses latar belakang dalam pelayar, prestasi web	Menggunakan proses latar belakang pelayar untuk mengurus ikon pelanjutan; belajar tentang prestasi web dan beberapa pengoptimuman untuk meningkatkan	Tugas Latar Belakang dan Prestasi	Jen
15	Permainan Angkasa	Pembangunan Permainan yang Lebih Lanjut dengan JavaScript	Belajar tentang Pewarisan menggunakan kedua-dua Kelas dan Komposisi serta corak Pub/Sub, sebagai persediaan untuk membina permainan	Pengenalan kepada Pembangunan Permainan Lanjutan	Chris
16	Permainan Angkasa	Melukis pada kanvas	Belajar tentang API Kanvas, digunakan untuk melukis elemen pada skrin	Melukis pada Kanvas	Chris
17	Permainan Angkasa	Menggerakkan elemen di sekitar skrin	Mengetahui cara elemen boleh bergerak menggunakan koordinat Cartesian dan API Kanvas	Menggerakkan Elemen di Sekitar	Chris
18	Permainan Angkasa	Pengesanan perlanggaran	Membuat elemen bertembung dan bertindak balas antara satu sama lain menggunakan penekanan kekunci dan menyediakan fungsi cooldown untuk memastikan prestasi permainan	Pengesanan Perlanggaran	Chris
19	Permainan Angkasa	Menyimpan skor	Melakukan pengiraan matematik berdasarkan status dan prestasi permainan	Menyimpan Skor	Chris
20	Permainan Angkasa	Menamatkan dan memulakan semula permainan	Belajar tentang menamatkan dan memulakan semula permainan, termasuk membersihkan aset dan menetapkan semula nilai pembolehubah	Keadaan Tamat	Chris
21	Aplikasi Perbankan	Templat HTML dan Laluan dalam Aplikasi Web	Belajar cara mencipta rangka seni bina laman web berbilang halaman menggunakan laluan dan templat HTML	Templat HTML dan Laluan	Yohan
22	Aplikasi Perbankan	Membina Borang Log Masuk dan Pendaftaran	Belajar tentang membina borang dan mengendalikan rutin pengesahan	Borang	Yohan
23	Aplikasi Perbankan	Kaedah Mengambil dan Menggunakan Data	Bagaimana data mengalir masuk dan keluar dari aplikasi anda, cara mengambilnya, menyimpannya, dan melupuskannya	Data	Yohan
24	Aplikasi Perbankan	Konsep Pengurusan Keadaan	Belajar cara aplikasi anda mengekalkan keadaan dan cara menguruskannya secara programatik	Pengurusan Keadaan	Yohan
25	Kod Pelayar/VScode	Bekerja dengan VScode	Belajar cara menggunakan editor kod	Gunakan Editor Kod VScode	Chris
26	Pembantu AI	Bekerja dengan AI	Belajar cara membina pembantu AI anda sendiri	Projek Pembantu AI	Chris

🏫 Pedagogi

Kurikulum kami direka dengan dua prinsip pedagogi utama:

pembelajaran berasaskan projek
kuiz yang kerap

Program ini mengajar asas JavaScript, HTML, dan CSS, serta alat dan teknik terkini yang digunakan oleh pembangun web masa kini. Pelajar akan berpeluang untuk membangunkan pengalaman praktikal dengan membina permainan menaip, terrarium maya, pelanjutan pelayar mesra alam, permainan gaya penceroboh angkasa, dan aplikasi perbankan untuk perniagaan. Menjelang akhir siri ini, pelajar akan memperoleh pemahaman yang kukuh tentang pembangunan web.

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

Dengan memastikan kandungan selaras dengan projek, proses pembelajaran menjadi lebih menarik untuk pelajar dan pengekalan konsep akan dipertingkatkan. Kami juga menulis beberapa pelajaran permulaan dalam asas JavaScript untuk memperkenalkan konsep, digabungkan dengan video daripada koleksi "Beginners Series to: JavaScript", beberapa penulisnya menyumbang kepada kurikulum ini.

Selain itu, kuiz berisiko rendah sebelum kelas menetapkan niat pelajar untuk mempelajari topik, manakala kuiz kedua selepas kelas memastikan pengekalan yang lebih baik. Kurikulum ini direka bentuk untuk fleksibel dan menyeronokkan dan boleh diambil secara keseluruhan atau sebahagian. Projek bermula kecil dan menjadi semakin kompleks menjelang akhir kitaran 12 minggu.

Walaupun kami sengaja mengelakkan memperkenalkan rangka kerja JavaScript untuk menumpukan pada kemahiran asas yang diperlukan sebagai pembangun web sebelum menggunakan rangka kerja, langkah seterusnya yang baik selepas melengkapkan kurikulum ini ialah belajar tentang Node.js melalui koleksi video lain: "Beginner Series to: Node.js".

Lawati Kod Etika dan panduan Menyumbang kami. Kami mengalu-alukan maklum balas membina anda!

🧭 Akses Luar Talian

Anda boleh menjalankan dokumentasi ini secara luar talian dengan menggunakan Docsify. Fork repositori ini, pasang Docsify pada mesin tempatan anda, dan kemudian dalam folder root repositori ini, taip docsify serve. Laman web akan disediakan pada port 3000 di localhost anda: localhost:3000.

📘 PDF

PDF semua pelajaran boleh didapati di sini.

🎒 Kursus Lain

Pasukan kami menghasilkan kursus lain! Lihat:

Lesen

Repositori ini dilesenkan di bawah lesen MIT. Lihat fail LICENSE untuk maklumat lanjut.

Penafian:
Dokumen ini telah diterjemahkan menggunakan perkhidmatan terjemahan AI Co-op Translator. Walaupun kami berusaha untuk memastikan ketepatan, sila ambil maklum bahawa terjemahan automatik mungkin mengandungi kesilapan atau ketidaktepatan. Dokumen asal dalam bahasa asalnya harus dianggap sebagai sumber yang berwibawa. Untuk maklumat penting, terjemahan manusia profesional adalah disyorkan. Kami tidak bertanggungjawab atas sebarang salah faham atau salah tafsir yang timbul daripada penggunaan terjemahan ini.

28 KiB Raw Permalink Blame History