| 섹션 1. React JS의 개요 |
|
React JS의 개요 및 Hello World |
|
00:15:00 |
|
코드펜(Codepen)을 이용한 React 개발환경 구축하기 |
|
00:08:00 |
|
React에서 JSX |
|
00:12:00 |
|
리액트에서 컴포넌트(Component)와 Props |
|
00:12:00 |
|
리액트의 State |
|
00:14:00 |
|
React 라이브러리의 라이프 사이클(Life Cycle) 및 API 호출 |
|
00:13:00 |
|
React의 이벤트 처리(Event Handling) |
|
00:05:00 |
| 섹션 2.React와 Node.js를 활용한 고객 관리 시스템 개발 |
|
Create React App으로 리액트 프로젝트 시작하기 |
|
00:09:00 |
|
Visual Studio Code를 이용한 소스코드 작성 |
|
00:04:00 |
|
깃 허브(Git Hub)를 이용해 소스코드 관리하기 |
|
00:08:00 |
|
고객 컴포넌트(Component) 만들기 |
|
00:08:00 |
|
고객 컴포넌트(Component) 구조화하기 |
|
00:13:00 |
|
Material UI를 적용하여 고객 테이블 디자인하기 |
|
00:12:00 |
|
Node.js Express 서버 개발환경 구축하기 |
|
00:09:00 |
|
Node.js Express에서 REST API 구축하기 |
|
00:19:00 |
|
React의 라이프 사이클 이해 및 API 로딩 처리 구현하기 |
|
00:10:00 |
|
AWS RDS 서비스를 이용하여 MySQL DB 구축하기 |
|
00:13:00 |
|
고객(Customer) DB 테이블 구축 및 Express와 연동하기 |
|
00:14:00 |
|
고객 추가 양식(Form) 구현 및 이벤트 핸들링 |
|
00:15:00 |
|
Node.js Express에서 파일 업로드 요청 처리 및 DB에 데이터 삽입 |
|
00:12:00 |
|
부모 컴포넌트의 상태(State) 변경을 통한 고객 정보 갱신 |
|
00:06:00 |
|
고객(Customer) 정보 삭제 기능 구현하기 |
|
00:13:00 |
|
Material UI 모달(Modal) 디자인 구현하기 |
|
00:16:00 |
|
AppBar 및 웹 폰트를 적용하여 디자인 개편하기 |
|
00:12:00 |
|
필터(Filter) 함수를 이용한 고객(Customer) 검색 기능 구현하기 |
|
00:07:00 |
