Vue.js Stack Roadmap — Step-by-step Learning Path
Vue.js frontend with Node/Express and MongoDB backend
The Vue.js Stack roadmap
- Internet Basics — beginner
- How the Internet Works — beginner
- DNS & Hosting — beginner
- HTTP/HTTPS & Browsers — beginner
- HTML — beginner
- HTML Basics & Document Structure — beginner
- Semantic HTML — beginner
- Text, Headings & Lists — beginner
- Forms & Inputs — beginner
- Tables — beginner
- Media & Embedding — beginner
- Meta Tags & Basic SEO — beginner
- Web Accessibility (a11y) Basics — beginner
- CSS — beginner
- CSS Basics & Selectors — beginner
- The Box Model — beginner
- Positioning & Display — beginner
- Flexbox — beginner
- CSS Grid — beginner
- Responsive Design & Media Queries — beginner
- CSS Variables & Custom Properties — beginner
- Transitions & Animations — beginner
- Utility-First CSS: Tailwind — intermediate
- JavaScript — beginner
- Syntax & Variables — beginner
- Data Types & Operators — beginner
- Control Flow — beginner
- Functions & Scope — beginner
- Arrays & Array Methods — beginner
- Objects & Object Methods — beginner
- ES6+ Features — beginner
- DOM Manipulation & Events — beginner
- Asynchronous JavaScript — beginner
- Fetch API & AJAX — beginner
- Error Handling & Debugging — beginner
- JavaScript Modules — beginner
- JSON & Data Handling — beginner
- Developer Tools & Version Control — beginner
- Command Line Basics — beginner
- Code Editor Setup — beginner
- Browser DevTools — beginner
- Git Basics — beginner
- Branching & Merging — beginner
- Remote Repositories & GitHub — beginner
- Pull Requests & Code Review — beginner
- Git Workflows & Merge Conflicts — beginner
- Node.js — intermediate
- Node.js Fundamentals — intermediate
- Modules (CommonJS & ESM) — intermediate
- File System & Path Module — intermediate
- NPM & Package Management — intermediate
- Building a Basic HTTP Server — intermediate
- Event Emitters & Streams — intermediate
- Environment Variables & dotenv — intermediate
- Express.js — intermediate
- Express Basics & Setup — intermediate
- Routing — intermediate
- Middleware — intermediate
- RESTful API Design — intermediate
- Request Validation — intermediate
- Error Handling Middleware — intermediate
- File Uploads (Multer) — intermediate
- Mini Project: Complete REST API — intermediate
- MongoDB — intermediate
- MongoDB Basics — intermediate
- CRUD Operations — intermediate
- MongoDB Compass & Atlas Setup — intermediate
- Mongoose ODM Basics — intermediate
- Schema Design & Data Modeling — intermediate
- Relationships: Embedding vs Referencing — intermediate
- Indexing & Query Optimization — intermediate
- Aggregation Pipeline — intermediate
- Transactions — advanced
- Vue.js — intermediate
- Vue Fundamentals & Vite Setup — intermediate
- Single File Components (SFC) — intermediate
- Template Syntax & Directives — intermediate
- Reactivity Fundamentals — intermediate
- Components & Props — intermediate
- Emitting Events & Component Communication — intermediate
- Composition API vs Options API — intermediate
- Lifecycle Hooks — intermediate
- Computed Properties & Watchers — intermediate
- Forms & v-model Bindings — intermediate
- Vue Router — intermediate
- Pinia (State Management) — advanced
- Composables (Reusable Logic) — advanced
- Slots & Scoped Slots — intermediate
- Component Styling — intermediate
- Fetching Data (Axios/Fetch) — intermediate
- Performance Optimization — advanced
- Mini Project: Multi-Page Vue App — advanced
- Full Stack Integration (Vue Stack) — advanced
- Connecting Vue to Express — advanced
- Handling CORS — advanced
- Environment Configuration Across the Stack — advanced
- Mini Project: Full CRUD Vue Stack App — advanced
- Real-Time Communication with Socket.io — advanced
- Full-Stack File Upload Flow — advanced
- Authentication & Security — advanced
- Authentication Basics — advanced
- JWT Authentication — advanced
- Password Hashing (bcrypt) — advanced
- OAuth & Social Login — advanced
- Role-Based Access Control — advanced
- Securing Express Apps — advanced
- Protecting Vue Routes with Navigation Guards — advanced
- Testing — advanced
- Testing Fundamentals — advanced
- Unit Testing with Vitest — advanced
- Testing Vue Components (Vue Test Utils) — advanced
- API Testing with Supertest — advanced
- End-to-End Testing (Cypress/Playwright) — advanced
- Deployment & DevOps — advanced
- Environment & Build Configuration for Production — advanced
- Deploying the Vue Frontend — advanced
- Deploying the Backend — advanced
- MongoDB Atlas Production Setup — advanced
- CI/CD Basics (GitHub Actions) — advanced
- Docker Basics for Vue Stack Apps — advanced
- Domain, DNS & HTTPS Setup — advanced
- Production Best Practices & Performance — advanced
- Logging & Monitoring — advanced
- Error Tracking (Sentry) — advanced
- Caching Strategies — advanced
- Code Splitting & Lazy Loading — advanced
- API Rate Limiting & Throttling — advanced
- Scalability & Load Balancing Basics — advanced
- Clean Code, Linting & Code Reviews — advanced
- Advanced & Bonus Topics — advanced
- TypeScript with Vue — advanced
- Server-Side Rendering with Nuxt.js — advanced
- GraphQL as an Alternative to REST — advanced
- Microservices Architecture Basics — advanced
- Progressive Web Apps (PWA) — advanced
- Capstone: Production-Ready Vue Stack Portfolio Project — advanced