category

라인 파이낸셜 출신 개발자와 리액트로 실무 서비스 제작하기

리액트의 기초 문법부터 프로젝트를 통한 실무 기능 구현까지, 라인 파이낸셜 현직 프로트엔드 개발자가 당신의 개발 사수가 되어드립니다!

63강

강의 내용을 요약한 학습노트

최대 5회 코칭가능

코칭패키지 한정

초보, 중급 모두에게 필요한 강의

JS에 대한 기초 지식이 있는 분들을 위한 강의입니다.

수강생 후기 4

70% 이상 강의를 수강한 수강생들이 남긴 생생한 후기를 확인해보세요!

4.8
5점
3
4점
1
3점
0
2점
0
1점
0

 

 

프론트엔드 취업시장 점유율 압도적 1위, 리액트 

 

리액트는 국내외 수많은 기업들이 가장 많이 사용하고 있는 프레임워크입니다. 

대세 기술 스택으로 프론트엔드 개발을 배우고 싶다면

 

지금, 리액트를 시작하세요!

 

 

그런데, 

정작 기업들은 이렇게 말합니다. 


 

리액트를 다루는 시중의 많은 강의들이 ‘사용법', ‘기능' 위주의 껍데기 구현에만 치우친 탓입니다. 

 

리액트를 원리부터 제대로 이해하지 못한 상태로 개발을 하게 되면, 정작 리액트의 장점을 살리기 어렵고 겉보기에만 구현된 서비스를 만들게 됩니다. 

스터디파이가 생각하는 좋은 리액트 개발자는? 

 

첫째, 리액트의 장점과 원리를 제대로 이해하고 자유자재로 활용할 수 있어야 합니다. 

 

둘째, 서비스에 대해 고민하는 개발자입니다. 그 고민을 바탕으로 서비스의 구조, 리액트의 구조를 세울 수 있어야 진짜 실력 있는 프론트엔드 개발자가 됩니다. 

 

 

 


 

스터디파이가 제안합니다. 
실력 있는 리액트 개발자가 되기 위한 학습 방법!

 

1. 

 

리액트의 라이브러리를 다각도로 이해하고 활용하는 7년 차 프론트엔드 개발자가 여러분의 개발 사수가 되어드립니다.

 

 

JSX의 기본 문법부터 리액트의 특징과 서비스 구조까지 함께 살펴보며 각 라이브러리의 원리를 세세하게 짚어드릴게요.

 

7년간 프론트엔드 개발자로서 리액트를 활용한 강사님만의 경험과 노하우를 온전히 커리큘럼에 녹여냈습니다. 

 

본 강의는 단순히 코드를 따라 치고 기계적으로 생산하는 코더가 아니라 주체적으로 고민을 해결하는 프론트엔드 개발자를 양성하는 리액트 마스터 과정입니다. 
 

2.

 

페이스북 클론 코딩한다고 페이스북 만들 수 있나요? 

 

본 강의에서는 껍데기 기능만 구현하는 클론 코딩은 진행하지 않습니다. 

대신, 실무와 동일하게 서비스 가이드, 디자인 가이드가 주어진 상황에서 요구사항을 분석하고 서비스를 설계하는 ‘리얼 프론트엔드 개발’을 경험할 수 있습니다! 

 

프로프론트엔드 개발자가 다양한 요구에 어떻게 대응하고 웹 서비스를 설계해야 하는지 고민하는 게 진짜 프론트엔드 개발의 핵심 역량이기 때문이죠.  

 

이게 끝이 아닙니다

 

본 강의에서는 실무에서 리액트 개발자들이 웹서비스를 개발하기 위한 필수 기능인 ‘서비스 제작'과 ‘어드민 제작' 두 가지 실습을 모두 진행합니다. 

 

강의를 모두 듣고 나면, 스스로 하나의 웹서비스를 개발할 수 있는 역량을 갖게 됩니다.
 

 

3. 

 

리액트를 활용한 개발 실무에서 꼭 필요한 리액트 라이브러리 7가지를 함께 다룹니다. 

 

Recoil과 Redux의 사용법을 배우고, 컴포넌트 스타일링, Sass의 기초 문법 그리고 SWR, Axios, 리액트 라우터 등 커리큘럼 전반에 걸쳐 함께 배울 수 있습니다. 

 

심화 프로젝트를 통해서 프론트엔드 개발 실무에서 가장 많이 쓰이는 6가지 기능을 구현해 봅니다. 

 

라우팅, 폼 컨트롤, 빌더 페이지, 커스텀 훅스, 글로벌 상태 관리, 스타일드 컴포넌트 기능을 직접 제작하며, 리액트 개발에서 꼭 필요한 핵심 필수 기능을 모두 배울 수 있습니다. 

 

 

4. 

 

리액트 공부하다 막혀도 걱정 마세요! 

 

구글링에 시간 낭비하지 마시고, 리액트 강의 수강생만을 위한 학습 조교에게 직접 물어보세요! 
학습에 관한 질문이라면 무엇이든 이해할 때까지 정성껏 대답해 드립니다. 

 

