Learning JavaScript in 3 little projects

During the past semester I have programmed in a few languages: Python during Advent of Code ( my first participation at that event ), Ruby for a university project and Rust for another little project. But I have mostly used Javascript and have come to appreciate it. I had not used Javascript before for more than a few lines and now used it almost every day.
Javascript has a bad reputation for a few reasons:

  1. Ever changing frameworks
    It’s a running joke, that every day new frameworks for JS are created that make life “so much simpler” and just create a new set of tools before seen that have to be learned anew.
    To mitigate this I did not use a framework for my small hobby projects. Now this might be not sustainable for larger projects (a saying goes like “Every sufficiently complex web application will include a reimplementation of JQuery), but it worked for me. Learning a real front-end framework remains on my todo list.
  2. Compatibility nightmares
    Since there is (thankfully) not only one browser, some features may not be available for some users, which can be a real headache, that is usually mitigated by tools like babel that compile newer versions of JS code to older browsers (To support these 2 people still using IE9!).
    Since I do not work in the industry and take no responsibility to make sure it works on every machine, I also skipped this part and just developed for current versions of Firefox and Chrome.
  3. Dependency hell
    The problem is that a lot of JS projects use a lot of dependencies, and these again use a lot of dependencies. This does not only lead to point 4 but also to the consequence that a change in a simple package way upstream can propagate to your project, like the infamous leftpad event. Also it is possible to inject exploitable software or straight up evil code into some simple library, that is then used by lots of now vulnerable projects, as described in this excellent article.
    This is certainly a problem. I have tried to mitigate it by reducing the number of dependencies and am quite happy with the result.
  4. Giant webpages
    When using a lot of frameworks and external libraries, sites using a lot of JS logic tend to get really big, leading to long loading times.
    Again, because of the vanilla and small scale approach this is not a big problem for me.
  5. Bad design
    It is clear that Javascript was not designed from the start to be one of the most widely used languages over which enormous amounts of logic run and power the modern web. However, in my superficial impression I find JS to be a not badly designed language. Sure, there are many quirks that seem odd like the lexical sorting of arrays and comparisons that don’t turn out the way you expect. But JS also has nice concepts, like the functional side, which is very integral to the language.

All in all I have found JS a fun language that enables extremely rapid prototyping of simple apps because of the tight integration to HTML.

My 3 projects

elections

A website to compare different election systems, both for single seat elections (like first past the post) and multi seat elections.

New concepts

  • Module system
  • HTML canvas manipulation
  • chart.js library
  • Dynamic UI generation
  • Using eslint

zahlenmaschine

A simple emulator for a custom assembly language. This is not useful in any way but was very fun to make and led me to scratch the surface of language design, a topic that I will definitely return too (with higher level languages). The website allows the programming of machines with simple operations and also I/O, as well as the combination of these machines to create larger more complex algorithms.

New concepts

  • Further libraries: Sweetalert, Codemirror
  • Working with uploaded files

line-planner

An app to create train lines on a map. I have long been fascinated with public transport in general and the berlin “ÖPNV” in particular. This was an idea I had kept in my backlog for a long time and I was happy to finally make it happen.

New concepts

  • Leaflet map library
  • Interacting with APIs
  • Creating an undo manager

Conclusion

Where to go from here? Some next steps in my JS journey could be going to the server side with node.js, using a real front end framework like react or switching to typescript to enjoy the advantages of JS which a little added type sanity. I don’t know yet.