From 895b39eaf81960b504cd95fd03600df6b8e6187c Mon Sep 17 00:00:00 2001 From: Shahrooz Alimoradi <33348237+shahroozme@users.noreply.github.com> Date: Thu, 29 Nov 2018 11:13:15 +0330 Subject: [PATCH 01/74] Removed space --- 06 - Type Ahead/index-START.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/06 - Type Ahead/index-START.html b/06 - Type Ahead/index-START.html index 1436886918..109c90fb36 100644 --- a/06 - Type Ahead/index-START.html +++ b/06 - Type Ahead/index-START.html @@ -18,5 +18,5 @@ const endpoint = 'https://gist.githubusercontent.com/Miserlou/c5cd8364bf9b2420bb29/raw/2bf258763cdddd704f8ffd3ea9a3e81d25e2c6f6/cities.json'; - + From da693dfc3656e1f3eb3ab5a165e655f7dd18c397 Mon Sep 17 00:00:00 2001 From: Shahrooz Alimoradi <33348237+shahroozme@users.noreply.github.com> Date: Thu, 29 Nov 2018 11:30:50 +0330 Subject: [PATCH 02/74] Removed spaces --- 06 - Type Ahead/style.css | 128 +++++++++++++++++++------------------- 1 file changed, 64 insertions(+), 64 deletions(-) diff --git a/06 - Type Ahead/style.css b/06 - Type Ahead/style.css index 5203de42a4..0c8c74e01b 100644 --- a/06 - Type Ahead/style.css +++ b/06 - Type Ahead/style.css @@ -1,74 +1,74 @@ - html { - box-sizing: border-box; - background: #ffc600; - font-family: 'helvetica neue'; - font-size: 20px; - font-weight: 200; - } +html { + box-sizing: border-box; + background: #ffc600; + font-family: 'helvetica neue'; + font-size: 20px; + font-weight: 200; +} - *, *:before, *:after { - box-sizing: inherit; - } +*, *:before, *:after { + box-sizing: inherit; +} - input { - width: 100%; - padding: 20px; - } +input { + width: 100%; + padding: 20px; +} - .search-form { - max-width: 400px; - margin: 50px auto; - } +.search-form { + max-width: 400px; + margin: 50px auto; +} - input.search { - margin: 0; - text-align: center; - outline: 0; - border: 10px solid #F7F7F7; - width: 120%; - left: -10%; - position: relative; - top: 10px; - z-index: 2; - border-radius: 5px; - font-size: 40px; - box-shadow: 0 0 5px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.19); - } +input.search { + margin: 0; + text-align: center; + outline: 0; + border: 10px solid #F7F7F7; + width: 120%; + left: -10%; + position: relative; + top: 10px; + z-index: 2; + border-radius: 5px; + font-size: 40px; + box-shadow: 0 0 5px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.19); +} - .suggestions { - margin: 0; - padding: 0; - position: relative; - /*perspective: 20px;*/ - } +.suggestions { + margin: 0; + padding: 0; + position: relative; + /*perspective: 20px;*/ +} - .suggestions li { - background: white; - list-style: none; - border-bottom: 1px solid #D8D8D8; - box-shadow: 0 0 10px rgba(0, 0, 0, 0.14); - margin: 0; - padding: 20px; - transition: background 0.2s; - display: flex; - justify-content: space-between; - text-transform: capitalize; - } +.suggestions li { + background: white; + list-style: none; + border-bottom: 1px solid #D8D8D8; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.14); + margin: 0; + padding: 20px; + transition: background 0.2s; + display: flex; + justify-content: space-between; + text-transform: capitalize; +} - .suggestions li:nth-child(even) { - transform: perspective(100px) rotateX(3deg) translateY(2px) scale(1.001); - background: linear-gradient(to bottom, #ffffff 0%,#EFEFEF 100%); - } +.suggestions li:nth-child(even) { + transform: perspective(100px) rotateX(3deg) translateY(2px) scale(1.001); + background: linear-gradient(to bottom, #ffffff 0%,#EFEFEF 100%); +} - .suggestions li:nth-child(odd) { - transform: perspective(100px) rotateX(-3deg) translateY(3px); - background: linear-gradient(to top, #ffffff 0%,#EFEFEF 100%); - } +.suggestions li:nth-child(odd) { + transform: perspective(100px) rotateX(-3deg) translateY(3px); + background: linear-gradient(to top, #ffffff 0%,#EFEFEF 100%); +} - span.population { - font-size: 15px; - } +span.population { + font-size: 15px; +} - .hl { - background: #ffc600; - } +.hl { + background: #ffc600; +} From 944331acb044bb585ec4d04f340977719e9a85b9 Mon Sep 17 00:00:00 2001 From: Magda Date: Mon, 10 Dec 2018 16:31:55 +0100 Subject: [PATCH 03/74] Fix typo in index-START.html --- 10 - Hold Shift and Check Checkboxes/index-START.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/10 - Hold Shift and Check Checkboxes/index-START.html b/10 - Hold Shift and Check Checkboxes/index-START.html index 5560058f18..4fd2936ddc 100644 --- a/10 - Hold Shift and Check Checkboxes/index-START.html +++ b/10 - Hold Shift and Check Checkboxes/index-START.html @@ -75,7 +75,7 @@
-

Everything inbetween should also be set to checked

+

Everything in between should also be set to checked

From 5f04b4a2df6562feaaa7fae00c73d6a541199223 Mon Sep 17 00:00:00 2001 From: Magda Date: Mon, 10 Dec 2018 16:49:00 +0100 Subject: [PATCH 04/74] Fix typos on index-FINISHED.html --- 10 - Hold Shift and Check Checkboxes/index-FINISHED.html | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/10 - Hold Shift and Check Checkboxes/index-FINISHED.html b/10 - Hold Shift and Check Checkboxes/index-FINISHED.html index f2a4a78e43..d967b249cd 100644 --- a/10 - Hold Shift and Check Checkboxes/index-FINISHED.html +++ b/10 - Hold Shift and Check Checkboxes/index-FINISHED.html @@ -54,7 +54,7 @@
@@ -76,7 +76,7 @@
-

Everything inbetween should also be set to checked

+

Everything in between should also be set to checked

@@ -112,7 +112,7 @@ console.log(checkbox); if (checkbox === this || checkbox === lastChecked) { inBetween = !inBetween; - console.log('Starting to check them inbetween!'); + console.log('Starting to check them in between!'); } if (inBetween) { From 14927a4c3f358a3f81f9afdb7d8d0be2ce7052b0 Mon Sep 17 00:00:00 2001 From: Shahrooz Alimoradi <33348237+shahroozme@users.noreply.github.com> Date: Thu, 20 Dec 2018 15:02:22 +0330 Subject: [PATCH 05/74] Removed spaces --- 15 - LocalStorage/style.css | 135 ++++++++++++++++++------------------ 1 file changed, 67 insertions(+), 68 deletions(-) diff --git a/15 - LocalStorage/style.css b/15 - LocalStorage/style.css index 2ecadadc37..a717a07b88 100644 --- a/15 - LocalStorage/style.css +++ b/15 - LocalStorage/style.css @@ -1,80 +1,79 @@ +html { + box-sizing: border-box; + background: url('http://wes.io/hx9M/oh-la-la.jpg') center no-repeat; + background-size: cover; + min-height: 100vh; + display: flex; + justify-content: center; + align-items: center; + text-align: center; + font-family: Futura,"Trebuchet MS",Arial,sans-serif; +} - html { - box-sizing: border-box; - background: url('http://wes.io/hx9M/oh-la-la.jpg') center no-repeat; - background-size: cover; - min-height: 100vh; - display: flex; - justify-content: center; - align-items: center; - text-align: center; - font-family: Futura,"Trebuchet MS",Arial,sans-serif; - } +*, *:before, *:after { + box-sizing: inherit; +} - *, *:before, *:after { - box-sizing: inherit; - } +svg { + fill:white; + background: rgba(0,0,0,0.1); + padding: 20px; + border-radius: 50%; + width: 200px; + margin-bottom: 50px; +} - svg { - fill:white; - background: rgba(0,0,0,0.1); - padding: 20px; - border-radius: 50%; - width: 200px; - margin-bottom: 50px; - } +.wrapper { + padding: 20px; + max-width: 350px; + background: rgba(255,255,255,0.95); + box-shadow: 0 0 0 10px rgba(0,0,0,0.1); +} - .wrapper { - padding: 20px; - max-width: 350px; - background: rgba(255,255,255,0.95); - box-shadow: 0 0 0 10px rgba(0,0,0,0.1); - } +h2 { + text-align: center; + margin: 0; + font-weight: 200; +} - h2 { - text-align: center; - margin: 0; - font-weight: 200; - } +.plates { + margin: 0; + padding: 0; + text-align: left; + list-style: none; +} - .plates { - margin: 0; - padding: 0; - text-align: left; - list-style: none; - } +.plates li { + border-bottom: 1px solid rgba(0,0,0,0.2); + padding: 10px 0; + font-weight: 100; + display: flex; +} - .plates li { - border-bottom: 1px solid rgba(0,0,0,0.2); - padding: 10px 0; - font-weight: 100; - display: flex; - } +.plates label { + flex: 1; + cursor: pointer; +} - .plates label { - flex: 1; - cursor: pointer; - } +.plates input { + display: none; +} - .plates input { - display: none; - } +.plates input + label:before { + content: '⬜️'; + margin-right: 10px; +} - .plates input + label:before { - content: '⬜️'; - margin-right: 10px; - } +.plates input:checked + label:before { + content: '🌮'; +} - .plates input:checked + label:before { - content: '🌮'; - } +.add-items { + margin-top: 20px; +} - .add-items { - margin-top: 20px; - } - - .add-items input { - padding: 10px; - outline: 0; - border: 1px solid rgba(0,0,0,0.1); - } +.add-items input { + padding: 10px; + outline: 0; + border: 1px solid rgba(0,0,0,0.1); +} From 954382b93f005eb8eabbc30d225607d224419ae4 Mon Sep 17 00:00:00 2001 From: Magda Date: Thu, 3 Jan 2019 15:48:32 +0100 Subject: [PATCH 06/74] Fix typo --- 19 - Webcam Fun/scripts-FINISHED.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/19 - Webcam Fun/scripts-FINISHED.js b/19 - Webcam Fun/scripts-FINISHED.js index 9bb602d4e6..df07fa123a 100755 --- a/19 - Webcam Fun/scripts-FINISHED.js +++ b/19 - Webcam Fun/scripts-FINISHED.js @@ -57,7 +57,7 @@ function takePhoto() { link.href = data; link.setAttribute('download', 'handsome'); link.innerHTML = `Handsome Man`; - strip.insertBefore(link, strip.firsChild); + strip.insertBefore(link, strip.firstChild); } function redEffect(pixels) { From b12be384889bc2fda7d753453012a201f550b177 Mon Sep 17 00:00:00 2001 From: Valentin Ionita <33692650+vanntile@users.noreply.github.com> Date: Tue, 12 Feb 2019 12:55:37 +0200 Subject: [PATCH 07/74] VannTile's JavaScript30 implementation --- readme.md | 1 + 1 file changed, 1 insertion(+) diff --git a/readme.md b/readme.md index 17e54a1c95..0c56bf8f4b 100644 --- a/readme.md +++ b/readme.md @@ -41,6 +41,7 @@ Feel free to submit a PR adding a link to your own recaps, guides or reviews! * [Herminio Torres](https://github.com/herminiotorres/JavaScript30) lessons and tricks learned, and a [gh-page](https://herminiotorres.github.io/JavaScript30/) to see working all the mini-projects. * [Dmytro Borysovskyi](https://github.com/dimabory) says many thanks to for the course to Wes 🤝 It was incredible challenge 👌 The full repository with code available [here](https://github.com/dimabory/dimabory.github.io/tree/gh-pages/src/components/JavaScript30Days) and demos can be reached by the link to [gh-pages](https://dimabory.github.io/#/js30days) 👍👍👍 * [Kizito](https://github.com/akhilome/)'s follow along [repo](https://github.com/akhilome/js30) with [completed challenges](https://akhilome.github.io/js30) and [notes](https://akhilome.github.io/js30/notes). +* [VannTile](https://github.com/vanntile)'s [repository](https://github.com/vanntile/JavaScript30) and [GitHub Pages showcase](https://vanntile.github.io/JavaScript30/). Thank you for a great ⌨️ experience. ## Alternative Implementations From ee4c2ab87f03487742005a085d32ed84c0913a1a Mon Sep 17 00:00:00 2001 From: Ian MacIntosh Date: Wed, 20 Feb 2019 23:10:24 -0500 Subject: [PATCH 08/74] =?UTF-8?q?=F0=9F=95=B5=F0=9F=8F=BB=E2=80=8D?= =?UTF-8?q?=E2=99=82=EF=B8=8F=20Make=20Exercise=2016=20filenames=20consist?= =?UTF-8?q?ent?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit All the other exercises have the index file named as "index-START.html" and "index-FINISHED.html" Making this exercise's filenames consistent with the rest --- .../{index-finished.html => index-FINISHED.html} | 0 16 - Mouse Move Shadow/{index-start.html => index-START.html} | 0 2 files changed, 0 insertions(+), 0 deletions(-) rename 16 - Mouse Move Shadow/{index-finished.html => index-FINISHED.html} (100%) rename 16 - Mouse Move Shadow/{index-start.html => index-START.html} (100%) diff --git a/16 - Mouse Move Shadow/index-finished.html b/16 - Mouse Move Shadow/index-FINISHED.html similarity index 100% rename from 16 - Mouse Move Shadow/index-finished.html rename to 16 - Mouse Move Shadow/index-FINISHED.html diff --git a/16 - Mouse Move Shadow/index-start.html b/16 - Mouse Move Shadow/index-START.html similarity index 100% rename from 16 - Mouse Move Shadow/index-start.html rename to 16 - Mouse Move Shadow/index-START.html From 23ad2c8ccf5a6236cf267c039a6d667cff715e80 Mon Sep 17 00:00:00 2001 From: Seth Lewis Date: Thu, 13 Jun 2019 17:12:15 -0500 Subject: [PATCH 09/74] removed 0 from end of backgroundimage url in day2 --- 02 - JS and CSS Clock/index-START.html | 27 ++++++++++++++------------ 1 file changed, 15 insertions(+), 12 deletions(-) diff --git a/02 - JS and CSS Clock/index-START.html b/02 - JS and CSS Clock/index-START.html index 7cbf5f6ba6..1b852a823e 100644 --- a/02 - JS and CSS Clock/index-START.html +++ b/02 - JS and CSS Clock/index-START.html @@ -1,24 +1,26 @@ + JS + CSS Clock + -
-
-
-
-
-
+
+
+
+
+
+
- + + \ No newline at end of file From e26a1959dbcfede3226f8ce2994bcda7e1f9a9f4 Mon Sep 17 00:00:00 2001 From: Seth Lewis Date: Thu, 13 Jun 2019 17:18:29 -0500 Subject: [PATCH 10/74] removed my workspaces formatting and dropped 0 from background image url on day2 --- 02 - JS and CSS Clock/index-START.html | 25 +++++++++++-------------- 1 file changed, 11 insertions(+), 14 deletions(-) diff --git a/02 - JS and CSS Clock/index-START.html b/02 - JS and CSS Clock/index-START.html index 1b852a823e..12f721b183 100644 --- a/02 - JS and CSS Clock/index-START.html +++ b/02 - JS and CSS Clock/index-START.html @@ -1,21 +1,19 @@ - JS + CSS Clock - -
-
-
-
-
+
+
+
+
+
+
-
- - \ No newline at end of file + From d2114a96cc0ff1ac35afe1f14648cfeb863af102 Mon Sep 17 00:00:00 2001 From: Palash Mondal Date: Fri, 14 Jun 2019 09:11:49 +0530 Subject: [PATCH 11/74] Fix background image url --- 02 - JS and CSS Clock/index-FINISHED.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/02 - JS and CSS Clock/index-FINISHED.html b/02 - JS and CSS Clock/index-FINISHED.html index 7449fc52f5..efe3912bf2 100644 --- a/02 - JS and CSS Clock/index-FINISHED.html +++ b/02 - JS and CSS Clock/index-FINISHED.html @@ -18,7 +18,7 @@ - From 64ff97930ab4007953abb55cde73a8e5ca1d8224 Mon Sep 17 00:00:00 2001 From: Hsin-tingCHI Date: Mon, 9 Jan 2023 13:42:18 +0100 Subject: [PATCH 61/74] Update README.md --- readme.md | 1 + 1 file changed, 1 insertion(+) diff --git a/readme.md b/readme.md index 7237a323f5..74d31cc120 100644 --- a/readme.md +++ b/readme.md @@ -53,6 +53,7 @@ Feel free to submit a PR adding a link to your own recaps, guides or reviews! * [filipkowal](https://github.com/filipkowal/JS30-05-Flex-Panels-Deactivate) Fix to flex panels (5th day) so the panels deactivate when clicked on another one. * [Mo. Saif's](https://github.com/MoSaif00)note on lessons learned and a [gh-pages showcase](https://mosaif00.github.io/30-Days-JavaScript-Challenge/) for the projects. * [Stiaannel's](https://stiaannel.co.za/my-projects/javascript30) implementation of the Javascript30 challenge, with small design changes and a couple of extra features. +* [Kelly CHI's](https://kellychi22.github.io/JavaScript30/) complete JavaScript30 challenges! Click the links to check demos and notes of each challenge. 🇹🇼 🌟 ## Alternative Implementations Here are some links of people who have done the tutorials, but in a different language or framework: From 6ad1c023355e518eeea52e330cd5b5901a9de90e Mon Sep 17 00:00:00 2001 From: Piyush <118425491+piyush280599@users.noreply.github.com> Date: Mon, 16 Jan 2023 12:41:59 +0530 Subject: [PATCH 62/74] Update readme.md --- readme.md | 32 ++++++++++++++++---------------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/readme.md b/readme.md index 74d31cc120..b27738c126 100644 --- a/readme.md +++ b/readme.md @@ -10,13 +10,13 @@ Grab the course at [https://JavaScript30.com](https://JavaScript30.com) Feel free to submit a PR adding a link to your own recaps, guides or reviews! -* [Arjun Khode’s blog](http://thesagittariusme.blogspot.com/search/label/JS30) about summaries for each day, including fixed glitches, bugs and extra features -* [Nitish Dayal's Text Guides](https://github.com/nitishdayal/JavaScript30) are great for those who like reading over watching -* [Thorsten Frommen](https://tfrommen.de/tag/javascript-30/) shares how he solved the exercises before viewing the answers +* [Arjun Khode’s blog](http://thesagittariusme.blogspot.com/search/label/JS30) about summaries for each day, including fixed glitches, bugs and extra features. +* [Nitish Dayal's Text Guides](https://github.com/nitishdayal/JavaScript30) are great for those who like reading over watching. +* [Thorsten Frommen](https://tfrommen.de/tag/javascript-30/) shares how he solved the exercises before viewing the answers. * [Soyaine 写的中文指南](https://github.com/soyaine/JavaScript30)包含了过程记录和难点解释 -* [Ayo Isaiah's](https://freshman.tech/archive/#javascript30) Recaps and Lessons Learned -* [Adriana Rios](https://stpcollabr8nlstn.github.io/JavaScript30/) shares her alternative solutions -* [Michael Einsohn](http://30daysofjs.michaeleinsohn.com) publishes each challenge after watching the video once +* [Ayo Isaiah's](https://freshman.tech/archive/#javascript30) Recaps and Lessons Learned. +* [Adriana Rios](https://stpcollabr8nlstn.github.io/JavaScript30/) shares her alternative solutions. +* [Michael Einsohn](http://30daysofjs.michaeleinsohn.com) publishes each challenge after watching the video once. * [Mike Ekkel](https://medium.com/@mike_ekkel/javascript-30-a-30-day-vanilla-js-challenge-6a733fc9f62c#.9frjtaje9) * [Yusef Habib](https://github.com/yhabib/JavaScript30) lessons and tricks learned, and a [gh-page](https://yhabib.github.io/JavaScript30/) to see working all the mini-projects. * [Amelie Yeh](https://github.com/amelieyeh/JS30) 30 lessons notes with things I've learned, and those important recaps. and directly view my demos [here](https://amelieyeh.github.io/JS30/) 🇹🇼😄 @@ -24,20 +24,20 @@ Feel free to submit a PR adding a link to your own recaps, guides or reviews! * [Rayhatron](https://rayhatron.github.io/blog/) - walkthroughs, recaps and lessons learned. * [Andrei Dobra](https://github.com/andreidbr/JS30) Full repo with lessons learned and a [gh-page](https://andreidbr.github.io/JS30/) with all the exercises. * [从零到壹全栈部落](https://github.com/liyuechun/JavaScript30-liyuechun),春哥发起的从零到壹全栈部落,旨在带领大家一起学习,一起输出,文档化,代码化,中文视频化,全栈部落口号:输出是最好的学习方式。 -* [Usmaan Ali's](https://github.com/usyyy/javascript/blob/master/JavaScript30/analysis.md) summary of the technical skills learned from each project. He's also posting them as separate blog posts [here](https://medium.com/@usyyy) +* [Usmaan Ali's](https://github.com/usyyy/javascript/blob/master/JavaScript30/analysis.md) summary of the technical skills learned from each project. He's also posting them as separate blog posts [here](https://medium.com/@usyyy). * [Axel](https://github.com/afuh/js30)'s lessons learned and a [showcase](https://afuh.github.io/js30/) with the projects. * [Chris](https://github.com/dwatow/JavaScript30) 中文實戰,目標描述、過程紀錄。 * [Muhammad D. Ramadhan's](https://miayam.github.io) blog. He shamlesly mixed his personal life with 30 day JavaScript challenge so as to increase his learning retention. He also summarised the challenge on [one single page](https://miayam.github.io/js30). Do not read his blog! * [Lee Keitel's Blog](https://blog.keitel.xyz/categories/javascript30/) includes summaries of each lesson, what I learned from each one, and my thoughts about the topic taught and using them in the future. * [Dustin Hsiao](https://github.com/dustinhsiao21/Javascript30-dustin) 包含了各篇介紹、 效果Demo、各篇詳解及記錄過程,附上部分延伸閱讀及[gh-page](https://dustinhsiao21.github.io/Javascript30-dustin/)。 * [GuaHsu](https://github.com/guahsu/JavaScript30) - 紀錄各篇練習過程與心得,並嘗試擴充部分練習,也做了一個包含全部練習的[介紹站](http://guahsu.io/JavaScript30/)🇹🇼 -* [Daniela](https://github.com/misslild)'s completed challenges on [GitHub Pages](https://misslild.github.io/WesBos-30day-Coding-challenge/) and [Codepen](https://codepen.io/collection/DapZeP/) :raised_hands: :muscle: :+1: -* [Dmitrii Pashutskii's](https://github.com/guar47) code of all challenges on [GitHub with Pages](https://github.com/guar47/javascript30Summary) and review [blog posts](https://blog.dpashutskii.com/tag/javascript30/) +* [Daniela](https://github.com/misslild)'s completed challenges on [GitHub Pages](https://misslild.github.io/WesBos-30day-Coding-challenge/) and [Codepen].(https://codepen.io/collection/DapZeP/) :raised_hands: :muscle: :+1: +* [Dmitrii Pashutskii's](https://github.com/guar47) code of all challenges on [GitHub with Pages](https://github.com/guar47/javascript30Summary) and review [blog posts](https://blog.dpashutskii.com/tag/javascript30/). * [Abid Hasan's](https://github.com/sabidhasan/javascript-30) completion of all challenges. This was awesome!! Learned so much! :+1: -* [Yusong Notes](https://sky172839465.github.io/course/js30) Records Yusong JS 30 days note and demo :star2: -* [Ding's Implementation](https://github.com/Ding-Fan/javascript30) code and online demo +* [Yusong Notes](https://sky172839465.github.io/course/js30) Records Yusong JS 30 days note and demo. :star2: +* [Ding's Implementation](https://github.com/Ding-Fan/javascript30) code and online demo. * [Herminio Torres](https://github.com/herminiotorres/JavaScript30) lessons and tricks learned, and a [gh-page](https://herminiotorres.github.io/JavaScript30/) to see working all the mini-projects. -* [Dmytro Borysovskyi](https://github.com/dimabory) says many thanks to for the course to Wes 🤝 It was incredible challenge 👌 The full repository with code available [here](https://github.com/dimabory/dimabory.github.io/tree/gh-pages/src/components/JavaScript30Days) and demos can be reached by the link to [gh-pages](https://dimabory.github.io/#/js30days) 👍👍👍 +* [Dmytro Borysovskyi](https://github.com/dimabory) says many thanks to for the course to Wes 🤝 It was incredible challenge 👌 The full repository with code available [here](https://github.com/dimabory/dimabory.github.io/tree/gh-pages/src/components/JavaScript30Days) and demos can be reached by the link to [gh-pages](https://dimabory.github.io/#/js30days).👍👍👍 * [Kizito](https://github.com/akhilome/)'s follow along [repo](https://github.com/akhilome/js30) with [completed challenges](https://akhilome.github.io/js30) and [notes](https://akhilome.github.io/js30/notes). * [VannTile](https://github.com/vanntile)'s [repository](https://github.com/vanntile/JavaScript30) and [GitHub Pages showcase](https://vanntile.github.io/JavaScript30/). Thank you for a great ⌨️ experience. * [Alex Kim](https://github.com/Alex-K1m/js30-challenge) completed all the challenges. You can check them out at [github pages](https://alex-k1m.github.io/js30-challenge/). @@ -58,13 +58,13 @@ Feel free to submit a PR adding a link to your own recaps, guides or reviews! ## Alternative Implementations Here are some links of people who have done the tutorials, but in a different language or framework: -* [Thomas Mattacchione](https://github.com/tkjone/clojurescript-30) JavaScript 30 written in ClojureScript +* [Thomas Mattacchione](https://github.com/tkjone/clojurescript-30) JavaScript 30 written in ClojureScript. * [Dave Follett's](https://github.com/davefollett) blog series, [A New Vue on #JavaScript30](https://davefollett.io/categories/a-new-vue-on-javascript30/), where he explores re-implementing #JavaScript30 projects using [Vue](https://vuejs.org). -* [Akinjide Bankole](https://github.com/akinjide/JS30days) used Node.js with [Jade](http://jadelang.net) to solve the exercises +* [Akinjide Bankole](https://github.com/akinjide/JS30days) used Node.js with [Jade](http://jadelang.net) to solve the exercises. * [Adrien Poly](https://github.com/adrienpoly/javascript30-stimulus) a modest attempt to convert Drum Kit, Video Player, Local Tapas, TypeHead to [Stimulus JS](https://stimulusjs.org/) framework in a Rails App. -* [Bogdan Lazar](https://github.com/tricinel/TypeScript30) all the JavaScript 30 written in [TypeScript](https://www.typescriptlang.org/) +* [Bogdan Lazar](https://github.com/tricinel/TypeScript30) all the JavaScript 30 written in [TypeScript](https://www.typescriptlang.org/). * [Will Wager](https://github.com/wwags33/JavaScript30) another [TypeScript](https://www.typescriptlang.org/) implementation! -* [marcoSven](https://github.com/marcoSven) solution suggestion for [10 - Hold Shift and Check Checkboxes](https://github.com/marcoSven/JavaScript30/blob/master/10%20-%20Hold%20Shift%20and%20Check%20Checkboxes/index-FINISHED.html) +* [marcoSven](https://github.com/marcoSven) solution suggestion for [10 - Hold Shift and Check Checkboxes](https://github.com/marcoSven/JavaScript30/blob/master/10%20-%20Hold%20Shift%20and%20Check%20Checkboxes/index-FINISHED.html). * [ALMaclaine](https://github.com/almaclaine) Javascript 30 written in [Dart 2.0](https://github.com/ALMaclaine/Dart30). * [Connie Leung](https://github.com/railsstudent) Javascript 30 written in [Angular and RxJS](https://github.com/railsstudent/ng-rxjs-30). From 5547fc057b46b2fa2f6354e757a52cdcee0d4c07 Mon Sep 17 00:00:00 2001 From: Wes Bos Date: Fri, 27 Jan 2023 16:12:10 -0500 Subject: [PATCH 63/74] Add favicons to projects as favicon.ico errors were throwing learners --- 01 - JavaScript Drum Kit/index-FINISHED.html | 1 + 01 - JavaScript Drum Kit/index-START.html | 1 + 02 - JS and CSS Clock/index-FINISHED.html | 1 + 02 - JS and CSS Clock/index-START.html | 1 + 03 - CSS Variables/index-FINISHED.html | 1 + 03 - CSS Variables/index-START.html | 1 + 04 - Array Cardio Day 1/index-FINISHED.html | 1 + 04 - Array Cardio Day 1/index-START.html | 1 + 05 - Flex Panel Gallery/index-FINISHED.html | 9 +++++---- 05 - Flex Panel Gallery/index-START.html | 7 ++++--- 06 - Type Ahead/index-FINISHED.html | 1 + 06 - Type Ahead/index-START.html | 1 + 07 - Array Cardio Day 2/index-FINISHED.html | 1 + 07 - Array Cardio Day 2/index-START.html | 1 + 08 - Fun with HTML5 Canvas/index-FINISHED.html | 1 + 08 - Fun with HTML5 Canvas/index-START.html | 1 + 09 - Dev Tools Domination/index-FINISHED.html | 1 + 09 - Dev Tools Domination/index-START.html | 1 + 10 - Hold Shift and Check Checkboxes/index-FINISHED.html | 1 + 10 - Hold Shift and Check Checkboxes/index-START.html | 1 + 11 - Custom Video Player/index.html | 1 + 12 - Key Sequence Detection/index-FINISHED.html | 1 + 12 - Key Sequence Detection/index-START.html | 1 + 13 - Slide in on Scroll/index-FINISHED.html | 7 ++++--- 13 - Slide in on Scroll/index-START.html | 7 ++++--- .../index-FINISHED.html | 1 + 14 - JavaScript References VS Copying/index-START.html | 1 + 15 - LocalStorage/index-FINISHED.html | 1 + 15 - LocalStorage/index-START.html | 1 + 16 - Mouse Move Shadow/index-FINISHED.html | 1 + 16 - Mouse Move Shadow/index-START.html | 1 + 17 - Sort Without Articles/index-FINISHED.html | 5 +++-- 17 - Sort Without Articles/index-START.html | 5 +++-- 18 - Adding Up Times with Reduce/index-FINISHED.html | 1 + 18 - Adding Up Times with Reduce/index-START.html | 1 + 19 - Webcam Fun/index.html | 1 + 20 - Speech Detection/index-FINISHED.html | 5 +++-- 20 - Speech Detection/index-START.html | 3 ++- 21 - Geolocation/index-FINISHED.html | 3 ++- 21 - Geolocation/index-START.html | 3 ++- 22 - Follow Along Link Highlighter/index-FINISHED.html | 1 + 22 - Follow Along Link Highlighter/index-START.html | 1 + 23 - Speech Synthesis/index-FINISHED.html | 1 + 23 - Speech Synthesis/index-START.html | 1 + 24 - Sticky Nav/index-FINISHED.html | 1 + 24 - Sticky Nav/index-START.html | 1 + .../index-FINISHED.html | 7 ++++--- .../index-START.html | 7 ++++--- 26 - Stripe Follow Along Nav/index-FINISHED.html | 7 ++++--- 26 - Stripe Follow Along Nav/index-START.html | 7 ++++--- 27 - Click and Drag/index-FINISHED.html | 1 + 27 - Click and Drag/index-START.html | 1 + 28 - Video Speed Controller/index-FINISHED.html | 1 + 28 - Video Speed Controller/index-START.html | 1 + 29 - Countdown Timer/index.html | 1 + 30 - Whack A Mole/index-FINISHED.html | 1 + 30 - Whack A Mole/index-START.html | 1 + 57 files changed, 91 insertions(+), 34 deletions(-) diff --git a/01 - JavaScript Drum Kit/index-FINISHED.html b/01 - JavaScript Drum Kit/index-FINISHED.html index 1a16d0997c..7dd9d9cb6a 100644 --- a/01 - JavaScript Drum Kit/index-FINISHED.html +++ b/01 - JavaScript Drum Kit/index-FINISHED.html @@ -4,6 +4,7 @@ JS Drum Kit + diff --git a/01 - JavaScript Drum Kit/index-START.html b/01 - JavaScript Drum Kit/index-START.html index 4070d32767..8a2f8e8417 100644 --- a/01 - JavaScript Drum Kit/index-START.html +++ b/01 - JavaScript Drum Kit/index-START.html @@ -4,6 +4,7 @@ JS Drum Kit + diff --git a/02 - JS and CSS Clock/index-FINISHED.html b/02 - JS and CSS Clock/index-FINISHED.html index 04d1a4e40e..52d379ed94 100644 --- a/02 - JS and CSS Clock/index-FINISHED.html +++ b/02 - JS and CSS Clock/index-FINISHED.html @@ -3,6 +3,7 @@ JS + CSS Clock + diff --git a/02 - JS and CSS Clock/index-START.html b/02 - JS and CSS Clock/index-START.html index 7a6d27d5bd..55ab1a5331 100644 --- a/02 - JS and CSS Clock/index-START.html +++ b/02 - JS and CSS Clock/index-START.html @@ -3,6 +3,7 @@ JS + CSS Clock + diff --git a/03 - CSS Variables/index-FINISHED.html b/03 - CSS Variables/index-FINISHED.html index 2f0d1464ff..f9e6a04b2c 100644 --- a/03 - CSS Variables/index-FINISHED.html +++ b/03 - CSS Variables/index-FINISHED.html @@ -3,6 +3,7 @@ Scoped CSS Variables and JS +

Update CSS Variables with JS

diff --git a/03 - CSS Variables/index-START.html b/03 - CSS Variables/index-START.html index 6b9b539c09..d5fcc3a2ae 100644 --- a/03 - CSS Variables/index-START.html +++ b/03 - CSS Variables/index-START.html @@ -3,6 +3,7 @@ Scoped CSS Variables and JS +

Update CSS Variables with JS

diff --git a/04 - Array Cardio Day 1/index-FINISHED.html b/04 - Array Cardio Day 1/index-FINISHED.html index d1f6ce33d6..a9f2ec20b4 100644 --- a/04 - Array Cardio Day 1/index-FINISHED.html +++ b/04 - Array Cardio Day 1/index-FINISHED.html @@ -3,6 +3,7 @@ Array Cardio 💪 +

Psst: have a look at the JavaScript Console 💁

diff --git a/04 - Array Cardio Day 1/index-START.html b/04 - Array Cardio Day 1/index-START.html index 21bec96e8c..0dcfd00f40 100644 --- a/04 - Array Cardio Day 1/index-START.html +++ b/04 - Array Cardio Day 1/index-START.html @@ -3,6 +3,7 @@ Array Cardio 💪 +

Psst: have a look at the JavaScript Console 💁

diff --git a/05 - Flex Panel Gallery/index-FINISHED.html b/05 - Flex Panel Gallery/index-FINISHED.html index bfa64d6be3..684ee7e307 100644 --- a/05 - Flex Panel Gallery/index-FINISHED.html +++ b/05 - Flex Panel Gallery/index-FINISHED.html @@ -4,6 +4,7 @@ Flex Panels 💪 +