WHAT WE STUDY
확장성과 재사용성을
고려한 엔지니어링
React를 활용한 컴포넌트 기반의 UI 개발
새로운 기술 토픽 공유
지속적으로 발전하는 웹 트렌드에 맞춰
최신 기술 도입을 논의하고, 이를 프로젝트에 적용
사용자 경험 향상
웹 접근성, 크로스 브라우징, 검색엔진 최적화,
그리고 개인화된 경험 제공
Frontend 비기너
커리큘럼을 소개합니다
1주차
1
FrontEnd는 무엇을 배우는 것인가? (역할과 이해)
2
HTML
HTML이 뭘까?
Tag, Element, Attribute
HTML 문서 구조 (head, body)
3
CSS
CSS가 뭘까? (구조, 적용방식)
BOX Model
CSS Layout
2주차
1
JavaScript
표준 내장 객체
식, 연산자
선언문
함수와 화살표 함수
2
TypeScript
3주차
1
DOM
HTML 데이터 읽기, 변경
템플릿 리터럴
2
BOM
브라우저 API
BOM 객체
3
Event
Event binding
이벤트 종류와 객체
흐름과 제어
4주차
1
웹 동작 방식
웹 서버와 클라이언트
URL
HTTP
2
동기/비동기
Event Loop
3
AJAX, JSON
4
RESTful API
5
JS 비동기
callback
Promise, async/await
Fetch API, axios
debounce, throttle
6
loading
placeholder data, skeleton
lazy loading
5주차
1
Interactive Web 실습
6주차
1
FE Framework
2
node.js
3
Webpack
4
package manager
npm, pnpm
yarn, yarn berry
5
렌더링 방식
SPA, MPA
CSR, SSR
6
실습 : React 프로젝트 만들기
Vite
프로젝트 배포 (github actions, CI/CD)
package.json
구조 학습
7주차
1
Virtual DOM
2
JSX
html과의 차이
규칙과 attribute 작성
props 전달
event handling
key
3
Component(Class, Function)
4
Hooks
5
State
useState
불변성
6
Life Cycle
react의 life cycle
useEffect
7
ref
useRef
8주차
1
React router
React Router DOM
useParams
useLocation
useNavigate
2
React 스타일링
BEM이란?
React 스타일링 방법
(CSS module, Styled Components, Emotion, tailwind)
9주차
1
Component
조합과 상속
제어와 비제어
2
Reusing
HOC
Context API
Compound pattern
Custom Hooks
3
side Effect
4
React Fragment
5
Portal
10주차
1
useContext, useReducer
2
메모이제이션
useMemo
useCallback
3
라이브러리
Zustand
Recoil
Redux Toolkit
Jotai
11주차
1
useEffect 활용
2
api 모듈화
3
Fetching state, Server state
tanstack query
useSWR
4
Suspense
5
Error Boundaries
12주차
1
프로젝트에 TS 환경 추가하기
props, element, event type
hook, tanstack query type
2
브라우저 저장소
localStorage
sessionStorage
Cookie(jwt, session)
3
Fetching state, Server state
tanstack query
useSWR
4
Suspense
5
Error Boundaries
13주차
1
React 실습
배운 내용 바탕으로 React 프로젝트 진행
14~17주차
1
Frontend 개인 프로젝트
18주차
1
Frontend 응용 - 회고
사용하는 기술스택
함께 할 멤버들
REGULAR
김민재
REGULAR
김혜준
REGULAR
김도훈
REGULAR
정해성
REGULAR
곽승주
REGULAR
서예진
REGULAR
조정원
REGULAR
최정훈
REGULAR
강성훈
REGULAR
김대관
REGULAR
심윤섭
REGULAR
채승윤
REGULAR
이해루
REGULAR
김대의
REGULAR
김하나
REGULAR
윤해진
REGULAR
정민구
REGULAR
이준영
REGULAR
김아영
REGULAR
이동훈
REGULAR
이재익