여기에 하나 더! 

 

스터디파이는 전용 커뮤니티 페이지를 통해 나와 같은 강의를 듣고 있는 수강생들과 자유롭게 소통할 수 있어요.

 

온라인 학습도 외롭지 않게 수강생들끼리 활발하게 소통하며 완강의 의지도 함께 다져보세요. 

 

온라인 강의도 끝까지 완주할 수 있도록 스터디파이가 확실하게 도와드립니다!
 

 


 

수업은 이렇게 진행됩니다. 

 

 

코칭패키지 수강생만을 위한 5개의 과제를 풀고,
7년차 현직 개발자의 1:1 피드백을 받아보고 싶다면?

 

 

 


 

이 강의를 모두 듣고나면?

 

 

 


 

7년차 개발자이자 라인 파이낸셜의 프론트엔드 개발자, 

유동균 강사님을 소개합니다. 

 

 

 


 

이런 분들께 추천합니다!

 

 


 

본 강의 수강생에게만 드리는 혜택

 

 


 

 

 

 

커리큘럼

63강

  • Chapter 01 React 소개
    1. 1-1. React란?

      무료공개

    2. 1-2. React의 특징

  • Chapter 02 JSX
    1. 2-1. JSX란?

    2. 2-2. JSX에서 Javascript 사용하기

    3. 2-3. JSX에서의 조건문

    4. 2-4. JSX에서의 반복문

    5. 2-5. JSX 스타일링

    6. 2-6. JSX로 구구단 출력하기

  • Chapter 03 컴포넌트
    1. 3-1. 컴포넌트란?

    2. 3-2. Props

    3. 3-3. State

    4. 3-4. 클래스형 컴포넌트 vs 함수형 컴포넌트

      무료공개

    5. 3-5. 스터디파이 강의 컴포넌트 만들기

  • Chapter 04 LifeCycle과 Hooks
    1. 4-1. Hooks 종류

    2. 4-2. React 렌더링 과정

    3. 4-3. 아코디언 컴포넌트 만들기

  • Chapter 05 이벤트 핸들링
    1. 5-1. 이벤트 연결하기

    2. 5-2. 이벤트 종류

    3. 5-3. Form

    4. 5-4. 설문조사 만들기

  • Chapter 06 React 환경 설정
    1. 6-1. Node.js, Vs code 설치

    2. 6-2. create-react-app 프로젝트 생성

    3. 6-3. create-react-app 구조 소개

    4. 6-4. eslint, prettier 설정

  • Chapter 07 React 메모장 만들기
    1. 7-1. 메모장 프로젝트 소개 및 설계

    2. 7-2. 기본 컴포넌트 구현하기

    3. 7-3. 메모 수정 기능 및 메모 선택 기능 구현

    4. 7-4. 메모 추가 기능 구현

    5. 7-5. 메모 삭제 기능 구현

    6. 7-6. localStorage로 데이터 보관하기

  • Chapter 08 React 심화 프로젝트 소개
    1. 8-1. SurveyPie 소개

    2. 8-2. SurveyPie와 Admin 소개

  • Chapter 09 SurveyPie 설계
    1. 9-1. 요구사항 분석

    2. 9-2. 컴포넌트 구조 설계

    3. 9-3. 데이터 정의

    4. 9-4. 프로젝트 세팅 및 환경설정

    5. 9-5. 기본 컴포넌트 구현

  • Chapter 10 SurveyPie 라우터 적용
    1. 10-1. react-router

    2. 10-2. react-router 적용

    3. 10-3. 라우터로 스텝 구분하기

  • Chapter 11 SurveyPie 컴포넌트 스타일링
    1. 11-1. styled-components

    2. 11-2. 질문 유형 별, 컴포넌트 만들기

    3. 11-3. 스타일 변수 만들기

    4. 11-4. 나머지 컴포넌트 스타일링 하기

  • Chapter 12 SurveyPie 전역 상태 관리
    1. 12-1. 전역 상태 관리란?

    2. 12-2. Recoil이란?

    3. 12-3. Recoil로 데이터 관리하기

    4. 12-4. Custom hook 만들기

  • Chapter 13 SurveyPie API 연동
    1. 13-1. Axios 설치

    2. 13-2. Recoil의 Selector로 API 연동

    3. 13-3. 설문 답변 저장하기

  • Chapter 14 SurveyPie 그 외 나머지 기능 구현
    1. 14-1. 응답 완료 페이지 구현

    2. 14-2. 답변 유효성 검사 구현하기

    3. 14-3. 프로그래스 바 구현

  • Chapter 15 Admin 설계
    1. 15-1. 요구사항 분석

    2. 15-2. 컴포넌트 구조 설계

    3. 15-3. 프로젝트 세팅

    4. 15-4. Ant Design 설치

    5. 15-5. 라우터 적용

  • Chapter 16 Admin 리스트 페이지 구현
    1. 16-1. useSWR을 이용하여 API 연동

    2. 16-2. 설문 리스트 컴포넌트 구현

  • Chapter 17 Admin 빌더 페이지 구현
    1. 17-1. 질문 미리보기 영역 구현

    2. 17-2. 질문 추가, 삭제 기능 구현

    3. 17-3. Redux로 데이터 관리

    4. 17-4. Redux에서 API 연동

    5. 17-5. 옵션 영역 구현

    6. 17-6. 저장 기능 구현

    7. 17-7. 새로운 설문 생성 기능 구현

  • Chapter 18 전체 학습 정리
    1. 18-1. SurveyPie 서비스 정리

