React & Express 를 이용한 웹 어플리케이션 개발하기

Velopert 님이 알려주는 ReactJS 강좌 입니다. 최근 각광받는 Javascript 라이브러리인 React 를 소개하고, 사용법을 알려주는 강좌 입니다.

(4.8) 수강평 150개

수강생 18,514명

velopert(김 민준)

React

먼저 경험한 수강생들의 후기

이런 걸 배울 수 있어요

전반적인 Web front-end 기술
Javascript, React.js, node.js

후반부 텍스트 강좌는 취소되었습니다. 이 강좌에서 다루는 내용이 조금 오래되어 새로운 강의로 리뉴얼되었습니다.
새 강의 보기

1. 강좌 소개

자바스크립트 라이브러리 ReactJS 를 학습하는 react 강좌 입니다. 요즘 들어 HOT 한 페이스북에서 개발한 자바스크립트 라이브러리, React.js 에 대하여 알아보고, 직접 사용을 해보면서 기술을 익힐 수 있는 강좌입니다. React.js 의 기본 개념부터 시작해서, 간단한 예제 프로젝트 몇개를 만들어보고, Node.js, MongoDB를 사용하여 Backend 서버를 만드는 방법도 익히고, 최종적으로는 강좌에서 배운 지식들을 결합하여 간단한 웹 어플리케이션 프로젝트를 완성합니다.

- node.js 를 사용해 본 경험이 있으면 학습하기 수월합니다.
- HTML,CSS,JAVASCRIPT 에 대한 이해도가 있는 분께 적합한 강좌입니다.
- 완강 전 입니다. 매주 한두편씩 연재될 예정입니다.
- 2016년 8월에 Webframeworks.kr 에서 진행하는 React.js 코드랩 세미나를 위해 준비한 자료를 토대로 진행합니다
참고 자료
Links
- http://slides.com/minjunkim-1/deck (강의에서 사용되는 슬라이드)
- https://velopert.com/reactjs-tutorials (React.js 텍스트 강좌 목록)

2. 도움되는 분들

평소 React.js 를 학습하고 싶었던 분
웹 프론트엔드 개발자가 되고 싶은 분
HTML,JAVASCRIPT,CSS 에 대한 이해도가 있으신 분

3. 강좌 특징

다루는 기술 : 전반적인 Web front-end 기술, Javascript, React.js, node.js
강좌 수준 : 초급~중급
사전 지식: HTML,CSS,Javascript 에 대한 기본적인 이해가 필요합니다.
node.js 를 경험해보신 분이라면 더욱 좋아요.

4. 강사 소개

김민준
트렌디한 IT기술을 지향(하려고 노력)하는 개발자, 김민준입니다. Github이나 블로그에서는 velopert로 활동하고 있습니다. React.js 라이브러리를 매우 좋아하며, 국내에서 이 라이브러리의 인기를 한층 더 높이겠다는 다짐으로 자료를 만들고 있습니다.

이런 분들께
추천드려요

학습 대상은
누구일까요?

평소 React.js 를 학습하고 싶었던 분
웹 프론트엔드 개발자가 되고 싶은 분

안녕하세요
입니다.

24,166

명

수강생

528

개

수강평

개

답변

4.8

점

강의 평점

개

강의

커리큘럼

전체

38개 ∙ (5시간 45분)

섹션 1. 섹션 1. 오리엔테이션, ReactJS 소개

3개 ∙ (23분)

1. 강좌 소개
05:11
2. React.JS 소개
09:19
3. React.js 장점과 단점
08:55

섹션 2. 섹션 2. React.js 시작하기

5개 ∙ (39분)

4. Codepen 설정 , ES6 클래스
04:46
5. JSX의 특징
06:54
6. props
07:23
7. state
08:54
8. 컴포넌트 매핑 (Component Mapping)
11:15

섹션 3. 섹션 3. 개발환경 설정, 프로젝트 진행

3개 ∙ (39분)

9. 작업환경 설정하기
06:51
10. React Project 만들기 | NPM, WEBPACK
24:03
11. Hot Module Replacement | React Hot Loader
08:08

섹션 4. 섹션 4. 주소록 (Contact) 만들기

9개 ∙ (1시간 25분)

섹션 5. 섹션 5. Redux

8개 ∙ (1시간 37분)

섹션 6. 섹션 6. Backend

7개 ∙ (1시간 0분)

섹션 7. MEMOAPP 만들기

1개

섹션 8. 번외편

2개

강의 게시일:

마지막 업데이트일:

수강평

전체

150개

4.8

150개의 수강평

