The ultimate guide to learning to code & full stack development that will land you a job in no time 🔥
Hi,
I'm James, a self-taught software developer, and this guide is the roadmap I wish I had as I endeavored to learn programming with the ultimate goal of being employed as a software developer. Successful as I was, it was a journey fraught with peril and with the knowledge I have today, there are many things I would do differently & better. You can learn more about my journey here ->
With this guide, hopefully you too can learn to code (even if you have no prior experience) and land your developer role!
If you're enjoying the guide, consider staring ⭐️ & sharing the repo :P Or check out the interactive version🔥
You're not alone in your journey, dive in to our coding community.
- Youtube -> https://www.youtube.com/smoljames
- Discord -> https://discord.gg/BYr6gujs4k
- Newsletter -> https://smoljames.beehiiv.com/subscribe
- Course Notes -> https://www.smoljames.com/notes
Finally, time for the good stuff 🎉
Completion time [10hrs]
We begin our journey with HTML CSS & GIT. The first two are essentially the backbone of the internet, and are the perfect entry point for beginner developers. GIT on the otherhand, is a code version management that companies use to organize their work.
-
Code a SUPREME Web-Portfolio w. HTML & CSS (& nothing else) [40mins]
-
Learn HTML & CSS - Build & Deploy a Linktr.ee Clone [Beginner Tutorial] [30mins]
-
GIT Crash Course [13mins]
-
Learn HTTPS Networking [14mins]
Summary notes and reference material can be found here ->
Build your first ever Single Page Application (SPA) - a portfolio website showcasing your coding skills! Using only HTML and CSS, create a responsive website with sections for introducing yourself, listing your skills and projects, and providing contact details. Don't hesitate to experiment with design and interactive elements (it doesn't need to be perfect).
After completing a tutorial or project, share your work on Twitter, LinkedIn or in the Discord channel and tag me too so everyone can be inspired by your success :P
Completion time [10hrs]
JavaScript is the most popular programming language in the world and is brilliant for both frontend and backend development.
For this chapter you can select either the FreeCodeCamp curriculum OR the JavaScript Course 🔥
-
FreeCodeCamp JavaScript Algorithms & Data Structures [300 hrs]
-
The Complete JavaScript Course - Zero to Hero in 2024 [9 hrs]
Ready to combine your passion for food and coding? Build an interactive Single Page Application (SPA) - your own recipe book! Using HTML, CSS, and JavaScript, create a responsive app with recipe lists, detailed instructions, and search functionality. Showcase your culinary creativity and explore data manipulation, user interaction, and SPA design.
After completing a tutorial or project, share your work on Twitter, LinkedIn or in the Discord channel and tag me too so everyone can be inspired by your success :P
Completion time [20hrs]
JavaScript frameworks make building dynamic and interactive websites incredibly easy. There's loads to pick from but React.js is a great place to start!
-
React.js Crash Course -> Zero to Hero (Build a GYM App) [1.5hrs]
-
SvelteKit Web Portfolio [1.2hrs]
-
Learn NextJS 13: Build a Modern Full-Stack E-commerce App with TailwindCSS + Stripe + Zustand [1.5hrs]
-
Learn Qwik - The World's Fastest JavaScript Web Framework [1.5hrs]
Dive into the world of dynamic weather with React! Build a user-friendly dashboard displaying current conditions and forecasts for any location. Utilize React components, state management, and API integration to bring weather data to life with informative visuals and interactive features. Showcase your React mastery and share your stunning weather app with the world!
After completing a tutorial or project, share your work on Twitter, LinkedIn or in the Discord channel and tag me too so everyone can be inspired by your success :P
Completion time [20hrs]
If you're looking to extend your capabilites beyond Frontend development into Full Stack development, then it's time to explore CRUD, APIs & backend servers!
Take your first steps in backend development with a simple "To-Do List" app! Build an API with Node.js and Express to add, list, and mark tasks as complete, all while utilizing in-memory data storage and basic error handling.
After completing a tutorial or project, share your work on Twitter, LinkedIn or in the Discord channel and tag me too so everyone can be inspired by your success :P
Completion time [10hrs]
It's time to persist data - all the data... all of it!
-
Mongo.db Tutorial [-/- hrs]
-
FreeCodeCamp SQL Tutorial [-/- hrs]
Build a backend API with Node.js, Express.js & PostgreSQL that manages a stores inventory! Actions should include being able to read, add, update & delete items - basically all the standard CRUD operations, and also allow the owner to manage stock levels & quantities.
After completing a tutorial or project, share your work on Twitter, LinkedIn or in the Discord channel and tag me too so everyone can be inspired by your success :P
Completion time [10hrs]
This chapter will help us to synthesise all our knowledge together under the branch of programming known as Full Stack Development. We'll learn how we can integrate all of the systems we've learned to far to build and deploy amazing web applications for just about purpose or application.
-
Passing Data Between Frontend and Backend | Node.js [20mins]
-
Learn Next.js by building a full-stack CRUD app | Nextjs + Firebase (Auth & Firestore) + TailwindCSS [2hrs]
-
Learn SvelteKit by building a Full Stack CRUD app | SvelteKit & Firebase (Auth + DB) [1.33hrs]
Now that you've got the knowledge you need to start building some wicked full stack web applications, here's my recommendation for the best trio of projects to include in your web portfolio.
Projects do not need to be overly complex, just clean and well coded
-
Web portfolio -> You'll need somewhere to store you work. Recommended to use a JavaScript framework combined with TailwindCSS
-
Frontend Framework (e.g. React.js or Next.js) that consumes an API (weather app, pokemon pokedex etc.).
-
An API project that uses the REST methodologies with Node.js, Express.js and PostgreSQL. Bonus points if you can contain it within a Docker Container and combine it with the ChatGPT API.
-
A Full Stack project using a frontend framework (React.js or SvelteKit), Firebase auth, Firebase Firestore database & TailwindCSS. This could be a calender app, a todo app, or even a recipe app.
After completing a tutorial or project, share your work on Twitter, LinkedIn or in the Discord channel and tag me too so everyone can be inspired by your success :P
- Full Stack Projects
- Frontend Project
- Backend Project Recommendations
Everything you could ever want to know about landing your software developer job can be found here ->
This part cannot be understated and is equally important as the entirety of the learning to code section!
To make the process a hint more fun and engaging, there's a few extracurricular activities happening on the regular that you might wish to participate in!
- Builder Streams -> Weekly streams @ 2pm EDT time where we'll spend some time developing projects and doing other programming related things!
- Project Feedback -> Get feedback and assistance on your project in the #share-your-projects channel in the Discord.
- Mock Interviews -> Practice your interview skills with some mock interviews (they might get uploaded to the channel so be prepared :D).
- Coding Battles -> Nothing like a challenge and in the coding battles we'll see who can program different things faster.
This journey can be challenging, even at the best of times. But with some patience & consistency you can absolutely become an extremely capable developer and have a successful career in tech, or just build hella bomb projects for the memes - it's up to you :P There's loads of us on this path together so just keep in mind that there's always a community here to support you along the way and we're pretty active in the Discord chat if you want to come hang out!
Cheers,
James