패키지 선택

기본패키지
수강기간 2022. 12. 07 ~ 2023. 12. 07 [365일]
구성
  • 동영상 강의 12개월 무제한 수강권 (학습 6개월+복습 6개월)
  • 강의 내용을 요약한 학습노트 무료혜택
  • 리액트 학습에 유용한 사이트 리스트 무료혜택
500,000 35

12개월 할부

월 27,083원

오늘 이후 인상될 수 있습니다

코칭패키지 (12월 30일 코칭시작)
수강기간 2022. 12. 07 ~ 2023. 12. 07 [365일]
코칭기간 2022. 12. 30 ~ 2023. 05. 01
구성
  • 동영상 강의 12개월 무제한 수강권 (학습 6개월 + 복습 6개월)
  • 1:1 코칭권(5회)
  • 코칭 패키지 전용 프라이빗 커뮤니티 초대 무료혜택
  • 강의 내용을 요약한 학습노트 무료혜택
  • 리액트 학습에 유용한 사이트 리스트 무료혜택
  • 완주시 50,000원 환급 무료혜택
800,000 35

6개월 할부

월 86,666원

오늘 이후 인상될 수 있습니다

  • * 해당 패키지의 경우 수량이 제한되어 있어 판매 기간보다 조기 매진될 수 있습니다.
  • * 코칭 기간동안 모든 강의를 수강하고 지정된 과제를 모두 제출하면 5만원을 환급해 드립니다.

FAQ

강의를 듣다가 모르는 내용이 나오면 누구에게 질문할 수 있나요?
커뮤니티 '질문게시판'에 질문을 올리시면 학습 조교가 24시간 안에 답변해드립니다. 물론 수강생끼리 자유로운 질의응답도 가능합니다.
신용카드 무이자 할부 가능 기간은 어떻게되나요?
이니시스에서 사용가능한 모든 신용카드에 대해서 12개월 무이자 할부 혜택을 드리고 있습니다.
강의 정가는 어떻게 되나요?
동영상 강의 수강권: 50만원(학습기간 6개월 + 복습기간 6개월 무료 추가 제공)/ 온라인 코칭권 : 6만 원(1회당)
학습노트는 무엇이고, 어떻게 받을 수 있나요?
학습노트는 강의의 중요 내용, 학습을 위한 참고자료, 팁 등을 정리한 PDF 파일로 '내 강의실'에서 다운로드 받으실 수 있습니다.학습 노트 및 학습 자료는 강의가 모두 오픈된 이후 공개됩니다.
회사 제출을 위한 증빙서류 발급이 가능한가요?
네 가능합니다. 스터디파이 직인이 찍힌 수료증, 영수증, 수강확인증 등의 증빙서류는 스터디파이 고객센터 (https://studypie.channel.io) 에서 신청하실 수 있습니다. 일반적으로 증빙 서류에는 수강생명, 강의명, 수강 기간, 수강률(선택), 결제액 등이 포함됩니다.
2개 이상의 카드로 금액을 분할하여 결제할 수 있나요?
네 가능합니다. 2개 이상의 카드로 분할하여 결제하거나, 카드 + 가상계좌(혹은 계좌이체) 형식으로도 결제가 가능하십니다. 분할 결제를 원하시는 분은 스터디파이 고객센터 (https://studypie.channel.io) 로 문의해 주세요.

유의사항

  • 결제 전 학습 기간을 다시 한 번 확인해주세요.
  • 복습기간은 무료로 제공되는 기간으로 환불금 산정시 제외됩니다.
  • 동영상 콘텐츠는 구매 후 7일 이내 이용하지 않은 부분 대해서 전액 환불을 보장합니다. 하단의 취소/환불정책을 확인해주세요.
  • 카드사 포인트/ 선불/ 기프트카드로 결제하면 환불이 불가능하기 때문에 결제수단으로 사용하실 수 없습니다.
  • 환불, 환급은 결제한 수단과 동일한 방식으로 진행됩니다.
  • 환급액이 5만원을 초과할 경우, 환급액을 기준으로 제세 공과금 22%를 차감한 뒤 지급합니다.
  • 코칭 가능 기간 도중에 환급조건을 만족하더라도, 환급은 코칭 가능 기간 종료 이후에 진행됩니다.
  • 환급 신청은 코칭 가능 기간 종료일로부터 반드시 60일 이내에 신청해주셔야 환급액이 지급됩니다.

다른 강의를 찾으시나요?

전체 강의보기

최근 검색어

추천 검색어