No-BS Web Development "Course"/Roadmap 🚀

Welcome to the no-nonsense web development "course" meant to help guide you to learn web development and coding in JS the right way, with basic instruction and explaination followed by practice/mini project based experimenting on your end. 🌐💻

Overview

This web development "course" is not your typical, lengthy, and boring program. I've curated a collection of video-based lessons from various expert sources, ensuring you get diverse perspectives and hands-on insights.

Getting Started 🏁

1. Introduction

• 🧠 Understand a good mindset for coding as a whole and how expansive the field is.
• 💡 Get an intro on the field of web development and it's capabilities

2. Foundations

• 🚀 Dive into the basics of HTML, CSS, and JavaScript.
• 📚 Acquire good resources for developing, a treasure chest perhaps

3. Frontend

• 🎨 Explore responsive design and user interface (UI) principles.
• 🐇 Going down the rabit hole of frontend tools and CSS buffs that makes life easier and is used a lot in frontend.
• 🚗 Navigate the more advanced world of front-end frameworks like React and Vue.

4. Backend

• 🛠️ Learn server-side scripting with Node.js.
• 🗃️ Dive into API's and understanding how they're used.
• 🔥 Get an introduction to software development toolkits for the backend heavy lifting.

5. Web app structures

• 🛠️ Learn what goes into a web app project and how they're structured.
• 🗃️ Have a look into some of the infrastructures other companies use and how they work.
• 🔥 Learn how to plan and put together a full stack web app

TODO

• Monetized web apps
• TBD

How It Works 🛠️

1. 📺 Video Lessons: Watch engaging video content from top-notch creators.
2. 📚 Documentation: My centralized documentation breaks down complex topics and explains how you could go about practicing.
3. 🚀 Hands-On Labs: Apply your knowledge with hands-on exercises.
4. 🤝 External Sources: Gain a new mindset with coding alongside many coding resources which even I use when I'm stuck on a project or trying to learn a concept quickly.

Who Is This For? 🎯

• 👩‍💻 Beginners looking to kickstart their web development journey with efficiency.
• 🚀 Developers wanting to level up their skills with practical knowledge beyond basic HTML, CSS, and JS.
• 🌐 Enthusiasts eager to explore both frontend and backend development.
• 👍 Anybody wanting to simply understand the complexity of web development and what can go into a full stack project!

Ready to Dive In? 🚀

Start here!!

Also, for those curious

How it's made:

I'm using nuxt which is a Meta-framework for universal applications with a prebuilt documentation template called docus which utilizes nuxt's great markdown integration features. That paired with lots of writing and configuring resulted in this clean UI. So props to Docus and the team that put it together, I'll probably be using this for documentation as apposed to what I had planned originally which was a static site generator.

All hosted on my server running 24/7 (mostly) via docker. Check the status of the site here. Also I'll be making a proper tech stack visual later