How to *really* get good at web application development, what to avoid, and how I survive(d).

I’m writing this from the perspective of how I developed my own personal website, and just laugh at myself for how stubborn I was.
For the sake of keeping this post condensed, I’ll be writing about my experience of learning coding thru the perspective of making a personal website, rather than talk about literally every programming concept, language and project I had along the way.

Foundations #

When I first started, I was writing my first ever website in traditional html/css/js. And, it was painful! I took myself from the ground up, even unknowingly on what little information I had, and taught myself every bare essential there was to know about web programming. As you can imagine, a lot of this was mostly just going to other websites, using inspect element, copying other things I liked, copy/pasting files, the usual index_backup.html, index_okaythisisfixed.html, etc etc, you name it, I did it.

After many copy/paste edits and duplicated files later, I had my first working website! Lain1447.xyz was complete. Now came time to put it to the internet. So I installed NginX onto my linux laptop, ran my web-server, tried to get a certificate, and, nothing.
I could not get a certificate for my localhost domain, even if I changed my /etc/hosts to magically give me the domain of my dreams. Well, my dreams had to be crushed at some point.

Being a Luke Smith troglodyte at the time, I watched his video about different types of hosting, and decided to buy my first Namecheap server. So, just a matter of copying all my files to the server, every single html and css file, and- And, it was horrible.
I thought I was doing something wrong. I was. I thought I had to use one of these shiny buttons that Namecheap gave me, maybe this Node.JS thing will solve my issue? Oh and since I hate copying my files, they’re talking about a git repository? What’s that? Oh and also there’s a PHPmyAdmin panel and omg!-

This, labourious process was not fun. So after many copy/paste jobs, logging into my host, testing it on a local NginX server, trying my best to juggle my dev and local environment, I started to get exhausted. I came to a point where I was thinking, “hmm, there must be a way to surely template these things, since I’m writing it over and over-” and lo-and-behold, I discovered templating languages, like EJS, Jade/Pug, et al.
So, I tried rewriting my code into Jade, copy/paste that into the Namecheap HTML editor box and, nothing??

Why isn’t anything I do working!!!
I yell to the heavens, as my laptop keyboard shatters with the force of the seven suns, my cat defecting my bed in fear yet again, yeeting out my window from the second floor at speeds Sporticus would have a heart attack at.

After all my trials and tribulations, in total, my website had:

• Completely stolen copied w3schools code
• Stolen CSS from css-tricks and other people’s websites by using inspect element
• 0 soul or creativity whatsoever

I laugh at myself now, but honestly, by going through all of these technical concepts as a beginner was, even though extremely frustrating, ended up becoming far more rewarding in knowledge and experience.

Taking my code to the next level 📣 💥 💥 💥 💯 🔥 #

It was then of course, I read on Stack Overflow that I was supposed to put this Node.JS thing onto my system by installing it?
So, after doing that, following the setup instructions from Harp.JS to make my website on my new… framework? Okay, this is pretty weird.

This process continued until I learned I could template anything in my code to abstract a lower-level concept, and in reality, Pug was just putting my fancy, pretty syntax and putting it down to that ugly HTML I hated writing so much - a concept I would then take to all of my later coding projects (and honestly the best one I have ever picked up).
I thought to myself,

Wow, so this is an entire new language someone wrote on top of JS to make my life easier huh, and all my new website is doing is just taking someone else’s code and putting it in to fit with my use case?
Well done younger me. You got it.

And after finally getting over my fears of writing code, I wrote my first lines of JS, to make my own small interactive game, and have an API enabled user login. Why I wanted user authentication on my personal website I will never know. But, alas, learning is learning.
This newfound sense of freedom led me to attempt the creation of my first npm package I wrote to handle user authentication in my own extremely weird client-side manner, by putting users in a json object within my node_modules.
Yes, I was too afraid of databases even then. I was 16 years old okay.

After trying to do this, and realizing how horrific of an idea this was, I knew I couldn’t hold off on adopting a far more “traditional” stack much longer. Bracing myself, I took the dive and learned about MySQL, and, lo and behold! My upgraded amazing blog now has a database to hold users!

After discovering complete freedom I now had:

Wait, who was ever stopping you in the fir-

• A Pug-based frontend using the layout/partial paradigm with now (mostly) original code
• Actual custom CSS
• CSS animations!
• Client-side user authentication written in javascript using my own npm package
• A MySQL database to hold all these new users
• The soul of a sweaty try-hard teenager

As a side note, an extremely early version of this site still lives on at https://cxss.surge.sh.

What’s the point of you mentioning all this??

Okay, enough rambling about my trauma recovery. Simply put, by going through all these steps, I learned what all of these tools were, how they fit into my toolbox of being a developer, how each individual part of a technology stack interacts with one another - REST APIs, CRUD operations, all from being bored of a simple static website!

I bring this up because, I notice a lot how developers don’t really know the purpose of their tools, and are only doing what their Udemy tutorials or CS lecturer are telling them to do. There’s no thought or reason given to why anything should exist or work, everything simply does, and for the average dev, that’s seemingly enough.
If you want to be a good developer, stop thinking about what’s “good enough”.

