채널톡 아이콘
개발 · 프로그래밍

/

웹 개발

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

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

(5.0) 수강평 2개

수강생 114명

ReactNode.jsMongoDBHTML/CSSJavaScript
Thumbnail

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

이런 걸 배울 수 있어요

  • React & Tailwind CSS로 트렌디한 UI를 설계, 구현

  • Node.js와 Express로 백엔드 서버 구축

  • MongoDB와 Express Router로 데이터베이스 설계 및 관리

  • 프론트엔드와 백엔드 간의 데이터 통신 이해

  • 실제 회사 웹사이트 수준의 프로젝트 완성

🎉수강생 100명 돌파 기념 특별 할인!🎉

여러분의 성원에 힘입어, 수강생 100명 돌파를 기념하여 특별 할인 이벤트를 진행합니다!
4월 8일(오늘)부터 4월 30일까지, 아래와 같은 할인쿠폰을 제공합니다

44,000원→ 33,000원 (25% 할인!)

25% 할인쿠폰 받기
많은 관심과 참여 부탁드립니다. 😊

2025-03-23 업데이트

나만의 회사 웹사이트가 드디어 공식 도메인에 배포되었습니다! 🎉
https://my-company.site
강의 구매 전 직접 접속해보고 경험해보세요.

🔐 관리자 페이지 접속 안내
https://my-company.site/admin
아이디: admin / 비밀번호: test123

  • AWS S3와 TinyMCE 에디터는 비용 문제로 현재 비활성화된 상태입니다.

  • 기능 구성을 확인하는 용도로만 가볍게 봐주시면 감사하겠습니다 :)

회사의 웹사이트는 어떻게 고객과의 첫인상을 좌우할까요?

답은 React, Node.js, MongoDB, HTML/CSS, JavaScript를 활용한 강력한 기술 스택에 있습니다. 많은 사용자들이 기업사이트의 트렌디한 UI와 효율적인 데이터 관리를 통해 Interaction을 경험하고 있습니다.

본 강의에서는 React로 프론트엔드를, Node.js와 MongoDB로 백엔드를 설계하여 실제 회사 웹사이트 수준의 프로젝트를 완성합니다. 효율적인 상태 관리, RESTful API 통합, 데이터베이스 설계 등 실무에서 요구되는 핵심 기술을 깊이 있게 다룹니다.

단순히 따라 하는 튜토리얼이 아닌, 체계적인 학습을 통해 Production Ready 수준의 웹사이트를 만들며 실전 개발자의 감각을 익혀보세요!

이 강의의 특징

📌회사의 첫인상을 결정짓는 웹사이트 제작의 노하우를 공개합니다. 3년간의 프로젝트 경험을 통해 얻은 효율적이고 실용적인 개발 방법론을 전수합니다.

📌프론트엔드부터 백엔드까지 스키마 설계, 상태 관리, 데이터베이스 최적화 등 실무에서 반드시 필요한 기술과 insight를 제공합니다.

📌이론 20%, 실습 80%. 모든 코드를 직접 작성하고 테스트하며, 실제로 작동하는 완성도 높은 웹사이트를 만들어 봅니다.

📌중급에서 상급으로 도약하려는 분들을 위한 강의. 기본적인 HTML, CSS, JavaScript 및 React & Node.js의 간단한 지식만 있다면 누구나 따라 할 수 있습니다.

수강 후에는

  • React, Tailwind CSS, Node.js, MongoDB를 활용해 실제 회사 웹사이트 수준의 프로젝트를 제작할 수 있게 돼요.

  • RESTful API 설계와 상태 관리를 체계적으로 이해하고, 클라이언트와 서버 간의 데이터를 효율적으로 처리할 수 있게 돼요.

  • MongoDB를 활용한 데이터베이스 설계와 최적화로 데이터를 체계적으로 관리할 수 있어요.

  • Production Ready 웹사이트 개발 과정을 경험하며, 실무에서도 활용 가능한 포트폴리오를 만들게 돼요.

  • 개발 과정에서 테스트와 디버깅을 통해 코드의 품질을 높이고 안정적인 웹사이트를 완성할 수 있어요.

이런 분들께 추천해요

👨‍💻풀스택 개발로 레벨업하고 싶어요.
React와 Node.js의 기본을 이해했지만, 이를 활용해 더 실용적이고 프로 수준의 프로젝트를 만들고 싶은 개발자 / 학생

🌟현업 수준의 웹사이트 제작이 궁금해요.
실제 회사에서 사용하는 기술 스택을 배우고, 사용자 경험을 높이는 웹사이트 설계 방법을 익히고 싶은 분

💡웹 개발 과정을 처음부터 끝까지 경험하고 싶어요.
프론트엔드, 백엔드, 데이터베이스 통합 등 웹 개발의 전체 과정을 체계적으로 배우고 싶은 분

React, Node.js, MongoDB로 만드는 나만의 회사 웹사이트: 완벽 가이드 - 소개동영상

이런 내용을 배워요.

React, Tailwind CSS로 UI 설계 및 구현
컴포넌트를 활용해 재사용 가능한 모던 UI를 설계하고, 효율적인 상태 관리로 반응형 웹사이트를 구현합니다.

