Somewhere this year I started a journey to learn some more Javascript, mostly triggered by wanting to reach a next level in terms of user interface. In August the learning suddenly accelerated fast, mostly by getting excited about Svelte and finding myself with some extra time on my hands for the first time in a long time.
I built a few demos and things got rolling. I built work upon other work and was happy with the results which motivated me to work more and more.
I’ve learned a bit of Javascript over the years, mostly some jQuery things to manipulate the DOM and some practical knowledge like how to work with certain plugins like HighCharts or Select2. I think I even once wrote a (poorly architected) plugin. But I have never really learned the basics since I have never really needed them. I’ve been vaguely aware of the different string manipulation methods and how to call events to do something with the DOM and I could do something relatively standard like implement a library and then maybe change it a little bit, but nothing more than that.
I’ve hacked away on our prototype project Bedrock occasionally over the past few years but this was mostly modifying code that someone else wrote. I’ve always been enchanted by the idea of node.js — with the possibility of being both server & client — and the fact that it can access the file system.
This makes me feel like I has the possibility to write “real” apps as most of the professional things I want to do involve automation and that in turn needs a lot of file handling. I never got to that of course as my focus is on UI design.
In general I’ve kept away from writing too much JS in my day job for the past years, mostly focussing on the UI designs themselves and delivering well-architected HTML and CSS to help the developers on their way to build the entire UI in a full stack environment (And now coaching others to do so as well)
I also don’t like spending hours on something when I know that I will be inefficient at doing it. I would rather leave the JS work to the persons who I always jokingly call the “real programmers”.
I want to change that and start writing more JS in my day to day. First of all I feel like I reached a knowledge level where I have similar skills as the “real programmers” anyway. It’s not a competition BTW, that’s just an observation for myself to feel certain enough to do programming types of tasks in a (paid) project context. In the end we have to work together to make great products.
Next to that our team is growing and there are more people with more skills in it that can also teach me a thing or two about modern JS.
We’re not going to turn into a development company overnight now. We’ve always been designers that use code as a means to an end – to explain an interaction, to show what is possible responsively.
I just feel like I just need to know more about manipulating what’s on the screen in a programmatic way to reach a next level in UI. You can only do so much if you stick to HTML and CSS. At some level I also feel like the standardista’s I grew up with are holding on to 10-15 year old opinions that are no longer valid, because the world has moved on, but that is another discussion in itself.
I’ve always liked stuff like D3.js – there are things like MapBox that I can geek out about – there’s plugins for Figma – there’s two.js and Zdog – and I’m excited by the possibilities of web components.
What all of the things above have in common is that they are Javascript-heavy. I feel like I need to be smooth at manipulating it in order to create what I want to create.
The timing feels right to improve my level of Javascript. The market need is there to have a better deliverable (i.e. a web components based one). The resources to learn it properly are out there too, now. A few years ago you’d be hard pressed to find a decent Javascript course. Now there are tons of resources out there.
Now, about learning Svelte specifically. Svelte was quite difficult to grasp in the beginning of the year. I tried to get into it in February but it just wasn’t finished in terms of documentation and external resources.
Things are better now, with much improved documentation. Some of the demos on the REPL are really impressive (I love this tree for instance). One problem I encountered for now is there’s not many resources about Svelte out there. There are plenty of React courses but for Svelte there is just this one course, that’s apparently not very good because it teaches you to think too much in React-style coding.
In order to counter this I’ve been patching bits and pieces of thinking together to get to an understanding, documenting things along the way for myself, both publicly and privately. I’ve changed my mindset about how I should learn to code – not by listening to a video tutorial but by doing, reading other people’s code, and documenting how I solved the problems. If you have to wait for an external resource to explain eloquently why you need to do things a certain way you will always be behind the curve.
Moreso, these isolated examples can help our company grow as a team.
So that’s a bit about my recent programming experiments/learnings/process. I hope I can inspire someone to do something similar or that some of the thoughts or references in this post get you thinking.