React로 구현하는 웹 애플리케이션 프로젝트 CAMP

리액트 개발의 A to Z
Web Application 개발 프로세스 완주하기

  • #ES6
  • #상태관리
  • #스타일링
기간
2020년 7월 11일 - 9월 5일 총 8주 (8월 15일 휴강)
일정
매주 토요일, 14:00 - 18:00 주 1회, 총 32시간
장소
패스트캠퍼스 강남강의장 강남역 4번출구, 미왕빌딩
문의
02-568-9886 help@fastcampus.co.kr

본 강의는 모집이 마감되었습니다.
다음 기수 출시알림을 신청해주시면, 특별 할인혜택과 함께 가장 먼저 소식을 알려드리겠습니다.

리액트 정복.

React 개발 프로세스 전체를 경험하며
전체 구조를 잡는 능력을 기르세요.
여기에 함께 활용 가능한 기술 조합까지 8주 만에

Component로 UI를 쉽게 개발할 수 있는 라이브러리 React.
복잡한 코드 없이도 웹 프론트엔드·데이터가 수시로 업데이트되는 서비스 구축!
전 세계 개발자들이 주목하고 있습니다.

학습방식.

REACT를 어떻게 알려주나요?

문서로 배우기 힘든 구조화부터 실무까지

단순히 리액트 라이브러리의 사용방법을 배우는 것이 아니라, 여러분이 실제로 실무에서 사용할 때 필요할 지식을 알려드립니다. 리액트는 다른 라이브러리나 프레임워크에 비해 개발자가 꼭 지켜야 할 규칙이 적어 자유도가 높은 것이 장점입니다. 하지만 자유도가 높아서 처음 시작하는 개발자들은 리액트 활용이 어려울 수 있습니다. 이 코스는 강사님과 함께 프로젝트를 어떻게 설계하는지부터 시작해 실무 노하우를 알아가는 과정입니다.

만들고 싶은것을 만들 수 있게

이 강의의 목표는 여러분이 만들고 싶은것을 직접 구현 할 수 있게 해주는 것입니다. 오직 리액트만 다루면 배경지식이 이미 있지 않은 이상 충분한 활용을 할 수 없습니다. 관련 기술을 아직 잘 다루지 못하는 분들을 위하여 ‘프론트엔드 개발 올인원 패키지 Online. With React.js’ 포함한 추가 자료가 부록으로 제공됩니다 (동영상/문서). 때문에, 강의를 마칠 시점엔, 만들고 싶은 서비스를 개발하는데 필요한 지식들을 충분히 갖춰나갈 수 있을 것입니다.

프로젝트로 체득하는 React 핵심

프로젝트를 통해 프론트엔드 프로그래밍의 기초, 그 이상을 얻어가실 수 있습니다. 프로젝트를 완성해가면서 스타일링, 상태관리, API 연동, 라우팅, 서버사이드 렌더링, 코드 스플리팅, 테스팅 등의 다양한 기술들을 학습하여 실무에 바로 적용 할 수 있는 풍부한 경험치를 쌓아드립니다

기술서적 리뷰사이트 구현하기.

수업에서는 어떤 프로젝트를 진행하나요?

매 수업시간에 배운 내용을 프로젝트에 적용해서 조금씩 완성합니다.
React 개발의 프로세스 전반을 경험하며 한 사이클을 완주할 수 있습니다.
개발 기술 뿐만 아니라 전체적인 구조를 잡는 능력까지 가져갑니다.

가이드라인이 없는 리액트, 어떻게 활용하느냐가
실무 생산성을 좌우합니다.

커리큘럼.
1주차 수업.
리액트 시작하기


📕이론
- 리액트를 위한 ES6 기본 문법 정리
- 리액트가 하는 일
- 자바스크립트 컴파일 없이 리액트 시작하기
- Rendering 이해하기
- Component 의 이해
- JSX 문법
- props 와 state
- 이벤트 처리

✏️실습
[프로젝트] Tutorial: Intro to React
2주차 수업.
리액트 프로젝트 구성


📕이론
- Prettier + ESLint + husky + lint-staged 사용하기
- 리액트 컴포넌트 디버깅
- tic-tac-toe
- Component Life Cycle
- React 의 라우팅 이해하기 (react-router)
- Higher Order Component (HoC) 알아보기

✏️실습
- [프로젝트] 리액트 라우터 복습
3주차 수업.
리액트 스타일링 정복


📕이론
- 컴포넌트 스타일링
- CSS Module
- Sass
- Styled-components
- Ant Design 활용하기

✏️실습
- [프로젝트] 개발 서적 평가 서비스 로그인 디자인
4주차 수업.
리액트 실전 활용법
📕이론
- Optimizing Performance Hooks
- Context API
- Component Controlled - Component 와 Uncontrolled Component
- Login 요청하기
- localStorage
- Rest API 로 데이터 가져오기

✏️실습
[프로젝트] 개발 서적 평가 서비스 백엔드 API 와 연동하기
5주차 수업.
REDUX(리덕스) 기초
📕이론
- 컴포넌트 간 통신
- 리덕스 개요
- 리덕스 Action
- 리덕스 Reducers
- createStore, combineReducers
- Context API 사용하기
- react-redux