javascript
수강평 6
∙
평균 평점 5.0
5
100% 수강 후 작성
この講座でリアクト入門開始しました。退屈しないように説明もできるだけきれいにしてくださる方で.. 声もいろいろなことを言うように聞いて本当に楽ですねㅎㅎㅎ 蜂蜜声帯認めます！質感のあるカリキュラムと特定の概念を理解することを意図した例はとても気に入っています。たぶんこれだけで繰り返してもリアクトの実力が上がるようですね。そして講師様が書いた「リアクトを扱う技術」の書籍も買いました。書店に行ってみんなで比較して買いましたが、100％フルカラーではありませんが、それでもカラフルな感じがします。教材に例も豊富で、この講座終わって教材見るのもいいようです。ありがとうございます。
saintruka4007
수강평 3
∙
평균 평점 5.0
5
100% 수강 후 작성
良い講義ありがとうございます。
wavyroom
수강평 93
∙
평균 평점 5.0
5
100% 수강 후 작성
無料講義なので、必要な部分だけを選んでみましたが、参考になりました。本講義はちょっと昔の内容なので参考にしてほしいと思います。
nerdmecha
수강평 88
∙
평균 평점 4.9
4
18% 수강 후 작성
ysw
수강평 5
∙
평균 평점 5.0
5
18% 수강 후 작성

무료

velopert(김 민준)님의 다른 강의

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

だれでもするリアクト: 初心者のためのreactの中心のコース

publicvelopert0034

フロントエンドフレームワーク、リアクト（React）を誰でも簡単で楽しく始められるように作られた講義です。

초급

JavaScript, React

だれでもするリアクト: 初心者のためのreactの中心のコース

publicvelopert0034

비슷한 강의

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

リアクト（React.js）を利用した独自のYouTubeサイト作成プロジェクト

webstoryboy

レッスンでは、ReactフレームワークとYouTube APIを使用して独自のリアクトなYouTubeビデオサイトを作成します。 Reactの基本概念を理解し、コンポーネントを構造化し、状態を管理する方法を学びます。また、YouTube Data APIを利用して外部データを取得する方法を学び、APIレスポンスを処理してユーザーに意味のある情報を提供する方法を理解します。これにより、独自のYouTubeサイトを作成し、活用することを目指します。

초급

React, HTML/CSS, JavaScript

リアクト（React.js）を利用した独自のYouTubeサイト作成プロジェクト

webstoryboy

オープンソースのJavaScript Reactプログラミング入門 Part.3

usefulit

Reactは、Facebookで作成されたオープンソースのJavaScriptライブラリです。 JavaScriptを使用して、コンポーネントベースのUIを作成できます。シングルページアプリケーション（SPA）の作成に最適化された現在最も人気のあるフロントエンド開発ライブラリであるリアクトを使用して、Web開発に必要なすべてのコンポーネントを学習します。 Part3では、1つの完成したデータベース処理Webアプリを作成します。

초급

React

オープンソースのJavaScript Reactプログラミング入門 Part.3

usefulit

Next.js 15で完成する実戦YouTube クローン開発

antonio

この24時間のチュートリアルでは、自分だけのYouTubeクローンを作る方法を学びます。Next 15とReact 19（tRPCを含む）、サーバーコンポーネントでのプリフェッチ、クライアントコンポーネントでのサスペンス活用、ビデオ処理、バックグラウンドジョブ、AI機能など、高度なトピックを扱います。

초급

Next.js, React, PostgreSQL

Next.js 15で完成する実戦YouTube クローン開発

antonio

Next.js完璧マスター (v15): Notion基盤開発者ブログ作り (with CursorAI)

gymcoding

最新のNext.js v15 App Routerを学習しながら、Notion基盤の実用的な開発者ブログを一緒に構築する講義です。さらにCursor AI活用法など様々なインサイトも得ることができます。

초급

React, Blog, Next.js

Next.js完璧マスター (v15): Notion基盤開発者ブログ作り (with CursorAI)

gymcoding

Python/Djangoウェブサービス開発完璧ガイド with React (Django 4.2基準)

pyhub

Python/Djangoを使ったウェブサービス開発の基礎をしっかりと固めましょう。Djangoの学習には時間がかかりますが、繰り返しの開発の中で皆さんの生産性を最大化できます。皆さんの想像を現実のものにしてください。

초급

Python, Django, React

Python/Djangoウェブサービス開発完璧ガイド with React (Django 4.2基準)

pyhub

コロナマップ開発者が教えるReact + Expressで地図サービスを作る (Typescript)

donghunee

MERN stack (feat. TypeScript) を活用して、地図サービスを最初から最後まで作成する講義です。API 公式ドキュメントを見ながら、一つずつ順を追って作成してみましょう。

초급

MongoDB, Express, React

コロナマップ開発者が教えるReact + Expressで地図サービスを作る (Typescript)

donghunee

フォローして学ぶリアクト、ファイアベース - チャットアプリケーションを作る[2023.12リニューアル]

