시작하기에 앞서,,,
🤔프론트 엔드가 되려면 어떤 순서로 공부를 해야할까,,,?
다음 유튜브 영상을 보고 토대로 로드맵을 작성해보고,,,
이 로드맵 순서로 블로그 작성을 해보겠!(●'◡'●)
👉프론트엔드 교육 사이트 모음
-MDN WEB DOCS
ᓚᘏᗢdeveloper.mozilla.org
-W3SCHOOLS.COM
ᓚᘏᗢw3schools.com
-CSS-TRICKS.COM
ᓚᘏᗢcss-tricks.com
-GEEKSFORGEEKS.ORG
ᓚᘏᗢgeeksforgeeks.org
HTML
👉html 공부 개념
태그 및 기본 문법
form
emmet
CSS
👉CSS 공부 개념
Selectors
Inheritance
Specificity
Box Model
Position
Display
Flexbox
Grid
Calc
Pseudo Elements
Pseudo Classes
Custom Properties
Logical Properties
Media Queries
Container Queries
Animation
Javascript
👉Js 공부 개념
Async vs Defer Script Loading
Var vs Let vs Const
Function Basics
Callbacks
Arrow Functions
Hoisting
Scoping
Closures
Strict Equality
Objects/Arrays
Reference Vs Value
DOM Traversal
DOM Manipulation
Event Listeners
Control Flow (If, Loops, etc.)
Promises
Async Await
Fetch
Browser Storage
Event Loop
Modules
Null Vs Undefined
Recursion
Bundlers
Array Methods
Template Literals
Destructoring/Spread Operator
REACT
👉REACT공부 개념
Component Model
JSX
Props
State
Events
useEffect
StrictMode
Lists/Conditional Rendering
Fragments
Refs
useMemo
useCallback
Custom Hooks
useReducer
Context
Routing
Portal
useLayoutEffect
Suspense
Best Practices
Next.js
👉Next.js 공부 개념
-App Router
Folder Based Routing
Metadata/SEO
Server vs Client Components
Data Fetching
Loading/Error Pages
Dynamic Routes
Data Cache/Request Memoization/Full Route Cache/Router Cache
Dynamic vs Static Pages
Dynamic Functions
Server Actions
useOptimistic/useFormState/useFormStatus
Parallel Routes/Intercepting Routes
Route Handlers
-Pages Directory
Page Based Routing
CSR vs SSR vs SSG vs ISR
getServerSideProps/getStaticProps/getStaticPaths/getInitialProps
API Routes
TypeScript
👉TypeScript 공부 개념
TSConfig
Type Inference
Array Type
Any/Unknown Type
Type vs Interfaces
Functions
Unions/Intersections
readonly/keyof/typeof
As Const/Enums
Tuples
Generics
Built In Types (Pick, Omit, etc.)
Type Guards
Satisfies
Discriminated Union
Function Overloads
Type Predicate
Declaration Files
others
👉추가 공부 개념
Version Control (Learn As Soon As Possible)
JSON (Learn Alongside JavaScript)
Regular Expressions (Optional)
How To Deploy
Basic Security
Testing
☆: .｡. o(≧▽≦)o .｡.:☆
