Web Development

NodeFull Stack Development Guide

Let's create your own shopping mall in a Docker environment regardless of Mac or Windows ^^

22 learners are taking this course

ssaple

이론 실습 모두

React

Docker

redux-toolkit

oauth2

What you will learn!

react
react-router-dom
redux-toolkit
vite
sass
nginx
Using Kakao Address API
Infinite Scroll
Implementing Admin Page
express
cheerio
Oauth2.0
postgresql
web3 storage
filecoin
sendgrid
SNS Login (Naver, Kakao, Google)
Kakao Pay implementation

Node FullStack Development Guide Series

🖥️ Colini Web Development Guide [Part 1]: https://inf.run/tx8Jb (10% off Node FullStack Development Guide coupon)
🖥️ Node FullStack Development Guide [Part 2]: https://inf.run/zdPci (10% off Terraform Deployment Guide coupon)
🖥️ Terraform Deployment Guide [Part 3]: https://inf.run/bzPPR (Learning materials provided in Notion)
💻 Node FullStack Development Roadmap, A~Z [Roadmap]: https://www.inflearn.com/roadmaps/731 20% discount coupon provided upon participation ※ Free participation

Recommended for
these people

Who is this course right for?

Anyone who knows the basics of web development
People who have difficulty listening to lectures for more than 5 minutes
Colini Web Development Guide Student
Anyone who wants to create from development to production using Docker

Need to know before starting?

Html, Css, Javascript, React Basics

Hello
This is

587

Learners

Reviews

271

Answers

4.1

Rating

Courses

낮에는 평범한 회사원이지만, 밤에는 열정을 가진 개발자 입니다

Curriculum

All

240 lectures ∙ (19hr 19min)

Course Materials:

Lecture resources

Section 1. Intro

10 lectures ∙ (41min)

1. Lecture Guide
03:34
2. Introduction to front-end and back-end technologies (1)
04:36
3. Introduction to Backend Technology (2)
04:34
4. How to learn
03:50
5. Flow of History (SSR, CSR)
03:05
6. Reasons for producing with CSR (1)
04:38
7. Reasons for producing with CSR (2)
03:22
8. [Practice] Basic settings (1)
05:00
9. [Practice] Basic settings (2)
04:55
10. [Practice] Basic settings (3)
03:43

Section 2. Basic settings such as API, Docker, etc.

36 lectures ∙ (2hr 52min)

11. sequelize(1)
05:30
12. sequelize(2)
05:56
13. sequelize(3)
05:10
14. sequelize(4)
04:40
15. sequelize(5)
03:19
16. sequelize(6)
03:14
17. sequelize(7)
03:59
18. sequelize(8)
04:13
19. sequelize(9)
05:39
20. sequelize(10)
04:46
21. sequelize(11)
05:58
22. docker(1)
05:56
23. docker(2)
05:56
24. docker(3)
03:24
25. docker(4)
05:48
26. db, gateway(1)
05:30
27. gateway(2)
03:57
28. Front Setting (1)
04:20
29. Front Setting (2)
04:27
30. Front setting (3), docker compose (1)
05:45
31. docker compose(2), docker command
04:13
32. Practice (1)
05:23
33. Practice (2)
03:29
34. Practice (3)
05:35
35. Practice (4)
05:47
36. Practice (5)
04:38
37. Practice (6)
03:54
38. Practice (7)
04:44
39. Practice (8)
05:23
40. Practice (9)
04:30
41. Practice (10)
05:25
42. Practice (11)
04:15
43. Practice (12)
04:21
44. Practice (13)
05:44
45. Practice (14)
04:34
46. Practice (15)
03:22

Section 3. HomeScreen

29 lectures ∙ (2hr 12min)

47. server.js(1)~(2)
04:55
48. server(3)~postController folder
03:54
49. main.jsx(1)~App.jsx(1)
05:35
50. App.jsx(2)~assets folder(1)
04:21
51. assets folder (2)
04:00
52. assets folder (3)~store.js (2)
05:20
53. redux/apiSlices/index.js~extendedPost.js(1)(1)
05:26
54. extendedPost.js(1)(2)
03:15
55. extendedPost.js(2)~ index.html
04:25
56. HomeScreen.index.jsx ~ Carousel.jsx
03:22
57. Body.jsx(1)
03:18
58. Body.jsx(2)
03:28
59. Practice (1)
04:13
60. Practice (2)
05:59
61. Practice (3)
03:34
62. Practice (4)
04:22
63. Practice (5)
04:22
64. Practice (6)
05:02
65. Practice (7)
05:32
66. Practice (8)
03:26
67. Practice (9)
05:41
68. Practice (10)
05:38
69. Practice (11)
04:23
70. Practice (12)
05:22
71. Practice (13)
05:01
72. Practice (14)
03:38
73. Practice (15)
03:57
74. Practice (16)
05:59
75. Practice (17)
04:40

Section 4. Header•SNS Login & Footer

53 lectures ∙ (4hr 14min)

Section 5. PostDetailScreen

12 lectures ∙ (58min)

Section 6. CartScreen