John Ahn

この講義を通じてリアクトとファイアベースを利用してチャットアプリケーションを作成することができます。

초급

React, Firebase, Web Application

フォローして学ぶリアクト、ファイアベース - チャットアプリケーションを作る[2023.12リニューアル]

John Ahn

iOS/Androidアプリ開発のための本番 React Native - Basic

Wintho

Mobile App Front-End開発のためのReact Nativeの基礎知識の習得を目指しています。進入障壁の低い言語/APIの活用により、非専門家も簡単にNative Mobile Appを開発できるように作られた講義です。

초급

React Native, React, ES6

iOS/Androidアプリ開発のための本番 React Native - Basic

Wintho

[VOD] 6週間完成！開発実務のための高濃縮バイブコーディング (Cursor AI, Figma)

codecamp

10分で바이브코딩で作れる単純なサービスはもう捨てましょう！ '本当の'実務適用바이브코딩を学ぶことができます。企画とデザイン通りに実サービスレベルの高度化されたサービスをカーソルAI NCOPで作ってみましょう。 No Code, Only Prompt

중급이상

React, Next.js, cursor

[VOD] 6週間完成！開発実務のための高濃縮バイブコーディング (Cursor AI, Figma)

codecamp

SpringBoot & React ポートフォリオプロジェクト: AWSサービスで実戦デプロイ入門

ehtjd339667

ReactフロントエンドとSpringBootバックエンドをAWSクラウドに直接デプロイするポートフォリオ中心の講座！素早く自分のポートフォリオにフロント、バックエンドプロジェクトをデプロイしたい方に役立つ講座です！デプロイに必要な知識を、サーバー設定からDocker、Domain接続、Nginx、HTTPS適用まで段階別に短期間で実習できるようになります！

초급

React, Java, AWS

SpringBoot & React ポートフォリオプロジェクト: AWSサービスで実戦デプロイ入門

ehtjd339667

[JavaScript GUI開発 #1] Electron + Reactで作るタイマーアプリ (+ Zustand)

dakgangjung123

React, Electron, Zustandを活用しタイマーアプリを直接制作、クロスプラットフォーム（Windows、macOS、Linux）へデプロイまで行う実践講義です。慣れ親しんだReactウェブ開発を皮切りに、Zustandを通じたグローバル状態管理と最終的なGUIデプロイまで、デスクトップアプリ開発の全体的な流れを学ぶことができます！

초급

React, Electron, GUI

[JavaScript GUI開発 #1] Electron + Reactで作るタイマーアプリ (+ Zustand)

dakgangjung123

Web開発者の年収を上げるハイブリッドアプリ with Expoフレームワーク

codecamp

Web開発を活用して、AndroidとIOSでサービス可能なモバイルアプリ開発ができるようにする講座です。

초급

React, Next.js, expo

Web開発者の年収を上げるハイブリッドアプリ with Expoフレームワーク

codecamp

React Native with Expo: ゼロチョから正しく学ぶ

zerocho

Web開発者が(特にReact開発者であれば)本当に簡単にアプリをリリースできる時代になりました。Expoと一緒なら、より一層速くAndroidとiOSアプリの両方をリリースできます。Expoを通じて迅速にアプリまでリリースできる開発者になりましょう。

초급

React, React Native, Hybrid App

React Native with Expo: ゼロチョから正しく学ぶ

zerocho

Next.js つけ麺フルコース (英語音声 & 韓国語字幕)

ludgi

Next.jsフルコースをディップして食べよう！ GraphQL、Redis、RabbitMQ、Prisma、TailwindCSS、Docker Compose、Cypress、Prometheus、Grafanaなど、最新技術で実践プロジェクトを完成させ、App RouterとPage Routerの両方を経験できます。

중급이상

Next.js, React, GraphQL

Next.js つけ麺フルコース (英語音声 & 韓国語字幕)

ludgi

TypeScript Korea：React with TypeScriptセミナー

woongjae

タイプスクリプトとリアクト関連講座です。

중급이상

React, TypeScript

TypeScript Korea：React with TypeScriptセミナー

woongjae

React & Express 를 이용한 웹 어플리케이션 개발하기

먼저 경험한 수강생들의 후기

이런 걸 배울 수 있어요

새 강의 보기

1. 강좌 소개

참고 자료

2. 도움되는 분들

3. 강좌 특징

4. 강사 소개

김민준

이런 분들께 추천드려요

안녕하세요 .css-1q3zd4q{text-decoration-line:underline;text-underline-position:under;text-underline-offset:1px;}입니다.

커리큘럼

수강평

velopert(김 민준)님의 다른 강의

비슷한 강의

이런 분들께
추천드려요

안녕하세요
입니다.