Menu
CoddyTech
학습 경로

자바스크립트 개발자 로드맵

JavaScript 개발자로 일하려면 무엇을 배워야 하는지, 순서대로 담았습니다. 언어와 TypeScript, 커맨드 라인, Git과 SQL, 이어서 면접에서 시험하는 자료구조와 알고리즘, 마지막으로 팀이 유지보수할 수 있는 코드. 같은 기초가 프론트엔드, 백엔드, 풀스택 일 모두에 쓰입니다. 무료이고, 직접 해보며, 브라우저 안에서 끝납니다.

528,995+ 명의 codders가 이 코스들에 등록함

651 개 강의662 챌린지2,785 퀴즈 문제

JavaScript 개발자 로드맵, 단계별로

17 개 강의7 섹션651 개 강의662 챌린지2,785 퀴즈 문제

각 단계는 이미 존재하는 Coddy 코스들로 이루어져 있고, 모든 ‘시작’ 버튼은 코스를 JavaScript로 엽니다. 단계를 순서대로 따라가도 되고, 부족한 단계부터 시작해도 됩니다. 진행 상황은 코스별로 저장됩니다.

  1. 1
    이 단계 시작시작섹션은 네 개입니다. 기초 섹션은 변수, 엄격한 동등 비교와 느슨한 동등 비교, 타입 강제 변환, 함수와 화살표 함수, 배열을 다루고, 논리 & 흐름 섹션은 문자열, JSON과 객체, 스프레드 연산자, Set, 그리고 배열 메서드 map, filter, reduce, sort를 다룹니다. TypeScript 소개 섹션은 핵심 타입, 튜플, 유니언, 인터페이스, 열거형, 제네릭, 타입 가드를, 객체 지향 프로그래밍 섹션은 this, 모듈, 클래스, private 필드, 상속, 합성을 다룹니다. 깊이 배우세요. 나중에 만나는 모든 프레임워크도 속은 JavaScript이며, === 옆의 ==, 소리 없는 타입 변환 같은 느슨한 규칙은 알기 전까지만 함정입니다.시작전용 페이지
  2. 2
    이 단계 시작시작경로와 파일, 와일드카드, grep, 파이프와 리다이렉션, 권한, 환경 변수, 셸 스크립트. JavaScript 개발 도구는 터미널에서 움직입니다. npm install, npx, 개발 서버, 빌드, 테스트 러너는 모두 명령이고, package.json의 스크립트는 셸 명령이며, 비밀 값은 process.env를 거쳐 환경 변수로 Node.js 앱에 전달됩니다.시작전용 페이지
  3. 3
    이 단계 시작시작스테이징, 커밋, .gitignore, 브랜치, 머지와 충돌, 실수 되돌리기, 원격 저장소. JavaScript 프로젝트에서는 첫 커밋부터 node_modules/를 무시하고 package-lock.json은 커밋하며, 변경이 잦은 락 파일은 병렬로 작업하는 브랜치들이 흔히 충돌하는 곳입니다. Vercel과 Netlify 같은 호스팅 서비스는 푸시할 때마다 배포하므로, 많은 웹 팀에서는 main에 머지하는 것이 곧 릴리스입니다.시작전용 페이지
  4. 4
    이 단계 시작시작필터링, 정렬, 조인, 그룹화, 집계, 서브쿼리, WITH 절, 윈도우 함수를 실제 테이블로 연습합니다. 풀스택 JavaScript라면 API 뒤에 데이터베이스가 있고, 흔히 PostgreSQL이나 MySQL을 Prisma 같은 ORM이나 쿼리 빌더로 다룹니다. 엔드포인트가 왜 느린지 알아내는 방법은 그 도구가 보내는 SQL을 읽는 것입니다.시작전용 페이지
  5. 5
    이 단계 시작시작스택, 큐, 연결 리스트, 이진 트리, 해시 테이블을 각각 JavaScript로 바닥부터 만든 뒤 문제에 적용합니다. 모두 JavaScript 애플리케이션이 이미 그 위에서 돌아가는 형태입니다. 실행 취소 기록은 스택이고, 이벤트 루프는 큐를 따라 일을 처리하며, 중첩된 메뉴나 JSON 문서는 트리입니다.시작
  6. 6
    이 단계 시작시작먼저 재귀 챌린지, 그다음 버블, 선택, 삽입, 병합, 퀵 정렬을 JavaScript로 다루며, 정렬마다 Coddy의 알고리즘 시각화 도구가 짝을 이룹니다. 중첩된 객체나 컴포넌트 트리를 순회하는 재귀는 JavaScript에서 일상이지만 한계가 있습니다. 너무 깊이 들어가면 Chrome과 Node.js의 엔진인 V8이 RangeError: Maximum call stack size exceeded를 던집니다. 이 단계에서는 그런 상황이 오는 것을 미리 알아보는 법을 배웁니다.시작
  7. 7
    이 단계 시작시작처음부터 끝까지 만드는 객체 지향 프로젝트와 코딩 문제 모음. 둘 다 JavaScript로 진행됩니다. 포매팅은 Prettier가 정리하고 일부 실수는 ESLint가 잡아 주지만, 이름 짓기, 함수 크기, 책임을 어디에 둘지는 여러분의 몫이며, 리뷰어가 코멘트를 다는 곳도 바로 거기입니다.시작
