What is this page?

I am going to treat this like an evergreen page where I document my progress as and when it happens.

This is to serve 3 purposes:

  1. To help myself structure my learning
  2. To show others one person’s learning journey

Full context here is that I’m learning web development as a hobby. I have a full time job (not in web development) and a lovely wife so my available time can vary between having no time/energy some weeks, to having a good amount. I think sometimes people on youtube and blogs can be a lot of single, students or people whose jobs are literally in software engineering - and so I want to add a different background perspective.

However note that I am a Data Scientist, so I do have a background in SQL, Python and Bash which has definitely helped me get up to speed a bit faster than a complete beginner.

My Historical Experience

Ever since I was a teenager I’ve always wanted to be able to build my own website.

My first attempt was in the summer between school when I was maybe 16 or 17, I started creating a revision website with details about how to study effectively and to pass exams.

This was all in basic HTML and CSS. But it wasn’t long before I was getting stuck. I distinctly remember writing for example a navbar, and then thinking to myself ‘Oh man, I need to now write the exact same code in all my other html files’. Unfortunately I got frustrated, had no friends who knew coding, and clearly my Google-Fu was weak as I couldn’t find good learning resources online. (Plus there was definitely less than there is now).

So sadly, I didn’t really touch web development for many years (naturally I was busy with university and full time jobs). Then about 1 month ago, I had a bit more time on my hands so finally got stuck in.

Learning Log (last updated 22nd April 2025)

I thought it might be useful for both myself but potentially others to document the steps I have taken thus far to learn the above.

  1. React 101 Course [Codecademy] (February 2024)

    • I learnt from a friend that React is one of the leading Javacript frameworks for front-end web development. So to learn the basic concepts and syntax, I started at Codecademy.

  2. CSS Flexbox Course [Codecademy] (February 2024)

    • Whilst studying the React course, I think they touched upon some CSS and possibly Flexbox. My friend had told me how great it is, so I took about an hour aside to learn the basics of this.

  3. Code and Deploy a Personal Portfolio with React [Youtube - PedroTech] (February 2024)

    • After learning the basics, I wanted to actually create something to practice. I found PedroTech’s channel and this was a perfect starter project. I would follow along coding everything Pedro did, and along the way really got to grips with hooks.
    • I then modified the design and content slightly from this tutorial video and deployed my own portfolio website (using Netlify) here.

  4. Node Crash Course [Youtube - Net Ninja] (March 2024)

    • I actually started to the MERN Stack Course (see below) but then it said I should do his tutorial on Node first to understand the basics of backend and Node & Express.
    • I’m glad I did, because I had never had any understanding of servers and HTTP requests. At the end of this, I had a much clearer understanding, it was genuinely so good to do this course.
    • He also showed Express (an easier to use backend/server package) and a bit of MongoDB during this course

  5. MERN Stack Course [Youtube - Net Ninja] (March 2024)

    • Now armed with some fundamental knowledge of the stack (MongoDB, React, Express, Node), I went through this course on and off for a period of 2 weeks (I have a fulltime job!)
    • This course takes you through building your own workout tracker where you can add, delete, update workouts and say how many reps you did, what kg you lifted, what exercise etc.
    • It is a great overview of full-stack web development.

  6. Introduction to Javascript [Codecademy] (March 2024)

    • I realised this should have come first before studying ReactJS. I often found myself getting confused between vanilla JS syntax, and then ReactJS syntax.
    • This was a good intro to the basics, but it doesn’t cover everything I feel like I need to know (e.g. async functions, promises and so on). That is what I will be studying next - “Intermediate Javascript” with Codecademy.

  7. Intermediate Javascript [Codecademy] (April 2025)

    • This is the first time I’ve ever learnt about the concept of currying. Was confused at first but further reading and watching this YT video made it click for me.
    • Covers the concept of hoisting, which is a term I love.
    • Covers “The Event Loop” which really crystallised what Call Stack means and how it functions, particularly with respect to the execution of asynchronous functions.
    • Article covering memory management. It further reinforced the concept of “The Heap” and “The Stack” for me. I mostly understand it, aided by also watching this video by Alex Hyett
    • Article covering various design patterns

  8. Learn TypeScript [Codecademy] (TBD)

    • As I’ve been following more and more tutorials and reading about web development, I have learnt that TypeScript is almost a ‘gold standard’ for developers. My basic understanding is it basically enforces typing your variables/objects so that you get better error handling and whatnot. I’m sure I will learn more as I go through this course.

  9. Build a website for a family friend in React + TypeScript (Estimated: May 2025)

    • I don’t want to fall into the trap of forever doing tutorials. So my plan is once I’ve finished learning TypeScript, I will put all I have learnt into practice and build a website for a family friend who is an independent tradesman. So it should be a super simple website to build with an about, contact form, testimonials and perhaps a page with images of previous work done.

Articles I liked

  • Article: Debugging is Learning
    • Came across this article going through the Intermediate Javascript Codecademy course. I know all of what is says but it was a nice reminder that bugs are opportunities to learn, and to not get too frustrated.