• #HTML
  • #REACT
  • #프론트엔드
  • #웹퍼블리셔

웹퍼블리셔 프론트엔드(React)개발자 과정

React의 라이브러리 기능을 학습하고 실무에서 적용 가능한
스택의 기능을 사용할 수 있도록 교육하는 과정
[ 직업계고 3학년 대상 훈련 ]

  • 교육기간
    총 4개월

    68일/476시간

  • 개강일

    수시개강

  • 수강료
    일반고·특화 과정

    전액지원

개강일 수시개강

INFOMATION
UI개발에 대한

새로운 관점
리액트(React)

자바스크립트와 HTML을 더 편리하게 사용할 수 있게 해준 라이브러리로
각광받으며 개발자가 UI에 더 집중할 수 있는 환경이 만들어지면서 현재 웹 애플리케이션 개발에 가장 많이 사용되는 리액트

자바스크립트 프레임 워크 리액트 React

  • 높은 효율성

    컴포넌트 기반으로 하여
    다양한 형식의 데이터 반영, 재사용 가능

  • 편리한 유지보수

    가상 DOM을 지원고있어
    성능 최적화와 유지보수 및 관리가 편리

  • 높은 잠재력

    시장에서의 인기도 큰편이라
    대기업부터 스타트업까지 많은 비중 차지

  • 학력/전공 상관없는 직업

    전공, 경력, 학력 상관없이
    관심 있는 분이라면 응시 가능

FRONT-END
CLASS

어떤 분들께
추천하나요?
강의 추천 대상

  • 코딩을 배우고 싶은데 뭐부터 해야 할지 모르겠는 분
  • 사이드 프로젝트 혹은 창업을 위한 웹/앱 서비스 개발을 하고 싶으신 분
  • 개발자는 아니지만 소통을 위한 개발 흐름을 잡고 싶으신 분

취업분야 과정수강 후 취업가능!

스타트업, 소프트웨어개발/서비스, IT/인공지능, 앱/웹서비스, 커머스, 온라인플랫폼 등

문화·예술·디자인·방송 디지털디자인 프로젝트 설계 화면구조 설계하기 정보구조 설계하기 디지털 디자인

국비지원교육이라
교육 퀄리티를 걱정하시나요?

국비지원 교육은 NCS 능력 단위 로 구성되는 특성상 빠르게 변화하는 현장에
맞지 않는 커리큘럼으로 교육이 이루어지는 경우가 발생하기도 합니다.

NCS란?

직업에서 요구하는 능력을 산업현장의 수요에 부합하도록 국가에서 표준화한것

그래서
(주)우리인재개발원은

배워야 할 것과
준비되어야 할 것에
집중했습니다.

(주)우리인재개발원에서는 현업에서 종사한 전임강사와 졸업생들의 자문을 얻어
스마트한 신입/경력이 되기 위해 배워야 할 것과 준비되어야 할 것이 무엇인지 분석하고

NCS를 바탕으로 교육을 구성하되 실무에 투입 되었을때 빠르게 적응할 수 있도록
해당 년도 트렌드에 맞는 현장 실무를 결합한 특별한 교육시스템을 만들었습니다.

