Ingin berlatih dengan JavaScript atau membangun portofolio Anda untuk mengesankan manajer perekrutan?
Menurut JavaScript telah menghabiskan sembilan tahun berturut-turut sebagai bahasa pemrograman yang paling umum digunakan, dengan 69% pengembang menggunakannya secara ekstensif. Jika Anda tertarik menjadi pengembang web (front end, back end, atau full stack), JavaScript adalah salah satu bahasa pemrograman terbaik yang dapat Anda pelajari. Salah satu cara untuk melakukannya adalah dengan melakukan beberapa proyek JavaScript untuk pemula
Vanilla JavaScript, juga dikenal sebagai JavaScript "polos" — artinya tanpa kerangka kerja apa pun — adalah salah satu dasar pengkodean dan pengembangan web. Sebagian besar halaman web yang Anda lihat dibuat menggunakan kombinasi HTML, CSS, JavaScript vanilla, dan panggilan API
Mengenal dasar-dasar JavaScript berarti menggunakan keterampilan JavaScript tersebut untuk membangun proyek latihan JavaScript. Untungnya, kami mengetahui beberapa proyek pemula JavaScript menyenangkan yang dapat Anda lakukan untuk mengasah keterampilan Anda dari ribuan siswa yang telah kami latih dalam program pelatihan kerja pengembangan ujung depan kami, Masuk ke Teknologi
Apa yang kami lihat dengan siswa sukses kami yang telah mendapatkan pekerjaan di perusahaan seperti GoDaddy, Toast, Asics Digital, 1Password, Figure, dan Apple adalah bahwa mereka semua memiliki proyek praktik JavaScript, portofolio yang memamerkan keterampilan pengembang ujung depan mereka, dan sangat berpengalaman. . Melakukan proyek JavaScript untuk pemula adalah cara yang bagus untuk berlatih dan membangun portofolio Anda
Jika Anda ingin melatih keterampilan pengembang ujung depan Anda, kami telah menyusun daftar 20+ proyek pemula JavaScript yang dapat Anda mulai kerjakan sekarang juga. Saat Anda menemukan proyek latihan JavaScript yang menarik minat Anda, ikuti tautan proyek. Masing-masing proyek JavaScript open source untuk pemula (dan lebih tinggi) ini memiliki kode sumber yang tercantum di beranda mereka untuk Anda gunakan sebagai panduan
Lisa Savoie, salah satu instruktur JavaScript Skillcrush, merekomendasikan membaca kode sumber dengan lantang untuk memahaminya dengan lebih baik, mencari fitur untuk dimasukkan ke dalam proyek lain, atau bahkan mengetik ulang untuk bekerja pada memori otot Anda tentang cara menulis fungsi, variabel, dan loop
Dia berkata, “Anda dapat menggunakan metode Google yang tidak Anda kenal untuk mempelajarinya lebih lanjut atau bahkan memecahkan kode dan memperbaikinya — Sangat menyenangkan untuk memecahkan banyak hal😀. ”
Daftar isi
Apakah Teknologi Tepat Untuk Anda?
Anda Akan Belajar. Jika karir di bidang teknologi tepat untuk Anda Karier teknologi apa yang sesuai dengan kekuatan Anda Keterampilan apa yang Anda butuhkan untuk mencapai tujuan Anda
Kesalahan Umum Proyek Pemula JavaScript
- Salah ketik
- Baca apa yang dikatakan konsol kepada Anda, terutama jika Anda terus menerima pesan kesalahan
- Apakah Anda bekerja dengan jenis variabel yang tepat?
- Apakah logika Anda masuk akal?
- Apakah Anda memperhitungkan kasus tepi seperti input kosong atau bilangan bulat negatif?
- Apakah Anda meneruskan jenis/jenis argumen yang tepat ke suatu fungsi?
Proyek JavaScript untuk Pemula
1. Elemen Arahkan Mouse
Mengapa proyek ini?
- Anda akan melihat bagaimana fungsi JavaScript bekerja dan melatih logika JavaScript Anda
- Ini adalah proyek JavaScript pemula yang menyenangkan untuk menghidupkan pengalaman pengguna Anda
- Pelajari lebih lanjut tentang menggunakan acak, fungsi, dan event listener
Kode Sumber Elemen Mouseover
Konsep kunci tertutup
- Fungsi dan pernyataan if-else
- Acak
- Pendengar acara
Apa yang harus dilakukan
- Salin kode sumber dari CodePen
- Terapkan kode JavaScript sehingga saat Anda mengarahkan mouse ke bola berwarna, itu menjadi lebih besar
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik elemen mouseover, tantangan bonus Anda adalah proyek kursor khusus ini
2. Jam JavaScript
Mengapa proyek ini?
- Anda mendapatkan langsung jenis pekerjaan aktual yang akan Anda lakukan sebagai pengembang JavaScript
- Anda akan menerapkan konsep utama JavaScript dan memiliki proyek menarik untuk portofolio Anda
- Praktikkan konsep seperti variabel, logika kondisional, dan API tanggal
Kode Sumber Jam JavaScript
Konsep kunci tertutup
- Variabel
- Logika kondisional
- Aliran program
- Fungsi
- Pendengar acara
- Tanggal API
- elemen DOM
Apa yang harus dilakukan
- Salin kode sumber dari CodePen
- Terapkan kode JavaScript sehingga setiap kali Anda mengklik tombol “Party Time. ” dalam rentang waktu yang Anda tentukan, Anda mendapatkan LOLcat yang berbeda. Anda dapat mengatur waktu yang berbeda untuk melihat gambar yang berbeda — total ada empat gambar
Tantangan bonus
Sekarang setelah Anda menguasai jam JavaScript Lolcat, tantang diri Anda dengan membuat penghitung waktu mundur Anda sendiri
3. Bola 8 Ajaib
Mengapa proyek ini?
- Ini memberi Anda dasar yang kuat untuk cara menggunakan Matematika. acak untuk menghasilkan hasil acak untuk proyek JavaScript
- Anda dapat menggunakan proyek ini untuk mengesankan teman-teman Anda dan membuat keputusan kecil dalam hidup
- Pelajari selengkapnya tentang cara menggunakan fungsi acak, fungsi bersarang, dan pemroses peristiwa
Kode Sumber Sihir 8 Bola
Konsep kunci tertutup
- Matematika. acak
- Fungsi bersarang
- Pendengar acara
Apa yang harus dilakukan
- Salin kode sumber dari GitHub untuk HTML dan CSS
- Terapkan kode JavaScript sehingga Anda dapat mengambil bola 8, mengajukan pertanyaan, mengocoknya, dan membuat bola 8 merespons dengan jawaban yang agak membingungkan dan dapat diterapkan
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik Magic 8 Ball, tantangan bonus Anda adalah pembuat lelucon ayah ini
4. Daftar Pekerjaan
Mengapa proyek ini?
- Anda akan meningkatkan keterampilan Anda dalam membuat kode daftar interaktif, yang memungkinkan pengguna menambahkan, menghapus, dan mengelompokkan item
- Anda dapat menggunakan proyek JavaScript pemula ini dalam kehidupan sehari-hari dan menambahkannya ke portofolio Anda
- Pelajari lebih lanjut cara menggunakan larik, fungsi bersarang, dan API penyimpanan lokal
Kode Sumber Daftar Tugas
Konsep kunci tertutup
- API penyimpanan lokal
- Array
- Fungsi bersarang
- Pendengar acara
- manipulasi DOM
Apa yang harus dilakukan
- Salin kode sumber dari CodePen
- Terapkan kode JavaScript sehingga Anda dapat menambahkan item baru dan menggunakan tombol untuk mengalihkan item yang sudah selesai, mengedit item, atau menghapus item
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik daftar Tugas, tantangan bonus Anda adalah daftar belanjaan JavaScript ini
5. Daftar Putar Campuran Epik
Mengapa proyek ini?
- Ini membantu Anda melatih keterampilan JavaScript inti, seperti loop forEach dan pendengar acara, dan bekerja dengan fungsi dan daftar
- Anda dapat menggunakan proyek ini untuk menunjukkan kepada orang-orang yang melihat portofolio Anda tentang selera musik Anda yang luar biasa
- Pelajari lebih lanjut cara classList, innerHTML, forEach, dan template literal
Kode Sumber Daftar Putar Epic Mix
Konsep kunci tertutup
- Loop array (untukEach)
- dokumen. createElement
- Tambahkan ke array
- Templat literal
Apa yang harus dilakukan
- Salin kode sumber dari CodeSandbox
- Terapkan kode JavaScript sehingga Anda dapat membuat daftar lagu favorit yang dibuat secara otomatis dan indeksnya
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik playlist campuran epik, tantangan bonus Anda adalah daftar film favorit ini
6. Penyelamatan Hewan Peliharaan
Mengapa proyek ini?
- Ini memberi Anda dasar yang kuat untuk memahami pola dan parameter fungsi pabrik
- Anda dapat menggunakan proyek ini untuk berkontribusi pada penyelamatan hewan peliharaan atau menampilkan inventaris produk di situs e-niaga
- Pelajari selengkapnya tentang cara menggunakan fungsi pabrik, parameter, metode, dan objek
Kode Sumber Penyelamatan Hewan Peliharaan
Konsep kunci tertutup
- Fungsi pabrik
- Metode dan properti objek
Apa yang harus dilakukan
- Salin kode sumber dari CodeSandbox
- Terapkan kode JavaScript sehingga Anda dapat menerima nama hewan, spesies, dan tingkat energi sebagai parameter dan menunjukkan status setiap hewan (apakah sedang tidur atau terjaga)
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik Pet Rescue, tantangan bonus Anda adalah sistem inventaris ini
7. Perangkat Drum
Mengapa proyek ini?
- Anda dapat melihat interaksi antara melihat elemen di halaman dan mendengarkan suara serta mempelajari cara menambah dan menghapus elemen
- Anda dapat menggunakan proyek ini untuk melatih keterampilan drum Anda dengan keterampilan JavaScript Anda
- Pelajari lebih lanjut tentang cara menggunakan tag audio dan dokumen. querySelector
Kode Sumber Perangkat Drum
Konsep kunci tertutup
- Array
- Pendengar Acara
- Tag audio
- dokumen. querySelector
- Kelas
Apa yang harus dilakukan
- Klon repo GitHub
- Terapkan kode JavaScript sehingga Anda dapat memainkan drum dengan menekan tombol tertentu di browser
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik perangkat drum, tantangan bonus Anda adalah pemain piano JavaScript ini
8. Deteksi Ucapan
Mengapa proyek ini?
- Ini memberi Anda dasar untuk memahami cara kerja deteksi ucapan, yang bagus (dan sangat keren. ) untuk mengetahui
- Anda akan memiliki metode pencatatan yang bagus langsung di browser Anda
- Pelajari lebih lanjut tentang pengenalan ucapan, konten teks, dan pendengar acara
Kode Sumber Deteksi Suara
Konsep kunci tertutup
- Jendela. Pengenalan suara
- Array
- teksKonten
- Pendengar acara
Apa yang harus dilakukan
- Salin kode sumber dari GitHub
- Terapkan kode JavaScript sehingga saat Anda berbicara, apa pun yang Anda katakan akan ditranskripsikan pada kertas bergaris di layar Anda
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik deteksi ucapan, tantangan bonus Anda adalah teks ke ucapan ini dalam berbagai bahasa
9. Navigasi Lengket
Mengapa proyek ini?
- Ini mengajarkan Anda bagaimana menjaga elemen Anda dalam posisi tetap pada halaman, yang merupakan keterampilan yang mungkin Anda perlukan dalam peran pengembang ujung depan Anda
- Anda dapat menggunakan ini untuk meningkatkan desain situs web atau portofolio Anda
- Pelajari selengkapnya tentang cara menggunakan pemilih kueri, pemroses peristiwa, dan penyeimbangan
Kode Sumber Navigasi Lengket
Konsep kunci tertutup
- querySelector
- offsetTop
- Pendengar acara
Apa yang harus dilakukan
- Salin kode sumber dari GitHub
- Terapkan kode JavaScript sehingga saat Anda menggulir ke atas atau ke bawah halaman, bilah navigasi Anda tetap pada posisi tetap dan terlihat
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik navigasi lengket, tantangan bonus Anda adalah membuat navigasi geser
10. Geolokasi
Mengapa proyek ini?
- Anda dapat mempelajari lebih lanjut tentang cara mengembangkan untuk seluler, cara kerja geolokasi, dan cara menguji kode Anda menggunakan simulator atau perangkat lain
- Anda dapat menggunakan proyek ini dalam kehidupan sehari-hari Anda (jika Anda mudah tersesat)
- Pelajari lebih lanjut cara menggunakan pemilih kueri, posisi jam tangan, dan koordinat
Kode Sumber Geolokasi
Konsep kunci tertutup
- querySelector
- watchPosition
- teksKonten
Apa yang harus dilakukan
- Salin kode sumber dari GitHub
- Instal paket dengan npm dan jalankan server lokal Anda
- Terapkan kode JavaScript sehingga Anda dapat melihat lokasi Anda secara real time. Anda memerlukan iOS atau simulator iOS untuk menguji apakah kode Anda berfungsi atau tidak
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik geolokasi, tantangan bonus Anda adalah alat prakiraan cuaca ini
11. Aplikasi Film
Mengapa proyek ini?
- Ini memberi Anda dasar yang kuat tentang cara kerja JavaScript dengan HTML, CSS, dan alat lainnya
- Anda dapat menggunakan proyek ini untuk membuat aplikasi film kustom Anda sendiri
- Pelajari lebih lanjut tentang cara menggunakan JavaScript dengan jQuery, Bootstrap, dan panggilan API
Kode Sumber Aplikasi Film
Konsep kunci tertutup
- panggilan API
- Fungsi
- Pada acara klik
Apa yang harus dilakukan
- Salin kode sumber dari GitHub
- Anda harus mendapatkan sendiri kunci API
- Terapkan kode JavaScript sehingga Anda dapat membuat aplikasi film sendiri yang memungkinkan Anda melihat film paling populer, mengurutkannya berdasarkan genre, dan mencari film lain
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik aplikasi film, tantangan bonus Anda adalah membuat laman landas e-niaga
12. Tanda nama
Mengapa proyek ini?
- Sebagai proyek JavaScript pemula, ini memungkinkan Anda berlatih menggunakan React untuk membuat alat yang praktis dan berguna
- Anda dapat menggunakan proyek ini untuk mengasah keterampilan React dan konsep kunci Anda
- Pelajari lebih lanjut cara menangani input pengguna, bekerja dengan komponen stateful, dan merender model data array
Kode Sumber Generator Tag Nama
Konsep kunci tertutup
- Menangani masukan pengguna
- Komponen stateful
- Render model data array
Apa yang harus dilakukan
- Salin kode sumber dari CodeSandbox
- Terapkan kode JavaScript sehingga Anda dapat membuat kotak teks dan tombol agar pengguna dapat memasukkan teks dan memintanya merespons masukan tersebut dengan membuat tag nama baru
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik generator tag nama, tantangan bonus Anda adalah generator Pokemon React ini
Apakah Teknologi Tepat Untuk Anda?
Anda Akan Belajar. Jika karir di bidang teknologi tepat untuk Anda Karier teknologi apa yang sesuai dengan kekuatan Anda Keterampilan apa yang Anda butuhkan untuk mencapai tujuan Anda
Proyek JavaScript Menengah
13. Nada. js
Mengapa proyek ini?
- Anda akan mempelajari cara membuat musik browser web interaktif dengan kemampuan penjadwalan lanjutan, synth dan efek, serta abstraksi musik intuitif yang dibangun di atas API Audio Web
- Anda dapat menggunakan proyek ini untuk menjadi DJ dan produser musik pribadi Anda, gratis
- Pelajari lebih lanjut tentang cara menggunakan event listener, triggerAttack, triggerRelease, dan berbagai jenis synth
Nada. Kode Sumber js
Konsep kunci tertutup
- triggerAttack dan triggerRelease
- Pendengar acara
- querySelector
- nada. Lingkaran
Apa yang harus dilakukan
- Salin kode sumber dari Nada. js GitHub. halaman io
- Terapkan kode JavaScript sehingga Anda dapat membuat musik interaktif di browser Anda sendiri
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik daftar Tugas, tantangan bonus Anda adalah daftar belanjaan JavaScript ini
14. Peta Pemilu
Mengapa proyek ini?
- Ini memberi Anda dasar yang kuat tentang perbedaan antara JavaScript, HTML, dan CSS, terutama apa yang dilakukan JavaScript dan bagaimana melakukannya
- Anda dapat menggunakan proyek ini dalam kehidupan sehari-hari dan menambahkannya ke portofolio Anda
- Pelajari lebih lanjut tentang cara menggunakan array dan fungsi bersarang
Kode Sumber Peta Pemilu
Konsep kunci tertutup
- Latihan if-else dan fungsi
- Hubungan orangtua-anak
- getElementById
Apa yang harus dilakukan
- Salin kode sumber dari JSBin
- Terapkan kode JavaScript sehingga Anda dapat menambahkan dua kandidat yang mencalonkan diri sebagai presiden dan menampilkan jumlah suara yang mereka terima dari setiap negara bagian, baik dalam tabel di kanan bawah maupun saat Anda mengarahkan mouse ke suatu negara bagian
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik peta pemilihan, tantangan bonus Anda adalah peta interaktif ini
15. Otentikasi Masuk
Mengapa proyek ini?
- Ini memperkenalkan Anda ke Angular JS dan konsep JavaScript yang lebih canggih
- Anda dapat melihat cara kerja autentikasi masuk di balik layar
- Pelajari lebih lanjut cara menggunakan status fungsi, pengontrol aplikasi, dan dependensi
Masuk Kode Sumber Otentikator
Konsep kunci tertutup
- AngularJS
- Manajemen negara
- Pengontrol aplikasi
- Ketergantungan
Apa yang harus dilakukan
- Salin kode sumber dari CodePen
- Terapkan kode JavaScript sehingga Anda dapat memasukkan alamat email dan kata sandi, dan biarkan sistem memberi tahu Anda jika alamat email tidak valid saat Anda menekan tombol "Kirim"
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik Login Authenticator, tantangan bonus Anda adalah pembuat kata sandi ini
16. Tebak kata
Mengapa proyek ini?
- Ini memberi Anda dasar yang kuat untuk metode, membuat variabel global, dan bekerja dengan event listener
- Anda dapat menggunakan proyek ini sebagai permainan pesta atau tantangan dengan teman dan rekan kerja Anda
- Pelajari selengkapnya tentang cara menggunakan metode, fungsi, dan ekspresi reguler
Tebak Kode Sumber Kata
Konsep kunci tertutup
- Metode seperti match(), split(), trim(), dan join()
- Ekspresi reguler
- querySelector
- Pendengar acara
Apa yang harus dilakukan
- Salin kode sumber dari GitHub
- Terapkan kode JavaScript sehingga pemain memulai dengan memasukkan huruf. Jika mereka menebak dengan benar, huruf itu muncul di kata. Jika mereka salah menebak, mereka belajar berapa banyak tebakan yang tersisa. Pemain juga dapat melihat huruf mana yang sudah mereka tebak. Gim ini memberi tahu pemain jika mereka sudah menebak huruf atau memasukkan karakter non-abjad
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik game Tebak Kata, tantangan bonus Anda adalah game Wordled ini
Peringatan. tingkat kesulitan untuk ini sudah lanjut, jadi jika Anda mengalami masalah, itu bukan Anda
17. Terminalizer
Mengapa proyek ini?
- Ini mengajarkan Anda cara merekam layar terminal Anda dan membagikan pekerjaan Anda dengan orang lain
- Anda dapat menggunakan proyek ini untuk men-debug dan mengerjakan proyek pengkodean dengan teman
- Pelajari lebih lanjut tentang cara menggunakan file rekaman, penundaan bingkai, dan menyetel waktu diam
Kode Sumber Terminalizer
Konsep kunci tertutup
- Merekam file
- Menggunakan frameDelay
- Mengatur waktu menganggur
Apa yang harus dilakukan
- Salin kode sumber dari GitHub
- Terapkan kode JavaScript sehingga Anda dapat merekam terminal dan membuat gambar GIF animasi atau membagikan tautan pemutar web
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik Terminalizer, tantangan bonus Anda adalah mengetahui cara memutar/menjeda GIF
18. Aplikasi Obrolan
Mengapa proyek ini?
- Ini memberi Anda dasar yang kuat tentang bagaimana JavaScript dan pustaka bagian depan dan belakangnya dapat digunakan untuk membuat aplikasi
- Anda dapat menambahkan proyek ini ke portofolio Anda untuk menunjukkan pengetahuan Anda tentang konsep pemrograman sebagai full stack developer
- Pelajari lebih lanjut tentang cara menggunakan ReactJS, NodeJS, dan soket bersama dengan JavaScript
Kode Sumber Aplikasi Obrolan dan tautan tutorial YouTube
Konsep kunci tertutup
- Reaksi
- Node
- Soket
Apa yang harus dilakukan
- Anda tidak akan dapat mengkloning dan menjalankan proyek langsung dari GitHub karena tidak ada paket. json, tetapi Anda dapat membuatnya menggunakan tutorial YouTube
- Terapkan kode JavaScript sehingga Anda dapat membuat aplikasi obrolan waktu nyata yang memungkinkan Anda mengirim dan menerima pesan menggunakan soket web
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik aplikasi obrolan, tantangan bonus Anda adalah editor teks Bereaksi ini
19. Permainan Tic Tac Toe
Mengapa proyek ini?
- Proyek ini akan menguji semantik HTML dan keterampilan logika JavaScript Anda
- Anda dapat menggunakan ini sebagai proyek latihan dan melakukan sesuatu saat kode Anda dikompilasi
- Pelajari selengkapnya tentang cara menggunakan array, metode kisi, dan event listener
Kode Sumber Tic-Tac-Toe
Konsep kunci tertutup
- Array
- Pendengar acara
Apa yang harus dilakukan
- Salin kode sumber dari CodePen
- Terapkan kode JavaScript sehingga pemain dapat mengatur tingkat kesulitan sebagai mudah atau sulit, memilih apakah akan bermain sebagai X atau O, bermain game dengan komputer, mengingat siapa yang menang atau seri, dan bermain lagi
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik permainan Tic-Tac-Toe, tantangan bonus Anda adalah permainan algojo ini
20. Aplikasi Pemesanan Hotel
Mengapa proyek ini?
- Anda akan mempraktikkan konsep kunci dalam JavaScript ES6 dan React JSX
- Anda dapat menggunakan proyek ini untuk berlatih membangun situs dengan lebih banyak fungsi dan menggunakan sebagian kreativitas Anda dengan membuatnya terlihat sangat keren
- Pelajari lebih lanjut tentang cara mengelola aliran data dan memanipulasi DOM
Kode Sumber Aplikasi Pemesanan Hotel
Konsep kunci tertutup
- Latihan ES6 dan React JSX
- Mengelola aliran data
- manipulasi DOM
Apa yang harus dilakukan
- Salin kode sumber dari CodePen
- Terapkan kode JavaScript sehingga Anda dapat membuat contoh pemesanan di situs hotel, lengkap dengan hasil pencarian yang difilter, tampilan inventaris kamar, dan peringkat hotel
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik Aplikasi Pemesanan Hotel, tantangan bonus Anda adalah aplikasi pemesanan tiket ini
Proyek JavaScript Tingkat Lanjut
21. Permainan Labirin
Mengapa proyek ini?
- Ini memberi Anda ide yang kuat tentang bagaimana keterampilan dan fungsi inti JavaScript dapat digunakan untuk membuat game interaktif
- Anda dapat memasukkan proyek ini ke dalam portofolio Anda dan menantang teman
- Pelajari lebih lanjut tentang cara menggunakan konsep matematika JavaScript, membuat elemen, dan menggunakan loop
Kode Sumber Permainan Labirin
Konsep kunci tertutup
- Acak dan Lantai
- Pembuatan elemen
- Loop
Apa yang harus dilakukan
- Salin kode sumber dari CodePen
- Terapkan kode JavaScript sehingga Anda bisa mendapatkan acar dari satu ujung labirin ke ujung lainnya menggunakan fungsi panah (atau AWSD) pada keyboard Anda, membuatnya menampilkan jumlah langkah yang diperlukan untuk menyelesaikan labirin, dan dapat mengatur
Tantangan Bonus
Untuk menguji pemahaman Anda tentang konsep di balik permainan labirin, tantangan bonus Anda adalah permainan Tetris ini
Justina Hwang
Justina Hwang adalah Manajer Pemasaran Konten di Skillcrush, dan telah meliput pendidikan teknologi selama lebih dari tiga tahun. Dia memegang gelar PhD dari Brown University. Justina menghabiskan waktu luangnya dengan kucingnya yang agak membutuhkan (tapi sangat menggemaskan).