[서울시 뉴딜] 프론트엔드 개발자
- 1차 개강일
- 24년 12월 17일(화)
고용24 국민내일배움카드 훈련과정명은
[서울시 뉴딜]
프론트엔드 개발자입니다.
- 교육기간
- 정규, 포트폴리오 서울시 거주 만18세~39세 미취업자
- 수강료
-
교육비
실업자과정 최대100%지원
- 취업분야
-
웹디자인, 웹퍼블리셔,
UI/UX 디자인, 프론트엔드 개발자
지금 신청하면 모든 온라인강의가 0원이라고?
간편 회원 가입만으로도 1400만원 상당의 온라인 강의가 0원
2개월 프리패스 제공안내받기
서울시 뉴딜이란?
실무 경험과 기술·직무교육 등 스킬역량을 키워 취업성공!
#인턴급여 239만원 #교육수당 지급
- 훈련비
전액지원 - 우수기업
인턴근무 - 인턴 후
정규직
전환지원
웹 콘텐츠의 기획 및 분석과
디자인과 프론트엔드 개발을 동시에!
프론트엔드(React,node.js) 개발자란?
스마트 웹콘텐츠 개발에 필요한 UI 디자인과 프론트엔드(React,node.js)
언어를 배우며 다양한 스마트기기 플랫폼에 적용 가능한 웹 기반의 콘텐츠서비스를
기획, 분석, 설계, 구현,테스트, 배포 및 유지보수 할 수 있습니다.
Start now
- UI UX
- 사용자 리서치
- 정보구조
- 와이어프레임&프로토타입
- 비쥬얼디자인
- Photoshop, Figma
- FRONT-END
- HTML/CSS
- JavaScript
- React
- Node.JS
- Node.JS or 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 전문가로 거듭납니다.
기초부터 요즘 핫한 최신 기술까지 배우고
디자인 능력을 겸비한 프론트엔드 개발자로 성장!
관련 자격증 취득이 가능합니다.
수강후기
커리큘럼
- 1
HTML5 & CSS3 웹앱서비스 기초
- HTML Semantic Tag
- CSS3 Selector, CSS3 layout(flex/grid)
- Platform 및 Device별 웹 페이지 구현
· 네이버 / 쿠팡 / 카카오 클론 - Flex & Grid 활용 실전 웹페이지 구현
(Web / Mobile / Tablet),
Git / Github 연동 - SCSS 학습 & 실전예제
(Navigation / Header / Toggle) - SVG 활용 Animation 실전예제 실습
- 2
Javascript 기초이해
- Javascript 기초 문법
(자료형, 연산자, 함수) - Javascript 기초예제 (가위.바위.보 게임) (D-day 계산기)
- Javascript 내장 객체
(Math / Date / Object 등)
Javascript 라이브러리 jQuery
- jQuery 활용
- Javascript Plugin 실습
(scrollTo / fullpage / parallax)
- Javascript 기초 문법
- 3
Javascript DOM Event
- Javascript DOM & BOM 구조
(event 운영방법 학습) - Javascript 비동기함수 학습
(setTimeInterval / setTimeout / setClearInterval) - Javascript 활용: Modal, Slide 제작 실습
- Javascript DOM & BOM 구조
- 4
Javascript 포트폴리오 제작 & 배포
- 1차 평가 :
Javascript 활용 ToDoList 제작 - 1차 평가 코드리뷰 추가 미션 제공
& PortFolio O.T - Javascript 실전예제 : video resource활용 flex 반응형 웹페이지 제작
- Firbase 활용 Deploy
- 1차 평가 :
- 5
Javascript 연산자 기능
- Javascript 심화과정 for in /
for of 문
class 생성자 함수 개발 - Javascript 심화과정 prototype, instance 객체
- Javascript 심화과정 Array,
String Method 실습 - Array Method 학습 :
forEach, push, pop, shift 등 - Javascript 심화과정 : spread operator
· deep copy / shallow copy - Javascript 심화과정 : Map,
Set 개념학습 · iterable, generator함수
- Javascript 심화과정 for in /
- 6
Javascript Data 통신
- Javascript 심화과정 API &
json data 학습(*try / catch / finally) - Javascript 심화과정
XMLHttprequest( ) 활용 실습 - Javascript 심화과정
synchronous / Asynchronous - Javascript 심화과정
Callback / Promise / Fetch( )
- Javascript 심화과정 API &
- 7
Javascript API 활용
- Javascript 실습프로젝트
SNS 블로그 페이지 제작 - Web API 개념학습
Storage API 학습 - Kakao Map API 활용
Geolocation API 구현 - Javascript Canvas API 이론
getContext / moveTo - Javascript Canvas API 실습
웹 페이지 구현
- Javascript 실습프로젝트
- 8
Typescript 기본 타입 정의
- Typescript 개념정리
· 객체, 클래스 적용 - Typescript Compile 설정
추상클래스, 메서드 타입정의 - Typescript Array, Tuple
타입 정의 실습
Typescript 함수 & 객체 정의
- Typescript iterable,
generator 타입 정의 - Typescript 함수 타입정의
- Typescript 고차함수 타입정의
- Typescript 제네릭타입정의
- Node.js & Typescript 모듈정의
- Typescript 개념정리
- 9
React.js 기초이론
(jsx / state / props)- React 기초 문법 (*with Typescript)
- React 카운트 앱 제작
(*with Typescript) - React / JSX 문법 학습 Component 관리, React / input 요소 관리
Hooks > useRef - React Hooks useEffect 학습
useEffect 활용 컴포넌트 생애주기 사이클 실습
React.js 기본예제 실습
(hooks 함수 사용단계)- React TodoList 예제 실습 컴포넌트
주도형 웹페이지(*Header / TodoEditor) - 1.useReducer 활용 : 상태관리학습
2.useMemo 활용 : 리액트 앱 최적화하기 - React 감정일기장, 실습 프로젝트 제작
- React 실전예제 국가별 날씨 데이터 출력
(with 위젯스피너활용) - React 실전예제(*H&M 쇼핑몰 만들기)
React.js 응용예제 심화
(state management 관리단계)- [이론] React CSR 프레임워크 학습
GraphQL / useStaticQuery /
pageQuery / Recoil / React query
- 10
Node.js 기본기능학습
- Node.js 설치 및 기본서버 구축,
내부 API 활용 - Node.js 모듈활용, Data Transfering
http 모듈 및 익스프레스 웹 서버
- Node.js 설치 및 기본서버 구축
내부 API 활용 - MySQL 소개 및 CRUD 학습
- Node.js Middleware 학습
- Express 활용 웹서버 구현실습
DataBase 운영.관리 기본
- Node.js Router 활용,
error 처리 / 보안영역 학습 - Cookie 및 Session 개념이해,
Login / Logout 실습 - 회원정보 저장 및 접근제어,
- DataBase 기본이론 & Mongo DB 학습
- Node.js 설치 및 기본서버 구축,
- 11
React.js Final 프로젝트
- Node.js 활용 TodoList 실습
- React + TypeScript + Node,
Netflix Webpage Project - Final PortFolio Deploy &
Code Feedback_First - Final PortFolio Deploy &
Code Feedback_Second
웹 UI/UX 콘텐츠 디자인
웹 UI/UX 콘텐츠 디자인 취업완성패스
웹 UI/UX 콘텐츠 디자인 커리어패스
10초 안내받기
원하시는 과정을 선택하시면 1:1 상담을 진행해드립니다.