It’s been long enough now since I started programming that I couldn’t give you an truly accurate amount of time that I’ve been coding. I started when I was 11 or so, and at the time of this article this puts me at about 7 years. In all of that time I had almost never touched one thing: web development.
I made toy games in Khan Academy, Minecraft mods and plugins in Java, a bytecode executor in C, and some of my more recent endeavors have been a Minecraft server re-implementation in Rust, a remake of online Cards Against Humanity (after the well-known public one was taken down), as well as a remote desktop application. But no web dev, just didn’t get to it I guess? (Really it’s because I never had the patience to figure out how CSS works).
This is where Forge’s Launch program comes in. I really wanted to get an internship between my freshman and sophomore years of college, and also figured it was time to add a new skill to my list. In this post I’ll outline the top 5 lessons I’ve learned while working through ReactJS, the idiosyncrasies of JavaScript, and my old nemesis: CSS.
5. TypeError: _ is undefined
I’ve spent so long using strongly typed languages that I’ve really developed a dependence on it. A really strong dependence. For the first couple projects I did through Countdown, I actually found JavaScript harder than my current main language, Rust, which is notorious for its complexity. I actually had to keep mental notes in my head about my functions’ contracts and memorize the structure of all the data I was working with.
Since I couldn’t rely on types to tell me what functions were doing, and since we were discouraged from putting comments in our final code (something which I completely disagree with by the way), this encouraged me to really think about how I named things, and how I structured my code. Keeping it simple became a necessity. In hindsight, over the years my code has become increasingly complex, and this experience has allowed me to reflect on how I code in all languages, and has motivated me to try to keep things simple across the board when possible.
4. React is easier than I thought
I was not expecting to be so delighted with ReactJS. The whole concept of components, props, and hooks clearly takes a lot of inspiration from functional programming and I found it very natural to work with.
In all three Launch projects now, I have more or less been able to copy-paste my navigation bar code from one to the next. React makes it easy, and even encourages you to write idempotent APIs, which are easier to debug and reuse.
Another example of this came up in Launch’s second project where we were tasked with creating a website that combined Spotify with social media. The day before we were assigned this project we were tasked with creating a simple message board app. With minimal modification, I was able to transplant almost all of my message board app into my group’s website code to back our forum and DM features, and it more or less Just Worked.
3. CSS is hackier than I thought
The answer to life, the universe, and everything is 42 (or more) flex-boxes. How do you center a div ? Well, the modern way of doing that as succinctly as possible (to my knowledge) is through a flex-box.
Maybe I’m not giving CSS enough credit (perhaps due to lingering hard feelings). Sure I might layout my webpages through increasingly nested flex-boxes, but this has taught me to think about webpages as a grid. Once this clicked, the speed at which I could style a website increased 10-fold, maybe even more. This shift in perspective helped me break through the barrier I had run up against every time I tried to use CSS before.
2. Planning is paramount
One benefit that comes with strongly typed languages and systems is that refactoring can often times be quite simple. If your code wouldn’t work then it may not compile (depending on what the compiler guarantees you), if it does compile then it’s decently likely to work.
When working with a JSON tree database and plain JS, it’s a different ballgame. During the first first Launch project where we were tasked to create a website for an elementary school’s administration, my team and I had to rework our entire database layout in the middle of the project. This was painful. See lesson 5.
In the second and third Launch projects, my groups have put a lot more of the planning up-front, and this has helped tremendously. I’ve always been so eager to just jump head-first into the code that I often tell myself “it’s fine I’ll just refactor it later.” Launch has taught me that this is an unsustainable attitude when on a timeline, and I will definitely be carrying this lesson with me for the rest of my software development carrier.
1. Good UI design is an art and a science
I’ve long claimed that I’m bad at the fine arts, so I was expecting UI design to be a monumental PITA. As it turns out, it can be very methodical, but still requires creativity.
The artistic part of it comes up at the beginning for me. Deciding on the end goal of a webpage’s UI is still tough, but I’ve found I can rely on my group mates for helping me with that. Figuring out how to achieve that goal is actually a fairly technical endeavor (yay I can do technical things!) I can say with some confidence now that if you tell me what you want a webpage to look like, I can make that happen. This is much farther than I ever thought I would get with UI design, and I’m very glad Launch has helped me achieve this.
Conclusion
I am a little bit of a PL nerd so I’ve always somewhat-jokingly somewhat-seriously hated on JavaScript and friends, but in reality sitting down and grappling with this language, its associated tools, and web development in general has taught me a number of valuable, transferable lessons. I wouldn’t say it’s my favorite thing in the world — my dream job will probably have something to do with systems programming or compiler development — but I am very glad I have learned these new skills. They have certainly made me a more experienced, well-rounded developer.