직무 / IT / 프로그래밍직무

[HD]페이스북에서 만든 오픈 소스 자바스크립트 React(리액트) 프로그래밍 입문 Part.2

[HD]페이스북에서 만든 오픈 소스 자바스크립트 React(리액트) 프로그래밍 입문 Part.2

과정 소개

제작: 2025년 09월

리액트(React)는 페이스북에서 만든 오픈 소스 자바스크립트 라이브러리입니다. 자바스크립트를 사용하여 컴포넌트 기반으로 UI를 만들 수 있습니다.

SPA(Single Page Application)을 만드는데 최적화된 현재 가장 인기있는 프런트엔드 개발 라이브러리인 리액트를 사용하여 웹 개발을 하는데 필요한 모든 구성 요소를 학습합니다.

강의 대상

리액트(React)를 사용한 웹 개발에 대한 기본 개념을 학습합니다.

리액트의 컴포넌트를 만드는 여러가지 방법을 학습합니다.

닷넷코어를 사용하여 백엔드 API를 만드는 방법을 학습합니다.

하나의 완성된 데이터베이스 처리 웹앱을 만들어봅니다.

강의 목표

리액트와 닷넷코어를 기반으로 풀스택으로 웹 개발을 하고자하는 개발자

학습 내용

  1. 섹션 1
    1. SeeSharpGuide_01_create-react-app으로 프로젝트 만들고 기본 컴포넌트와 함수 컴포넌트를 사용하여 강좌 리스트
    2. SeeSharpGuideTitle_className과 style을 사용하여 자식 컴포넌트에 스타일 적용하는 방법 설명
    3. 리액트 라우팅 경로 지정 이론 설명
    4. About 컴포넌트 생성 및 라우팅에 추가
  2. 섹션 2
    1. Contact 컴포넌트 생성 및 실행 데모
    2. ContactDetails와 Copyright 서브 컴포넌트 생성 및 부모 컴포넌트에 포함해서 실행
    3. TechList와 SiteList 서브 컴포넌트 생성 및 Home 컴포넌트에 포함해서 실행
    4. About과 Contact 컴포넌트 UI 변경하기
  3. 섹션 3
    1. 버튼에 인라인 스타일 적용하기
    2. React.Fragment를 사용하여 컴포넌트에서 동일 레벨의 여러 HTML 요소 표현하기
    3. 리액트 state 개체로 상태 관리하기 이론
    4. StateDescription_state 개체를 사용하여 클래스 컴포넌트에서 title과 message 속성을 저장하고 출력하는 상태 관리 데모
  4. 섹션 4
    1. 리액트 컴포넌트 라이프 사이클 componentDidMount
    2. 리액트 onClick 이벤트 처리기 이론
    3. OnClickEventHandler_onCLick 이벤트 처리기에서 클릭 이벤트를 처리하는 3가지 모양 정리
    4. OneWayBinding_React에서 텍스트박스의 값을 읽어 sate 개체에 저장 후 다시 출력하는 초간단 양방향 바인딩 구현하기
  5. 섹션 5
    1. 초간단 인-메모리 TodoList 만들기 데모

교강사

박용준

감사합니다~

훈련 비용

기본 훈련 비용
가 격34,000 원

과정 후기

교재
이 과정은 지정된 교재가 없습니다.