메가스터디IT아카데미

1개월 2개월 3개월 4개월 5개월

1주차

개발환경 구축 및 HTML 문서 작성 -작업 디렉토리 생성과 HTML 구조 작성하기 HTML5, CSS3 박스모델 구조의 이해 -태그 배치 속성과 박스모델 구조 이해하기 링크와 미디어 콘텐츠 요소 사용 -하이퍼 링크 연결과 미디어 콘텐츠 출력 예제 만들기
2주차

리스트 형태의 레이아웃 구현 - 이미지 리스트 만들기 DOM 요소의 정렬 -요소를 정렬시키는 다양한 방법 활용하기
3주차

DOM 요소의 위치 제어 - position 속성을 이용하여 요소의 x,y,z축 위치 제어하기 그리드 레이아웃과 플렉스박스 1 - grid와 flex-box 속성의 특징 이해하기 그리드 레이아웃과 플렉스박스 2 - grid와 flex-box를 이용한 웹 레이아웃 구조 작성하기
4주차

시멘틱 웹 페이지 - HTML 시멘틱 태그로 웹 레이아웃 구조 작성하기 웹 화면의 구성요소

1개월

HTML/CSS

1주차

크로스 브라우징 - 크로스 브라우징 개념 이해와 처리 방법 익히기 반응형 웹 레이아웃 1 - 반응형 웹 사례 분석과 레이아웃 기본 구조 작성하기 반응형 웹 레이아웃 2 - 미디어 쿼리를 이용한 반응형 웹 구현하기
2주차

CSS3 Animation, CSS3를 활용한 2D & 3D
3주차

CSS 애니메이션 2 - 섬세한 애니메이션 동작 표현하기 실용 예제 구현 - 다이아이몬드 메뉴 만들기 자바스크립트 프리뷰 -자바스크립트의 특징과 활용 형태 알아보기
4주차

자바스크립트 기초 문법 1 - 변수, 상수, 연산자 개념 이해하기 자바스크립트 기초 문법 2 - 조건문, 반복문, 함수, 메소드 개념 이해하기

HTML./CSS +Javascript

1주차

JavaScript 본격 기초문법 - 객체와 배열 개념을 이해하고 간단한 쇼핑몰 로직 작성하기 자바스크립트의 DOM 접근과 조작 - 선택자, 이벤트 문법을 이해하고 HTML 태그에 적용하기 자바스크립트 클래스 - 자바스크립트 클래스를 정의하고 상황에 맞는 안내 문구창 띄우기
2주차

자바스크립트 활용 예제 실습 - 모달 팝업창과 슬라이더 만들기 제이쿼리 기초 문법과 DOM 접근 - 제이쿼리 선택자와 이벤트 문법 학습하기
3주차

제이쿼리 메소드 활용과 실용 예제 구현 - 애니메이션 배너, 타이머, to do list 만들기 UI 라이브러리 활용 - UI 템플릿 라이브러리와 슬라이더 라이브러리 연동하기 Ajax와 http 통신 - 제이쿼리 Ajax 사용 방법을 이해하고 http 통신 구현하기
4주차

API 연동과 데이터 조작 - 우편번호 API 연동을 통한 주소검색 UI 구현하기 웹 퍼블리싱 포트폴리오 작업 - 포트폴리오 관련 개별 상담 및 작업 진행

Javascript와 jQuery 실습

1주차

Node.js 웹 서버 생성 - Node.js 개발환경 설정과 웹 서버 생성하기 Node.js 라우터. - 라우터 개념을 이해하고 http통신 요청과 응답 객체 다루기 Express 프레임워크와 MVC 패턴 - Express 프레임워크 연동 및 MVC 패턴 구조 작성하기
2주차

UI 템플릿 엔진과 데이터 연동 - ejs와 jade 사용법을 이해하고 화면에 데이터 출력하기 SSR 방식 데이터 연동 - 서버사이드 렌더링 개념을 이해하고 화면에 데이터 연동하기
3주차

DB와 SQL 기초 문법 - MySQL DB 설치, RDB 개념 이해, SQL구문 실행하기 REST API 1 - DB 테이블 구조 작업 및 Node.js와의 연동 REST API 2 - 실데이터를 연동하여 간단한 입출력 API 만들기
4주차

React.js 기초 문법 1 - 리액트 개발환경 설정과 Virtual DOM 개념 이해하기 React.js 기초 문법 2 - JSX문법 사용과 컴포넌트 작성하기

Node.Js 와 React

1주차

React.js 기초 문법 3 - state와 props 개념과 데이터의 흐름 이해하기 React와 API 활용 - 영화 정보 검색 API 연동과 데이터 처리 실습하기 SPA 기법과 CSR 방식 활용 - SPA의 구조와 CSR 작동 원리를 이해하고 예제 작성하기
2주차

Redux 기본 개념 - 리덕스 패키지 설치 및 기본 개념 이해하기 React에 Redux 사용하기 - 리덕스 상태 관리 방식을 이해하고 카운터 예제 작성하기
3주차

React.js를 이용한 SPA 포트폴리오 작성 1 - CRUD 기능이 들어간 React SPA 웹 포트폴리오 작성 React.js를 이용한 SPA 포트폴리오 작성 2 - CRUD 기능이 들어간 React SPA 웹 포트폴리오 작성 React.js를 이용한 SPA 포트폴리오 작성 3 - CRUD 기능이 들어간 React SPA 웹 포트폴리오 작성
4주차

RN 체험 1 - 리액트 네이티브를 이용한 기본 앱 생성 및 모바일 프론트 환경에 대해 알아보기 RN 체험 2 - 기본 앱 컴포넌트 변경 및 스타일 적용하기