웹퍼블리셔 프론트엔드(React)개발자 과정 교육과정 커리큘럼

  • html
  • css
  • js
  • 플러그인
  • react
  • 포트폴리오
  • 1-Step
    1주차

    - html5 마크업 기초, git 설치 및 github 배우기 - git실습
    - css 기초(배경, 서식, 레이아웃관련) 예제 학습
    - 레이아웃 잡기 (position, float, flex)
    - 포트폴리오 컨셉 잡기(html 버전)

  • 2-Step
    2주차

    - css중급(interaction)예제 학습, sass 설치 및 기본문법 강의
    - 반응형웹페이지(미디어쿼리, viewport)
    - 웹 접근성 강의 및 사례 실습, 웹 표준 강의 및 사례 실습

  • 3-Step
    3주차

    - 포트폴리오 메인페이지(정적인 페이지 구현)
    - js기초 강의, js적용 기초 예제학습
    - css3와 js를 활용한 interaction 예제 학습, music player만들기

  • 4-Step
    4주차

    - js중급 강의(1)
    - js적용 중급 예제 학습(1) - 문자열메소드 활용, 이벤트위임 적용
    - 포트폴리오 메인페이지에 js적용(동적 페이지 구현), ES6 문법 강의

  • 5-Step
    5주차

    - 플러그인 사용법(isotope_layout, swiper.js)- 예제
    - ES6 슬라이드(기본, loop, multy), 탭 메뉴(기본, 접근성추가) 예제
    - SVG이론 학습, scroll(기본, 연동한 인터액션)예제학습

  • 7-Step
    7주차

    - API의 이해와 예제학습(지도, 갤러리) , 쿠키에 대한 이해
    - js중급강의 (3)
    - js고급강의 – 객체지향 , 객체지향 실습 – 플러그인 만들기

  • 8-Step
    8주차

    - 포트폴리오 서브페이지 구현
    - html포트폴리오 피드백 및 완성

  • 9-Step
    9주차

    - react 환경설정(18.2 -> 17 다운그레이드)
    - jsx문법 학습 및 예제 , react 기본 hook 강의 및 예제학습
    - 포트폴리오 컨셉 잡기(react 버전)

  • 10-Step
    10주차

    - react 심화 hook 강의 및 예제학습
    - react 포트폴리오 제작 시작 – 메인페이지, 반응형과 공통서브 페이지
    - react router 이해와 연결실습

  • 11-Step
    11주차

    - 메인페이지 scroll 적용(인터액션 효과적용)
    - 서브페이지 – 지도구현, 회원가입페이지(validation) - 깃 배포
    - 서브페이지 디자인 구현, 조직도 페이지 구현

  • 12-Step
    12주차

    - 서브페이지 – toDolist를 이용한 게시판
    - react 심화 hook 강의 및 예제학습(3),메인페이지와 연동(서브페이지 데이터연동)

  • 13-Step
    13주차

    - 서브페이지 – 갤러리페이지(framer이용)
    - 서브페이지 디자인 구현 , 서브페이지 – 유튜브페이지

  • 14-Step
    14주차

    - 리액트 포트폴리오 피드백 및 제작완성

  • 15-Step
    15주차

    - 리액트 포트폴리오 피드백 및 제작완성
    - 취업컨설팅, 포트폴리오 발표, 수료식

커리큘럼 전체보기

일반고 특화훈련

취업을 희망하는 일반계고 3학년 재학생 대상으로
원하는 진로에 맞추어 훈련기관에서 직업 훈련을 받고 출석과 성적평가는 소속 학교와 연계합니다.

  • 훈련비 전액 지원
  • 매월 훈련장려금 지급
  • 대학진학 및 취업 우선 지원

  • 잘 배우고 갑니다! 5.0

    컴퓨터로 무언가를 해 보는 것이 처음이라 많이 긴장하고 갔었습니다. 그런데 반 분위기도 너무 좋았고 무엇보다도 자룡쌤께서 쉽게 잘 가르쳐 주셔서 어려움 없이 잘 배울 수 있었습니다. 다시 또 뭘 배울 기회가 생기면 자룡쌤께 배우고 싶을 정도였으니까요. 컴퓨터에 무지했던 저를 컴퓨터를 다룰 줄 아는 사람으로 만들어주셔서 너무 감사했고 가르치시느라 너무 힘드셨을 텐데 정말 고생 많이 하셨습니다. 잘 배우고 갑니다!

    컴퓨터활용능력2급(필기+실기) 문유선 학생

  • 잘 가르쳐 주십니다. 4.0

    본인 의지만 확고하다면 언제든지 실력을 키울 수 있는 훈련과정 이라고 생각합니다. 잘 가르쳐 주십니다.

    클라우드 기반 자바기반 시스템 프로그래밍 양성 김유경 학생

  • 너무 좋아요 5.0

    너무 좋아요 선생님께서 잘 가르쳐 주셔서 좋았습니다

    [일반고]네트워크운영관리&정보기기운용기능사(스마트혼합) 홍정아 학생

  • 유용하게 쓰일거같다 5.0

    취업할때 도움이 되는 기술들을 배웠다
    유용하게 쓰일거같다

    [일반고]네트워크운영관리&정보기기운용기능사(스마트혼합) 허승희 학생

INQUIRY교육과정 문의·신청

온라인상담신청

  • 지점 선택

  • 교육과정 선택

      실업자·국기과정
        일반·재직자과정

        • 신청자

        보기
        • 주소
        • 전화