Node.js와 Express로 백엔드 구축
RESTful API를 설계하고, 클라이언트와 서버 간의 데이터를 안정적으로 통신하는 백엔드 기술을 배웁니다.

MongoDB를 활용한 데이터 관리
MongoDB의 스키마, 모델로 데이터 구조를 설계하고, Express Router로 유연한 RESTful API를 구현하여 실시간 데이터 중심의 웹앱을 제작합니다.

실전 프로젝트: 회사 웹사이트 제작
React, Node.js, MongoDB를 통합해 Production Ready 웹사이트를 완성!

이 강의를 만든 사람

  • 2020 ~ 현재: React, Node.js, MongoDB를 활용한 풀스택 웹 개발 프로젝트 진행 (3년 경험)

  • 2024: 서강대학교 컴퓨터공학과 졸업

  • 2021 ~ 현재: 기업 웹사이트 및 다양한 실무 프로젝트 참여

수강 전 참고 사항

실습 환경

  • 강의는 Windows와 macOS 환경에서 실습할 수 있도록 구성되었습니다. Linux 사용자도 강의를 따라올 수 있습니다.

  • 강의에서는 Visual Studio Code (VS Code)를 기본 코드 편집기로 사용하며, 무료로 설치 및 사용할 수 있습니다.

  • 최신 버전의 Node.js와 MongoDB가 필요합니다. 설치 방법은 강의에서 상세히 안내합니다.


제공 자료: 소스 코드, PDF 강의 자료, 예제 프로젝트 파일

  • 학습 자료는 강의와 함께 GitHub Repository로 제공되며, 쉽게 다운로드받아 실습할 수 있습니다.

  • 노션에서 올라오는 베이직 코드와 함께 코드실습을 수월하게 하실 수 있습니다.

선수 지식 및 유의사항

  • HTML, CSS, JavaScript, React, Node.js의 기초를 알고 있다면 강의를 더 수월하게 수강할 수 있습니다.

  • Tailwind CSS, MongoDB를 처음 사용하는 분들도 충분히 따라올 수 있도록 기초부터 차근차근 설명합니다.

  • 기본적인 Git 사용 경험이 있으면 실습을 진행하기 더 편리합니다.

이런 분들께
추천드려요!

학습 대상은
누구일까요?

  • React, Node.js, MongoDB로 풀스택 웹 개발에 도전하고 싶은 분들

  • 실제 회사 웹사이트 수준의 프로젝트를 완성해보고 싶은 분들

  • 웹 개발을 처음 시작하지만 체계적으로 배우고 싶은 초보자

  • 포트폴리오에 프로젝트를 추가하고 싶은 취준생 및 직장인

  • 기초를 다지며 실무에 필요한 개발 기술을 익히고 싶은 분들

선수 지식,
필요할까요?

  • React

  • Node.js

  • HTML

  • CSS

  • JavaScript

안녕하세요
닭강정입니다.

146

명

수강생

4

개

수강평

21

개

답변

5.0

점

강의 평점

3

개

강의

안녕하세요! 서강대학교 컴공과를 졸업하고 현재 대학원 진학을 준비 중인 학생입니다.

고등학교 때 우연히 풀스택 웹 개발과 파이썬을 활용한 자동 매매를 시작하면서 프로그래밍에 빠지게 되었습니다.

그 후 다양한 프로젝트와 프로그래밍 과외활동을 경험하며 실력과 노하우를 공유했습니다. 이러한 경험을 통해 프로그래밍을 처음 접하는 분들에게도 "이렇게 쉬울 수 있구나!"라는 느낌을 줄 수 있는 강의를 만들고자 노력하고 있습니다.

 

실용적인 예제와 친근한 설명으로 여러분의 학습을 돕고 싶습니다. 감사합니다.

 

GitHub 저장소 바로가기 (클릭!)

더보기

커리큘럼

전체

75개 ∙ (15시간 13분)

해당 강의에서 제공:

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

수강평

전체

2개

5.0

2개의 수강평

닭강정님의 다른 강의

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

Firebase 시리즈 #1: 소셜 로그인·휴대폰·위치 인증 완벽 가이드강의 썸네일

Firebase 시리즈 #1: 소셜 로그인·휴대폰·위치 인증 완벽 가이드

닭강정

🔥 HTML + Tailwind CSS + 순수 JavaScript만으로 완성하는 Firebase 사용자 인증! 소셜 로그인·휴대폰·위치 인증까지, 복잡한 백엔드 없이 쉽고 빠르게 계정 시스템 구축합니다.

초급

초급

HTML/CSS, TailwindCSS, JavaScript

Firebase 시리즈 #2: AI 한자 추천 & 필기 학습 플랫폼강의 썸네일

Firebase 시리즈 #2: AI 한자 추천 & 필기 학습 플랫폼

닭강정

🔥 한자 학습을 위한 맞춤형 플랫폼 구축! Google Gemini AI와 Firestore를 활용해 나만의 한자 단어장, 획순 애니메이션, 필기 인식까지 직접 구현해보세요!

초급

초급

gemini, HTML/CSS, TailwindCSS

₩30,800

30%

₩44,000