5 lectures ∙ (28min)

Section 7. PaymentScreen

19 lectures ∙ (1hr 36min)

Section 8. ShippingScreen

21 lectures ∙ (1hr 41min)

Section 9. PostUploadScreen

18 lectures ∙ (1hr 28min)

Section 10. MyPageScreen

3 lectures ∙ (12min)

Section 11. AdminScreen

34 lectures ∙ (2hr 53min)

Published:

Last updated:

Reviews

Not enough reviews.

Please write a valuable review that helps everyone!

$246.40

ssaple's other courses

Check out other courses by the instructor!

Terraform 배포 가이드

싸플

현 시점 코드형 인프라스트럭처(IaC) 끝판왕 Terraform! Azure 서버에 Github Action을 사용해 자동 배포를 완성해봅시다

초급

Terraform, Docker, Kubernetes

Terraform 배포 가이드

싸플

Colini 웹개발 가이드

싸플

웹 개발 처음 시작하시는 분들을 위한 완전 기초 강의! HTML, CSS, Javascript, React 등 웹개발 기초를 쌓아보자!

입문

HTML/CSS, JavaScript, React

Colini 웹개발 가이드

싸플

리액트로 나만의 블로그 만들기(MERN Stack)

싸플

풀스택으로 나만의 블로그를 만들어 보아요~~!

중급이상

React, Redux, Node.js

리액트로 나만의 블로그 만들기(MERN Stack)

싸플

Similar courses

Explore other courses in the same field!

이거 하나로 종결-고품질 리액트와 스프링부트 65시간 풀스택 개발 강의(도커, AWS, GITHUB-ACTIONS)

그린코딩

1인 IT 창업, 1인 사업가 모두 경험한 저자가 만든 솔직하고 담백하며 직관적이고 깊은 리액트+스프링부트 강좌 (도커, AWS, GITHUB-ACTIONS) 그냥 이거로 한 강좌로 통일 시켰습니다.

입문

React, AWS, Docker

이거 하나로 종결-고품질 리액트와 스프링부트 65시간 풀스택 개발 강의(도커, AWS, GITHUB-ACTIONS)

그린코딩

Next.js 15: Full-Stack Development

구멍가게코딩단

전통적인 React 개발 방식과 Next.js를 이용해서 개발하는 방식은 전혀 다릅니다. 이 강의는 최신 Next.js 15의 핵심을 꿰뚫고, '진짜' Next.js다운 개발 방식을 알려드립니다. 취업 포트폴리오부터 실무 프로젝트까지, 성능과 효율을 모두 잡는 방법을 경험하세요. Next.js 스럽게 개발 합시다! Next.js의 기능을 어떻게 적용해야하는지 실제 예제를 만들면서 몸으로 배울 수 있도록 구성되었습니다. 서버 컴포넌트를 중심으로 보고 서버 액션과 캐싱 전략등을 이론보다는 실제로 코드를 통해서 더 빠르게 학습합니다. 강의의 목표는 최대한 빨리 Next.js의 분위기를 따라가는 것이 때문에 강의 자체는 JavaScript를 이용해서 진행합니다. 하지만 각 강의의 예제는 Typescript로 제작된 것을 추가로 수업자료로 제공합니다.

초급

JavaScript, React, JPA

Next.js 15: Full-Stack Development

구멍가게코딩단

React & FastAPI로 만드는 투표 커뮤니티 플랫폼: 결제 시스템으로 수익화까지!

닭강정

이 강의에서는 React와 FastAPI를 활용해 실시간 투표, 댓글, 좋아요 등의 소셜 기능은 물론, 결제 시스템(카카오페이, 토스페이 등)을 연동해 수익화하는 방법까지 단계별로 실습합니다.

중급이상

React, MySQL, Docker

React & FastAPI로 만드는 투표 커뮤니티 플랫폼: 결제 시스템으로 수익화까지!

닭강정

Terraform 배포 가이드

싸플

현 시점 코드형 인프라스트럭처(IaC) 끝판왕 Terraform! Azure 서버에 Github Action을 사용해 자동 배포를 완성해봅시다

초급

Terraform, Docker, Kubernetes

Terraform 배포 가이드

싸플

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

John Ahn

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

초급

React, Node.js

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

John Ahn

주니어를 위한 3시간 만에 끝내는 도커+컨테이너

코드쿼카

전 세계 2,000만 명 이상의 개발자가 사용하는 기술 스택인 도커! 수많은 개발자들의 기본 기술스택으로 자리잡은 도커와 컨테이너 개념에 대해 공식 문서를 따라가며 공부합니다! 시중에 나온 기술문서들 중, 특히나 두꺼운 도커 책들을 보며 시작하기도 전에 겁먹으셨을거라고 생각해요. 이 강의는 도커 공식 문서를 기반으로 핵심 내용을 짚어주며, 실습 위주의 탄탄한 커리큘럼으로 구성되어 있습니다. 실습 위주로 학습하고 빠르게 실무 적용을 도와드릴 것으로 약속드릴 수 있어요! 강의를 마치면 실무적으로 다양하게 도커를 사용할 수 있게 될 거에요!

