[서울시 뉴딜] 프론트엔드 개발자
- 1차 개강일
- 25년 11월 04일(화)
- 2차 개강일
- 25년 11월 18일(화)
								고용24 국민내일배움카드 훈련과정명은 
								[서울시 뉴딜]
프론트엔드 개발자입니다.
							
 
						- 교육기간
- 정규, 포트폴리오 서울시 거주 만18세~39세 미취업자
- 수강료
- 			교육비 실업자과정 최대100%지원 
- 취업분야
- 
								웹디자인, 웹퍼블리셔,
 UI/UX 디자인, 프론트엔드 개발자
서울시 뉴딜이란?
실무 경험과 기술·직무교육 등 스킬역량을 키워 취업성공! 
#인턴급여 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
 
UX/UI 웹디자인 프론트엔드
UX/UI 웹디자인 프론트엔드 취업완성패스
UX/UI 웹디자인 프론트엔드 커리어패스
- 
												
													  UI 디자인 스케치, 프로토타이핑 및 
 협업을 위한 사용법과 실무 활용법피그마 UI/UX 웹&앱 디자인
- 
												
													  빠르게 변하는 트렌드에 맞는 
 인터렉티브한 디자인을 학습웹 포트폴리오 완성
- 
												
													  디자이너라면 가장 먼저 배워야할 
 필수 프로그램 포토샵&일러스트웹 그래픽(포토,일러)
- 
												
													  HTML과 CSS를 기반으로 한 
 웹표준 웹사이트 만들기~!웹표준(HTML5/CSS)
- 
												
													  화려하고 다채로운 콘텐츠 표현, 
 JavaScript&jQueryJavaScript&jQuery
- 
												
													  UI와 UX를 근거로 
 전문성을 높은 클래스UI/UX 디자인 (Adobe XD)
- 
												
													  자바스크립트 프레임워크의 혁신~! 
 프론트엔드 개발자의 필수요소React 프론트엔드개발
10초 안내받기
원하시는 과정을 선택하시면 1:1 상담을 진행해드립니다.
 
						 
										 
										 
										 
										 
										 
								 
								 
								 
								 
								 
								 
														 
														