Think about your tools. What are you using currently that could be done better? What about your workflow can you change to suit yourself far more? That’s really how you become great.

Expanding my horizons #

But, my desires as a developer grew stronger. I wanted now to have the CSS animations like the cool websites out there!
I saw these awwwards websites with their slick animations, custom cursors, slick transitions, and I was amazed.
Why can’t I have something like that?

So this is where I learned about React, and what components were, what different rendering strategies existed, the lot.
I learned different libraries like barba.js, react-spring, etc and ended up with the code to my first site, Elith.Systems.
I wrote it at the time as a storefront to the electronics I was selling, which I would post and update using Stripe CMS, handing payments with Strapi, oh it was a wonderful time.
And I made money! It all worked!

You can find that code on my GitLab.

After developing these skills enough, I decided to suck it up and try getting a job. So I joined my first company as an intern, and my lead dev at the time taught me designing in Figma, UI prototyping, how to create a GraphQL API, how to debug them, the lot.
I was never paid during that time, but the experience led me to go work at other companies which I then grew more in, learning far more complex React needed to keep up with the demands of what was expected from me at the time.
It required me to learn software engineering best practices, how best to lay out my code, structure, how to test and implement new features, and hence I finally had my first successful launch of Nikeboi, my first real big client work project.
Even though for me, that entire time during deployment involved working on a codebase I’ve never seen before, having to use react-bootstrap, which was completely new to me, I just barely got it working over the course of 4 hours non-stop on 0 sleep in 2 days, just hours before expected launch.
A stressful time, and a hell of a shock to me realizing how much I still had yet to learn.

Continuation #

I could write a hell of a lot more about each individual project, who I learned from, each new language I tried, learning C for a while, writing a smol game engine in allegro with C++, but overall, I think I’ve made my point.

From previously writing lower level code, I learned that javascript was just about manipulating objects, that spreading out an object into another is literally just doing a memcpy() operation in the back, and other lower-level functions that simplify what your higher level code is really doing.
Your knowledge ends up accumulating and links back to things you might have done before, so even though I made many detours along the way, learning Elixir, Ruby, Scala, Pascal, Lua, Lisp, getting into the world of functional programming, OOP, it all became practices and knowledge I took with me into learning JS, and ultimately, becoming a better programmer.

Reflection #

To save you the hassle of understanding my excruciating pain during this time, no, I did not follow a set out web development pathway, since I didn’t even know those things even existed. My learning method was by no means intentional, and I did not look up a single tutorial during this time aside from reading MDN docs and W3Schools.
All of these trials and tribulations forced me to learn about how a browser actually renders HTML from scratch, what a web engine was, how networking worked, the basics of the OSI model, network topology, client/server architecture, etc etc.
I learned and trialed PHP, Javascript, trying to get each of them to work the way I wanted to, and learning how they were supposed to be implemented.

And in my now 5 years of experience, having successfully developed several production-ready websites in two companies, I meet other developers who struggle to even understand the most fundamental of concepts.
Even though it’s mostly just JS framework one-trick-ponies who suffer from this, the divide of those who learned building on top of abstraction and those who learned from the fundamentals will always rear its ugly head.

insert old woman yells at cloud meme here.

The fact that so many developers these days learn & develop in a way that’s completely opposite to this, instead immediately learning a heavily abstracted meta-framework such as Next.JS shows that in reality, most juniour and even mid-level developers can go a large part of their entire careers never knowing how to code.

I’d even go so far and argue that it’s indicative of how little originality exists in today’s modern applications and services, with pretty much every new technology being a carbon clone of what has originally come before it.
Why go through the hassle of creating something novel, when there exists no tutorial for it?
Why not recreate the same cookie cutter website over and over for different people and get paid to copy your own Wordpress templates, charged at 6000£ a pop?

If most people took the time to learn barebones programming, the new rise in knowledge would probably actually develop cultural aesthetics in code that give rise to far more than just, Deliveroo clone #389403289043, or new startup idea that clones another one before it, etc etc.
We could finally have our more interesting internet back, a true time of sovereignty, a vast pool of original and unique content, rather than simply being the corporate hellscape it is today.

The sad thing is though, nothing is ever really hard, but people (and me included for the largest part of my time learning!) can do anything, by just going into learning something with the same child-like wonder as finding a new toy.

In reality, even though I spent a good 5 years training myself from scratch, I would have progressed myself so much faster if I had simply just admitted to myself how little I knew, and just accepted the aid of a guide, or a mentor to help me along.
But, my pride wounded me. Even though, these days I can create a really good functioning web app, integrated with the hottest tech on the scene sure, I kick myself up the ass every day knowing I could have been better.

So, if you want to be good at software development, do the following:

1. Learn how to code.
2. Make mistakes
3. Lean how to not make those mistakes.
4. Google.

And hopefully, by the end of it, you’ll become an amazing programmer.
It’s, honestly not really hard.

Yea programming is fucking awful go outside-