프론트엔드 풀스택 (React, Node.js)
- 1차 개강일
- 24년 11월 26일(화)
- 2차 개강일
- 24년 12월 10일(화)
고용24 국민내일배움카드 훈련과정명은
프론트엔드 풀스택
(React, Node.js)입니다.
- 교육기간
- 정규 6개월 취준생/디자인 입문/초보자
- 수강료
-
국기과정 전액지원
실업자과정 최대100%지원
- 취업분야
-
웹디자인, 웹퍼블리셔,
UI/UX 디자인
지금 신청하면 모든 온라인강의가 0원이라고?
간편 회원 가입만으로도 1400만원 상당의 온라인 강의가 0원
2개월 프리패스 제공안내받기
웹 콘텐츠의 기획 및 분석과
디자인과 프론트엔드 개발을 동시에!
스마트 웹콘텐츠 UI/UX 디자인 &
프론트엔드(React,node.js)란?
스마트 웹콘텐츠 개발에 필요한 UI 디자인과 프론트엔드(React,node.js)
언어를 배우며 다양한 스마트기기 플랫폼에 적용 가능한 웹 기반의 콘텐츠서비스를
기획, 분석, 설계, 구현,테스트, 배포 및 유지보수 할 수 있습니다.
Start now
- UI UX
- 사용자 리서치
- 정보구조
- 와이어프레임&프로토타입
- 비쥬얼디자인
- Photoshop, Figma
- FRONT-END
- HTML/CSS
- JavaScript
- React
- Node.JS
- AWS 서버 구축
프론트엔드 및 Node.js로 서버단 관리까지!
UI UX 기획 및 디자인부터
프론트엔드(React) 및
백엔드(Node.js)개발까지!
모든 소프트웨어 업계에서 가장 핫한 단어 UX/UI
- 모바일 UI 화면 설계 : 디자인 트렌드를 반영하여, 좋은 UI/UX 디자인을 설계
- 프로토타이핑 : 디자인 툴을 사용한 프로토타이핑
- 리액트(React) : facebook에서 제공해주는 프론트엔드 라이브러리라고 볼 수
있으며 모바일 애플리케이션의 개발 시 토대로 사용될 수 있습니다. - Node.js : Chrome V8 JavaScript 엔진으로 빌드 된 JavaScript 런타임으로
노드를 통해 다양한 자바스크립트 애플리케이션을 실행할 수 있으며,
서버를 실행하는 데 제일 많이 사용됩니다.
- 산업수요를 반영한 구직자 맞춤형 실무교육 커리큘럼으로 진행됩니다.
- 모바일, PC용 웹 UI 최신 트렌드를 반영한 교육훈련을 진행합니다.
- 취업에 필요한 포트폴리오 제작 및 프로젝트를 학습합니다.
- 담당 훈련교사와 교육담당자, 취업상담사를 통해 월 1회 및 수시상담을 진행합니다.
- 전시회·공모전·워크샵 등 풍부한 현장경험 기회로 실무역량을 강화합니다.
- 웹 콘텐츠 기획
- 기초데이터 수집
- 아이디어 스케치
- 스토리보드 제작
- UI UX 디자인
- 포토샵 기초 / 피그마
- UI/UX 디자인 이론
- UI 구현
- 퍼블리싱
- HTML5/CSS3
- 자바/제이쿼리 기초활용
- React / Node.JS
- 애플리케이션
- 테스트 수행
- 배포
- 포트롤리오
- 모바일 디자인
- 메인 디자인
- 개인사이트 디자인
UI/UX Frontend 당신은 디자인과 프로그래밍
당신은 디자인과 프로그래밍
모두 가능한 경쟁력 있는
UI/UX 전문가로 거듭납니다.
기초부터 요즘 핫한 최신 기술까지 배우고
디자인 능력을 겸비한 프론트엔드 개발자로 성장!
관련 자격증 취득이 가능합니다.
수강후기
커리큘럼
- 1
개발자 환경 구축
- 운영체제의 이해 ( GUI vs CLI )
- CLI 환경 이해와 활용
- 코딩을 위한 IDE (통합개발환경) 의 종류
- VS CODE 기본 사용 방법 파악하기
- VS CODE 플러그인/익스텐션 활용하기
개발 환경 운영 지원
- Git의 이해와 기본 명령어
- Github을 활용한 프로젝트 형상 관리
- 2
HTML, CSS, JavaScript
(화면 구현)- HTML을 활용한 시멘틱 웹 페이지 제작
- CSS를 활용한 반응형 웹 페이지 제작
- SCSS를 활용한 CSS 전처리
- Javascript 기초 문법
(자료형, 연산자, 함수) - Javascript 내장 객체
(Math / Date / Object 등)
- 3
바닐라 스크립트
- 이벤트 처리
- Window 객체 · 웹 브라우저 제어하기
- Document 객체 · DOM 제어하기
- Image, Form, Screen, Navigator
객체 - Geolocation을 기반한 위치 정보 활용
- Cookie 데이터 저장 및 활용
- LocalStorage, SessionStorage
- Web SQL Database 활용
- 4
프로그래밍 언어 활용
- 변수, 상수, 데이터 타입, 연산자, 배열
- 프로그램 흐름 제어 (조건문, 반복문)
- 함수(기본함수, 익명함수, 화살표 함수)
- 객체지향 프로그래밍 (JSON,
Prototype, Class) - 클로저
- Javascript 기본 API 활용하기
(내장함수, 내장객체) - Promise, Async/Await
- XMLHttpRequsest 기반 Http Client
- 모듈과 패키지
- NPM 기반의 오픈소스 패키지 활용하기
- YARN 기반의 오픈소스 패키지
활용하기
- 5
React.js
- React 환경 파악하기
- SPA 구조 이해하기
- JSX 표현법
- React 컴포넌트
- 스타일 적용하기
- Hook의 이해와 활용
- Event 처리
- 클래스 기반 컴포넌트 살펴보기
- Redux를 활용한 컴포넌트 상태 관리
- 오픈소스 컴포넌트 활용하기
- Server Side Rendering 이해
- 앱 기본 설정
- 웹 페이지 구성하기
- 컴포넌트 구성하기
- 컴포넌트 상태 관리
- 6
서버 구축 및 활용
Node.js 서버 구현
- Node.js 기본 특성 이해하기
- 미들웨어의 이해와 활용
- 배치 스케쥴러
- Express 기반 HTTP 서버 구성하기
- Restful의 이해와 Restful API 서버 구축
- 마이크로 서비스의 이해와 구축
AWS 서버 구축
- 클라우드와 아마존 웹 서비스
- 서버, 스토리지, 가상 네트워크 공간 만들기
- 확장 가능한 데이터베이스 서버 만들기
- DNS를 연결하고 관리하기
- 로드 밸런싱과 인프라 구성하기
- CDN 활용 클라우드 자원과 리소스 관리
- 7
팀 프로젝트
애플리케이션 설계
- 프로젝트 팀원 분배
- 팀원별 역할 분배
- 팀 프로젝트 기획 및 화면 / DB 설계
- 프로젝트 진행 및 피드백
- 차후 업데이트 및 보안점 분석
웹&앱 프로그래밍
웹&앱 프로그래밍 취업완성패스
웹&앱 프로그래밍 커리어패스
국비혜택조회
원하시는 과정을 선택하시면 1:1 상담을 진행해드립니다.