React와 Node.js를 활용한 고객 관리 시스템 개발

리액트와 node.js를 이용해 웹 기반의 고객 관리 시스템을 개발해봅시다.

클래스 소개
난이도
쉬움
카테고리
웹 프로그래밍 - 프로그래밍
태그
리액트, 자바스크립트, node.js
추천 학습대상
- 맥이나 리눅스 프로그래밍을 경험해보지 않은 초보 개발자
- 리액트를 실제로 적용한 사이트를 구축하고 싶은 분
- 웹 서버 프로그래밍에 관심이 많고 실제 데이터베이스를 다루어보고 싶은 분
- 윈도우 환경에서 웹 프로그래밍을 하고 싶은 분

🎡웹 프로그래밍으로 만드는 매니지먼트 시스템 A to Z🎡

- React와 Node.js로 고객 관리 시스템을 구축해봅시다. -



📝강좌 소개


🔫응용프로그램으로 구현했던 다양한 매니지먼트 시스템이 점점 웹 애플리케이션으로 구축되기 시작했습니다. 해당 과목에서는 2019년 가장 핫한 웹 프론트 라이브러리인 React를 이용해 웹 사이트를 효과적으로 구성하여 출력하고, Node.js를 이용해 실제 사용자의 고객 정보를 데이터베이스로 관리하려 합니다.

👶맥이나 리눅스를 이용하여 개발하는 분들도 많지만, 다수의 윈도우 사용자와 초보 개발자를 위해 윈도우 환경에서 강좌를 진행합니다. 추후 강의자 님의 필요에 따라 강의가 추가될 수 있습니다.



🎯학습 목표


  • 맥이나 리눅스 환경이 익숙치 않은 초보 개발자 및 윈도우 사용자가 웹 애플리케이션을 제작할 수 있습니다.
  • 최고의 인기를 누리고 있는 React를 실제로 어떻게 적용할 수 있는지 다루어봅니다.
  • Node.js를 이용해 웹 서버에서 데이터베이스를 어떻게 다루는지 배웁니다.

 


강의자 소개


안경잡이개발자(나동빈)

  • 포항공과대학교 대학원 컴퓨터공학과 석사 졸업

체험하기
모두 펼치기
  • 02
    01. 환경 세팅 및 기초
  • Create React App으로 리액트(React) 프로젝트 시작하기
    Visual Studio Code를 이용한 소스코드 작성
    깃 허브(Git Hub)를 이용해 소스 코드 관리하기
교육 과정
모두 펼치기
  • 01
    00. ReactJS 이론부터 실전까지
  • ReactJS의 개요 및 Hello World
    코드펜(Codepen)을 이용한 React 개발환경 구축하기
    React에서 JSX란
    React의 Component와 Props
    React의 State
    React의 Lifecycle과 API호출
    React의 이벤트 처리
  • 02
    01. 환경 세팅 및 기초
  • Create React App으로 리액트(React) 프로젝트 시작하기
    Visual Studio Code를 이용한 소스코드 작성
    깃 허브(Git Hub)를 이용해 소스 코드 관리하기
  • 03
    02. 시스템 구현
  • 고객 컴포넌트(Component) 만들기
    고객 컴포넌트 구조화하기
    Material UI를 적용하여 고객 테이블 디자인하기
    Node.js Express 서버 개발환경 구축하기
    Node.js Express에서 REST API 구축하기
    리액트의 라이프 사이클 이해 및 API 로딩 처리 구현하기
    AWS RDS 서비스를 이용하여 MySQL DB 구축하기
    고객(Customer) DB 테이블 구축 및 Express와 연동하기
    고객 추가 양식(Form) 구현 및 이벤트 핸들링
    Node.js Express에서 파일 업로드 요청 처리 및 DB에 데이터 삽입
    부모 컴포넌트의 상태(State) 변경을 통한 고객 정보 갱신
    고객 정보 삭제 기능 구현하기
    Material UI 모달(Modal) 디자인 구현하기
    AppBar 및 웹 폰트를 적용하여 디자인 개편하기
    필터(Filter) 함수를 이용한 고객 검색 기능 구현하기
마지막 업데이트|2019년 05월 02일
선생님 소개
안녕하세요. 구름에듀 캡틴 나동빈입니다. 함께 학습을 시작해봐요!

클래스 후기
무료

평균평점
4.9
난이도
쉬움
학습기간
평생 무제한