✏️실습
- [프로젝트] 개발 서적 평가 서비스에 리덕스 적용하기
6주차 수업.
리덕스 심화 (1)
📕이론
- Async Action with Router
- 리덕스 미들웨어
- redux-thunk
- redux-promise-middleware
- react-router-dom 과 redux 함께 쓰기

✏️실습
- [프로젝트] 개발 서적 평가 서비스 리덕스 미들웨어 적용
7주차 수업.
리덕스 심화 (2)
📕이론
- Ducks Pattern
- Connect with Hooks
- redux-actions
- redux-saga
- Immutable.js
- createPortal

✏️실습
[프로젝트] 개발 서적 평가 서비스 테스트 작성하기
8주차 수업.
TESTING & PRODUCTION
📕이론
- JavaScript 테스트
- Jest 사용하기
- 리액트 컴포넌트 테스트
- react-testing-library 활용하기
- 리덕스 / 비동기작업의 테스트
- 프로젝트 배포 이해하기
- AWS S3 에 React Wep App 배포하기
- node.js express 로 React Wep App 배포하기
- NginX 로 React Wep App 배포하기
- 서버사이드 렌더링 이해하기

✏️실습
- [프로젝트] 개발 서적 평가 서비스 마무리
추가 혜택.

오직 오프라인 수강생에게만 드리는 영상 강의 2종 혜택!

수강생 여러분의 원활한 학습을 위하여 Frontend 추가 영상강의를 제공합니다.

Velopert(김민준) 강사님의 온라인 직강!
프론트엔드 개발 올인원 패키지 Online.

프론트엔드의 기본이 되는 HTML/CSS, JavaScript부터, 개발 실무에 필요한 SASS, Git/Github, TypeScript, 효과적인 개발을 도와주는 React의 실무 활용법까지 모든 커리큘럼을 한 번에 모아서 제공해드립니다.

TypeScript로 리액트 하기 / MobX
/ TypeStyle

엄격한 규칙이 적용되어 허들이 높은 TypeScript. 하지만 현업에서는 이미 활발하게 사용되고 있어, React 활용에서 피해갈 수 없기도 합니다. 본 강의에서는 더욱 원활한 학습을 위해 강사님이 직접 촬영한 강의 영상을 제공합니다.

강사 소개.

8주동안 함께 할 강사님을 소개합니다.

이웅재 강사님

- Studio XID 프로토파이 개발 (2016 ~)
- VTouch 수석 엔지니어 (2014 ~)
- 창업 및 스타트업 운영 (2010 ~)

PROJECTS & ACTIVITIES

[프로젝트]
- ProtoPie 개발
- Real Estate Development Service in LA
- Virtual Touch Solution & Demo System

[기타 활동]
- 한국 타입스크립트 유저 그룹 오거나이저
- Microsoft Most Valuable Professional
- AWS Certified Developer
- Youtube 채널 운영 중

수업 목표.

수업에서는 이런 것들을 실제로 해 봅니다.

👉이 코스의 목표는?
8주, 총 32시간 동안 React 와 관련된 모든 것을 이해하는 것입니다. React 는 자유도가 높기 때문에 어떻게 구성하는 지가 중요합니다. React 와 관련된 기술들을 총 망라하여 장단점을 확실히 알고, 선택해갈 수 있는 능력을 함께 기르는 값진 시간이 되도록 노력하겠습니다.
👉지금 React가 필요하다면?
React 로 무언가를 해야 한다면, 생각보다 쉽게 시작할 수 있습니다. 하지만, React 를 왜 써야 하는 그리고 React 와 관련된 기술들이 왜 등장한지 알고 사용해야, 자유도 높은 React Web Application 을 좀 더 체계적으로 만들 수 있습니다. 함께 React 와 관련 기술을 디테일하게 학습하고, 설계 능력까지 키우는 뜻 깊은 시간이 되기를 바랍니다.
수강 대상.

내 이야기처럼 느껴진다면, 지금 합류하세요!


리액트를 어디서부터 시작해야 할지 어떻게 나아가야 할지 막막하다.

회사에서 리액트를 사용하게 되어 실무에 빨리 쓸 수 있는 실력이 필요하다.

지속해서 데이터가 변화하는 대규모 애플리케이션을 구축해야한다.

React를 실무에 적용하여 부분적으로라도 활용해보고 싶다.
잠깐! 선수지식이 필요해요.

🚨 React.js 수강을 위해서는 최소한의 자바스크립트 문법을 알아야 합니다. [ 링크보기 ]
🚨 본 강의에서는 JavaScript를 별도로 강의하지 않습니다. 만약, JavaScript 경험이 없거나 코드에 대한 이해가 없으시다면,
[JavaScript 부트 캠프] 강의를 수강하시는걸 추천합니다.

강의장 안내.
유의사항 및 환불규정.

수강료.

국내 9개 카드사 12개월 무이자 할부 지원!

  • 삼성카드
  • 신한카드
  • 롯데카드
  • 현대카드
  • 하나카드
  • BC카드
  • KB국민은행
  • 씨티카드
  • NH농협카드