학습 경로

풀스택 개발자 로드맵

풀스택 웹 개발자에게 필요한 순서대로 놓은 무료 강의입니다. 페이지를 위한 HTML, CSS, JavaScript, 화면을 위한 TypeScript와 React, 서버를 위한 Next.js, 데이터를 위한 SQL, 그리고 배포를 위한 Linux, Git, Docker. JavaScript는 브라우저와 서버 양쪽에서 실행되기 때문에, 언어 하나를 배워서 처음부터 끝까지 씁니다. 모든 레슨은 브라우저에서 실행되고, 강의의 섹션마다 끝에 무료 수료증이 있습니다.

학습 시작(무료)

830,387+ 명의 codders가 이 코스들에 등록함

880 개 강의883 챌린지4,346 퀴즈 문제

초보자 환영
AI 코딩 도우미
실습 중심의 대화형 강의
모든 레슨에 음성 나레이션 제공
지식을 확인하는 퀴즈
경로 전체에서 무료 수료증 16개

풀스택 개발자 경로, 단계별로

7 개 강의16 섹션880 개 강의883 챌린지4,346 퀴즈 문제

각 단계는 이미 있는 Coddy 강의입니다. 순서대로 진행해도 되고 빠진 것부터 바로 시작해도 됩니다. 진도는 어느 쪽이든 강의별로 저장됩니다.

1
1단계
HTML과 CSS: 페이지전용 페이지
이 단계 시작시작요소, 링크, 폼, 시맨틱 마크업, 이어서 두 개의 CSS 섹션에 걸친 선택자, 박스 모델, flexbox, grid, 반응형 레이아웃, 트랜지션. 여기서 작성하는 폼은 이 경로의 뒷부분에서 여러분의 서버가 읽게 될 바로 그 폼입니다.시작 전용 페이지
3개 섹션, 순서대로
179 개 강의215 챌린지833 문제
2
2단계
JavaScript와 TypeScript전용 페이지
이 단계 시작시작기초, 로직과 제어 흐름, 객체와 클래스까지 세 개 섹션, 이어서 TypeScript: 타입, 인터페이스, 제네릭, 그리고 컴파일러의 오류 읽는 법. 브라우저에서도 서버에서도 쓰게 될 언어이기 때문에 다른 어떤 단계보다 시간을 많이 씁니다.시작 전용 페이지
4개 섹션, 순서대로
271 개 강의288 챌린지1,457 문제
3
3단계
브라우저 속 JavaScript전용 페이지
이 단계 시작시작DOM, 이벤트, 폼과 유효성 검사, 그리고 탭, 모달, 테마, 반응형 내비게이션 같은 실무 프론트엔드 패턴. HTML, CSS, JavaScript가 사용하는 사람에게 반응하는 하나의 페이지가 됩니다.시작 전용 페이지
2개 섹션, 순서대로
1. JavaScript 실전27 개 강의27 챌린지163 문제
2. 실전 프론트엔드35 개 강의34 챌린지197 문제
62 개 강의61 챌린지360 문제
4
4단계
React전용 페이지
이 단계 시작시작컴포넌트, JSX, props, 상태, 이벤트, 목록, 제어 컴포넌트 폼. 마지막에는 작은 소셜 카드를 한 단계씩 만듭니다. React는 다음 단계에서 서버 위에서 돌리게 될 화면 계층입니다.시작 전용 페이지42 개 강의37 챌린지65 문제
5
5단계
Next.js: 서버 쪽 절반전용 페이지
이 단계 시작시작라우팅과 레이아웃, 서버 컴포넌트와 클라이언트 컴포넌트, 서버에서 데이터 가져오기, 나만의 API 엔드포인트를 위한 라우트 핸들러, 폼을 위한 서버 액션, 로딩과 에러 상태. 이어서 장바구니, 필터, 리뷰, 실시간 검색이 있는 9단계 레스토랑 앱을 만듭니다. 여기서 백엔드를 작성합니다.시작 전용 페이지47 개 강의32 챌린지99 문제
6
6단계
SQL: 데이터베이스전용 페이지
이 단계 시작시작실제 테이블에 대한 쿼리: 필터링, 정렬, 조인, 그룹화와 집계, 이어서 서브쿼리, 윈도우 함수, CASE, 공통 테이블 표현식. 모든 풀스택 애플리케이션은 데이터를 데이터베이스에 보관하고, SQL은 그 데이터베이스에 질문하는 방법입니다.시작 전용 페이지
2개 섹션, 순서대로
1. 기초72 개 강의72 챌린지360 문제
2. 심화 과정27 개 강의28 챌린지167 문제
99 개 강의100 챌린지527 문제
7
7단계
Linux와 Git전용 페이지
이 단계 시작시작진짜 Linux 터미널에서 파일, 권한, 파이프, 셸 스크립트를 다루고, 이어서 커밋, 브랜치, 병합, 충돌, 원격 저장소를 배웁니다. 서버는 Linux에서 돌아가고, 모든 팀은 코드를 Git 저장소에 보관합니다.시작 전용 페이지
2개 섹션, 순서대로
1. 기초82 개 강의68 챌린지440 문제
2. 버전 관리58 개 강의46 챌린지370 문제
140 개 강의114 챌린지810 문제
8
8단계
Docker전용 페이지
이 단계 시작시작이미지, 컨테이너, Dockerfile, 볼륨, 네트워크. 컨테이너는 애플리케이션을 실행에 필요한 모든 것과 함께 묶어 두는 것이며, 오늘날 대부분의 웹 애플리케이션이 서버로 배포되는 방식입니다.시작 전용 페이지40 개 강의36 챌린지195 문제

