Cover Image photo by Matt Duncan on Unsplash.
Hey everyone, I wrote this piece to share my path through the web-development minefield from beginner to now in the hopes that it could help others who are currently on a similar path or want to start. It includes a lot of the resources I used to help me along the way as well as the timeline it took from the start to now! This is not a post dedicated to all of the resources I have used but I thought I should include the ones that had a positive effect on my development.
(I will only mention paid courses that I think are worth the small investment based on my experiences.)
For anyone who just wants a list of useful resources I will include them below in order of appearance:
- Colt Steele's "The Web Developer Bootcamp"
- Beginner + Advanced) by Maximilian Schwarzmuller
- Traversy Media
- Web Dev Simplified
- Dev Ed
- The Complete Node.js Developer Course (3rd Edition) by Andrew Mead - Not front-end related but was useful which I explain in the post
- React - The Complete Guide (incl Hooks, React Router, Redux) by Maximilian Schwarzmuller
- Kent C. Dodds' blog for react & more
In March of 2020 I was taking time out after university to travel and had already been gone a year. It started to dawn on me that I would eventually have to return and I still did not know that I wanted to do with my career.
I graduated from university with an engineering degree in 2017 but towards the end of my studies I began to realize that I could not see myself going into a career as an engineer, the passion was not there. For me, the plan was always to take some time out after graduating so I could travel and see more of the world, so I did.
Back to March 2020 having spent the last year travelling and working in New Zealand, with the world on the verge of lockdown I decided to look into possible options that would suit my skills and interests. As an engineer I was always solving problems and genuinely enjoyed that part of the work so I set that as my key skill and began looking into tech related roles.
That's when I came across web-development. At first I was not sure where to begin as it seemed very overwhelming and more like a pipe-dream than anything else. Luckily a friend of a friend told me about a course they had purchased a while back which I could use as a starting point and so I wrote my first few lines of HTML with Colt Steele's "The Web Developer Bootcamp") and was immediately hooked.
I loved writing solutions to problems and immediately seeing the results on the page and was always a creative person so the idea of being able to design and build your own custom sites and apps was extremely rewarding to visualize.
Fortunately I was able to throw all of my efforts and time into learning all I could about web development and so thought it would be a good idea to share my path from beginning to where I am now, including the resources and courses I used, things I have learned and projects I was able to build.
I began with Colt Steele's "The Web Developer Bootcamp") course through Udemy as I previously mentioned.
(Udemy is an online learning marketplace featuring many different courses including ones for web-development.)
Not all courses are quality though so do your research if you decide to make a purchase. Don't be drawn in by the sales. They don't exist. Open the site in incognito and you'll see.
It was useful in guiding me through some of the basics of HTML and CSS at the stage where I had little idea what I was doing, although the course was a little outdated at the time.
Colt Steele has since updated the course for 2021 which is now much more in line with modern web-development and I consider this to be a worthwhile investment if you are after more structure in your learning.
There is a bloated collection of courses on Udemy that a lot of the time are not worth the investment or might be outdated so buyers beware.
On the whole I believe this was an extremely useful resource to me, providing all of the core features, concepts and syntax a beginner could ever need. Although it did seem to move quickly especially during the early practice projects such as the rock, paper, scissors project. There were a few times I found myself just copying code, trying to keep up but with time I found myself retaining more and more information and was able to at least understand the WHY of what I was writing.
Take your time with the content and you will be rewarded.
It should be noted I had a little prior knowledge of basic programming from a module of Java that we were required to take as first year engineers at university. Things like variables, conditionals and basic types were things I already knew a little about making the transition a little easier.
Photo by Joshua Bachand on Unsplash
Objects in Maximilian Schwarzmuller's course, and then set out to try and implement what I had learned in a project. Most of the time unsuccessfully but it forced me to look for the right answers.
I followed along with many different tutorials from:
and at the end of the two weeks I felt far more comfortable in my ability to apply common techniques and patterns myself. All of these content creators offer lots and lots of quality practice projects, tips and general knowledge teaching videos aimed at beginner and intermediate developers and I highly recommend working through this content yourself.
In order to get a taste of back-end development I purchased the The Complete Node.js Developer Course (3rd Edition) by Andrew Mead and worked my way though about half of the course before deciding that I preferred working on the client-side, although I did learn a lot which helped me with my future projects.
Photo by Nick Abrams on Unsplash.
I slowed down during these three months as I needed to earn some money to support my travels home from New Zealand and therefore started full time work during the day. In order to keep up my learning I would wake up at 5:00am on weekdays to code and get my two hours in before leaving for work. The last thing I wanted was to lose all of the progress that had already been made.
I dabbled with Github but felt a little intimated by Git and Github so I left in on the back-burner and stuck with what I knew which was certainly a mistake. For any beginners getting into development, Git is a version control system for projects while Github is the website that builds on Git allowing us to store and keep track of our projects, collaborate with others and much more.
If you would like to learn more about Git codeacademy offer a course on the topic. Although codeacademy is usually a paid service, they do offer a 7 day FREE trial for those of us on a budget (although you do have to enter a debit/credit card and cancel it before the end of the 7 days). It is must know for modern web-development and is not as scary as it seems.
October is when everything changed. After arriving back in Europe I was fortunate to find myself with nothing but time to invest in what I loved and work on development full time.
And so I set out on the challenge of building a few personal projects from start to finish and finally building my own personal portfolio so that I could eventually start the job search.
And so I did.
I built a site for a mock brewery company, a simple recipe-search app, a web based music playing site using the Spotify developer api, checkers board game and two different versions of a portfolio (the first one I was not so happy with!).
The progress during this time was very noticeable. For example, where it used to take hours for me to put together responsive site navigation was now considerably faster and I could focus more time on the the sites core services.
During this time I moved though many different styling techniques including SASS (a preprocessor scripting language that complies to CSS giving you extra features), TailwindCSS (a class-based utility first CSS framework) and more becoming very comfortable picking up new technologies and adapting to whatever was the best tool for the job.
While picking up react, I thoroughly enjoyed using the react framework next.js which markets itself as "The React Framework
for Production", so much so that I ended up re-building my portfolio using next.js.
For anyone who wants to take a look at the projects, My Github repositories.
With a portfolio full of projects, I finally had that feeling of accomplishment with something to show for all of the hours I had put in. Having been working solidly on my personal projects for the last few months I feel it is now time to refine a lot of the fundamentals I have picked up along the way.
My target is to start applying for junior front-end developer roles in the coming few months and so I have recently begun the revision and preparation process for interviews.
As a developer they say you never stop learning which definitely excites me. Looking back at my code from even three months ago makes me question what I was thinking at the time, but this is a good thing and shows the progress we can make.
For now I am focusing on:
- Data structures & algorithms
- Back to CSS fundamentals including layouts and accessibility
I hope this post was able to be of some use to you in your development and if you would like to ask me anything or keep up with my progress, you can find me on twitter @Kieran6dev.
Tell me, what are you currently learning about?