Scribd
Upload
43 views

Roadmap MS FS

This document provides an overview of full stack development, including: 1) It explains how a website functions from entering a URL to displaying content, involving DNS servers, IP addresses, backend servers, programming languages, and databases. 2) It outlines different types of developers like frontend, backend, database, and infrastructure/DevOps engineers. 3) A full stack developer works with both frontend and backend technologies, with variations in the time spent on each area. 4) Roadmaps are provided for becoming a frontend and backend developer, involving languages like HTML, CSS, JavaScript, and frameworks/libraries.

Uploaded by

phalgunikarmakar315
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
43 views

Roadmap MS FS

This document provides an overview of full stack development, including: 1) It explains how a website functions from entering a URL to displaying content, involving DNS servers, IP addresses, backend servers, programming languages, and databases. 2) It outlines different types of developers like frontend, backend, database, and infrastructure/DevOps engineers. 3) A full stack developer works with both frontend and backend technologies, with variations in the time spent on each area. 4) Roadmaps are provided for becoming a frontend and backend developer, involving languages like HTML, CSS, JavaScript, and frameworks/libraries.

Uploaded by

phalgunikarmakar315
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 8

1) Beginner roadmap to frontend dev

2) Beginner roadmap to backend dev


3) Easiest way to be a fullstack dev
4) Advanced frontend dev technologies
5) Advanced backend dev technologies
6) Interviews for these roles (For all the roles)
7) Package in these roles

Who is a full stack developer


Different verticals of development

1) When you enter the URL


2) You need the IP address of the URL provided
3) This IP is stored in a DNS server
4) DNS server’s ip address is provided in the Router
5) Domain name server - There is a map b/w the urls and the
ipaddress
6) IP address of the website that you are looking for
7) What is behind the IP address
8) There is a server that is going to accept requests and respond to
the requests
9) On top of these servers there are some backend languages that
are running
10) They enable the connection between your browser to the server
11) HTML to the browser
12) Browser then displays this html onto the screen
13) JS and Css provide the interactivity to the website
14) Backend has a connection to the Database

There is something known as cloud


The server could be used to run a backend
Run a database
Infrastructure for the website
AWS/GCP/Azure

1) Backend Developer - Whoever writes code in these backend


languages is a backend developer
2) Frontend Developer - HTML, CSS,JS,REact
3) Database Developer- Creates the data interacts fetches the data
4) Infrastructure Developer, Devops Engineer, Site Reliability Eng-
They take care of the infrastructure for a website.

Fullstack Developer?

Types of Fullstack developer

50-50 FE BE
70 FE 30 BE
30 FE 70 BE

Pick either of backend or frontend become one of these developers then


pick the other aspect

Roadmap to becoming a frontend


developer(https://roadmap.sh/frontend?r=frontend-beginner)

HTML

● W3Schools: Learn HTML


● htmlreference.io: All HTML elements at a glance
● HTML For Beginners The Easy Way
● Web Development Basics
● Codecademy - Learn HTML
● Interactive HTML Course
● HTML Full Course for Beginners | Complete All-in-One Tutorial
● HTML Full Course - Build a Website Tutorial
● HTML Tutorial for Beginners: HTML Crash Course

CSS

● The Odin Project


● What The Flexbox!
● Learn CSS | Codecademy
● Learn Intermediate CSS | Codecademy
● CSS Complete Course
● CSS Crash Course For Absolute Beginners
● HTML and CSS Tutorial
● CSS Masterclass - Tutorial & Course for Beginners
● W3Schools — Learn CSS
● cssreference.io: All CSS properties at a glance
● Web.dev by Google — Learn CSS
● freeCodeCamp — Responsive Web Design
● Learn to Code HTML & CSS
● Joshw Comeaus CSS Hack Blog Posts
● 100 Days CSS Challenge
● CSS Tutorial | Scaler

JS

● Visit Dedicated JavaScript Roadmap


● W3Schools – JavaScript Tutorial
● The Modern JavaScript Tutorial
● Learn JavaScript: Covered many topics
● Eloquent JavaScript textbook
● You Dont Know JS Yet (book series)
● JavaScript Crash Course for Beginners
● Build a Netflix Landing Page Clone with HTML, CSS & JS
● Build 30 Javascript projects in 30 days
● Learn the basics of JavaScript
● JavaScript for Beginners

Concepts
Closure
Event loops
Currying
Hoisting
Callbacks
Promises
AJAX

NPM is known as Node package manager

Javascript developer create packages(JS functions)

Are created and uploaded on Node


Node == Library
Books == Packages(JS package)
Librarian == NPM

Frontend Framework(React/Angular/Vue)

Job is to enhance the developer experience in creating websites


Provide faster and more performant websites that plain JS

CSS frameworks

Tailwind/Bootstrap

Testing you application


Jest/ chai mocha jasmine
3-6 months

Roadmap to backend development (https://roadmap.sh/backend)

Pick a backend Language

Java (Lot of jobs)


Python (Web+ DSML)
NodeJS (huge share of market is moving)
Ruby on rails
PHP
.net (Banking)
C#
C++
Go
Rust

What is the fastest way to become a fullstack developer

Javascript
MERN - Mongo Express React Node
MEAN - Mongo Express Angular Node

Database

Relation Database
Non Relational Database
People

1 Rahul
2 Ankush
3 Mrinal
4 Fazal
5 Rishabh
6 Udbhav

Friends
Id people_id
1 2
2 3
3 5

Relational database

MySQL
PostgreSQL
MariaDB
Oracle

Useful where you want to have secure transactions

Non relational Database NoSQL database


Mongo
Redis

API’s
Frontend would send a call to backend saying I want this data

API call happens to the backend sending data of location user details
Backend responds with data of all the movies currently running

API call to the backend with location of the user and movie choice

Data back to frontend


Theaters sorted by the distance of the location of the user to the
frontend

User then clicks on one of the Theater what happens now


Backend sends a map of seats
Available seats
Booked seats
Prices of each seat
Categories of the seats

API’s

This is a small example of LLD for your backend


Low level design

Authentication methods

SSO - You are logged into google account

JWT -
Oauth -
Browser caching - Cache the resources like images/JS/CSS on the
browser
CDN caching - We will provide you with spare servers which could be
used to store images/JS/CSS or static content

Rounds that are there for these interview

Round 0 - Aptitude test


Round 1- Basics test like js html css or DSA round
Round 2- Framework round(react/Angular/VUe) for backend LLD round
Round 3- Development round
Round 4- Basics round for backend and frontend
Round 5 - Cultural fitment round

FANG- DSA all across mostly all the interviews

If you are a senior developer

HLD round High level design

Knowledge of infrastructure

You might also like