QUICK
MENU

javascript

React, Node.js, Express, MongoDB 기반
풀스택 실무 프로젝트 정규과정!

본 과정은 React/Vue 기반 프론트엔드와 Node.js 기반 백엔드, Express 서버, MongoDB 연동, REST API, JWT 인증, 클라우드 배포까지 전 과정을 단일 언어(JavaScript)로 학습할 수 있도록 설계되었습니다.
웹 개발의 핵심 구조를 처음부터 끝까지 스스로 구축하며, 실무에서 요구되는 풀스택 개발자 역량을 완성하고 포트폴리오를 직접 개발 및 배포합니다.

  • 교육기간
    6개월
  • 강의시간(지점별 상이)
    3시간
  • 난이도
    입문~고급
  • 인원
    20내외
  • 전화상담(주말 · 공휴일 상담 및 접수가능)
    02-6225-9302

이런 분들께 추천해요!

  • 단일 언어(JavaScript)로 프론트/백엔드를 동시에 배우고 싶은 개발 입문자
  • 웹 서비스를 처음부터 직접 만들고 싶은 스타트업 창업 준비자
  • JavaScript 중심의 실무 프로젝트를 경험하고 싶은 취준생
  • 프론트엔드에서 백엔드까지 커리어 확장을 원하는 웹 퍼블리셔

자바스크립트 풀스택과정의 핵심 포인트

  • POINT.01

    HTML/CSS/JS → React/Vue → Node.js/Express → MongoDB로 이어지는 자연스러운 흐름으로 학습합니다.

  • POINT.02

    로그인, 회원가입, 게시판, 댓글 기능 등 실제 서비스에 필요한 기능을 직접 구현합니다.

  • POINT.03

    기획 → 디자인 → 개발 → 배포까지 경험하는 Git 기반 협업 프로젝트를 진행합니다.

  • POINT.04

    React + Express + MongoDB 또는 Vue + Express + MySQL 등 산업 수요에 맞춘 스택 선택이 가능합니다.

무엇이든 물어보세요

전문 멘토님들을 통해 정확하고 유익한 정보를 확인 할 수 있습니다.

문의하기

자바스크립트 풀스택 커리큘럼 안내

많은 프론트엔드 입문자들의 커다란 장벽의 하나인 javascript의 핵심만을 모아 활용 빈도가 높은 기술을 중점으로 교육 하고 있습니다.

  • Chapter.01

    HTML, CSS

    개발환경 구축
    - VS Code 설치

    HTML
    - 웹 환경 구축
    - 기본 구조와 여러가지 태그
    - 블록 / 인라인 / 인라인 블록 요소
    - form 태그
    - 클론 코딩을 위한 준비 (레이아웃 잡기)

    CSS
    - Selector
    - Cascading
    - Display, Position
    - overflow, z-index
    - 미디어 쿼리
    - 클론코딩 스타일 입히기
  • Chapter.02

    Javascript

    - Javascript의 역할
    - Node.js 설치
    - 식별자, 스코프, 연산자
    - 제어문
    - 함수(익명 함수 / 화살표 함수 / 콜백함수)
    - 객체란?
    - 객체(Array 객체)
    - forEach(), map(), filter()
    - 객체(Date / Math 객체)
    - DOM
    - HTML과 CSS를 제어하는 방법
    - 이벤트 함수의 원리와 실행 방법
    - 비동기 통신
    - API 활용
  • Chapter.03

    React.js (기초)

    - 환경구축
    - 기본 구조와 성능
    - React.js의 기본 용어 학습
    - JSX
    - 컴포넌트 / 변수 / 연산자
    - 컴포넌트 간의 데이터 전달
    - 컴포넌트의 반복
    - map(), key
    - 이벤트 함수
    - input 태그 입력 값 처리
    - 불변성과의 관계
    - useState() Hook 함수
    - checkbox
    - Spread 문법
  • Chapter.04

    React.js (심화)

    - useRef()를 통해 객체 가져오기
    - 컴포넌트의 라이프 사이클 메소드
    - Hooks
    - 순수 함수
    - useEffect / useMemo / useCallback
    - Custom Hooks
    - Context API
    - Redux
    - Action / Dispatch / Reducer / Store / Subscribe
    - Router
    - 다른 컴포넌트를 불러오는 SPA
    - 중첩된 Route
    - useNavigate
    - Redirect
    - 클론코딩 개인 프로젝트
  • Chapter.05

    Node.js | Express.js | NoSQL

    React.js
    - React 미들웨어

    Node.js
    - 서버 생성
    - Router 만들기
    - K6 성능 테스트
    2주차 Express.js
    - Express.js 프레임워크란
    - 게시판 CRUD 제작

    NoSQL
    - mongoDB
    - mongoose

    React.js와 연동하여 게시판 제작하기
    - 게시글 목록 보기
    - 게시글 작성 / 수정 / 삭제 / 조회
    - 댓글 목록 보기
    - 댓글 작성 / 수정 / 삭제

    Pagination
    - 게시판 페이징 처리
    - API 제작
  • Chapter.06

    Next.js

    Next.js
    - 프로젝트 기본 구조
    - TypeScript
    - SSR / CSR / SSG
    - Routing System
    - 정적 자원 및 메타데이터
    - 디렉터리 구조
    - 컴포넌트 / 유틸리티 / 라이브러리 / 스타일 / 정적 자원

    REST API
    - JSON
    - CRUD API를 RESTful로 개발
    - 데이터 요청 / 응답
    - 지역 / 전역 상태 관리

    Custom Server
    - Express.js 서버 연동

    단위 테스트와 통합 테스트
    - Jest
    - Cypress

취업의 핵심
실무 기반 프로젝트로 완성하는 포트폴리오

실제 수료생들의 프로젝트 결과물을 보고, 기업이 원하는 포트폴리오 기준을 확인해 보세요