제공되는 것
코딩을 배우기 위해 사용할 모든 것

해보면서 배우기

실제 코드를 작성하고, 데이터베이스를 쿼리하고, 웹사이트를 구축하고, AI 프롬프트를 마스터하세요. 인터랙티브 레슨으로 현대 개발자에게 필요한 모든 기술을 다룹니다.

playground.js
코드 편집기
1const greeting = "Hello, Coddy!"
2function sayHi(name) {
3    return greeting + " " + name
4}
5
bottombar Collapse icon
테스트 #1test Case Success icon
테스트 #2test Case Success icon
테스트 #3test Case Failure icon
입력
"Alex"
출력
"Hello, Coddy! Alex"

연속 기록을 쌓아보세요

꾸준히 하고 성장하는 모습을 지켜보세요! 매일 코딩 습관을 추적하고, 동결 기능으로 연속 기록을 보호하고, 매일 참여해서 보상을 받으세요.

12 일 연속

내일도 돌아와서 연속 기록을 유지하세요!

fire Filled icon
left icon

January 2026

right icon

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

21

22

23

24

25

26

27

28

29

30

product Double Or Nothing icon

더블 오어 낫싱

7일 중 5일차

fire Freeze icon

연속 기록 동결

2 left

어디서나 코딩하세요

코딩 여정을 함께 하세요! 설정도, 다운로드도 필요 없이 바로 열어서 코딩을 시작하세요. iOS, Android, 웹에서 4.9점 평점으로 이용 가능합니다.

Python
7스트릭
250점수
5에너지
변수
journey Hex Done Base iconjourney Hex Done Shadow iconjourney Hex Done Top iconjourney Lesson Done icon
journey Path Right Done icon
journey Hex Done Base iconjourney Hex Done Shadow iconjourney Hex Done Top iconjourney Lesson Done icon
journey Path Left Done icon
journey Hex Active Base iconjourney Hex Active Shadow iconjourney Hex Active Top iconjourney Lesson Theory Challenge icon
계속하기
journey Path Right icon
journey Hex Locked Base iconjourney Hex Locked Shadow iconjourney Hex Locked Top iconjourney Lesson Theory Challenge icon
journey Path Left icon
journey Hex Locked Base iconjourney Hex Locked Shadow iconjourney Hex Locked Top iconjourney Lesson All icon
여정
목표
리더보드
프로필
4.9
별별별별별
평점

당신은 혼자가 아닙니다

글로벌 리더보드에서 경쟁하고, 친구를 초대해서 보상을 받고, 서로의 성공을 축하하세요. 코딩은 친구와 함께하면 더 좋아요!

챌린저 리그
챌린저 리그상위 7명 승급
leaderboard First icon1
avatar 1 icon
fire Filled icon
Alex7+ Days
2840
leaderboard Second icon2
avatar 2 icon
fire Filled icon
Jordan7+ Days
2650
leaderboard Third icon3
avatar 3 icon
fire Filled icon
Sam7+ Days
2420
4
avatar 4 icon
Casey
2180
5
avatar placeholder icon
fire Filled icon
Morgan7+ Days
1950
leaderboard Arrow Up icon승급 구역leaderboard Arrow Up icon

모든 방식으로 학습

읽고, 듣고, 스스로 확인하고, AI에게 묻고, 이미 배운 내용을 찾아보세요. 모든 수업이 당신에게 맞춰집니다.

변수 입문
오디오

변수는 나중에 프로그램에서 참조할 값을 저장하는, 이름이 있는 컨테이너입니다.

Python에서는 이름, 등호, 저장할 값을 차례대로 써서 만듭니다.

값은 시간이 지나며 바뀔 수 있습니다. 재할당하면 그 이름이 새로운 값을 가리킵니다.

1xSarah

수료증을 받으세요

완료한 모든 코스에 대해 인증서를 받으세요. LinkedIn 프로필과 이력서에 추가하여 고용주에게 코딩 전문성을 보여주세요.

Coddy수료증
이 인증서는홍길동성공적으로 완료했음을 증명합니다
python iconPython 기초
인증됨
날짜2026년 1월
LinkedInLinkedIn에 추가

