diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md new file mode 100644 index 00000000..dd84ea78 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/bug_report.md @@ -0,0 +1,38 @@ +--- +name: Bug report +about: Create a report to help us improve +title: '' +labels: '' +assignees: '' + +--- + +**Describe the bug** +A clear and concise description of what the bug is. + +**To Reproduce** +Steps to reproduce the behavior: +1. Go to '...' +2. Click on '....' +3. Scroll down to '....' +4. See error + +**Expected behavior** +A clear and concise description of what you expected to happen. + +**Screenshots** +If applicable, add screenshots to help explain your problem. + +**Desktop (please complete the following information):** + - OS: [e.g. iOS] + - Browser [e.g. chrome, safari] + - Version [e.g. 22] + +**Smartphone (please complete the following information):** + - Device: [e.g. iPhone6] + - OS: [e.g. iOS8.1] + - Browser [e.g. stock browser, safari] + - Version [e.g. 22] + +**Additional context** +Add any other context about the problem here. diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md new file mode 100644 index 00000000..bbcbbe7d --- /dev/null +++ b/.github/ISSUE_TEMPLATE/feature_request.md @@ -0,0 +1,20 @@ +--- +name: Feature request +about: Suggest an idea for this project +title: '' +labels: '' +assignees: '' + +--- + +**Is your feature request related to a problem? Please describe.** +A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] + +**Describe the solution you'd like** +A clear and concise description of what you want to happen. + +**Describe alternatives you've considered** +A clear and concise description of any alternative solutions or features you've considered. + +**Additional context** +Add any other context or screenshots about the feature request here. diff --git a/1-getting-started-lessons/1-intro-to-programming-languages/README.md b/1-getting-started-lessons/1-intro-to-programming-languages/README.md index 53993f45..92582253 100644 --- a/1-getting-started-lessons/1-intro-to-programming-languages/README.md +++ b/1-getting-started-lessons/1-intro-to-programming-languages/README.md @@ -189,4 +189,4 @@ Study a bit on the different languages available to the programmer. Try to write ## Assignment -[Reading the Docs](1-getting-started-lessons/1-intro-to-programming-languages/assignment.md) +[Reading the Docs](assignment.md) diff --git a/1-getting-started-lessons/1-intro-to-programming-languages/translations/.github/post-lecture-quiz.id.md b/1-getting-started-lessons/1-intro-to-programming-languages/translations/.github/post-lecture-quiz.id.md new file mode 100644 index 00000000..e0c2f7ec --- /dev/null +++ b/1-getting-started-lessons/1-intro-to-programming-languages/translations/.github/post-lecture-quiz.id.md @@ -0,0 +1,18 @@ +*Selesaikan kuis ini bersama dengan kiriman Anda dengan memeriksa satu jawaban per pertanyaan.* + +1. Bahasa apa yang kemungkinan besar akan Anda gunakan untuk membuat situs web? + +- [ ] Machine Code (Kode Mesin) +- [ ] JavaScript +- [ ] Bash + +1. Lingkungan pengembangan unik untuk setiap pengembang + +- [ ] Benar +- [ ] Salah + +1. Apa yang akan dilakukan pengembang untuk memperbaiki kode buggy (mudah rusak)? + +- [ ] Syntax highlighting (Penyorotan sintaks) +- [ ] Debugging +- [ ] Code formatting (Pemformatan kode) diff --git a/1-getting-started-lessons/1-intro-to-programming-languages/translations/.github/pre-lecture-quiz.id.md b/1-getting-started-lessons/1-intro-to-programming-languages/translations/.github/pre-lecture-quiz.id.md new file mode 100644 index 00000000..8b57863f --- /dev/null +++ b/1-getting-started-lessons/1-intro-to-programming-languages/translations/.github/pre-lecture-quiz.id.md @@ -0,0 +1,18 @@ +*Selesaikan kuis ini di kelas* + +1. Sebuah program dapat dibuat tanpa pembuatnya menulis kode apapun + +- [ ] Benar +- [ ] Salah + +1. Bahasa tingkat rendah adalah pilihan populer untuk: + +- [ ] Website +- [ ] Hardware +- [ ] Perangkat lunak permainan video + +1. Manakah dari alat berikut yang kemungkinan besar ada di lingkungan pengembang web? + +- [ ] Hardware, like a Raspberry Pi +- [ ] Browser DevTools +- [ ] Operating system documentation diff --git a/1-getting-started-lessons/1-intro-to-programming-languages/translations/README.id.md b/1-getting-started-lessons/1-intro-to-programming-languages/translations/README.id.md new file mode 100644 index 00000000..36800646 --- /dev/null +++ b/1-getting-started-lessons/1-intro-to-programming-languages/translations/README.id.md @@ -0,0 +1,188 @@ +# Pengantar Bahasa Pemrograman dan Alat Keterampilan + +Pelajaran ini mencakup dasar-dasar bahasa pemrograman. Topik yang dibahas di sini berlaku untuk sebagian besar bahasa pemrograman modern saat ini. Di bagian 'Alat Keterampilan', Anda akan belajar tentang perangkat lunak yang berguna yang membantu Anda sebagai pengembang. + +![Pemrograman Intro](../webdev101-programming.png) +> Catatan sketsa oleh [Tomomi Imura](https://twitter.com/girlie_mac) + +## Kuis Pra-Kuliah +[Kuis pra-kuliah](.github/pre-lecture-quiz.id.md) + +## Pengantar + +Dalam pelajaran ini, kami akan membahas: + +- Apa itu pemrograman? +- Jenis bahasa pemrograman +- Elemen dasar dari sebuah program +- Perangkat lunak dan alat-alat yang berguna untuk pengembang profesional + +## Apa itu Pemrograman? + +Pemrograman (juga dikenal sebagai koding) adalah proses penulisan instruksi ke perangkat, seperti komputer atau perangkat seluler. Kami menulis instruksi ini dengan bahasa pemrograman, yang kemudian diinterpretasikan oleh perangkat. Kumpulan instruksi ini dapat dirujuk dengan berbagai nama, tetapi *program*, *program komputer*, *aplikasi (app)*, dan *dapat dijalankan (executable)* adalah beberapa nama populer. + +Sebuah *program* dapat berupa apapun yang ditulis dengan kode; situs web, permainan, dan aplikasi telepon adalah program. Meskipun memungkinkan untuk membuat program tanpa menulis kode, logika dasarnya diinterpretasikan ke perangkat dan logika itu kemungkinan besar ditulis dengan kode. Sebuah program yang *berjalan (running)* atau *menjalankan kode (executing code)* sedang menjalankan instruksi. Perangkat yang saat ini Anda gunakan untuk membaca pelajaran ini menjalankan program untuk mencetaknya ke layar Anda. + +βœ… Lakukan sedikit riset: siapa yang dianggap pemrogram komputer pertama di dunia? + +## Bahasa pemrograman + +Bahasa pemrograman memiliki tujuan utama: bagi pengembang untuk membuat instruksi untuk dikirim ke perangkat. Perangkat hanya dapat memahami biner (1 dan 0), dan untuk *sebagian besar* pengembang itu bukan cara yang sangat efisien untuk berkomunikasi. Bahasa pemrograman adalah wahana komunikasi antara manusia dan komputer. + +Bahasa pemrograman memiliki format yang berbeda dan mungkin memiliki tujuan yang berbeda. Misalnya, JavaScript terutama digunakan untuk aplikasi web, sedangkan Bash terutama digunakan untuk sistem operasi. + +*Bahasa tingkat rendah (Low level languages)* biasanya membutuhkan lebih sedikit langkah daripada *bahasa tingkat tinggi (high level languages)* agar perangkat dapat menafsirkan instruksi. Namun, yang membuat bahasa tingkat tinggi lebih populer adalah keterbacaan dan dukungannya. JavaScript dianggap sebagai bahasa tingkat tinggi. + +Kode berikut menggambarkan perbedaan antara bahasa tingkat tinggi dengan JavaScript dan bahasa tingkat rendah dengan kode rakitan ARM (ARM assembly code). + +```javascript +let number = 10 +let n1 = 0, n2 = 1, nextTerm; + +for (let i = 1; i <= number; i++) { + console.log(n1); + nextTerm = n1 + n2; + n1 = n2; + n2 = nextTerm; +} +``` + +```c + area ascen,code,readonly + entry + code32 + adr r0,thumb+1 + bx r0 + code16 +thumb + mov r0,#00 + sub r0,r0,#01 + mov r1,#01 + mov r4,#10 + ldr r2,=0x40000000 +back add r0,r1 + str r0,[r2] + add r2,#04 + mov r3,r0 + mov r0,r1 + mov r1,r3 + sub r4,#01 + cmp r4,#00 + bne back + end +``` + +Percaya atau tidak, *mereka berdua melakukan hal yang sama*: mencetak urutan Fibonacci hingga 10. + +βœ… Urutan Fibonacci [didefinisikan](https://en.wikipedia.org/wiki/Fibonacci_number) sebagai sekumpulan angka sedemikian rupa sehingga setiap angka adalah jumlah dari dua angka sebelumnya, mulai dari 0 dan 1. + +## Elemen program + +Satu instruksi dalam program disebut *statement* dan biasanya akan memiliki karakter atau penspasian baris yang menandai di mana instruksi berakhir, atau *mengakhiri (terminates)*. Bagaimana sebuah program berakhir bervariasi menurut setiap bahasa. + +Sebagian besar program mengandalkan penggunaan data dari pengguna atau di tempat lain, di mana pernyataan dapat mengandalkan data untuk melakukan instruksi. Data dapat mengubah bagaimana sebuah program berperilaku, sehingga bahasa pemrograman datang dengan cara untuk menyimpan data sementara yang dapat digunakan nanti. Data ini disebut *variabel*. Variabel adalah pernyataan yang menginstruksikan perangkat untuk menyimpan data dalam memorinya. Variabel dalam program mirip dengan yang ada di aljabar, di mana mereka memiliki nama yang unik dan nilainya dapat berubah dari waktu ke waktu. + +Ada kemungkinan bahwa beberapa pernyataan tidak akan dijalankan oleh perangkat. Ini biasanya oleh desain ketika ditulis oleh pengembang atau secara tidak sengaja ketika kesalahan yang tidak terduga terjadi. Jenis kontrol aplikasi ini membuatnya lebih kuat dan dapat dipertahankan. Biasanya perubahan kontrol ini terjadi ketika keputusan tertentu terpenuhi. Pernyataan umum dalam bahasa pemrograman modern untuk mengontrol bagaimana program dijalankan adalah pernyataan `if..else`. + +βœ… Anda akan mempelajari lebih lanjut tentang jenis pernyataan ini dalam pelajaran berikutnya + +## Alat Keterampilan + +[![Alat Keterampilan](https://img.youtube.com/vi/69WJeXGBdxg/0.jpg)](https://youtube.com/watch?v=69WJeXGBdxg "Alat Keterampilan") + +Di bagian ini, Anda akan mempelajari beberapa perangkat lunak yang mungkin berguna saat memulai perjalanan pengembangan profesional. + +***Lingkungan pengembangan (development environment)*** adalah seperangkat alat dan fitur unik yang sering digunakan pengembang saat menulis perangkat lunak. Beberapa alat ini telah disesuaikan untuk kebutuhan khusus pengembang, dan dapat berubah seiring waktu jika pengembang mengubah prioritas dalam proyek kerja atau pribadi, atau ketika mereka menggunakan bahasa pemrograman yang berbeda. Lingkungan pengembangan sama uniknya dengan pengembang yang menggunakannya. + +### Editor + +Salah satu alat yang paling penting untuk pengembangan perangkat lunak adalah editor. Editor adalah tempat Anda menulis kode dan kadang-kadang di mana Anda akan menjalankan kode Anda. + +Pengembang mengandalkan editor karena beberapa alasan tambahan: + +- *Debugging* Menemukan bug dan kesalahan dengan melangkah melalui kode, baris demi baris. Beberapa editor memiliki kemampuan debugging, atau dapat disesuaikan dan ditambahkan untuk bahasa pemrograman tertentu. +- *Penyorotan sintaks* Menambahkan warna dan pemformatan teks ke kode, membuatnya lebih mudah dibaca. Sebagian besar editor memungkinkan penyorotan sintaks yang disesuaikan. +- *Ekstensi dan Integrasi* Penambahan yang khusus untuk pengembang, oleh pengembang, untuk akses ke alat tambahan yang tidak dibangun ke dalam editor dasar. Misalnya, banyak pengembang juga membutuhkan cara untuk mendokumentasikan kode mereka dan menjelaskan cara kerjanya dan akan menginstal ekstensi pemeriksaan ejaan untuk memeriksa kesalahan ketik. Sebagian besar penambahan ini dimaksudkan untuk digunakan dalam editor tertentu, dan sebagian besar editor datang dengan cara untuk mencari ekstensi yang tersedia. +- *Kustomisasi* Sebagian besar editor sangat dapat disesuaikan, dan setiap pengembang akan memiliki lingkungan pengembangan unik mereka sendiri yang sesuai dengan kebutuhan mereka. Banyak juga yang memungkinkan pengembang untuk membuat ekstensi mereka sendiri. + +#### Editor dan Ekstensi Pengembangan Web Populer + +- [Visual Studio Code](https://code.visualstudio.com/) + - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) + - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare-pack) + - [Prettier - Code formatter](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) +- [Atom](https://atom.io/) + - [spell-check](https://atom.io/packages/spell-check) + - [teletype](https://atom.io/packages/teletype) + - [atom-beautify](https://atom.io/packages/atom-beautify) + +### Browser + +Alat penting lainnya adalah browser. Pengembang web mengandalkan browser untuk mengamati bagaimana kode mereka berjalan di web, itu juga digunakan untuk melihat elemen visual dari halaman web yang ditulis di editor, seperti HTML. + +Banyak browser datang dengan *alat pengembang* (DevTools) yang berisi serangkaian fitur dan informasi bermanfaat untuk membantu pengembang mengumpulkan dan menangkap wawasan penting tentang aplikasi mereka. Misalnya: Jika halaman web memiliki kesalahan, terkadang berguna untuk mengetahui kapan halaman web tersebut terjadi. DevTools di browser dapat dikonfigurasi untuk mengambil informasi ini. + +#### Browser dan DevTools Populer + +- [Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium) +- [Chrome](https://developers.google.com/web/tools/chrome-devtools/) +- [Firefox](https://developer.mozilla.org/docs/Tools) + +### Alat Command Line + +Beberapa pengembang lebih suka tampilan grafis yang kurang untuk tugas sehari-hari mereka dan mengandalkan command line (baris perintah) untuk mencapai ini. Mengembangkan kode membutuhkan sejumlah besar pengetikan, dan beberapa pengembang lebih suka tidak mengganggu aliran mereka pada keyboard dan akan menggunakan pintasan keyboard untuk bertukar antara jendela desktop, mengerjakan file yang berbeda, dan menggunakan alat. Sebagian besar tugas dapat diselesaikan dengan mouse, tetapi satu manfaat menggunakan command line adalah bahwa banyak yang dapat dilakukan dengan alat command line tanpa perlu bertukar antara mouse dan keyboard. Manfaat lain dari command line adalah bahwa mereka dapat dikonfigurasi dan Anda dapat menyimpan konfigurasi kustom Anda, mengubahnya nanti, dan juga mengimpornya ke mesin pengembangan baru. Karena lingkungan pengembangan sangat unik untuk setiap pengembang, beberapa akan menghindari menggunakan command line, beberapa akan mengandalkannya sepenuhnya, dan beberapa lebih suka campuran keduanya. + +### Pilihan Command Line Populer + +Pilihan untuk command line akan berbeda berdasarkan sistem operasi yang Anda gunakan. + +*πŸ’» = sudah terinstall dengan sistem operasi.* + +#### Windows + +- [Powershell](https://docs.microsoft.com/powershell/scripting/overview?view=powershell-7) πŸ’» +- [Command Line](https://docs.microsoft.com/windows-server/administration/windows-commands/windows-commands) (also known as CMD) πŸ’» +- [Windows Terminal](https://docs.microsoft.com/windows/terminal/) +- [mintty](https://mintty.github.io/) + +#### MacOS + +- [Terminal](https://support.apple.com/guide/terminal/open-or-quit-terminal-apd5265185d-f365-44cb-8b09-71a064a42125/mac) πŸ’» +- [iTerm](https://iterm2.com/) +- [Powershell](https://docs.microsoft.com/powershell/scripting/install/installing-powershell-core-on-macos?view=powershell-7) + +#### Linux + +- [Bash](https://www.gnu.org/software/bash/manual/html_node/index.html) πŸ’» +- [KDE Konsole](https://docs.kde.org/trunk5/en/applications/konsole/index.html) +- [Powershell](https://docs.microsoft.com/powershell/scripting/install/installing-powershell-core-on-linux?view=powershell-7) + +#### Alat Command Line Populer + +- [Git](https://git-scm.com/) (πŸ’» on most operating sytems) +- [NPM](https://www.npmjs.com/) +- [Yarn](https://classic.yarnpkg.com/en/docs/cli/) + +### Dokumentasi + +Ketika pengembang ingin mempelajari sesuatu yang baru, mereka kemungkinan besar akan mengandalkan dokumentasi untuk mempelajari cara menggunakannya. Pengembang sering mengandalkan dokumentasi untuk memandu mereka melalui cara menggunakan alat dan bahasa dengan benar, dan juga untuk mendapatkan pengetahuan yang lebih mendalam tentang cara kerjanya. + +#### Dokumentasi Populer tentang Pengembangan Web + +- [Mozilla Developer Network](https://developer.mozilla.org/docs/Web) +- [Frontend Masters](https://frontendmasters.com/learn/) +βœ… Lakukan riset: Sekarang Anda tahu dasar-dasar lingkungan pengembang web, bandingkan dan kontras dengan lingkungan desainer web. + +--- + +## πŸš€ Tantangan + +Bandingkan beberapa bahasa pemrograman. Apa saja ciri-ciri unik JavaScript vs. Java? Bagaimana dengan COBOL vs. Go? + +## Ulasan & Belajar Mandiri + +Pelajari sedikit tentang berbagai bahasa yang tersedia untuk programmer. Cobalah untuk menulis baris dalam satu bahasa, dan kemudian mengulanginya pada dua bahasa lainnya. Apa yang Anda pelajari? + +## Tugas + +[Membaca Dokumentasi](assignment.id.md) diff --git a/1-getting-started-lessons/1-intro-to-programming-languages/translations/assignment.id.md b/1-getting-started-lessons/1-intro-to-programming-languages/translations/assignment.id.md new file mode 100644 index 00000000..a9d0ece7 --- /dev/null +++ b/1-getting-started-lessons/1-intro-to-programming-languages/translations/assignment.id.md @@ -0,0 +1,11 @@ +# Membaca Dokumentasi + +## Instruksi + +Ada banyak alat yang mungkin diperlukan pengembang web yang ada di [dokumentasi MDN untuk alat sisi klien](https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Overview) . Pilih 3 alat yang tidak tercakup dalam pelajaran, jelaskan mengapa pengembang web akan menggunakannya, dan cari alat yang termasuk dalam kategori ini dan bagikan dokumentasinya. Jangan gunakan contoh alat yang sama pada dokumen MDN. + +## Rubrik + +| Teladan | Memenuhi Syarat | Perlu Perbaikan | +|----------------------------------------------------------|-----------------------------------------------------------------------------|----------------------------------------------------------------------------------| +| Menjelaskan mengapa pengembang web akan menggunakan alat | Dijelaskan bagaimana, tetapi tidak mengapa pengembang akan menggunakan alat | Tidak disebutkan bagaimana atau mengapa seorang pengembang akan menggunakan alat | diff --git a/1-getting-started-lessons/2-github-basics/README.md b/1-getting-started-lessons/2-github-basics/README.md index 91257f4e..24415aa9 100644 --- a/1-getting-started-lessons/2-github-basics/README.md +++ b/1-getting-started-lessons/2-github-basics/README.md @@ -22,8 +22,8 @@ Before you begin, you'll need to check if Git is installed. In the terminal type `git --version` If Git is not installed, [download Git](https://git-scm.com/downloads). Then, setup your local Git profile in the terminal: -`git config --global user.name "your-name"` -`git config --global user.email "your-email"` +* `git config --global user.name "your-name"` +* `git config --global user.email "your-email"` To check if Git is already configured you can type: `git config --list` diff --git a/1-getting-started-lessons/2-github-basics/translations/.github/post-lecture-quiz.id.md b/1-getting-started-lessons/2-github-basics/translations/.github/post-lecture-quiz.id.md new file mode 100644 index 00000000..ab6b5389 --- /dev/null +++ b/1-getting-started-lessons/2-github-basics/translations/.github/post-lecture-quiz.id.md @@ -0,0 +1,19 @@ +*Selesaikan kuis ini dengan mencentang satu jawaban per pertanyaan.* + +1. Tempat untuk membandingkan dan mendiskusikan perbedaan yang diperkenalkan pada cabang dengan review, komentar, tes terintegrasi, dan banyak lagi adalah: + +- [ ] GitHub +- [ ] Pull Request (Tarik Permintaan) +- [ ] Feature branch (Cabang fitur) + +1. Bagaimana Anda mendapatkan semua komit dari cabang remote (jarak jauh)? + +- [ ] `git fetch` +- [ ] `git pull` +- [ ] `git commits -r` + +1. Bagaimana Anda beralih ke sebuah cabang (branch)? + +- [ ] `git switch [branch-name]` +- [ ] `git checkout [branch-name]` +- [ ] `git load [branch-name]` diff --git a/1-getting-started-lessons/2-github-basics/translations/.github/pre-lecture-quiz.id.md b/1-getting-started-lessons/2-github-basics/translations/.github/pre-lecture-quiz.id.md new file mode 100644 index 00000000..ff425937 --- /dev/null +++ b/1-getting-started-lessons/2-github-basics/translations/.github/pre-lecture-quiz.id.md @@ -0,0 +1,13 @@ +*Selesaikan kuis ini di kelas* + +1. Bagaimana Anda membuat repo Git? + +- [ ] git create +- [ ] git start +- [ ] git init + +1. Apa fungsi `git add`? + +- [ ] Commit (menyerahkan) kode Anda +- [ ] Menambahkan file Anda ke area pementasan (staging area) untuk dilacak +- [ ] Menambahkan file Anda ke GitHub diff --git a/1-getting-started-lessons/2-github-basics/translations/README.id.md b/1-getting-started-lessons/2-github-basics/translations/README.id.md new file mode 100644 index 00000000..396161c1 --- /dev/null +++ b/1-getting-started-lessons/2-github-basics/translations/README.id.md @@ -0,0 +1,291 @@ +# Pengantar GitHub + +Pelajaran ini mencakup dasar-dasar GitHub, platform untuk menghosting dan mengelola perubahan pada kode Anda. + +![Pengantar GitHub](images/webdev101-github.png) +> Catatan sketsa oleh [Tomomi Imura](https://twitter.com/girlie_mac) + +## Kuis Pra-Kuliah +[Kuis pra-kuliah](.github/pre-lecture-quiz.id.md) + +## Pengantar + +Dalam pelajaran ini, kami akan membahas: + +- melacak pekerjaan yang Anda lakukan di mesin Anda +- mengerjakan proyek dengan orang lain +- bagaimana berkontribusi pada perangkat lunak sumber terbuka + +### Prasyarat + +Sebelum memulai, Anda harus memeriksa apakah Git sudah diinstal. Di terminal ketik: +`git --version` + +Jika Git tidak diinstal, [unduh Git](https://git-scm.com/downloads). Kemudian, atur profil Git lokal Anda di terminal: +`git config --global user.name "nama-anda"` +`git config --global user.email "email-anda"` + +Untuk memeriksa apakah Git sudah dikonfigurasi, Anda dapat mengetik: +`git config --list` + +Anda juga memerlukan akun GitHub, editor kode (seperti Visual Studio Code), dan Anda harus membuka terminal (atau: command prompt). + +Buka [github.com](https://github.com/) dan buat akun jika Anda belum melakukannya, atau masuk dan isi profil Anda. + +βœ… GitHub bukan satu-satunya repositori kode di dunia; ada yang lain, tapi GitHub adalah yang paling terkenal + +### Persiapan + +Anda akan memerlukan folder dengan proyek kode di komputer lokal Anda (laptop atau PC), dan repositori publik di GitHub, yang akan berfungsi sebagai contoh cara berkontribusi pada proyek orang lain. + +--- + +## Manajemen kode + +Katakanlah Anda memiliki folder secara lokal dengan beberapa proyek kode dan Anda ingin mulai melacak kemajuan Anda menggunakan git - sistem kontrol versi. Beberapa orang membandingkan penggunaan git dengan menulis surat cinta untuk diri Anda di masa depan. Membaca pesan commit Anda beberapa hari atau minggu atau bulan kemudian, Anda akan dapat mengingat mengapa Anda membuat keputusan, atau "membatalkan" perubahan - yaitu, saat Anda menulis "pesan commit" yang baik. + +### Tugas: Membuat repositori dan menyerahkan kode + +1. **Buat repositori di GitHub**. Di GitHub.com, di tab repositories, atau dari kanan atas bilah navigasi, temukan tombol **repo baru (new repo)**. + + 1. Beri nama repositori (folder) Anda + 1. Pilih **create repository**. + +1. **Arahkan ke folder kerja Anda**. Di terminal Anda, beralihlah ke folder (juga dikenal sebagai direktori) yang ingin Anda mulai lacak. Ketik: + + ```bash + cd [nama folder anda] + ``` + +1. **Inisialisasi repositori git**. Dalam proyek Anda ketik: + + ```bash + git init + ``` + +1. **Periksa status**. Untuk memeriksa status repositori Anda ketik: + + ```bash + git status + ``` + + hasilnya akan terlihat seperti ini: + + ```output + Changes not staged for commit: + (use "git add ..." to update what will be committed) + (use "git checkout -- ..." to discard changes in working directory) + + modified: file.txt + modified: file2.txt + ``` + + Pada umunya perintah `git status` memberi tahu Anda hal-hal seperti file apa yang siap untuk _simpan_ ke repo atau ada perubahan di dalamnya yang mungkin ingin Anda pertahankan. + +1. **Tambahkan file ke pelacakan** + + ```bash + git add . + ``` + + `git add` ditambah argumen `.` menunjukkan bahwa semua file dan perubahan Anda untuk pelacakan. + +1. **Mempertahankan pekerjaan Anda**. Pada titik ini Anda telah menambahkan file ke apa yang disebut _staging area_ (area pementasan). Tempat di mana Git melacak file Anda. Untuk membuat perubahan permanen Anda perlu _commit_ (menyerahkan) file. Untuk melakukannya, Anda membuat _commit_ dengan perintah `git commit`. Sebuah _commit_ mewakili titik penyimpanan dalam riwayat repo Anda. Ketik berikut ini untuk membuat _commit_: + + ```bash + git commit -m "first commit" + ``` + + Ini menyerahkan (commit) semua file Anda, menambahkan pesan "first commit". Untuk pesan commit di masa mendatang, Anda akan ingin lebih deskriptif dalam deskripsi Anda untuk menyampaikan jenis perubahan apa yang telah Anda buat. + +1. **Hubungkan repo Git lokal Anda dengan GitHub**. Sebuah Repo Git bagus di mesin Anda tetapi pada titik tertentu Anda ingin memiliki cadangan file Anda di suatu tempat dan juga mengundang orang lain untuk bekerja dengan Anda di repo Anda. Salah satu tempat yang bagus untuk melakukannya adalah GitHub. Ingat kita sudah membuat repo di GitHub jadi satu-satunya hal yang perlu kita lakukan adalah menghubungkan repo Git lokal kita dengan GitHub. Perintah `git remote add` akan melakukan hal itu. Ketik perintah berikut: + + > Catatan, sebelum Anda mengetik perintah, buka halaman repo GitHub Anda untuk menemukan URL repositori. Anda akan menggunakannya di perintah di bawah ini. Ganti `nama_repository` dengan URL GitHub Anda. + + ```bash + git remote add origin https://github.com/username/nama_repository.git + ``` + + Ini membuat _remote_, atau koneksi, bernama "origin" yang menunjuk ke repositori GitHub yang Anda buat sebelumnya. + +1. **Kirim file lokal ke GitHub**. Sejauh ini Anda telah membuat _connection_ (koneksi) antara repo lokal dan repo GitHub. Ayo kirim file-file ini ke GitHub dengan perintah berikut `git push`, seperti itu: + + ```bash + git push -u origin main + ``` + + Ini mengirimkan komit Anda di cabang "main" Anda ke GitHub. + +1. **Untuk menambahkan lebih banyak perubahan**. Jika Anda ingin terus membuat perubahan dan menerapkannya ke GitHub, Anda hanya perlu menggunakan tiga perintah berikut: + + ```bash + git add . + git commit -m "ketik pesan komit Anda di sini" + git push + ``` + + > Tip, Anda mungkin juga ingin mengadopsi file `.gitignore` untuk mencegah file yang tidak ingin Anda lacak muncul di GitHub - seperti file catatan yang Anda simpan di folder yang sama tetapi tidak memiliki tempat di repositori publik. Anda dapat menemukan template untuk file `.gitignore` di [.gitignore templates](github.com/github/gitignore). + +#### Pesan commit + +Baris subjek Git commit yang bagus melengkapi kalimat berikut: +Jika diterapkan, komit ini akan + +Untuk subjek gunakan imperatif, bentuk waktu sekarang (present tense): "merubah" bukan "perubahan" atau "mengubah". +Seperti pada subjek, dalam tubuh (opsional) juga gunakan imperatif, bentuk waktu sekarang. Tubuh harus memasukkan motivasi untuk perubahan dan membandingkannya dengan perilaku sebelumnya. Anda menjelaskan `mengapa`, bukan `bagaimana`. + +βœ… Luangkan beberapa menit untuk menjelajahi GitHub. Dapatkah Anda menemukan pesan commit yang sangat bagus? Dapatkah Anda menemukan yang sangat minim? Informasi apa yang menurut Anda paling penting dan berguna untuk disampaikan dalam pesan commit? + +### Tugas: Berkolaborasi + +Alasan utama menempatkan sesuatu di GitHub adalah untuk memungkinkan kolaborasi dengan pengembang lain. + +## Mengerjakan proyek dengan orang lain + +Di repositori Anda, buka `Insights > Community` untuk melihat bagaimana proyek Anda dibandingkan dengan standar komunitas yang direkomendasikan. + + Berikut beberapa hal yang dapat meningkatkan repo GitHub Anda: + - **Deskripsi**. Apakah Anda menambahkan deskripsi untuk proyek Anda? + - **README**. Apakah Anda menambahkan README? GitHub memberikan panduan untuk menulis [README](https://docs.github.com/articles/about-readmes/). + - **Panduan berkontribusi**. Apakah project Anda memiliki [pedoman kontribusi](https://docs.github.com/articles/setting-guidelines-for-repository-contributors/), + - **Kode etik**. sebuah [Kode etik](https://docs.github.com/articles/adding-a-code-of-conduct-to-your-project/), + - **Lisensi**. Mungkin yang paling penting, sebuah [lisensi](https://docs.github.com/articles/adding-a-license-to-a-repository/)? + +Semua sumber daya ini akan bermanfaat bagi anggota tim baru. Dan biasanya itu adalah jenis hal yang dilihat oleh kontributor baru bahkan sebelum melihat kode Anda, untuk mengetahui apakah proyek Anda adalah tempat yang tepat bagi mereka untuk menghabiskan waktu mereka.. + +βœ… File README, meskipun membutuhkan waktu untuk mempersiapkannya, sering kali diabaikan oleh pengelola yang sibuk. Dapatkah Anda menemukan contoh yang sangat deskriptif? Catatan: ada beberapa [alat untuk membantu membuat README yang baik](https://www.makeareadme.com/) yang mungkin ingin Anda coba. + +### Tugas: Menggabungkan beberapa kode + +Dokumen kontribusi membantu orang berkontribusi pada proyek. Itu menjelaskan jenis kontribusi yang Anda cari dan bagaimana prosesnya bekerja. Kontributor harus melalui serangkaian langkah untuk dapat berkontribusi ke repo Anda di GitHub: + +1. **Membagi (Forking) repo Anda** Anda mungkin ingin orang _fork_ proyek Anda. Forking berarti membuat replika repositori Anda di profil GitHub mereka. +1. **Clone**. Dari sana mereka akan mengkloning proyek tersebut ke mesin lokal mereka. +1. **Buat cabang**. Anda akan ingin meminta mereka untuk membuat _branch_ (cabang) untuk pekerjaan mereka. +1. **Fokuskan perubahan mereka pada satu area**. Minta kontributor untuk memusatkan kontribusinya pada satu hal pada satu waktu - dengan begitu, peluang Anda untuk _menggabungkan_ dalam pekerjaan mereka lebih tinggi. Bayangkan mereka menulis perbaikan bug, menambahkan fitur baru, dan memperbarui beberapa pengujian - bagaimana jika Anda ingin, atau hanya dapat mengimplementasikan 2 dari 3, atau 1 dari 3 perubahan? + +βœ… Bayangkan situasi di mana cabang sangat penting untuk menulis dan mengirimkan kode yang baik. Kasus penggunaan apa yang dapat Anda pikirkan? + +> Perhatikan, jadilah perubahan yang ingin Anda lihat di dunia, dan buat cabang untuk pekerjaan Anda juga. Komit apa pun yang Anda buat akan dilakukan di cabang tempat Anda "check out" saat ini. Gunakan `git status` untuk melihat cabang mana itu. + +Mari kita melalui alur kerja kontributor. Asumsikan kontributor sudah _forked (membagi)_ dan _cloned (mengkloning)_ repo sehingga mereka memiliki repo Git yang siap untuk dikerjakan, di mesin lokal mereka: + +1. **Buat cabang**. Gunakan perintah `git branch` untuk membuat cabang yang akan berisi perubahan yang dimaksudkan untuk dikontribusikan: + + ```bash + git branch [nama-cabang] + ``` + +1. **Beralih ke cabang kerja**. Beralih ke cabang yang ditentukan dan perbarui direktori kerja dengan `git checkout`: + + ```bash + git checkout [nama-cabang] + ``` + +1. **Bekerja**. Pada titik ini Anda ingin menambahkan perubahan Anda. Jangan lupa untuk memberi tahu Git tentangnya dengan perintah berikut: + + ```bash + git add . + git commit -m "perubahan saya" + ``` + + Pastikan Anda memberikan nama yang baik pada komitmen Anda, demi Anda dan juga pemelihara repo yang Anda bantu. + +1. **Gabungkan pekerjaan Anda dengan cabang `main`**. Pada titik tertentu Anda telah selesai bekerja dan Anda ingin menggabungkan pekerjaan Anda dengan pekerjaan yang ada di cabang `main`. Cabang `main` mungkin telah berubah sementara itu jadi pastikan Anda terlebih dahulu memperbaruinya ke yang terbaru dengan perintah berikut: + + ```bash + git checkout main + git pull + ``` + + Pada titik ini Anda ingin memastikan bahwa setiap _conflicts (konflik)_, situasi di mana Git tidak dapat dengan mudah _combine (menggabugkan)_ perubahan terjadi di cabang kerja Anda. Oleh karena itu jalankan perintah berikut: + + ```bash + git checkout [nama-cabang] + git merge main + ``` + + Ini akan membawa semua perubahan dari `main` ke cabang Anda dan mudah-mudahan Anda bisa langsung melanjutkan. Jika tidak, VS Code akan memberi tahu Anda di mana Git _confused (bingung)_ dan Anda hanya mengubah file yang terpengaruh untuk mengatakan konten mana yang paling akurat. + +1. **Kirim pekerjaan Anda ke GitHub**. Mengirim pekerjaan Anda ke GitHub berarti dua hal. Mendorong cabang Anda ke repo Anda dan kemudian membuka PR, Pull Request (Permintaan Tarik). + + ```bash + git push --set-upstream origin [nama-cabang] + ``` + + Perintah di atas membuat cabang di repo bercabang Anda. + +1. ****. Selanjutnya, Anda ingin membuka PR. Anda melakukannya dengan menavigasi ke repo bercabang di GitHub. Anda akan melihat indikasi di GitHub yang menanyakan apakah Anda ingin membuat PR baru, Anda mengkliknya dan Anda akan dibawa ke antarmuka di mana Anda dapat mengubah judul pesan commit, berikan deskripsi yang lebih sesuai. Sekarang pengelola repo Anda bercabang akan melihat PR ini dan _semoga_ mereka akan menghargai dan _merge (menggabungkan)_ PR Anda. Anda sekarang menjadi kontributor, hore :) + +1. **Membersihkan**. Ini dianggap praktik yang baik untuk _membersihkan_ setelah Anda. Anda ingin membersihkan cabang lokal dan cabang yang Anda dorong ke GitHub. Pertama mari kita hapus secara lokal dengan perintah berikut: + + ```bash + git branch -d [nama-cabang] + ``` + + Pastikan Anda membuka halaman GitHub untuk repo bercabang berikutnya dan hapus cabang jarak jauh yang baru saja Anda dorong ke sana. + +`Pull request` sepertinya istilah yang konyol karena Anda benar-benar ingin mendorong perubahan Anda ke proyek. Namun pengelola (pemilik proyek) atau tim inti perlu mempertimbangkan perubahan Anda sebelum menggabungkannya dengan cabang "main" proyek, jadi Anda benar-benar meminta keputusan perubahan dari pengelola. + +Pull request adalah tempat untuk membandingkan dan mendiskusikan perbedaan yang diperkenalkan pada cabang dengan ulasan, komentar, pengujian terintegrasi, dan banyak lagi. Pull request yang baik mengikuti aturan yang kira-kira sama dengan pesan komit. Anda dapat menambahkan referensi ke masalah di pelacak masalah, ketika pekerjaan Anda, misalnya, memperbaiki masalah (issue). Ini dilakukan dengan menggunakan `#` diikuti dengan nomor masalah (issue) Anda. Misalnya `#97`. + +🀞Semoga semua pemeriksaan lulus dan pemilik proyek menggabungkan perubahan Anda ke dalam proyek🀞 + +Perbarui cabang lokal Anda saat ini dengan semua komit baru dari cabang jarak jauh yang sesuai di GitHub: + +`git pull` + +## Bagaimana berkontribusi pada open source + +Pertama, mari temukan repositori - atau: repo - di GitHub yang Anda minati dan yang ingin Anda beri kontribusi perubahan. Anda akan ingin menyalin konten ke mesin kami. + +βœ… Cara yang baik untuk menemukan repositori 'ramah-pemula' adalah [menelusuri dengan tag 'good-first-issue'](https://github.blog/2020-01-22-browse-good-first-issues-to-mulai-berkontribusi-ke-open-source/). + +![Salin repo secara lokal](../images/clone_repo.png) + +Ada beberapa cara untuk menyalin kode. Salah satu caranya adalah dengan "menggandakan" konten repositori, menggunakan HTTPS, SSH, atau menggunakan GitHub CLI (Command Line Interface). + +Buka terminal Anda dan kloning repositori seperti ini: +`git clone https://github.com/ProjectURL` + +Untuk mengerjakan proyek, alihkan ke folder yang benar: +`cd ProjectURL` + +Anda juga dapat membuka seluruh proyek menggunakan [Codespaces](https://github.com/features/codespaces), editor kode / lingkungan pengembangan cloud GitHub yang disematkan, atau [GitHub Desktop](https://desktop.github.com/ ). + +Terakhir, Anda dapat mengunduh kode dalam folder zip. + +### Beberapa hal menarik lainnya tentang GitHub + +Anda dapat membintangi, menonton, dan / atau "fork (membagi)" repositori publik apa pun di GitHub. Anda dapat menemukan repositori berbintang di menu tarik-turun kanan atas. Ini seperti mem-bookmark, tetapi untuk kode. + +Proyek memiliki pelacak masalah, sebagian besar di GitHub di tab "Issues (Masalah)" kecuali dinyatakan lain, tempat orang-orang mendiskusikan masalah yang terkait dengan proyek. Dan tab Pull Requests (Permintaan Tarik) adalah tempat orang mendiskusikan dan meninjau perubahan yang sedang berlangsung. + +Proyek mungkin juga memiliki diskusi di forum, milis, atau saluran obrolan seperti Slack, Discord atau IRC. + +βœ… Lihatlah repo GitHub baru Anda dan coba beberapa hal, seperti mengedit pengaturan, menambahkan informasi ke repo Anda, dan membuat proyek (seperti papan Kanban). Banyak yang bisa Anda lakukan! + +--- + +## πŸš€ Tantangan + +Sandingkan dengan seorang teman untuk mengerjakan kode satu sama lain. Buat proyek secara kolaboratif, buat kode, buat cabang, dan gabungkan perubahan. + +## Kuis Pasca Kuliah +[Kuis pasca kuliah](.github/post-lecture-quiz.id.md) + +## Review & Belajar Mandiri + +Baca lebih lanjut tentang [berkontribusi pada software open source](https://opensource.guide/how-to-contribute/#how-to-submit-a-contribution). + +[Git cheatsheet](https://training.github.com/downloads/github-git-cheat-sheet/). + +Latihan, latihan, latihan. GitHub memiliki jalur pembelajaran yang bagus yang tersedia melalui [lab.github.com](https://lab.github.com/): + +- [Minggu Pertama di GitHub](https://lab.github.com/githubtraining/first-week-on-github) + +Anda juga akan menemukan lab yang lebih canggih. + +## Tugas + +Selesaikan [Minggu Pertama di lab pelatihan GitHub](https://lab.github.com/githubtraining/first-week-on-github) \ No newline at end of file diff --git a/1-getting-started-lessons/3-accessibility/README.md b/1-getting-started-lessons/3-accessibility/README.md index e8faa24e..601b0de1 100644 --- a/1-getting-started-lessons/3-accessibility/README.md +++ b/1-getting-started-lessons/3-accessibility/README.md @@ -215,6 +215,6 @@ Many governments have laws regarding accessibility requirements. Read up on your ## Assignment -[Analyze a non-accessible web site](1-getting-started-lessons/3-accessibility/assignment.md) +[Analyze a non-accessible web site](assignment.md) Credits: [Turtle Ipsum](https://github.com/Instrument/semantic-html-sample) by Instrument diff --git a/2-js-basics/1-data-types/README.md b/2-js-basics/1-data-types/README.md index 94135c12..bfda8330 100644 --- a/2-js-basics/1-data-types/README.md +++ b/2-js-basics/1-data-types/README.md @@ -193,4 +193,4 @@ Take a look at [this list of JavaScript exercises](https://css-tricks.com/snippe ## Assignment -[Data Types Practice](2-js-basics/1-data-types/assignment.md) \ No newline at end of file +[Data Types Practice](assignment.md) \ No newline at end of file diff --git a/2-js-basics/2-functions-methods/README.md b/2-js-basics/2-functions-methods/README.md index 8818dbda..ac498ddc 100644 --- a/2-js-basics/2-functions-methods/README.md +++ b/2-js-basics/2-functions-methods/README.md @@ -189,4 +189,4 @@ It's worth [reading up a little more on arrow functions](https://developer.mozil ## Assignment -[Fun with Functions](2-js-basics/2-functions-methods/assignment.md) \ No newline at end of file +[Fun with Functions](assignment.md) \ No newline at end of file diff --git a/2-js-basics/3-making-decisions/README.md b/2-js-basics/3-making-decisions/README.md index 1c8207e4..9c0f770c 100644 --- a/2-js-basics/3-making-decisions/README.md +++ b/2-js-basics/3-making-decisions/README.md @@ -172,4 +172,4 @@ Go through Josh Comeau's wonderful [operator lookup](https://joshwcomeau.com/ope ## Assignment -[Operators](2-js-basics/3-making-decisions/assignment.md) +[Operators](assignment.md) diff --git a/2-js-basics/4-arrays-loops/README.md b/2-js-basics/4-arrays-loops/README.md index b1f1bebd..b4dc64e1 100644 --- a/2-js-basics/4-arrays-loops/README.md +++ b/2-js-basics/4-arrays-loops/README.md @@ -123,4 +123,4 @@ Arrays in JavaScript have many methods attached to them, extremely useful for da ## Assignment -[Loop an Array](2-js-basics/4-arrays-loops/assignment.md) +[Loop an Array](assignment.md) diff --git a/3-terrarium/1-intro-to-html/README.md b/3-terrarium/1-intro-to-html/README.md index 3bc3e8a5..1710bb68 100644 --- a/3-terrarium/1-intro-to-html/README.md +++ b/3-terrarium/1-intro-to-html/README.md @@ -9,9 +9,9 @@ ### Introduction -HTML, or HyperText Markup Language, is the 'skeleton' of the web. If CSS 'dresses up' your HTML and JavaScript brings it to life, the body of your web application is its HTML. HTML's syntax even reflects that idea, as it includes "head", "body", and "footer" tags. +HTML, or HyperText Markup Language, is the 'skeleton' of the web. If CSS 'dresses up' your HTML and JavaScript brings it to life, HTML is the body of your web application. HTML's syntax even reflects that idea, as it includes "head", "body", and "footer" tags. -In this lesson, we're going to use HTML to layout the 'skeleton' of our virtual terrarium's interface. It will have a title and three columns: a right and left column where the draggable plants live, and a center area that will be the actual glass-looking terrarium. By the end of this lesson, you will be able to see the plants in the columns, but the interface will look a little strange; don't worry, in the next section you will add CSS styles to the interface to make it look better. +In this lesson, we're going to use HTML to layout the 'skeleton' of our virtual terrarium's interface. It will have a title and three columns: a right and a left column where the draggable plants live, and a center area that will be the actual glass-looking terrarium. By the end of this lesson, you will be able to see the plants in the columns, but the interface will look a little strange; don't worry, in the next section you will add CSS styles to the interface to make it look better. ### Task @@ -19,6 +19,14 @@ On your computer, create a folder called 'terrarium' and inside it, a file calle ![explorer in VS Code](images/vs-code-index.png) +Or + +Use these commands on your git bash: +* `mkdir terrarium` +* `cd terrarium` +* `touch index.html` +* `code index.html` or `nano index.html` + > index.html files indicate to a browser that it is the default file in a folder; URLs such as `https://anysite.com/test` might be built using a folder structure including a folder called `test` with `index.html` inside it; `index.html` doesn't have to show in a URL. --- @@ -29,7 +37,7 @@ The first line of an HTML file is its doctype. It's a little surprising that you > Tip: in VS Code, you can hover over a tag and get information about its use from the MDN Reference guides. -The second line should be the `` tag's opening tag, followed right now by its closing tag. These tags are the root elements of your interface. +The second line should be the `` tag's opening tag, followed right now by its closing tag ``. These tags are the root elements of your interface. ### Task @@ -46,7 +54,7 @@ Add these lines at the top of your `index.html` file: ## The document's 'head' -The 'head' area of the HTML document includes crucial information about your web page, also known as [metadata](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta). In our case, we tell the web server to which this page will be sent to be rendered four things: +The 'head' area of the HTML document includes crucial information about your web page, also known as [metadata](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta). In our case, we tell the web server to which this page will be sent to be rendered, these four things: - the page's title - page metadata including: @@ -159,7 +167,7 @@ Add those plant images into two columns between the `` tags: With this markup, the plants now show up on the screen. It looks pretty bad, because they aren't yet styled using CSS, and we'll do that in the next lesson. -Each image has an alt tag that will appear even if you can't see or render an image. This is an important element to include for accessibility. Learn more about accessibility in future lessons; for now, remember that it's important to enable screen readers to step through your web app so that visually impaired users can use your web site. +Each image has an alt tag that will appear even if you can't see or render an image. This is an important element to include for accessibility. Learn more about accessibility in future lessons; for now, remember that the alt attribute provides alternative information for an image if a user for some reason cannot view it (because of slow connection, an error in the src attribute, or if the user uses a screen reader). βœ… Did you notice that each image has the same alt tag? Is this good practice? Why or why not? Can you improve this code? @@ -220,4 +228,4 @@ Learn more about building sites for the web and mobile devices at [Microsoft Lea ## Assignment -[Practice your HTML: Build a blog mockup](3-terrarium/1-intro-to-html/assignment.md) +[Practice your HTML: Build a blog mockup](assignment.md) diff --git a/3-terrarium/2-intro-to-css/README.md b/3-terrarium/2-intro-to-css/README.md index 4ab3d07b..c6e25df7 100644 --- a/3-terrarium/2-intro-to-css/README.md +++ b/3-terrarium/2-intro-to-css/README.md @@ -260,4 +260,4 @@ CSS seems deceptively straightforward, but there are many challenges when trying ## Assignment -[CSS Refactoring](3-terrarium/2-intro-to-css/assignment.md) +[CSS Refactoring](assignment.md) diff --git a/3-terrarium/3-intro-to-DOM-and-closures/README.md b/3-terrarium/3-intro-to-DOM-and-closures/README.md index 5ba4e142..05ee7194 100644 --- a/3-terrarium/3-intro-to-DOM-and-closures/README.md +++ b/3-terrarium/3-intro-to-DOM-and-closures/README.md @@ -211,5 +211,5 @@ Always check browser capabilities using [CanIUse.com](https://caniuse.com/). ## Assignment -[Work a bit more with the DOM](3-terrarium/3-intro-to-DOM-and-closures/assignment.md) +[Work a bit more with the DOM](assignment.md) diff --git a/4-typing-game/typing-game/README.md b/4-typing-game/typing-game/README.md index 53977b2e..692669a6 100644 --- a/4-typing-game/typing-game/README.md +++ b/4-typing-game/typing-game/README.md @@ -333,4 +333,4 @@ Read up on [all the events available](https://developer.mozilla.org/en-US/docs/W ## Assignment -[Create a new keyboard game](4-typing-game/typing-game/assignment.md) +[Create a new keyboard game](assignment.md) diff --git a/4-typing-game/assignment.md b/4-typing-game/typing-game/assignment.md similarity index 100% rename from 4-typing-game/assignment.md rename to 4-typing-game/typing-game/assignment.md diff --git a/5-browser-extension/1-about-browsers/README.md b/5-browser-extension/1-about-browsers/README.md index 1c1e165a..f838eeb2 100644 --- a/5-browser-extension/1-about-browsers/README.md +++ b/5-browser-extension/1-about-browsers/README.md @@ -164,5 +164,5 @@ In this lesson you learned a little about the history of the web browser; take t ## Assignment -[Restyle your extension](5-browser-extension/1-about-browsers/assignment.md) +[Restyle your extension](assignment.md) diff --git a/5-browser-extension/2-forms-browsers-local-storage/README.md b/5-browser-extension/2-forms-browsers-local-storage/README.md index c9875fa7..5e75b983 100644 --- a/5-browser-extension/2-forms-browsers-local-storage/README.md +++ b/5-browser-extension/2-forms-browsers-local-storage/README.md @@ -218,5 +218,5 @@ You learned about LocalStorage and APIs in this lesson, both very useful for the ## Assignment -[Adopt an API](5-browser-extension/2-forms-browsers-local-storage/assignment.md) +[Adopt an API](assignment.md) diff --git a/5-browser-extension/3-background-tasks-and-performance/README.md b/5-browser-extension/3-background-tasks-and-performance/README.md index 881663c3..70553c09 100644 --- a/5-browser-extension/3-background-tasks-and-performance/README.md +++ b/5-browser-extension/3-background-tasks-and-performance/README.md @@ -157,5 +157,5 @@ Investigate some of the ways that browsers gauge web performance by looking thro ## Assignment -[Analyze a site for performance](5-browser-extension/3-background-tasks-and-performance/assignment.md) +[Analyze a site for performance](assignment.md) diff --git a/6-space-game/1-introduction/README.md b/6-space-game/1-introduction/README.md index beb646e4..ed67aee1 100644 --- a/6-space-game/1-introduction/README.md +++ b/6-space-game/1-introduction/README.md @@ -221,4 +221,4 @@ Learn more about Pub/Sub by [reading about it](https://docs.microsoft.com/en-us/ ## Assignment -[Mock up a game](/6-space-game/1-introduction/assignment.md) +[Mock up a game](assignment.md) diff --git a/6-space-game/2-drawing-to-canvas/README.md b/6-space-game/2-drawing-to-canvas/README.md index 2deb703a..015922e1 100644 --- a/6-space-game/2-drawing-to-canvas/README.md +++ b/6-space-game/2-drawing-to-canvas/README.md @@ -213,4 +213,4 @@ Learn more about the Canvas API by [reading about it](https://developer.mozilla. ## Assignment -[Play with the Canvas API](/6-space-game/2-drawing-to-canvas/assignment.md) \ No newline at end of file +[Play with the Canvas API](assignment.md) \ No newline at end of file diff --git a/6-space-game/3-moving-elements-around/README.md b/6-space-game/3-moving-elements-around/README.md index abe3e873..6decf3ea 100644 --- a/6-space-game/3-moving-elements-around/README.md +++ b/6-space-game/3-moving-elements-around/README.md @@ -385,4 +385,4 @@ While we're writing our game without using frameworks, there are many JavaScript ## Assignment -[Comment your code](/6-space-game/3-moving-elements-around/assignment.md) +[Comment your code](assignment.md) diff --git a/6-space-game/4-collision-detection/README.md b/6-space-game/4-collision-detection/README.md index b8068064..6431bfeb 100644 --- a/6-space-game/4-collision-detection/README.md +++ b/6-space-game/4-collision-detection/README.md @@ -294,4 +294,4 @@ Experiment with the intervals in your game thus far. What happens when you chang ## Assignment -[Explore collisions](/6-space-game/4-collision-detection/assignment.md) +[Explore collisions](assignment.md) diff --git a/6-space-game/5-keeping-score/README.md b/6-space-game/5-keeping-score/README.md index 6610df96..32a671e5 100644 --- a/6-space-game/5-keeping-score/README.md +++ b/6-space-game/5-keeping-score/README.md @@ -186,4 +186,4 @@ Research some ways that you can increment and decrement game scores and lives. T ## Assignment -[Build a Scoring Game](/6-space-game/5-keeping-score/assignment.md) +[Build a Scoring Game](assignment.md) diff --git a/6-space-game/6-end-condition/README.md b/6-space-game/6-end-condition/README.md index 1e0ef56d..4698d7be 100644 --- a/6-space-game/6-end-condition/README.md +++ b/6-space-game/6-end-condition/README.md @@ -219,4 +219,4 @@ Your assignment is to create a fresh sample game, so explore some of the interes ## Assignment -[Build a Sample Game](/6-space-game/6-end-condition/assignment.md) +[Build a Sample Game](assignment.md) diff --git a/6-space-game/README.md b/6-space-game/README.md index c6ae53c8..aa4f5be8 100644 --- a/6-space-game/README.md +++ b/6-space-game/README.md @@ -25,3 +25,7 @@ In these six lessons you will learn the following: - [Keeping score](5-keeping-score/README.md) - [Ending and restarting the game](6-end-condition/README.md) +## Credits + +The assets used for this came from https://www.kenney.nl/. +If you are into building games, these are some seriously good assets, a lot is free and some are paid. diff --git a/7-bank-project/1-template-route/README.md b/7-bank-project/1-template-route/README.md index 54f3b018..250f3678 100644 --- a/7-bank-project/1-template-route/README.md +++ b/7-bank-project/1-template-route/README.md @@ -292,4 +292,4 @@ Routing is one of the surprisingly tricky parts of web development, especially a ## Assignment -[Improve the routing](/7-bank-project/1-template-route/assignment.md) +[Improve the routing](assignment.md) diff --git a/7-bank-project/2-forms/README.md b/7-bank-project/2-forms/README.md index 32c5100e..9547dd4a 100644 --- a/7-bank-project/2-forms/README.md +++ b/7-bank-project/2-forms/README.md @@ -287,4 +287,4 @@ Developers have gotten very creative about their form building efforts, especial ## Assignment -[Style your bank app](/7-bank-project/2-forms/assignment.md) +[Style your bank app](assignment.md) diff --git a/7-bank-project/3-data/README.md b/7-bank-project/3-data/README.md index e8a91bc3..df44e7e8 100644 --- a/7-bank-project/3-data/README.md +++ b/7-bank-project/3-data/README.md @@ -323,4 +323,4 @@ Here's an example of a styled dashboard page: ## Assignment -[Refactor and comment your code](/7-bank-project/3-data/assignment.md) +[Refactor and comment your code](assignment.md) diff --git a/7-bank-project/4-state-management/README.md b/7-bank-project/4-state-management/README.md index 09e94343..1826596f 100644 --- a/7-bank-project/4-state-management/README.md +++ b/7-bank-project/4-state-management/README.md @@ -274,7 +274,7 @@ Try working together to change what is saved and loaded from `localStorage` to o ## Assignment -[Implement "Add transaction" dialog](/7-bank-project/4-state-management/assignment.md) +[Implement "Add transaction" dialog](assignment.md) Here's an example result after completing the assignment: diff --git a/index.html b/index.html index 742ba714..00d5eeeb 100644 --- a/index.html +++ b/index.html @@ -8,8 +8,6 @@ - -