위 강좌 이미지를 클릭하시면 강의목차(table of contents)로 바로 이동합니다. 본 강좌는 다운로드 방식 강좌입니다. 따라서, 수강신청 후 내pc로 다운 저장하여 학습합니다.
| 수강기간 | VIP 프리패스로 이용시10개월 단과로 이용시2개월 |
|---|---|
| 교육방식 | 다운로드 방식 - 강의를 내pc로 다운로드 받아서 저장해놓고 학습하는 방식 |
| 수강금액 | 220,000원 / 2개월 (VIP 프리패스로 이용시는 무료 이용이며, 프리패스 수강기간이 적용) |
| 자료제공 | 제공되는 자료가 있는 경우 1회차 목차에서 강의소스 및 첨부파일 제공 |
상세설명 및 참고사항
| 1 강 |
01_01_리액트 프로그래밍 입문 강의 시작
|
14:20 |
|---|
| 2 강 | 01_02_리액트 개발 환경 구축 및 클라우드 기반 데브옵스 설정하는 전체적인 절차에 대한 데모 | 82:21 |
|---|
| 3 강 | 01_03_Windows 환경에서 리액트 개발 환경 구축 및 리액트 프로젝트 생성하는 2가지 방법 설명 | 32:37 |
|---|
| 4 강 | 01_04_두 가지 방식으로 리액트 프로젝트를 만드는 방법 설명(create react app과 dotnet new react) | 13:27 |
|---|
| 5 강 | 01_05_참고_ReactDemo_프로젝트 생성 후 로컬 테스트 후 GitHub 리포지토리에 게시하는 전체 절차 설명 | 06:50 |
|---|
| 6 강 | 01_06_Temp 폴더에 dotnet new react 명령으로 풀스택 프로젝트 생성 및 실행 그리고 여러 가지 사용법 데모 | 20:31 |
|---|
| 7 강 | 01_07_Create React App으로 만든 리액트 프로젝트의 구조 간단히 살펴보기 | 05:51 |
|---|
| 8 강 | 01_08_현재 강의에서 만들어지는 최종 소스인 ReactMemo와 BookApp.React 프로젝트 다운 및 설치 그리고 실행하기 데모 | 13:32 |
|---|
| 9 강 | 02_00_순수 HTML 파일에 리액트 적용하기 소개 | 06:42 |
|---|
| 10 강 | 02_01_HelloReact_순수한 HTML 파일에서 리액트 헬로월드 예제 만들고 실행해보기 | 18:21 |
|---|
| 11 강 | 02_02_HelloReact_React Developer Tools 설치 및 createElement 함수에 속성 적용하기 | 16:15 |
|---|
| 12 강 | 02_03_HelloReact_중첩된 HTML 요소를 React_createElement 함수를 여러 번 사용해서 구현하기 | 09:00 |
|---|
| 13 강 | 02_04_HelloReact_Babel 라이브러리를 사용하여 JSX로 HTML 요소 작성하기 | 06:29 |
|---|
| 14 강 | 02_05_HelloReact_JSX에서 스타일 사용하기_className으로 CSS Class 적용하기 | 11:03 |
|---|
| 15 강 | 02_06_HelloReact_JSX 표현식 사용하기 | 12:29 |
|---|
| 16 강 | 02_07_HelloReact_함수형 컴포넌트 만들고 JSX 표현식에 적용하기 | 12:18 |
|---|
| 17 강 | 02_08_HelloReact_Props_동적 개체인 props를 사용하여 컴포넌트에 전달된 속성 이름과 속성 값을 받아 사용하기 | 19:34 |
|---|
| 18 강 | 02_09_HelloReact_구조 파괴 할당(구조 분해 할당)을 사용하여 props를 좀 더 간결하게 사용하기 | 09:22 |
|---|
| 19 강 | 02_10_HelloReact_JSX에서 조건(3항) 연산자 사용하기 | 11:14 |
|---|
| 20 강 | 02_11_HelloReact_함수형 컴포넌트와 클래스형 컴포넌트_클래스로 컴포넌트 만들기 | 07:37 |
|---|
| 21 강 | 02_12_HelloReact_state와 setState로 상태 데이터를 저장하고 onClick 이벤트 처리기에서 상태 데이터를 수정하기 | 15:48 |
|---|
| 22 강 | 02_13_HelloReact_컬렉션 형태의 데이터 출력 및 부트스트랩으로 UI 꾸미기 | 19:08 |
|---|
| 23 강 | 03_01_SeeSharpGuide_01_create-react-app으로 프로젝트 만들고 기본 컴포넌트와 함수 컴포넌트를 사용하여 강좌 리스트 | 13:47 |
|---|
| 24 강 | 03_02_SeeSharpGuideTitle_className과 style을 사용하여 자식 컴포넌트에 스타일 적용하는 방법 설명 | 11:51 |
|---|
| 25 강 | 04_00_리액트 라우팅 경로 지정 이론 설명 | 03:21 |
|---|
| 26 강 | 04_01_About 컴포넌트 생성 및 라우팅에 추가 | 07:38 |
|---|
| 27 강 | 04_02_Contact 컴포넌트 생성 및 실행 데모 | 08:07 |
|---|
| 28 강 | 04_03_ContactDetails와 Copyright 서브 컴포넌트 생성 및 부모 컴포넌트에 포함해서 실행 | 12:41 |
|---|
| 29 강 | 04_04_TechList와 SiteList 서브 컴포넌트 생성 및 Home 컴포넌트에 포함해서 실행 | 16:38 |
|---|
| 30 강 | 04_05_About과 Contact 컴포넌트 UI 변경하기 | 15:52 |
|---|
| 31 강 | 05_01_버튼에 인라인 스타일 적용하기 | 01:49 |
|---|
| 32 강 | 05_02_React.Fragment를 사용하여 컴포넌트에서 동일 레벨의 여러 HTML 요소 표현하기 | 10:33 |
|---|
| 33 강 | 05_03_리액트 state 개체로 상태 관리하기 이론 | 03:30 |
|---|
| 34 강 | 05_04_StateDescription_state 개체를 사용하여 클래스 컴포넌트에서 title과 message 속성을 저장하고 출력하는 상태 관리 데모 | 04:57 |
|---|
| 35 강 | 05_05_리액트 컴포넌트 라이프 사이클 componentDidMount | 01:13 |
|---|
| 36 강 | 06_01_리액트 onClick 이벤트 처리기 이론 | 02:23 |
|---|
| 37 강 | 06_02_OnClickEventHandler_onCLick 이벤트 처리기에서 클릭 이벤트를 처리하는 3가지 모양 정리 | 09:10 |
|---|
| 38 강 | 06_03_OneWayBinding_React에서 텍스트박스의 값을 읽어 sate 개체에 저장 후 다시 출력하는 초간단 양방향 바인딩 구현하기 | 12:58 |
|---|
| 39 강 | 07_00_초간단 인-메모리 TodoList 만들기 데모 | 29:27 |
|---|
| 40 강 | 08_01_FunctionStateDemo_useState()를 사용하여 함수형 컴포넌트에서 상태 관리 | 07:01 |
|---|
| 41 강 | 08_02_useEffect Hook를 사용하여 페이지 로드할 때 필요한 기능 수행 | 09:01 |
|---|
| 42 강 | 08_03_useEffect를 사용하여 페이지 로드할 때 fetch 함수로 Web API 호출하기 | 06:39 |
|---|
| 43 강 | 09_01_FetchApiPractice_fetch api를 사용하여 Web API를 호출하여 JSON 데이터 출력하기 | 15:51 |
|---|
| 44 강 | 09_02_TextBoxOnChangeEventHandler_텍스트박스의 change 이벤트에서 텍스트박스의 값을 가져와 상태 데이터에 저장하기 | 12:22 |
|---|
| 45 강 | 10_00_JSON 데이터를 주고 받을 수 있도록 닷넷코어 백엔드 기술을 사용하여 Web API 만들기 시작 데모 | 12:57 |
|---|
| 46 강 | 10_01_BookApp.React 프로젝트 생성 및 SQL Server 데이터베이스 프로젝트 추가 후 Books 테이블 생성 | 23:35 |
|---|
| 47 강 | 10_02_Books 테이블과 일대일로 매핑되는 Book 모델 클래스 생성 | 14:20 |
|---|
| 48 강 | 10_03_모델 클래스를 기본으로 리포지토리 인터페이스와 클래스 코드 구현 | 34:23 |
|---|
| 49 강 | 10_04_테스트 프로젝트 생성 및 5개 메서드에 대한 테스트 코드 작성 | 19:59 |
|---|
| 50 강 | 10_05_리액트에서 사용될 REST 서비스를 위한 Web API 프로젝트 생성 및 종속성 주입 후 GET 메서드 테스트 | 24:02 |
|---|
| 51 강 | 10_06_Web API 상세, 입력, 수정, 삭제 메서드 구현 | 16:57 |
|---|
| 52 강 | 10_07_React 프로젝트에서 CORS를 설정한 Web API 프로젝트를 fetch 함수로 호출 테스트 | 13:32 |
|---|
| 53 강 | 10_08_ASP.NET Core Web API를 사용하여 백엔드 파트 구현 완료 | 08:47 |
|---|
| 54 강 | 11_01_책 리스트를 출력하는 BooksIndex 클래스 컴포넌트 생성 및 기본 모양 테스트 | 18:34 |
|---|
| 55 강 | 11_02_fetch 함수를 사용하여 Web API 호출 후 JSON 데이터를 리스트 페이지에 출력하기 | 11:20 |
|---|
| 56 강 | 11_03_Promise 기반 HTTP 클라이언트인 axios를 사용하여 Web API 호출하기 | 11:12 |
|---|
| 57 강 | 11_04_Create, Edit, Delete 버튼 및 클릭 이벤트 처리기 생성 | 20:21 |
|---|
| 58 강 | 11_05_라우팅에 Index, Create, Edit, Delete 컴포넌트 등록 및 history 개체를 사용하여 이동 기능 구현 | 14:57 |
|---|
| 59 강 | 11_06_부트스트랩으로 Create 페이지에 대한 UI 작성 및 axios의 post 함수 호출로 입력 기능 구현 완료 | 22:48 |
|---|
| 60 강 | 11_07_넘어온 id 값에 해당하는 자료를 표시한 후 수정 페이지 기능 구현 그리고 삭제 컴포넌트 기능 구현 완료 | 20:26 |
|---|
| 61 강 | 11_08_보강_화살표 함수(람다 식)로 이벤트 핸들러 바인딩_강의 완료 | 04:18 |
|---|