이 JavaScript 로드맵을 Coddy에서 따라가야 하는 이유

  • 웹 전체를 아우르는 하나의 언어. JavaScript는 모든 브라우저에서 실행되고, Node.js와 함께라면 서버, 빌드 도구, 스크립트까지 실행합니다. 그래서 프론트엔드, 백엔드, 풀스택 일자리는 서로 갈라지기 전에 모두 이 로드맵이 쌓는 기초에서 출발합니다.
  • 첫 단계에 들어 있는 TypeScript. JavaScript 코스에는 핵심 타입과 유니언부터 인터페이스, 열거형, 제네릭까지 다루는 완전한 TypeScript 섹션이 있습니다. 그래서 많은 현업 팀이 쓰는, 타입을 붙인 JavaScript가 첫 직장에서 놀랄 거리가 아니라, 배우는 언어의 일부가 됩니다.
  • JavaScript로 하는 면접 연습. 자료구조, 재귀 챌린지, 다섯 가지 정렬이 모두 JavaScript로 진행되므로, 면접에서 실제로 쓰라고 할 언어로 연습합니다.
  • 채점과 힌트는 있고, 설치할 것은 없습니다. 모든 레슨은 테스트 케이스로 채점되는 JavaScript 챌린지로 끝나고, AI 튜터 Bugsy가 수정 코드를 대신 쓰지 않고 무엇이 잘못됐는지 짚어 줍니다. 대부분의 코스는 무료 수료증으로 마무리되며, 설정할 Node.js나 에디터도 없습니다. 모든 것이 브라우저에서 실행됩니다.

JavaScript 개발자가 되는 것에 대해 자주 묻는 질문

JavaScript 개발자가 되는 데 얼마나 걸리나요?

하루 한 시간 정도라면, 처음 시작해서 주니어 면접을 보기까지 6개월에서 12개월이 적당한 범위입니다. 이 로드맵에서 JavaScript 코스는 TypeScript 섹션을 포함해 8~10주, 커맨드 라인, Git, SQL이 합쳐서 한 달 정도, 자료구조와 정렬 단계가 두 달 더 걸립니다. 그다음은 전문 분야입니다. React 같은 프레임워크나 Node.js 백엔드를 익혀, 보여 줄 수 있는 프로젝트 한두 개로 완성합니다.

JavaScript는 소프트웨어 엔지니어의 첫 언어로 좋은가요?

네, 다만 한 가지 주의할 점이 있습니다. 어디서나 실행되고, 브라우저에서 결과를 바로 보여 주며, 웹에서 보수를 받는 일로 곧장 이어집니다. 주의할 점은 JavaScript가 다른 언어라면 거부할 실수를 너그럽게 넘어간다는 것입니다. == 연산자는 비교하기 전에 타입을 변환하고, 없는 속성은 에러가 아니라 undefined가 됩니다. 이 로드맵의 첫 단계에 TypeScript가 들어 있고, 자료구조 단계에서 각 구조를 직접 만들게 하는 이유가 바로 그것입니다.

JavaScript 개발자는 JavaScript 말고 무엇을 알아야 하나요?

이 로드맵이 다루는 커맨드 라인, Git, SQL, 그리고 이 로드맵이 다루지 않는 대상 플랫폼입니다. 브라우저라면 HTML, CSS, DOM, React 같은 프레임워크, 서버라면 Node.js, npm, HTTP입니다. Coddy의 프론트엔드 경로가 React를 포함한 브라우저 쪽을 다루며, 이 페이지가 끝나는 곳에서 이어집니다.

TypeScript와 JavaScript 중 무엇을 먼저 배워야 하나요?

JavaScript를 먼저, 그리고 곧이어 TypeScript를 배우세요. TypeScript는 JavaScript에 타입을 더한 것이고, 그 에러는 아래에 있는 JavaScript가 무엇을 하는지 알아야 비로소 이해가 됩니다. JavaScript 코스도 그 순서로 되어 있습니다. 순수 JavaScript 섹션 두 개, 그다음 TypeScript 섹션, 그다음 객체 지향 프로그래밍입니다.

이 로드맵에서 JavaScript로 진행되지 않는 코스는 무엇인가요?

하나입니다. 클린 코드는 아직 Python으로만 진행되기 때문에, 7단계 안이 아니라 단계 목록 뒤에 따로 나와 있습니다. 그 주제인 이름 짓기, 함수 크기, 구조는 어느 언어에서나 똑같이 읽히고, ESLint 같은 린터는 그중 일부만 잡아냅니다. 객체 지향 프로젝트와 코딩 문제를 포함해 모든 단계가 JavaScript로 진행됩니다.

이 JavaScript 로드맵은 무료인가요?

네. 이 로드맵의 모든 코스가 무료입니다. 레슨, 브라우저 안의 에디터와 Linux 터미널, 테스트로 채점되는 챌린지, Bugsy의 힌트, 수료증까지 전부입니다. Pro는 하루 에너지 제한을 없애고 AI 도움을 무제한으로 열어 주지만, 이 로드맵의 어떤 것도 Pro를 필요로 하지 않습니다.

다른 학습 경로

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

모든 학습 경로
Coddy 프로그래밍 언어 일러스트

소프트웨어 엔지니어 경로를 무료로 시작하세요

학습 시작