There are a lot of exciting ways to engage with the software & technology community, particularly in December. There are many platforms which offer interesting coding challenges to improve your dev skills, and often they put a holiday spin on it to engage learns.
Scrimba is a unique learning platform with an emphasis on frontend development and technology which differentiates itself by giving you ability to seamlessly code inside its tutorial videos. It gives you the ability to fiddle with the code the instructor is discussing it see its impact live in a simulated browser inside the video. They just wrapped up their 24-day Advent challenge called #JavaScriptmas. It was a lot of fun and they offered some great prizes for participation including membership giveaways, cash prizes, and certification for completing the challenges.
I just completed Scrimba's Frontend Developer Career Path this year which covers 14 Modules going in depth in topics such as HTML, CSS, and Javascript. You also go deep into the React frontend library and build some amazing projects to really exercise your skills. You can see some examples of what I learned from Scrimba on my portfolio site! Scrimba can help you quickly get your coding skills career-ready.
The JavaScriptmas Challenge covers foundational skills in JavaScript particularly algorithms which is a critical skill to build as you prepare for frontend interviews. Challenges are approachable for any level, and you can still go back and complete this year's challenges and earn yourself a nice certificate to show off 🎄. Some challenges allow to test your design skills, making an interactive page or game.
The final day in particular was really fun - you are tasked with making an interactive game with JavaScript - testing user's mouse clicking agility! The challenge tests your ability in DOM manipulation, event listeners, and async-await - all important concepts for aspiring frontend developers.
Code Sample From the Challenge
const spin = async () => {
let currentNumber = 0
while (!pushed) {
currentNumber = currentNumber + 1 <= 100 ? currentNumber + 1 : 0
spinningElem.innerHTML = currentNumber
await sleep(difficultyMillisec)
}
stop(currentNumber);
}
My solutions for this year's challenges are included below! Let me know if you try it out - we also have a great community on Discord, you should check it out!
JavaScriptmas Solutions:
Day 1 - Christmas Candy: Modulus Math
https://scrimba.com/scrim/co7904069892cdec737aabcc8
Day 2 - Deposit Profit: Find Years For Target Balance
https://scrimba.com/scrim/codc44ea9ad8f4ffc94246b4a
Day 3 - Chunky Monkey: Make Nested Array from Flat Array
https://scrimba.com/scrim/co0564578b0929edf8d075fc3
Day 4 - Century From Year: if-else & math
https://scrimba.com/scrim/co899466db69bcbe26d9baabb
Day 5 - Reverse a String
https://scrimba.com/scrim/co7144abea814f7e00f42a96f
Day 6 - Sort By Length: Sorting Array by String Length
https://scrimba.com/scrim/co57c4dac9b317ab5b0dcd749
Day 7 - Count Vowel Consonant: If-Else Logic Within String
https://scrimba.com/scrim/co28d426ba1c146ad72a6e975
Day 8 - The Rolling Dice: DOM Manipulation & CSS
https://scrimba.com/scrim/co9b949aba2094658bc0d88c5
Day 9 - Sum Odd Fibonacci Numbers: Iteration or Recursion
https://scrimba.com/scrim/cob8248ad80364061fe288ee4
Day 10 - Adjacent Elements Product: If-Else or Reduce
https://scrimba.com/scrim/co0714afd896c27390a15bea2
Day 11 - Avoid Obstacles: Array Algorithm
https://scrimba.com/scrim/co371439186f3da45d7bd914f
Day 12 - Valid Time: String Methods
https://scrimba.com/scrim/coe3f4eadaf8c2390d7f31057
Day 13 - Extract Each Kth: Filter With Modulus
https://scrimba.com/scrim/coc634510aa3419e4672861c4
Day 14 - Maximal Array Difference: Math Methods and Array Algorithms
https://scrimba.com/scrim/coc6b43269ffad3fc3a3e3cf2
Day 15 - JavaScript Carousel: JS DOM, CSS, Animation
https://scrimba.com/scrim/coe944d05979c5703fb4c3b04
Day 16 - Insert Dashes: String Methods
https://scrimba.com/scrim/co01a4f728f7b7d44b2786e56
Day 17 - Different Symbols Naïve: Sets or Hash Table
https://scrimba.com/scrim/co90d4bfc8d54b49b3c22bf0e
Day 18 - Array Previous Less: Array Iteration
https://scrimba.com/scrim/co5984206961fe9dff3abc006
Day 19 - Alphabet Subsequence: String Methods
https://scrimba.com/scrim/co0414200b7b6985f8f9f30e2
Day 20 - Domain Types: String Methods
https://scrimba.com/scrim/co2714e35a20a35da074ceb9d
Day 21 - Sum Of Two: Working With Arrays
https://scrimba.com/scrim/co564433a871a15870ebcd5a8
Day 22 - Extract Matrix Column: Indexing & Array Methods
https://scrimba.com/scrim/co24b4ff5b94d4fec70f29fe1
Day 23 - Social Media Input: Frontend Development
https://scrimba.com/scrim/co06f4da298e1cb77ac6affbc
Day 24 - Test Your Agility: Frontend Development & Games
https://scrimba.com/scrim/cod294f2091b9d6102654a713
Top comments (1)
Awesome post, Justin - I loved the last challenge by Carla, too!
I like that you elevated your solution with an animated background and difficulty variable.
You also improved the user experience by allowing the user to "Play again" rather than reload the page - amazing ✨