Scribd
Upload
9 views1 page

Frontend Roadmap 2024

Uploaded by

ahmedelshpasy1560
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
9 views1 page

Frontend Roadmap 2024

Uploaded by

ahmedelshpasy1560
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 1

Frontend Roadmap in 2024

By SimpleArabCode

Internet - Video

How does the internet work

What is HTTP

How web works (Browser & Server)

DNS and How it works

What is Domain Name

What is Hosting

HT ML Course - Video coming soon Projects Come with the course

The Basics

Writing Semantic HT ML
Forms and Validations

Conventions and best practices

Accessibility

SEO Basics

CSS Course - Video coming soon Projects Come with the course

Selectors Grid

Inheritance Pseudo Elements

Box Model Custom Properties

Position Media Queries


Display Container Queries

Flex Box Animation

JavaScript Course - Video coming soon Projects Come with the course

Syntax and Basics Destructuring / Spread Operator

DO M Manipulation
Fetch API / Ajax (XHR)

ES6+ and modular JavaScript

Hoisting, Event Bubbling, Scope,Prototype, Shadow DO M,strict


Template Literals

Frontend Frameworks - (Choose one of these frameworks)

React (Recommended) - Course

Svelte

Angular

Vue

React Course - Video Projects

CLI Tools (Vite & Create React App)

Components Basics (Functional and Class)

Props, State, JSX, Conditional Rendering


Hooks (useState,useEffect) and LifeCycle Methods (componentDidUpdate)
Higher Order Component

Error Boundaries

Context API & optimistic updates

Fetch and Axios

React Eco System => React Router Dom, React Hook Form, Redux , Material UI & Tailwind

CSS, React testing library

The React Frameworks for the Web (Optional)

Next.js (Recommended) - Course - Projects

Remix

Next.js Course Course - Projects

App Router Course Pages Directory Course

Folder Based Routing Folder & File Based Routing

Metadata / SEO CSR vs SSR vs SSG vs ISR

Server vs Client Components getServerSideProps,getStaticProps,

getStaticPaths, getInitialProps

Data Fetching and Caching


API Routes

Loading / Error Pages

Dynamic vs Static Pages

Server Actions

Route Handlers

TypeScript Course Course

React with typescript Course


Ts Config

Type vs Interface
Basic Types

Tuples and Array Type


Advanced Props

Generics
Event and Style Props

Union
useState Type Assertion

As Const / Enums
use Reducer Strict Action Types

readonly/keyof/typeof

Functions

Any/ Unknown Type

Other Important Topics

Version Control System (Github)

Deployment

Web Security (HTTPS,CORS)

Web Sockets

DevTools and Lighthouse

You might also like