React 프로그래밍 입문 (함수형 컴포넌트 기반, 예제 25문 포함) Part.1
입문자 및 초보개발자가 꼭 알아야할 React의 필수사항들과 핵심을 쉽게 배워봅시다!
Description
[강의 소개]
본 과정은 핵심 예제 25개를 통해서 React의 기본적인 사용법과 핵심내용들을 학습합니다. 리액트 프런트엔드 라이브러리를 공부하는 입문자 및 초보자가 꼭 알아야할 필수사항들과 기능들을 학습합니다. 어려운 개념을 실생활에서 볼 수 있는 예로 비유를 들어 초보자의 눈높이에 맞춰서 누구라도 이해할 수 있도록 설명합니다.
본 과정은 [HD]예제로 마스터 하는 React 25제 입문 (함수형 컴포넌트 기반으로만 강의) Part.2 과정과 이어지므로 Part. 2 과정을 이후에 수강하길 권장합니다.
[본 강의를 수강해야 하는 이유]
1. 핵심 예제 25개를 통해서 React의 기본적인 사용법과 핵심들을 학습합니다.
2. 리액트 프런트엔드 라이브러리를 공부하는 입문자가 꼭 알아야할 필수사항들과 기능들을 학습합니다.
3. 어려운 개념을 실생활에서 볼 수 있는 예로 비유를 들어 초보자의 눈높이에 맞춰 쉽게 설명합니다.
4. 함수형 컴포넌트 기반으로만 강의를 진행합니다.
[본 강의에서 다룰 내용]
구체적으로 이 강의는 다음을 제공합니다.
Part.1 VSCode 학습 및 리액트 파일구조
강의개요
학습환경 - 에디터 종류 및 다운 설치
비주얼스튜디오 코드 기본 사용법
Emmet Abbrebiation 활용
class id 삽입, 숫자 자동 증가, 주석 처리, 세로 멀티 선택
탭 간격 조정 및 공백 변경
옵션 설정 초기화 및 기본 제공되는 HTML5 템플릿 디자인 변경하기
커스텀 템플릿에 수정할 커서위치 적용, 드래그 폴더 열기, 행간 자간 조정, 줄번호 미니맵 표시
리액트 설치- 개발 서버 스타트 및 리액트 앱 디렉토리 삭제
리액트 App 웹사이트 폴더 구조 및 주요 구성 파일들
주요 리액트 파일 3가지
불필요한 파일과 코드 삭제 및 컴포넌트 기본 작성 규칙
리액트 파일구조 및 소스코드 분석
Part.2 리액트 컴포넌트
리액트에서 사용하는 표기법
index.js 스크립트 파일은 어디에서 불러오는 것인가
컴포넌트란 무엇인가
컴포넌트 구현 시 중요한 3가지 사항
컴포넌트 만들기 실습
컴포넌트 내부에서 CSS 스타일 적용하는 방법
구조분해할당
구조분해할당을 사용한 동적 변수 처리
rest 나머지 패턴
자바스크립트 rest vs spread 차이점
리액트에서 구조분해할당 사용 예
[본 강의의 대상]
1. React 프런트엔드 라이브러리 기본과 필수 학습사항들을 학습해보고자 하는 자
2. 예제를 통해서 하나하나씩 문법을 학습해가고자 하는 자
입문자 및 초보개발자가 꼭 알아야할 React의 필수사항들과 핵심을 쉽게 배워봅시다!
1강에서 뵙겠습니다.
- ITGO
What You Will Learn!
- 핵심 예제 25개를 통해서 React의 기본적인 사용법과 핵심들을 학습합니다.
- 리액트 프런트엔드 라이브러리를 공부하는 입문자가 꼭 알아야할 필수사항들과 기능들을 학습합니다.
- 어려운 개념을 실생활에서 볼 수 있는 예로 비유를 들어 초보자의 눈높이에 맞춰 쉽게 설명합니다.
- 함수형 컴포넌트 기반으로만 강의를 진행합니다.
Who Should Attend!
- 1. React 프런트엔드 라이브러리 기본과 필수 학습사항들을 학습해보고자 하는 자
- 2. 예제를 통해서 하나하나씩 문법을 학습해가고자 하는 자