Part of Bellshade Project, managed by WPU Discord Community
WPU Community is the fastest growing software developer forum initiated by Mr. Sandhika Galih
Repositori ini berisi kumpulan code JavaScript yang dapat digunakan sebagai pembelajaran bagi siapa saja. Mulai dari materi Basic, DOM, ES6, hingga Web Api yang dapat kalian gunakan sebagai sumber belajar. Tidak hanya itu, repositori ini juga memiliki berbagai macam code mengenai struktur data dan algoritma yang diimplementasikan dengan menggunakan JavaScript.
JavaScript adalah bahasa pemrograman yang digunakan dalam pengembangan website agar lebih dinamis dan interaktif. Jika sebelumnya kalian mungkin belajar HTML dan CSS maka dengan JavaScript kalian bisa membuat tampilan dari website kalian menjadi lebih interaktif lagi.
Tentunya belajar JavaScript pada saat seperti ini merupakan pilihan yang tepat, dikarenakan JavaScript adalah bahasa yang ramah untuk pemula alias beginner-friendly yang pastinya akan membuat kalian dapat mempelajarinya dengan mudah. Oleh karena itu JavaScript menjadi bahasa paling populer berdasarkan survei yang dilakukan oleh Stackoverflow.
Dengan JavaScript kita bisa membuat website yang jauh lebih baik pastinya. Seperti membuat navbar, slider, timer, hingga membuat sebuah game sekalipun yang dapat berjalan di browser, dan tentunya masih banyak lagi yang bisa dibuat dengan JavaScript.
Beberapa contoh sederhana penggunaan JavaScript:
Tertarik untuk Belajar? Yuk Belajar Sekarang 🌟
Berikut kami sediakan tahapan atau panduan dalam belajar JavaScript agar kalian tidak bingung dalam menentukan jalur belajar.
Jalur belajar ini diperuntukkan bagi kalian yang masih awam atau baru saja terjun di dunia pemrograman. Di sini kalian akan belajar dasar-dasar JavaScript mulai dari variabel hingga objek.
| Langkah | Topik | Target Pembelajaran | Materi | Video Rujukan |
|---|---|---|---|---|
| 01 | Pengenalan | Memahami bagaimana JavaScript bekerja | Hello World | WPU - Pengenalan JavaScript |
| 02 | Variabel dan Tipe Data | Memahami apa itu variabel dan tipe data yang ada di JavaScript | Variable & Datatype | WPU - Variabel dan WPU - Tipe Data |
| 03 | Operator Aritmatik | Dapat melakukan operasi aritmatika sederhana | Arithmetic | WPU - Operator Aritmatika |
| 04 | Perulangan | Memahami inti kedua dari pemograman yaitu melakukan perulangan | Looping | WPU - Perulangan dengan For dan WPU - Perulangan dengan While |
| 05 | Pengkondisian | Memahami salah satu dari inti dari membuat pemograman yaitu melakukan pengkondisian | Conditioning | WPU - Pengkondisian |
| 06 | Fungsi | Mengenal konsep fungsi dalam teknik pemograman | Function | WPU - Function |
| 07 | Konsep Array | Memahami konsep Array dan mencoba untuk mengimplemntasikannya dalam program | Array | WPU - Array |
| 08 | Konsep Objek | Mengenal konsep Object yang menjadi konsep paling penting di Javascript | Object | WPU - Object |
Jika sebelumnya kalian sudah mempelajari dan memahamai dasar-dasar JavaScript, selanjutnya kalian bisa belajar DOM. Di sini kalian akan belajar bagaimana berinteraksi langsung dengan website dengan cara memanipulasi objek / element HTML dengan menggunakan JavaScript.
| Langkah | Topik | Target Pembelajaran | Materi | Video Rujukan |
|---|---|---|---|---|
| 01 | Pengenalan | Mengenali apa itu DOM dan cara kerjanya | Introduction | WPU - Pengenalan DOM |
| 02 | Nodes | Memahami konsep Nodes pada DOM | Nodes | WPU - DOM Tree |
| 03 | Collections | Memahami konsep Colections pada DOM | Collections | WPU - DOM Tree |
| 04 | Method | Memahami bagaimana cara memanipulasi DOM dengan menggunakan method yang ada | Method | WPU - DOM Manipulation |
| 05 | Events | Memahami apa itu event pada DOM yang berguna untuk memberikan interaksi pada element HTML | Events | WPU - DOM Events |
| 06 | Event Listener | Memahami cara penulisan addEventListener yang digunakan untuk memberikan events pada element | Event Listener | WPU - DOM Events |
| 07 | Traversal | Memahami tentang bagaimana cara mengambil element berdasarkan objek yang ada | Traversal | WPU - DOM Traversal |
| 08 | Event Bubbling | Memahami lebih dalam mengenai events dan method-method di dalamnya | Event Bubbling | WPU - Event Bubbling |
Jalur belajar ini bisa kalian ambil jika sudah memahami dasar-dasar JavaScript tanpa mempelajari DOM terlebih dahulu. Di sini kalian akan belajar sintaks dan konsep JavaScript terbaru yang tentunya lebih berguna nantinya.
| Langkah | Topik | Target Pembelajaran | Materi | Video Rujukan |
|---|---|---|---|---|
| 01 | Pengenalan | Pengenalan apa itu ES6 | Introduction | - |
| 02 | Variabel | Mengenali sintaks terbaru dalam membuat variabel | Variable | WPU - VAR, LET & CONST |
| 03 | Arrow Function | Mengenali sintaks terbaru dalam membuat function | Arrow Function | WPU - Arrow Function |
| 04 | Template Literals | Memahami cara menyisipkan ekspresi ke dalam sebuah string | Template Literals | WPU - Template Literals |
| 05 | Destructuring Assignment | Memahami apa itu Destructuring Assignment dalam memecah array maupun objek | Destructuring Assignment | WPU - Destrucuting Assignment |
| 06 | For..Of Loop | Memahamai sintaks looping yang terbaru | For..Of | WPU - For..Of |
| 07 | Spread Operator | Memahami apa itu Spread Operator untuk memanipulasi array atau objek | Spread Operator | WPU - Spread Operator |
| 08 | Rest Parameter | Memahami penggunaannya dalam menangkap banyak parameter dari sebuah function | Rest Parameter | WPU - Rest Parameter |
Semua script yang ada pada repositori ini, dapat diakses dengan cepat lewat link berikut:
Dengan UI Server, kalian bisa belajar bahasa pemrograman Javascript dan langsung mempraktikkan topik yang sudah kalian pelajari, Bagaimana caranya?
Pertama pastikan Laptop/PC kalian sudah terinstall
- Git
- Node.js
- NPM
Jika belum kalian bisa klik dan ikuti video dibawah ini untuk menginstall semua program yang dibutuhkan
Jika sudah terinstall, kalian bisa mengikuti langkah langkah berikut ini
- Buka terminal dan clone repositori dengan perintah
git clone https://github.com/bellshade/Javascript.git - Pindahkan ke direktori hasil clone nya, lalu jalankan perintah
npm install
- Lalu jalankan perintah
npm start
- Jika sudah muncul tulisan
Listening on port 3000 | http://localhost:3000/maka selamat kalian sudah berhasil menginstall UI Server - Buka
http://localhost:3000/dan selamat belajar !!
Jika port 3000 sudah terpakai maka kalian bisa mengganti konfigurasi port nya
Pertama buka text editor kesukaan kalian lalu buka file .env.sample lalu tambahkan nomor port pada bagian PORT
Contohnya
PORT=3001
Lalu jalankan kembali UI Server nya.
Bantuan kalian diperlukan! Untuk Bellshade dapat lebih jauh lagi membantu anak-anak Indonesia belajar programming, kita butuh tenaga kalian.
"Dengan Bellshade, aku jadi bisa ngoding! Terima kasih Bellshade!!" Kami sangat senang bila kalian ingin melakukan kontribusi pada repositori JavaScript ini. Tapi, sebelum itu, silahkan baca terlebih dahulu Peraturan dan Pedoman Kontribusi yang telah kami siapkan. Terima kasih!
Untuk informasi lebih lanjut, mari gabung dalam komunitas Discord Channel WPU