입문

Docker, docker-compose, docker-volume

주니어를 위한 3시간 만에 끝내는 도커+컨테이너

코드쿼카

프론트엔드 개발의 Kick, Web API (feat. React)

박용주

실무에 적용할 수 있는 Web API를 다룹니다. 한 번쯤 꼭 마주치게 될 요구사항들을 풀어낼 무기를 얻어가시길 바랍니다.

초급

JavaScript, React, Web API

프론트엔드 개발의 Kick, Web API (feat. React)

박용주

대세는 쿠버네티스 (초급~중급편)

일프로

[Update 2025.04] 이론과 실습으로 가성비 있게 쿠버네티스에 대한 실력을 높여 보세요. 이 강좌를 통해 여러분도 대세에 쉽게 편승할 수 있게 됩니다.

초급

Docker, Kubernetes, devops

대세는 쿠버네티스 (초급~중급편)

일프로

웹 프론트엔드 포트폴리오의 모든 것 - 주제 선정부터 실전 배포까지 압축 실습 강의!

문태훈

"경력자만 뽑는 세상, 신입의 무기는 단 하나 - 차별화된 '개인' 포트폴리오!" 현업 요구를 녹인 프로젝트로 실력을 보여주는 신입 개발자의 필수 가이드.

초급

HTML/CSS, React, Git

웹 프론트엔드 포트폴리오의 모든 것 - 주제 선정부터 실전 배포까지 압축 실습 강의!

문태훈

Colini 웹개발 가이드

싸플

웹 개발 처음 시작하시는 분들을 위한 완전 기초 강의! HTML, CSS, Javascript, React 등 웹개발 기초를 쌓아보자!

입문

HTML/CSS, JavaScript, React

Colini 웹개발 가이드

싸플

[자바스크립트 GUI 개발 #1] Electron + React로 만드는 타이머 앱 (+ Zustand)

닭강정

React, Electron, Zustand를 활용해 타이머 앱을 직접 제작하고 크로스 플랫폼(윈도우, 맥 OS, 리눅스)으로 배포까지 하는 실전 강의입니다. 익숙한 React 웹 개발을 시작으로, Zustand를 통한 전역 상태 관리와 최종 GUI 배포까지, 데스크톱 앱 개발의 전체 흐름을 배우실 수 있습니다!

초급

React, Electron, GUI

[자바스크립트 GUI 개발 #1] Electron + React로 만드는 타이머 앱 (+ Zustand)

닭강정

실습으로 배우는 선착순 이벤트 시스템

최상용

선착순 이벤트 시스템을 구현할 때 어떤 문제가 발생할 수 있고 어떻게 해결할 수 있는지 배워봅니다.

초급

Spring Boot, Java, Docker

실습으로 배우는 선착순 이벤트 시스템

최상용

입문자를 위한 Spring Boot with Kotlin - 나만의 포트폴리오 사이트 만들기

정용백

이론부터 실습까지. 직접 개발한 웹사이트를 클라우드에 올리며 웹 개발 전반을 학습할 수 있습니다.

초급

Spring Boot, Kotlin, JPA

입문자를 위한 Spring Boot with Kotlin - 나만의 포트폴리오 사이트 만들기

정용백

제로베이스부터 배우는 웹개발의 개념과 바이브 코딩

신제용

빠른 실행과 검증의 시대, 바이브 코딩으로 누구보다 빠르게 실행하세요! 광고, 결제 등 수익화까지 빼놓지 않고 내 손으로 이루어 보세요.

입문

React, 웹앱, Next.js

제로베이스부터 배우는 웹개발의 개념과 바이브 코딩

신제용

쥬쥬와 함께 하루만에 끝내는 스프링 테스트

쥬쥬

테스트 코드 작성이 망설여지시나요? 이 강의를 통해 스프링 환경 테스트의 A to Z를 경험해보세요!

초급

소프트웨어 테스트, Mockito, JUnit

쥬쥬와 함께 하루만에 끝내는 스프링 테스트

쥬쥬

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

코드캠프

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

초급

React, Next.js, expo

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

코드캠프

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

이웅재

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

중급이상

React, TypeScript

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

이웅재

개발자들 사이에서 통하는 바이브코딩 – 실무형 (Cursor AI, Figma)

코드캠프

10분만에 바이브코딩으로 만들 수 있는 단순한 서비스는 이제 버리세요! '진짜' 실무적용 바이브코딩을 배울 수 있습니다. 기획과 디자인대로 실서비스 수준의 고도화된 서비스를 커서AI NCOP로 만들어보시죠. No Code, Only Prompt

중급이상

React, Next.js, cursor

개발자들 사이에서 통하는 바이브코딩 – 실무형 (Cursor AI, Figma)

코드캠프

NodeFull Stack Development Guide

What you will learn!

Recommended for these people

HelloThis is .css-1q3zd4q{text-decoration-line:underline;text-underline-position:under;text-underline-offset:1px;}

Curriculum

Reviews

ssaple's other courses

Similar courses

Recommended for
these people

Hello
This is