인프런 영문 브랜드 로고
인프런 영문 브랜드 로고
개발 · 프로그래밍

/

풀스택

따라하며 배우는 노드, 리액트 시리즈 - 기본 강의

이 강의를 통해서 리액트와 노드를 어떻게 사용하는지 기본적인 내용들을 배울 수 있습니다.

(4.8) 수강평 889개

수강생 23,098명

ReactNode.js
Thumbnail

초급자를 위해 준비한
[웹 개발, 풀스택] 강의입니다.

이런 걸 배울 수 있어요

  • 리액트

  • 노드

  • 리덕스

  • Express JS

  • 몽고 DB

리액트와 노드의 기본을 학습하세요!

📝 강의 소개

안녕하세요 ^ ^ 
이 강의에서는 리액트와 노드로 실질적인 어플리케이션을 만들기 위해 
필요한 기본 개념들을 다루고 있습니다.

💡 강의 특징

강의를 만들면서 수강생분들이 어떠한 것들을 궁금해할지를 스스로 질문하면서
조금이라도 의문이 생기는 것이 있으면 계획에 없었던 강의 내용들도 추가해 가며 만들었습니다. 

기본 개념이긴 하지만, 실질적으로 실무에서 쓸 수 있는 중요한 개념들을 주로 다루었습니다.

🧰 여기서 다루는 툴

Visual Studio Code를 사용하지만 자신이 원하는 Editor를 사용해도 됩니다. 
MAC을 사용하지만 윈도우에서도 가능합니다.

John Ahn

🙋🏻‍♂️ QnA

Q. 비전공자도 들을 수 있나요?
A. 넵! 전공자, 비전공자 상관없이 들을 수 있는 강의입니다.

Q. 왜 노드, 리액트 등을 배워야 하나요?

2019년 Stackoverflow survey 결과를 가져와 봤습니다. 
보시다시피 리액트와 노드의 인기는 해가 지나갈수록 점점 높아지고 있기 때문에 
배워 두신다면 자신의 커리어 향상에 많은 도움을 줄 수 있습니다.

Q. 노드, 리액트를 배우면 어떤 일을 할 수 있나요?
웹 개발자, 서버 개발자, 프론트엔드 개발자로서 일을 할 수 있습니다.

이런 분들께
추천드려요!

학습 대상은
누구일까요?

  • 자바 스크립트를 즐겁게 사용하고 싶으신 분

  • 실무에서 사용하는 개념을 배우고 싶으신 분

선수 지식,
필요할까요?

  • 자바스크립트

안녕하세요
John Ahn입니다.

83,096

명

수강생

2,644

개

수강평

2,428

개

답변

4.8

점

강의 평점

20

개

강의

안녕하세요. 

즐겁게 개발하고 있는 개발자입니다. 

앞으로 많은 도움을 드릴 수 있었으면 좋겠습니다.


- 따라하며 배우는 도커와 CI환경 저자
- 카카오 기업 신입 공채 FE 교수자
- 패스트캠퍼스, 구름 강사 
- 현대자동차 개발 기업 교육
- 신한은행 메타버스, 코빗 타운 풀스택 개발
- 여러 공공기관 SNS 풀스택 개발

더보기

커리큘럼

전체

36개 ∙ (4시간 53분)

해당 강의에서 제공:

수업자료
강의 게시일: 
마지막 업데이트일: 

수강평

전체

889개

4.8

