If you are short on time and just want to get the resources, I posted all links at the end of the post
It took me 7 exact months. I only missed 3 days(some days I forgot to commit my changes).
From learning how to declare a variable, to landing my first software developer job.
These are the resources I used.
Roadmap
Note: I started by following the front-end dev path and ended up landing a full-stack role. I'd still recommend starting with front-end even if you know you want to pursue a back-end dev career.
I guided myself based mainly on the below roadmap referred by a master software developer and dear friend(😘 Jorge).
This video gives a less overwhelming path.
Web Foundation - HTML/CSS/JS
I need to mention that I was not completely raw. I worked for 2 years with IT Support and went to college for IT(which included some coding) before quitting a year and a half later.
The IT experience ended in 2011, and the timeline of this post starts 10 years later. I basically didn't remember anything code related. Nothing.
After a refresher on how the internet/browser works, and what is HTTP/DNS, I started on FreeCodeCamp.
FreeCodeCamp (https://www.freecodecamp.org/)
- Responsive Webdesign Certification(I didn't finish this one)
- JavaScript Algorithm and Data Structure Certification
I did not go through the recommended path of doing the responsive Webdesign first and then moving to the javascript certification.
I followed my curiosity(it always gives me motivation) and jump-started the JavaScript certification. Finished the foundation subsection and with my curiosity satisfied, I went back to the Webdesign certification.
And finally, after getting bored with HTML and CSS I returned and finished the JavaScript certification.
At this point, I needed to build something, I had plenty of input and was eager to see what could come out, so I started looking for projects to build.
Stumbled upon John Smilga's 15 JavaScript Projects course on freeCodeCamp's youtube channel
It was an instant hit. I did the whole thing and had a great time.
Getting more out of my learning
Since this is a javascript course, John won't go over the HTML and CSS for the projects.
What I did was, I would take a look at the final version of his website and recreate it myself before starting the project. That way I got pretty confident in HTML and CSS while working on my javascript.
Once I finished his free youtube course, I wanted more, so I bought John's JavaScript full Course on Udemy.
Here is John's website with all his courses.
Computer Science Into
Also, through freeCodeCamp's website, I found Harvard's CS50 intro to computer science. It is bloody awesome and absolutely essential for a self-taught as myself.
worth mentioning
- I watched it on youtube
- I didn't watch lecture 6 python and lecture 9 flask
- I didn't do the exercises, just tried to understand what was going on.
- I didn't try to learn C syntax, I was interested in the CS concepts.
- Whenever I got lost, I'd go back and watch again or pause and try to understand what was going on.
- I was my passive learning, whenever I was not hands-on coding I was watching CS50
JavaScript Framework - React.js
This was a no-brainer to me after consuming John's JS course.
I bought his React.js course, which goes over almost the same projects built on the javascript course but this time in React.js.
At first, this was a downer, I didn't want to do the same projects again, but after pondering over it, it was the best thing I could do to cement my knowledge.
Again, twice the exposure to the same concepts, twice the changes of consolidating the knowledge(repetition).
Back-End - Node.js + SQL
There is no way around it, you have to know the basics of backend development, even if you plan on being a front-end dev.
The thing is, creating a more interesting/custom project will require a database and a simple server.
At this point, I was curious to know how the back end worked, how to connect the database to the server, and all that fun stuff. I had no idea, reason why it was so interesting.
Also, most people on the internet were saying that for a project to stand out or at least be considered worthy of being added to your portfolio, it had to perform the CRUD(Create, Update, Delete) operations at least. Hence needing a server and database.
In practice, it didn't take more than a few days to learn the basics of node and SQL, enough to rig up a simple back-end with DB.
Learned the basics of SQL(just what I needed for my CRUD projects):
Basics of Node.js
- John's Node.js course (did just 5% of the course)
Algorithms and Data Structures
Whether you like them or not, there is no code without algorithms and data structures. Everything you do code-wise gravitates around them.
It was very hard at first, then became just hard.
Once you have learned a few techniques and sharpened your problem-solving skills, it gets less hard.
I'd focus mostly on doing exercises tackling arrays, hashes, strings, and numbers since they will probably be your bread and butter at work.
In my case, in addition to the above, and again following my curiosity, I included: linked lists, trees/AVL/Binary, graphs, and DFS/BFS algorithms. (I am planning on going back to explore from where I left off)
Here are some of the resources I used:
- Data Structures and Algorithms in JavaScript - Full Course for Beginners
- Algorithms and Data Structures Tutorial - Full Course for Beginners
- mycodeschool
- NeetCode
- Nick White
Note: I almost burned out pushing myself too hard on this. Don't do the same. Take it slowly and steadily, or else you risk throwing your computer out the window and never using one again.
Git/Github and SCSS
Did a bunch of projects and code challenges along the way.
- 60+ CodeWars challenges
- 16 LeetCode challanges
- Build 20+ small projects along the way.
Here is a short list of some of the small projects I build:
The main projects that composed my portfolio:
What I consider key factors
With a few exceptions, I did not follow anything linearly, from top to bottom, beginning to end.
I had a "north" and let my curiosity take the lead as a general rule.
That gives me:
- persistence to understand a complex topic.
- Experimenting (reinforces learning)
- Extra motivation
When building projects I either:
- Had the idea and looked for similar projects on the internet to see what they had done and googled when stuck.
- Fused two tutorials into a unique project.
- Used a tutorial to do the front end and did my own back end (or the reverse)
I also:
- If following a tutorial, never used the same variable names(forced me to understand what is going on and not just blindly follow)
- Change the theme (if following a tutorial on how to build a movie app, I'd do a book app instead)
With all that said, I ended up landing a job whose tech stack is:
- C#, .NET MVC, SQL, Vue.js, JQuery
I had 10 days before the second interview to show that I knew enough to land the position...
That is a story for another post.
Thanks for reading!
Follow me on Twitter for shorter-form content @theguspear
Catch you later,
Gus
All Links
Roadmaps
Web Foundation - HTML/CSS/JS*
- FreeCodeCamp (https://www.freecodecamp.org/)
- Responsive Webdesign Certification
- JavaScript Algorithm and Data Structure Certification
- 15 JavaScript Projects Course
- johnsmilga.com (JavaScript)
- And for any JS question
Git/Github and SCSS
JavaScript Framework - Reacj.js
- johnsmilga.com (React.js)
Computer Science Into
Backend + SQL
Algorithms and Data Structures
Top comments (12)
Hi Gus,
I would like to suggest to your readers another link for web technologies.
The definitive Mozilla Developer Network (MDN).
All the best for your on-going learning journey.
Hey Gilmore! It's great to see you again
Thanks once more for taking the time to comment.
The MDN is nothing but the best source of info on anything JS.
Suggestion included!
I didn't include it initially because myself sometimes(as a begginer) struggled to understand it's dense and complete explanations.
Have a great week!
Hi! Congrats on landing your first job and thanks for this post.
I think you did an excellent pathway! I am still on JS FCC bootcamp (I started a few years ago HTML and CSS, and now I am full on JS.) I haven't figured out what to do with/work/create things with JS yet. And I feel lost from time to time (some days I ace it, some, most of them, not.)
I applaud your effort and persistency (I wish I had that!!) and please continue telling us about your journey, it makes me hopeful of a brighter future.
;)
Hi aizenmarina! thanks for taking the time to leave a comment.
I understand how you feel.. I felt exactly the same with a bunch of other things.
I also wasn't persistent at all in the beginning.. it took me a long time to understand that persistency and consistency are keys to achieving anything in life.
Teaching myself how to code and landing a job in a relative short time was the first "win" in my life that I attribute to consistency.
It's hard do keep doing something day after day for months without losing motivation.
I used the senfield method which in my case was the github green tiles (the photo on top of this post) to keep me going. I just didn't want to break the green sequence.
I talk more about my story here if you are interested => dev.to/gustavupp/how-i-learned-to-...
Go one day at a time. Focus on each day. Don't focus on the goal (getting the job or mastering JS) focus on opening your editor and coding for a few minutes every single day. I'll invariably get there.
It was great to hear from you! Best of luck with JS and please let me know if there is anything I can help you with.
I am also "trying" to be active on twitter twitter.com/gus_ppereira.
Thank you so much for your authentic post. I appreciate your post so much. resourceful and great roadmap sharing. It may be just a post with some words, I share mutual feelings on your coding journey from beginner to professional.
Thank you Alex for taking the time to leave a comment. Writing about it as I went down the learning path was one of the things I should've done, but did not. It wasn't easy, but it was definitely worth it.
This was a really helpful look at the self taught path and showed me that I'm on the right track. I also love the github tracker image showing your timeline. It really drives home the work you did.
Thank you so much Angie for positively fueling me with your comment. I honestly hope that by sharing my journey I have somehow given you a little push towards your first role as a software developer. That github image was my accountability partner... My simple goal was not to break the green tile chain. All the best in your journey and come back to tell us when you land your first dev job.
This is an awesome resource for anyone starting out. Great job on this
Thanks for taking the time to comment Nilan. I really appreciate it.
Cool
Thanks for leaving a comment mstnt-663!