제공되는 것

코딩을 배우기 위해 사용할 모든 것

Learn by Doing

Write real code, query databases, build websites, and master AI prompts. Our interactive lessons cover every skill modern developers need.

playground.js

Code Editor

1const greeting = "Hello, Coddy!"

2function sayHi(name) {

3 return greeting + " " + name

Test #1

Test #2

Test #3

Input

"Alex"

Output

"Hello, Coddy! Alex"

Build Your Streak

Stay consistent and watch your progress grow! Track your daily coding habit, protect your streak with freeze days, and earn rewards for showing up every day.

12 days streak

Return tomorrow to keep your streak!

January 2026

Double or Nothing

Day 5 of 7

Streak Freeze

2 left

Code Anywhere

Take your coding journey on the go! No setup, no downloads - just open and start coding. Available on iOS, Android and Web with 4.9 star ratings.

250

Variables

CONTINUE

4.9

Rating

You're Not Alone

Compete on global leaderboards, invite friends to earn rewards, and celebrate each other's wins. Coding is better with friends!

Challenger LeagueTop 7 advance

Alex7+ Days

2840

Jordan7+ Days

2650

Sam7+ Days

2420

Casey

2180

Morgan7+ Days

1950

Promotion zone

Every way to learn

Read, listen, test yourself, ask the AI, or look up anything you've already covered. Every lesson meets you where you are.

Intro to Variables

Audio

A variable is a named container that stores a value you can reference later in your program.

In Python, you create one by writing the name, an equals sign, then the value you want to store.

The value can change over time - reassigning the name simply points it to a new value.

1xSarah

Earn a Certificate

Earn certificates for every course you complete. Add them to your LinkedIn profile and resume to showcase your coding expertise to employers.

Certificate of Completion

This certifies thatJohn Doehas successfully completed

Python Fundamentals

DateJan 2026

Add to LinkedIn

풀스택 개발을 Coddy에서 배워야 하는 이유

양쪽에서 같은 언어. 이 경로는 먼저 브라우저를 위해 JavaScript와 TypeScript를 가르치고, 같은 언어를 Next.js의 라우트 핸들러와 서버 액션으로 서버에서도 씁니다. 그래서 백엔드는 두 번째 언어를 처음부터 배우는 일이 아니라 새로운 개념을 배우는 일이 됩니다.
설치할 것이 없습니다. HTML과 CSS는 코드 바로 옆에서 실시간으로 그려지고, SQL은 실제 테이블에서 실행되며, Linux, Git, Docker 단계에서는 브라우저 안에서 진짜 터미널을 씁니다. 개발 도구를 한 번도 설치한 적 없는 노트북으로도 스택 전체를 공부할 수 있습니다.
여러분의 코드를 읽는 AI 힌트. 컴포넌트가 렌더링되지 않거나, 쿼리가 엉뚱한 행을 돌려주거나, 명령어가 실패할 때, Bugsy는 여러분이 작성한 내용을 보고 정답을 건네지 않으면서 해결 쪽으로 안내합니다.
핵심은 순서입니다. 대부분의 풀스택 강의는 2주 차에 벌써 프레임워크로 넘어가지만, 이 경로는 React가 나오기 전에 JavaScript에 세 개 섹션, 브라우저에 한 개 섹션을 더 씁니다. 프레임워크는 그 아래에 있는 언어를 읽을 수 있어야 비로소 읽히기 때문입니다.

풀스택 개발자가 되는 것에 대한 자주 묻는 질문

풀스택 개발자란 무엇인가요?

웹 애플리케이션의 두 부분을 모두 만들 수 있는 개발자입니다. 브라우저에서 실행되는 프론트엔드(HTML, CSS, JavaScript, 그리고 React 같은 프레임워크)와 서버에서 실행되는 백엔드(요청 처리, 비즈니스 로직, 데이터베이스)입니다. 실제로는 대부분의 풀스택 개발자가 한쪽에 더 강하지만, 데이터베이스 테이블부터 그것을 쓰는 버튼까지 하나의 기능을 다른 사람에게 넘기지 않고 직접 완성할 수 있습니다.

웹 개발자가 되려면 무엇을 배워야 하나요?

빈 파일에서 페이지 하나를 만들 수 있을 만큼 HTML, CSS, JavaScript를 익히고, 프레임워크 하나(React)를 더하고, 서버가 요청에 어떻게 응답하고 데이터가 어떻게 저장되는지(이 경로에서는 Next.js와 SQL) 배우고, Git을 익히고, 온라인에 올려서 설명할 수 있는 프로젝트를 만드세요. 기업은 여러분이 보여 줄 수 있는 것을 보고 채용하기 때문에, 어떤 수료증보다 프로젝트가 더 중요합니다. 이 경로가 바로 그 순서이고, 무료입니다.

프론트엔드와 백엔드 중 무엇을 먼저 배워야 하나요?

프론트엔드가 먼저입니다. 코드 한 줄 한 줄의 결과가 화면에 보이기 때문에 실수가 바로 드러나고 의욕도 유지됩니다. 그리고 백엔드는 그것을 호출하는 페이지를 직접 만들어 본 뒤에 훨씬 이해하기 쉽습니다. 그래서 이 경로는 처음 네 단계를 브라우저에서 보내고, 그다음에야 서버와 데이터베이스로 넘어갑니다.

이 경로는 왜 서버에서 Python 대신 JavaScript를 쓰나요?

JavaScript는 브라우저에서 실행되는 유일한 언어이므로, 서버에서도 쓰면 스택 전체가 언어 하나로 끝나기 때문입니다. React 위에 만들어진 Next.js를 쓰면 같은 코드베이스로 서버에서 페이지를 렌더링하고, API 요청에 응답하고, 폼 제출을 처리할 수 있습니다. 백엔드를 Python으로 작성하고 싶다면 Coddy의 백엔드 개발자 경로가 Python 방식을 가르칩니다.

풀스택 개발자가 되려면 부트캠프에 다녀야 하나요?

아니요. 부트캠프는 일정, 함께 배우는 동기, 커리어 코칭을 제공하고 그 대가로 비용을 받습니다. 기술 자체는 이 경로가 가르치는 것과 같고, 무료 자료로도 충분히 배울 수 있습니다. 부트캠프로도 건너뛸 수 없는 것은 연습입니다. 수백 개의 작은 연습 문제와 몇 개의 실제 프로젝트요. 선생님이 확인하지 않아도 하루 한 시간을 꾸준히 지킬 수 있다면, 무료 경로로 같은 곳에 도착합니다.

풀스택 개발자가 되기까지 얼마나 걸리나요?

하루 한 시간씩 해서 주니어 수준에 이르기까지 약 9개월에서 12개월입니다. 이 경로에서는 HTML과 CSS가 합쳐서 6주에서 8주, JavaScript와 브라우저가 2개월에서 3개월, TypeScript와 React가 약 6주, Next.js가 한 달, SQL이 3주에서 4주, 그리고 Linux, Git, Docker가 한 달 더 걸립니다. 후반 단계와 함께 자신의 프로젝트를 만들면 그 시간이 포트폴리오가 됩니다.

이 경로에서 Node.js, Express, 인증, 배포도 배우나요?

아직 별도의 강의로는 없고, 페이지를 부풀리기보다는 그렇다고 밝혀 두겠습니다. 이 경로의 서버 코드는 Node.js 위에서 실행되는 Next.js의 라우트 핸들러와 서버 액션으로 작성하지만, Express 강의도, ORM으로 앱을 프로덕션 데이터베이스에 연결하는 강의도, 인증이나 호스팅 플랫폼 배포에 관한 강의도 없습니다. 이들은 커리큘럼 로드맵에 있으며, 공개되면 새 단계로 이 경로에 합류합니다.

이 풀스택 강의는 무료인가요, 수료증도 받나요?

네. 경로의 모든 강의는 무료입니다. 레슨, 브라우저 에디터와 터미널, AI 힌트, 수료증까지요. 강의의 섹션마다 끝에 무료 수료증이 있고, 각각 고유한 URL에서 검증할 수 있으며 LinkedIn이나 이력서에 추가할 수 있습니다.

다른 학습 경로

같은 코스를 다른 직무에 맞게 배열한 경로입니다. 진행 상황은 이어집니다. 한 경로에서 마친 코스는 그 코스를 포함한 모든 경로에서 인정됩니다.

모든 학습 경로

Coddy programming languages illustration

풀스택 개발자 경로를 무료로 시작하세요

학습 시작