889개의 수강평

  • 헬프미님의 프로필 이미지
    헬프미

    수강평 1

    ∙

    평균 평점 5.0

    5

    36% 수강 후 작성

    와 정말 감사합니다. udemy에서 20만원쓰고도 서버제작 엄두도 못내고 있었는데 이 수업듣고 기본 로드맵 바로 딱 잡히네요. 취미로 코딩공부하면서 투두리스트 만들고 있었는데, 회사에서 들켜서 직무 바꿔버리고 서버 만들라해서 막막해 하고 있었습니다. 이 수업은 복잡한 서버활용한 홈페이지만들기는 아니지만, 이 수업을 통해 어떻게 서비스를 구현할 지 로드맵을 그릴 수 있는 그런 수업이였어요. 확실히 node.js랑 react를 사용하다보니 프로그래밍을 잘 모르는 분에게는 어려울 수 있겠습니다. 만약 정말 100퍼센트를 다 뽑아보고 싶으시다면 에치티엠엘, 씨에스에스 한 두시간씩만 공부해보시고, 자바스크립트 무료로 나온것들 수업 주말 이틀잡고 공부해보시고 들으시면 정말 큰 도움이 될거에요. 이런 양질의 수업 무료로 베풀어주셔서 감사합니다. 어느쪽에 계신가요? 계신방향으로 큰절 올리겠습니다

    • 소라연님의 프로필 이미지
      소라연

      수강평 81

      ∙

      평균 평점 5.0

      5

      100% 수강 후 작성

      끝까지 완강했습니다. 최고!! 큰 도움이 되었습니다!!

      • John Ahn
        지식공유자

        소라연님 금방 들으셨네요 ^^ 좋은 수강평 남겨주셔서 진심으로 감사합니다 !! ^ ^

    • mo0562님의 프로필 이미지
      mo0562

      수강평 5

      ∙

      평균 평점 5.0

      5

      100% 수강 후 작성

      강사님 말씀하셨듯이 기본강의이지만 기본강의 아닌듯 기본같은 실무에 충실하고 재미있는 강의였습니다. 실무에서 필수적인 부분을 꼭 찍어서 강의해 주셔서 감사합니다.

      • John Ahn
        지식공유자

        좋은 수강평 남겨 주셔서 너무 감사합니다 ! 그리고 완강하시느라 너무나 수고하셨습니다^^ !!!

    • 장재영님의 프로필 이미지
      장재영

      수강평 4

      ∙

      평균 평점 5.0

      5

      100% 수강 후 작성

      너무 좋은강의로인해 팀원들끼리 프로젝트를하면서 모듈을 구현하는데 도움이 많이됬습니다 한가지 질문이있다면 저희가 만든걸 바탕으로 회원정보수정을 구현하고싶은데 정보가많이없어 도움을 받을수있을까요ㅠ?

      • John Ahn
        지식공유자

        아 안녕하세요 ! 네 궁금하신것 있으면 질문 주시면 최대한 도와드리겠습니다 !!! ^^

    • Rush님의 프로필 이미지
      Rush

      수강평 1

      ∙

      평균 평점 5.0

      5

      100% 수강 후 작성

      현역 개발자입니다.. 풀스텍으로 다 사용하는데 저도 이런 강의 하나 만들어야 겠다 싶었는데..와.. 언제생겼는지 정말 완벽한 강의네요 정말 강력추천 드립니다.. 모든분들 이거부터 보시길 바래요 react native로 react navigation V5 강의하나 찍어주세요..ㅋㅋㅋㅋ

      John Ahn님의 다른 강의

      지식공유자님의 다른 강의를 만나보세요!

      따라하며 배우는 자바스크립트 A-Z강의 썸네일

      따라하며 배우는 자바스크립트 A-Z

      John Ahn

      웹 개발의 기초가 되는 자바스크립트의 기초부터 중급까지 배울 수 있습니다.

      입문

      입문

      JavaScript

      따라하며 배우는 리액트 네이티브 기초강의 썸네일

      따라하며 배우는 리액트 네이티브 기초

      John Ahn

      이 강의를 통해서 리액트 네이티브를 이용해서 애플리케이션 개발을 할 수 있습니다.

      초급

      초급

      React Native, React, expo

      따라하며 배우는 타입스크립트 A-Z강의 썸네일

      따라하며 배우는 타입스크립트 A-Z

      John Ahn

      이 강의를 통해 타입스크립트에 대해서 배울 수 있습니다.

      초급

      초급

      TypeScript, JavaScript

      따라하며 배우는 HTML, CSS강의 썸네일

      따라하며 배우는 HTML, CSS

      John Ahn

      이 강의를 통해서 HTML, CSS 기본을 다질 수 있습니다.

      입문

      입문

      HTML/CSS

      따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)강의 썸네일

      따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)

      John Ahn

      이 강의를 통해서 레딧 웹사이트를 처음부터 하나하나 만들어 보실 수 있습니다.

      초급

      초급

      클론코딩, Node.js, React

      따라하며 배우는 웹 게임강의 썸네일

      따라하며 배우는 웹 게임

      John Ahn

      이 강의를 통해서 웹 게임을 어떻게 개발해야 하는지 알 수 있습니다.

      중급이상

      중급이상

      React

      따라하며 배우는 리액트 A-Z[19버전 반영]강의 썸네일

      따라하며 배우는 리액트 A-Z[19버전 반영]

      John Ahn

      이 강의를 통해 리액트 기초부터 중급까지 배우게 됩니다. 하나의 강의로 개념도 익히고 실습도 하며, 리액트를 위해 필요한 대부분의 지식을 한번에 습득할 수 있도록 만들었습니다.

      초급

      초급

      React, Next.js, TypeScript

      따라하며 배우는 리액트 테스트 [2023.11 업데이트]강의 썸네일

      따라하며 배우는 리액트 테스트 [2023.11 업데이트]

      John Ahn

      이 강의를 통해 리액트 애플리케이션을 테스트하는 법을 배우게 됩니다.

      초급

      초급

      React, React Context, 웹앱

      따라하며 배우는 NestJS강의 썸네일

      따라하며 배우는 NestJS

      John Ahn

      이 강의를 통해 NestJS에 대해서 배울 수 있습니다.

      초급

      초급

      NestJS, PostgreSQL, TypeORM

      따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]강의 썸네일

      따라하며 배우는 리액트, 파이어베이스 - 채팅 어플리케이션 만들기[2023.12 리뉴얼]

      John Ahn

      이 강의를 통해서 리액트와 파이어베이스를 이용해서 채팅 어플리케이션을 만들수 있습니다.

      초급

      초급

      React, Firebase, 웹앱

      따라하며 배우는 TDD 개발 [2023.11 업데이트]강의 썸네일

      따라하며 배우는 TDD 개발 [2023.11 업데이트]

      John Ahn

      이 강의를 통해서 테스트 주도 개발(TDD)을 이용하여 Node.js 어플리케이션을 만들어 봅니다.

      초급

      초급

      TDD, Node.js, Express

      따라하며 배우는 도커와 CI환경 [2023.11 업데이트]강의 썸네일

      따라하며 배우는 도커와 CI환경 [2023.11 업데이트]

      John Ahn

      이 강의를 통해 도커에 대해서 배울 수 있으며, CI 환경을 구성할 수 있습니다.

      초급

      초급

      GitHub, AWS, Docker

      따라하며 배우는 데노(DENO) - 기본 강의강의 썸네일

      따라하며 배우는 데노(DENO) - 기본 강의

      John Ahn

      출시 전부터 많은 관심을 받았던 데노가 드디어 나왔습니다. 이 강의에서 데노가 노드와 어떻게 다르며 어떻게 데노를 다루는지를 배울 수 있습니다.

      초급

      초급

      Deno

      따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]강의 썸네일

      따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]

      John Ahn

      이 강의를 통해서 쇼핑몰 웹사이트를 처음부터 하나하나 만들어 보실 수 있습니다.

      중급이상

      중급이상

      React, Redux, Node.js

      따라하며 배우는 노드, 리액트 시리즈 - 챗봇 사이트 만들기강의 썸네일

      따라하며 배우는 노드, 리액트 시리즈 - 챗봇 사이트 만들기

      John Ahn

      이 강의를 통해서 Google에서 제공하는 API를 사용해서 챗봇을 만들어 볼 수 있습니다.

      초급

      초급

      React, Node.js

      따라하며 배우는 노드, 리액트 시리즈 - 영화 사이트 만들기강의 썸네일

      따라하며 배우는 노드, 리액트 시리즈 - 영화 사이트 만들기

      John Ahn

      이 강의를 통해 리액트와 노드등의 개념만이 아닌, 실질적으로 어떻게 웹 사이트를 만드는지를 배울 수 있습니다.

      초급

      초급

      React, Node.js, 웹앱

      따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기강의 썸네일

      따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기

      John Ahn

      이 강의를 통해 리액트와 노드의 개념을 익히는 것뿐만이 아닌 실질적으로 어떻게 웹사이트를 만들 수 있는지를 배울 수 있습니다.

      초급

      초급

      React, Redux, Node.js

      비슷한 강의

      같은 분야의 다른 강의를 만나보세요!

      따라하며 배우는 노드, 리액트 시리즈 - 챗봇 사이트 만들기강의 썸네일

      따라하며 배우는 노드, 리액트 시리즈 - 챗봇 사이트 만들기

      John Ahn

      이 강의를 통해서 Google에서 제공하는 API를 사용해서 챗봇을 만들어 볼 수 있습니다.

      초급

      초급

      React, Node.js

      따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기강의 썸네일

      따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기

      John Ahn

      이 강의를 통해 리액트와 노드의 개념을 익히는 것뿐만이 아닌 실질적으로 어떻게 웹사이트를 만들 수 있는지를 배울 수 있습니다.

      초급

      초급

      React, Redux, Node.js

      스프링 부트와 리액트로 구현하는 소셜 로그인강의 썸네일

      스프링 부트와 리액트로 구현하는 소셜 로그인

      온코딩

      스프링 부트와 리액트를 활용해 일반 로그인과 소셜 로그인을 통합 구현하는 방법을 배웁니다. MPA와 SPA 환경 모두에서 로그인 시스템을 구축하고, JWT와 OAuth2 인증을 실습합니다. 실무에 바로 적용 가능한 예제 프로젝트를 통해 전체 로그인 흐름을 이해하고 구현할 수 있습니다.

      중급이상

      중급이상

      Java, Spring Boot, JPA

      풀스택 리액트 라이브코딩 - 간단한 쇼핑몰 만들기강의 썸네일

      풀스택 리액트 라이브코딩 - 간단한 쇼핑몰 만들기

      정재남

      개발부터 배포까지! 하나의 서비스를 완성하기 위한 험난한 여정을 여과없이 보여드립니다. 처음 써보는 기술들을 잔뜩 도입하여 좌충우돌 우당탕탕하면서도 어떻게든 헤쳐나갈 수 있어요!

      초급

      초급

      React, GraphQL, Firebase

      React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드강의 썸네일

      React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드

      닭강정

      React, Node.js, MongoDB를 활용해 회사 웹사이트를 직접 제작하는 과정을 배울 수 있는 실전 강의입니다. 간단한 React, Node.js 배경으로 풀스택 프로젝트를 같이 만들어요!

      중급이상

      중급이상

      React, Node.js, MongoDB

      React 비기너: 튼튼한 기본 만들기강의 썸네일

      React 비기너: 튼튼한 기본 만들기

      김영보

      React 기본을 배울 수 있습니다. React와 관련된 HTML, JavaScript, DOM, Event, Object, Module, OOP 등을 정리할 수 있습니다.

      초급

      초급

      React, JavaScript, DOM

      리액트 공식문서 함께 공부하기강의 썸네일

      리액트 공식문서 함께 공부하기

      정재남

      2023년 리뉴얼된 React 공식 문서를 함께 학습해요.

      입문

      입문

      React, JavaScript, react.js

      별 찍기 그거 도대체 왜 하는거야 ??강의 썸네일

      별 찍기 그거 도대체 왜 하는거야 ??

      촉촉한건빵맨

      이걸 깨닫는데, 무려 1년이라는 시간이 걸렸습니다.

      입문

      입문

      C, Node.js, Express

      웹 개발자의 연봉을 올려주는 하이브리드앱 with Expo 프레임워크강의 썸네일

      웹 개발자의 연봉을 올려주는 하이브리드앱 with Expo 프레임워크

      코드캠프

      웹 개발을 활용해서 Android와 IOS에 서비스 가능한 모바일앱 개발을 할 수 있도록 도와주는 강의입니다.

      초급

      초급

      React, Next.js, expo

      타입스크립트 코리아 : React with TypeScript 세미나강의 썸네일

      타입스크립트 코리아 : React with TypeScript 세미나

      이웅재

      타입스크립트와 리액트 관련 강좌입니다.

      중급이상

      중급이상

      React, TypeScript

      GraphQL: REST API를 대체할 기술강의 썸네일

      GraphQL: REST API를 대체할 기술

      Burger

      GraphQL의 프론트엔드와 백엔드를 한번에 배울 수 있는 기회

      초급

      초급

      GraphQL, Spring Boot, Node.js

      WEB5 - Express Passport.js강의 썸네일

      WEB5 - Express Passport.js

      Egoing Lee

      이 수업은 Node.js Express의 인증 미들웨어인 Passport.js의 사용법을 알려드리는 수업입니다.

      중급이상

      중급이상

      Node.js, Express

      얄팍한 GraphQL과 Apollo강의 썸네일

      얄팍한 GraphQL과 Apollo

      얄팍한 코딩사전

      ⚡ 짧고 굵은 전체 90분 강좌! 사이트의 코드들을 복붙하며 빠르게 GraphQL을 배우고 아폴로 사용법을 익히세요.

      초급

      초급

      GraphQL, Apollo, Node.js

      [2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스강의 썸네일

      [2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스

      정현우

      아이디어는 있는데 앱을 어떻게 개발해야할지 몰랐던 분들, 실전 프로젝트 4개를 만들어보면서 앱 개발을 마스터해봅시다!

      입문

      입문

      JavaScript, React, Node.js

      Node.js로 웹 크롤링하기강의 썸네일

      Node.js로 웹 크롤링하기

      제로초(조현영)

      네이버, 아마존, 트위터, 유튜브, 페이스북, 인스타그램, unsplash.com 등의 사이트를 크롤링하며 실전에 적용해봅니다.

      중급이상

      중급이상

      JavaScript, Node.js, 웹 크롤링

      Node.js로 데이터베이스 다루고 웹 애플리케이션 만들기강의 썸네일

      Node.js로 데이터베이스 다루고 웹 애플리케이션 만들기

      Egoing Lee

      서버측 자바스크립트 언어인 Nodejs 와 데이터베이스의 관계를 소개하고 NodeJs 와 데이터베이스를 통해 웹어플리케이션을 제작하는 방법을 알려줍니다.

      초급

      초급

      Node.js

      무료