2025
2023
FULLSTACK
WEBDEV ROADMAP
Basics of HTML, CsS &JS
Choosing a framework
Version Control Complete 7 Months Guide
Choose a language for backend
Head to Databases
Devops CI/CD
LEARN THE BASICS (1 MONTH)
HTML
" Forms & Validations
" Conventions and Best Practices D
CSS
" Making Layouts
Floats, Position, Display, Grid,
Flexbox, Box Model
" Responsive Design
D
JavaScript
" Syntax &Basic Construct
" DOM Manipulation
"Fetching APls / AJAX JS
" ES6+ Syntax
SAVE & SWIPE
CHOOSE AFRAMEWORK (1.5 MONTH)
(Choose any 1)
B
CSS *My Preference
"Bootstrap
" Tailwind Sass
" Bulma, Foundation or any other.
PREPROCESSOR
SASS
" Less
JavaScript
"React
" Angular
" Vue
SAVE & SWIPE
VERSION CONTROL SYSTEM (15 DAYS )
" Git
" Github/Gitlab / BitBucket git
Package Managers
" NPM
" Yarn
Module Bundlers
" Webpack
Rollup
" Parcel
*Note - If you have chose ReactJs you should also learn
" NextJs
"ReduX NEXT. SAVE & SWIPE
FRAMEWORK
LIBRARIES
FRONTEND DONUT <Link/> <Image/) Rovter CLl
React.JS
Wanna have a donut?
CSS
Floats & positions
Flexbox
HTML
" Forms and vd<idations
NEXT.
CSS Grid
" Semantic Tag BUILD
" Accessibility & SEO basics
" Displey & transform " Convention & best practices
Box Model
Media Queries </> fully guctional
Responsive Design J« Web ApP
VCS Everything explained on
GIT @developers_community__
GITHUB
" Gitlab DESIGN TOOLS
" Bit Bucke Figma
(ay oe) AdobeXD
Photoshop
llustrator
(3-4 MONTHS )
Frontend Finished
JAVASCRIPT
FRAMEWORKS
" React Js SS
" Angular JAVASCRIPT(ES6) S H A
" Vue Js
(any one) " Syntax & basic constructs
" Bootstrap " DOM Manipulation
" Tailwind " Functions, Classes & Objects
" Bulmo w o J S N Y L
" Semantic UI CSS 3
"Fetch API or AJAX
CSS 3
PREPROCESSSOR " ES6 + Syntax
" SASS " Hoisting, Closures, Prototype
" LESS " Event Bubbling, shadow DO
ARRAYS IN WAYS TO REMOVE
9 JAVASCRIPT
CSS CSS GRID FLEXBOX OR GRID!
JAVASCRIPT DUPLICATES FROM
AN APRAYI SHORTHANDS! FILTER)
7256
USE CASES!
WEB AP, YOU SPREAD OPERATOR 8 WAYS TO LOOP CSS FLEXBOX CSS CSS PSEUDO
NEED TOO KNOW! USE CASES! OVER AN ARRAY USE CASES! :SELECTORS
MEDIA QUERY
Idiziy
BACKEND STARTS (1.5 MONTH)
Choose &Learn a language (Choose :
" JavaScript
"Java
" C#
" PHP
" Python
" Ruby
" Go
" Rust
" NodeJs
Some Knowledge on OS &
terminal commands
" Process Mangement
" Threads and Concurrency
SAVE & SWIPE
"Basic NetworkingConcepts
HEAD TO DATABASES (1 MONTH)
Choose 1
DATABASES
Relational Non -Relational
" PostgreSQL " MongoDB
" MySQL " CouchDB
" MariaDB Cassandra
" MS SQL " InfluxDB
" Oracle "Firebase
SAVE & SWIPE
DEVOPS (2 MONTHS)
Learn Some CI/CD Tools
" Gitlab CI
" Jenkins
" Azure Devops
" Circle CI Microsoft
Azure
Cloud Providers
" AWS aws
"Google Clouds
" Azure, Linode Google Cloud
" Heroku, Digital Ocean
H heroku
What is & howto setup
" Reverse & Forward prOXy
" Load Balancer
SAVE & SWIPE
" Caching Server
" Firewall
BACKEND BURGER
Containerization Architectural patterns
" Docker Microservices
" rkt (Prefer Docker) " Monolithic
" LXC " Serverless
" CORS
CI/CD Tools " SOA
" Jenkins APls
" Azure (any one) " REST
Circle CI " JSON
" SOAP
VCS Caching " GSON
" G|T " CDN
" GITHUB " Server Side
(any one)
" Gitlab " Client-Side
" Bit Bucket " Redis
Frameworks Testing
" Django Integration Testing
Depending on " Unit Testing
" ExpressJS language you picked
Laravel "Functional Testing
" Ruby on Rails
(any one)
DATABASE
" RELATIONAL
Chooseaprogramming " NON RELATIONAL
language (any one) PostgreSQL
" MySQL
" JAVA " C# MongoDB
" PYTHON " NODE JS MS SQL RethinkDB
" RUBY " GO Oracle
Want this DynamoDB
" MariaDB
PHP " RUST CouchDB
(any one in both)
burger? GraphQL
