What you will be able to do
- Build responsive interfaces with semantic HTML and modern CSS
- Write confident modern JavaScript including async patterns
- Create component-driven React apps with client-side routing and state
- Design REST APIs, model relational data and handle authentication
- Deploy full applications with CI, environment variables and a real database
Before you start
- Basic computer literacy
- Willingness to debug
- No prior coding experience required
The week-by-week plan
Already know an early week? Start at your first real gap instead of week one — the projects still build on each other from wherever you join.
Week 1: HTML and the web
- Semantic elements
- Forms and inputs
- Accessibility basics
- How browsers request pages
Project: Static multi-section personal profile page
Week 2: CSS layout
- Box model
- Flexbox
- Grid
- Responsive breakpoints
Project: Rebuild a landing page from a screenshot
Week 3: Modern CSS craft
- Custom properties
- Transitions
- Dark mode
- Utility-first CSS
Project: Themeable pricing page with light and dark modes
Week 4: JavaScript fundamentals
- Types and scope
- Arrays and objects
- Functions and closures
- The DOM
Project: Interactive to-do list with local storage
Week 5: Async JavaScript
- Promises
- async/await
- fetch and JSON
- Error handling
Project: Weather dashboard consuming a public API
Week 6: Tooling and Git
- npm and package.json
- Vite
- Git branching
- Pull requests
Project: Publish week 5's app to GitHub with a clean history
Week 7: React basics
- JSX
- Props and state
- Lists and keys
- Events
Project: Convert the to-do list to React
Week 8: React patterns
- useEffect
- Custom hooks
- Lifting state
- Composition
Project: Movie search app with debounced queries
Week 9: Routing and data fetching
- Client-side routing
- Loaders
- Caching
- Loading and error states
Project: Multi-page blog reader with cached routes
Week 10: Node and Express
- HTTP servers
- Routing and middleware
- Request validation
- Environment config
Project: REST API for the to-do app
Week 11: Databases
- Relational modelling
- SQL basics
- Migrations
- Indexes
Project: Persist the API to PostgreSQL with migrations
Week 12: Authentication
- Password hashing
- Sessions vs JWT
- Protected routes
- Row-level authorisation
Project: Sign-up, login and per-user data
Week 13: Connecting the stack
- API clients
- Optimistic updates
- Form validation
- Error boundaries
Project: Full CRUD frontend against your own API
Week 14: Testing and quality
- Unit tests
- Component tests
- API tests
- Linting and formatting
Project: Add a test suite that runs in CI
Week 15: Deployment
- Build pipelines
- Environment variables
- Managed databases
- Logs and monitoring
Project: Deploy frontend and backend to production URLs
Week 16: Portfolio capstone
- Scoping a product
- Reading other people's code
- Performance basics
- Writing a README
Project: Ship one original full stack product end to end
Tools you will use
Where this roadmap leads
Frontend Developer
Interview-ready around week 9 with two strong React projects.
Backend Developer
Weeks 10-14 plus deeper SQL make this the fastest path if you prefer data over UI.
Full Stack Developer
The week 16 capstone is what most junior full stack interviews are built around.
Frequently asked questions
How long does it take to become a full stack developer?
Around 16 weeks of consistent 8-12 hour weeks to reach junior level with a capstone. Learners already comfortable with HTML, CSS and JavaScript usually start at week 7 and finish in about ten weeks.
Should I learn frontend or backend first?
Frontend first. Seeing your code render keeps momentum high, and the JavaScript you learn in weeks 4-5 transfers directly to Node in week 10.
Is a computer science degree required?
No. Junior hiring is dominated by portfolio evidence and a working knowledge of Git, deployment and debugging, all of which this roadmap covers.
Which stack should I choose in 2026?
React with a Node or serverless backend and PostgreSQL remains the most hireable default. Learn the concepts here and switching to another framework later takes days, not months.
Want this plan scheduled for you?
Pathlix turns roadmaps like this into daily goals sized to your study hours, tracks your streak, and tests you every week.