At the start of December I received an email from Scrimba inviting me to join their #JavaScriptmas advent calendar. It was a daily JavaScript coding challenge from Dec 1 to Dec 24 with the possibility of prizes. It seemed interesting enough, so I joined. I ended up finishing all 24 puzzles. The JavaScriptmas organisers encouraged us to write about our experiences, so this is what this post is about.
My background
I did a university degree majoring in "computing and software systems", and I've been working as a software developer for a little over a year since graduating. I write a lot of TypeScript as part of my job. This year I did LeetCode's daily coding challenge for eight months, and then I decided to take a break in December. But it wasn't really a break from coding puzzles because I quickly replaced it with JavaScriptmas. There also was another coding advent calendar that I looked at but didn't participate in. So I'll be making comparisons between JavaScriptmas and those other daily coding challenges.
The JavaScriptmas problems
This section contains my submissions and my comments about them.
1: Candies
scrimba.com/scrim/coaff461cbc8f3e5356a4ee31
2: Deposit profit
scrimba.com/scrim/cob954193ae7b53998c8d2be5
3: Chunky monkey
scrimba.com/scrim/coa2240549fe3becc84d42cc0
4: Century from year
scrimba.com/scrim/co619412d9be8d061163d77f3
5: Reverse a string
scrimba.com/scrim/coe874c78be919a07971be850
It reminded me of a gotcha where appending a character n times to an empty string could be O(n^2) time complexity due to the string being immutable (in Java). Maybe it's the same in JS?
6: Sort by length
scrimba.com/scrim/co8c2494d8b82be04c3b781d4
7: Count vowel consonant
scrimba.com/scrim/co1cf4384b347d0fbaf617787
The hint suggested using reduce, which is something I rarely use. I tried it as an alternative solution.
8: The rolling dice
scrimba.com/scrim/co67743bc89b0e96416d6c9cf
This one was notable because it was the first challenge to include html and css as well. I calculated left/top dot offsets required to produce each dice face and stored those in an array.
9: Sum odd fibonacci numbers
scrimba.com/scrim/co2b24c039e4192679bc1975a
10: Adjacent elements product
scrimba.com/scrim/co5b54632ae346dc2dd9ed6f9
11: Avoid obstacles
scrimba.com/scrim/co7224685b35ae7293c3dbaf7
This was where I noticed that I could add some type checking to the editor by adding a docstring like
/** @param nums {number[]} coordinates of the obstacles. */
This is nice because it changes the inferred type of the nums
param from any
to number[]
, which helps with autocomplete suggestions. The syntax felt like closure-compiler JS annotations.
12: Valid time
scrimba.com/scrim/coc5548a598da42d4227cca97
13: Extract each kth
scrimba.com/scrim/coa49455d8fa57cd064d5fdd4
14: Maximal adjacent difference
scrimba.com/scrim/co5204f65a4a6ff692e47b6b5
15: Carousel
scrimba.com/scrim/co43f4da88280c9723d3a87fa
Another html/css/js challenge. I did the CSS transition bonus because it only needed one extra line.
16: Insert dashes
scrimba.com/scrim/co72f4846b1ee917796d6770b
17: Different symbols naive
scrimba.com/scrim/co96b4ef7ac2329e6c3e6f89d
I wrote three approaches to solve it.
18: Array previous less
scrimba.com/scrim/coc394dc98c6f0d6c570c5108
The suggested solution and my initial implementation had O(n^2) time complexity, but there's also a linear time solution explained here. It would have been nice if this approach had been included as an extension.
19: Alphabet subsequence
scrimba.com/scrim/co98d4be692ae12d833f34f4c
20: Domain type
scrimba.com/scrim/co8114d25bcaaa2326b398569
21: Sum of two
scrimba.com/scrim/co9c14185a2f699305a419d49
22: Extract matrix column
scrimba.com/scrim/co35c4fca843d594664200a36
23: Social media input
scrimba.com/scrim/co56f49adb57d0ebbf5ec312d
Another html/css/js problem. I found that the input
event worked better than keydown
because it matched the changes to the textarea
more closely.
24: Test your agility
scrimba.com/scrim/co4bd443c93d3cea2d8727b9e
A gotcha (that also happened in the stream) was an off-by-one error in the displayed value vs the final user's value.
I set the win threshold to diff < 5 because getting diff = 0 is hard.
Other thoughts
The problems were mostly straightforward. I'd say they're all about LeetCode-easy difficulty (and definitely a lot easier than Advent of Code too). I would have liked a greater difficulty ramp-up, but they acknowledged the low ramp-up in their stream. I found the problems that included html and css more interesting because they were more challenging and open-ended.
I liked how most of the problems had unit tests. I always added more test cases to test other inputs.
I also liked how they walked through the solution to each problem the next day. It's educational. It would be even better if they did this for harder problems. Some harder problems require you to iterate on a solution to make it more efficient, so a screencast format explaining the problem solving process could work well. Plus there's Scrimba's special sauce of being able to pause the screencast at any point and edit/run the code. (But you can't just talk and write code though. Good diagrams help a lot too.)