코딩 무료로 배우는 법 - 2026년 완벽 로드맵

코딩 학원에 수백만 원 쓸 필요 없습니다

"코딩 배우고 싶은데 부트캠프가 500만 원이래요."

이런 말을 듣고 코딩을 포기하는 분들이 많습니다. 하지만 2026년 현재, 코딩을 배우는 데 돈이 들지 않습니다. 진짜입니다.

하버드 CS50 강의가 무료입니다. freeCodeCamp이라는 플랫폼에서 풀스택 개발자 커리큘럼을 무료로 제공합니다. 유튜브에는 수천 시간 분량의 고품질 코딩 튜토리얼이 올라와 있습니다. AI 챗봇은 24시간 무료로 코딩을 가르쳐줍니다.

문제는 돈이 아닙니다. 어디서부터 시작해야 하는지, 어떤 순서로 배워야 하는지 모르는 것이 진짜 문제입니다. 이 글이 그 문제를 해결해드립니다. 비전공자도 따라할 수 있는 단계별 로드맵을 제공합니다.

코딩을 배우기 전에 알아야 할 것

어떤 분야로 갈 건가요?

"코딩을 배우겠다"는 "운동을 하겠다"와 비슷합니다. 어떤 운동이요? 수영? 마라톤? 웨이트? 방향에 따라 훈련 방법이 완전히 다릅니다.

코딩도 마찬가지입니다:

웹 프론트엔드 개발: 사용자가 보는 화면을 만듭니다. HTML, CSS, JavaScript, React를 배웁니다. 시각적 결과물이 바로 보여서 초보자가 시작하기 좋습니다.

웹 백엔드 개발: 서버와 데이터베이스를 다룹니다. Node.js, Python, Java 등을 배웁니다. 로직과 시스템 설계를 좋아하는 분에게 적합합니다.

풀스택 개발: 프론트엔드와 백엔드 모두 다룹니다. 취업 시장에서 수요가 가장 높지만 배울 양이 많습니다.

데이터 분석/과학: Python, SQL, 통계를 배웁니다. 데이터로 인사이트를 뽑아내는 일입니다. 비전공자 전환이 비교적 쉽습니다.

모바일 앱 개발: iOS(Swift), Android(Kotlin), 또는 크로스플랫폼(Flutter, React Native)을 배웁니다.

이 글에서는 가장 범용적이고 수요가 높은 웹 풀스택 개발 로드맵을 제공합니다. 다른 분야로 가더라도 1-2단계까지는 동일하게 적용됩니다.

하루에 얼마나 해야 하나요?

최소: 하루 1시간, 주 5일 권장: 하루 2-3시간, 주 5-6일 집중 모드: 하루 6-8시간 (직장을 다니면서는 현실적으로 어렵습니다)

중요한 것은 매일의 양이 아니라 꾸준함입니다. 주말에 10시간 몰아서 하고 평일에 안 하는 것보다, 매일 1시간이 훨씬 효과적입니다. 코딩은 근육과 같습니다. 매일 조금씩 써야 강해집니다.

1단계: HTML과 CSS 기초 (2-3주)

HTML — 웹의 뼈대

HTML은 웹 페이지의 구조를 만드는 언어입니다. "여기에 제목을 넣고, 여기에 문단을 넣고, 여기에 이미지를 넣어라"고 지시하는 것입니다.

비유하자면, HTML은 집의 설계도입니다. 방이 몇 개인지, 문이 어디에 있는지, 창문 위치는 어디인지를 정하는 것입니다.

CSS — 웹의 꾸미기

CSS는 HTML로 만든 구조를 예쁘게 꾸미는 언어입니다. 색상, 크기, 위치, 간격, 폰트 등을 지정합니다.

집의 설계도가 HTML이라면, CSS는 인테리어입니다. 벽지 색상, 바닥재, 가구 배치를 결정하는 것입니다.

무료 학습 리소스

생활코딩 (opentutorials.org): 한국어로 된 최고의 무료 코딩 교육 사이트입니다. 이고잉님이 만든 이 사이트는 비전공자를 위해 설계되었고, HTML/CSS부터 시작합니다. 설명이 친절하고 예제가 실용적입니다.

freeCodeCamp (freecodecamp.org): 영어지만 가장 체계적인 무료 커리큘럼입니다. "Responsive Web Design" 인증 과정을 따라가면 HTML과 CSS를 실습하며 배울 수 있습니다. 브라우저에서 바로 코드를 작성하고 결과를 확인합니다.

유튜브 — 드림코딩: 한국어 유튜브 채널 중 품질이 가장 높은 채널 중 하나입니다. HTML/CSS 기초부터 고급 주제까지 커버합니다.

실습 프로젝트

배운 것은 반드시 직접 만들어보세요. 이 단계에서 만들 프로젝트:

1. 자기소개 페이지 — 이름, 사진, 간단한 소개, 취미를 담은 한 페이지 사이트
2. 좋아하는 맛집 리스트 — 사진, 설명, 위치 정보를 포함한 리스트 페이지
3. 이벤트 초대장 — 결혼식이나 생일파티 초대장 웹 페이지

완벽할 필요 없습니다. 못생겨도 됩니다. 직접 만드는 과정에서 배우는 것이 핵심입니다.

2단계: JavaScript 기초 (3-4주)

JavaScript란?

HTML이 구조이고 CSS가 디자인이라면, JavaScript는 동작입니다. 버튼을 누르면 메뉴가 열리고, 스크롤하면 애니메이션이 작동하고, 데이터를 서버에서 가져오는 모든 것이 JavaScript입니다.

비유하자면, HTML/CSS가 집의 구조와 인테리어라면, JavaScript는 전기 배선과 수도 시스템입니다. 스위치를 누르면 불이 켜지고, 수도꼭지를 열면 물이 나오게 만드는 것입니다.

무료 학습 리소스

생활코딩 — JavaScript 편: HTML/CSS를 배운 곳에서 이어서 JavaScript를 배울 수 있습니다.

JavaScript.info (한국어 번역 있음): 세계에서 가장 상세한 JavaScript 튜토리얼입니다. 한국어 번역이 있어서 접근성도 좋습니다.

Codewars (codewars.com): JavaScript 문제를 풀면서 실력을 키울 수 있는 사이트입니다. 8kyu(가장 쉬운)부터 시작해서 점차 난이도를 올리세요.

필수 개념

이 단계에서 반드시 이해해야 하는 것:

• 변수와 자료형
• 조건문 (if/else)
• 반복문 (for, while)
• 함수
• 배열과 객체
• DOM 조작 (HTML 요소를 JavaScript로 제어하기)
• 이벤트 처리 (클릭, 입력 등에 반응하기)

실습 프로젝트

1. 할 일 목록 (To-Do List) — 할 일 추가, 삭제, 완료 체크 기능
2. 계산기 — 사칙연산이 가능한 웹 계산기
3. 가위바위보 게임 — 컴퓨터와 대결하는 간단한 게임

이 3개 프로젝트를 직접 만들 수 있으면, JavaScript 기초가 완성된 것입니다.

3단계: Git과 GitHub (1주)

왜 필수인가?

Git은 코드의 버전을 관리하는 도구입니다. "3시간 전 코드로 돌아가고 싶다"를 가능하게 만듭니다. GitHub는 Git으로 관리하는 코드를 온라인에 저장하고 공유하는 플랫폼입니다.

비유하자면, Git은 문서의 "되돌리기(Ctrl+Z)" 기능의 초강력 버전입니다. 그리고 GitHub는 그 문서를 구글 드라이브에 저장하는 것과 같습니다.

Git을 배워야 하는 이유:

• 모든 개발 회사에서 Git을 사용합니다 (100%)
• 포트폴리오를 GitHub에 올려야 취업에 유리합니다
• 협업 시 필수 도구입니다
• 코드를 날릴 위험이 사라집니다

무료 학습 리소스

생활코딩 — Git: Git의 기본 개념과 사용법을 한국어로 쉽게 설명합니다.

freeCodeCamp YouTube — Git and GitHub for Beginners (1시간): 1시간짜리 영상 하나로 핵심을 배울 수 있습니다.

배울 것

• git init, add, commit, push, pull
• 브랜치 만들기와 머지하기
• GitHub에 코드 올리기
• README 작성하기

이전 단계에서 만든 프로젝트를 모두 GitHub에 올리세요. 지금부터 만드는 모든 것은 GitHub에 올리는 습관을 들이세요.

4단계: React 프레임워크 (4-6주)

React란?

React는 페이스북이 만든 프론트엔드 프레임워크입니다. 복잡한 웹 애플리케이션을 효율적으로 만들 수 있게 해줍니다. 2026년 현재 가장 수요가 높은 프론트엔드 기술입니다.

무료 학습 리소스

React 공식 문서 (react.dev): 2023년에 완전히 새로 작성된 공식 문서가 가장 좋은 React 학습 자료입니다. "Learn React" 섹션을 처음부터 끝까지 따라가세요.

Nomad Coders (노마드코더): 한국어로 React를 가르치는 인기 유튜브 채널이자 교육 플랫폼입니다. 무료 강의만으로도 기초를 탄탄히 다질 수 있습니다.

실습 프로젝트

1. 영화 검색 앱 — OMDB API를 사용해서 영화를 검색하고 정보를 표시
2. 날씨 앱 — OpenWeatherMap API로 도시별 날씨 표시
3. 개인 블로그 — React로 만든 간단한 블로그

5단계: 백엔드 기초 (4-6주)

Node.js와 Express

프론트엔드만으로는 웹 서비스를 완성할 수 없습니다. 데이터를 저장하고, 사용자 인증을 처리하고, 외부 API와 통신하려면 백엔드가 필요합니다.

Node.js는 JavaScript를 서버에서 실행할 수 있게 해주는 환경이고, Express는 Node.js로 웹 서버를 쉽게 만들 수 있게 해주는 프레임워크입니다.

무료 학습 리소스

The Odin Project (theodinproject.com): 무료 풀스택 커리큘럼 중 가장 체계적입니다. Node.js 경로를 따라가면 됩니다.

생활코딩 — Node.js: 한국어로 Node.js 기초를 배울 수 있습니다.

데이터베이스

PostgreSQL 또는 MongoDB 중 하나를 배우세요.

• PostgreSQL: 관계형 데이터베이스 (구조화된 데이터에 적합)
• MongoDB: 비관계형 데이터베이스 (유연한 구조에 적합)

취업 시장에서는 PostgreSQL을 더 많이 사용하므로 PostgreSQL을 추천합니다.

실습 프로젝트

1. REST API 만들기 — 블로그 글 CRUD(생성, 읽기, 수정, 삭제)
2. 회원가입/로그인 시스템 — 비밀번호 암호화, 세션 관리
3. 풀스택 To-Do 앱 — React 프론트엔드 + Node.js 백엔드 + DB 연동

6단계: 컴퓨터 과학 기초 (지속적으로)

자료구조와 알고리즘

코딩 면접에서 반드시 나오는 주제입니다. 서류는 포트폴리오로 통과하지만, 면접은 알고리즘 문제를 풀어야 합니다.

무료 학습 리소스:

백준 온라인 저지 (acmicpc.net): 한국에서 가장 유명한 알고리즘 문제 풀이 사이트입니다.

프로그래머스 (programmers.co.kr): 카카오 등 IT 기업의 코딩 테스트 기출문제를 풀어볼 수 있습니다.

CS50 (Harvard, edX 무료): 컴퓨터 과학 입문 최고의 강의입니다. 영어이지만 한국어 자막이 있습니다.

필수 주제

• 배열, 연결 리스트, 스택, 큐
• 해시 테이블
• 트리와 그래프
• 정렬 알고리즘
• 이진 탐색
• Big O 표기법

주 2-3문제씩 꾸준히 풀어서 6개월 안에 100문제 이상 풀기를 목표로 하세요.

7단계: 취업 준비 (8주)

포트폴리오 정리

GitHub 프로필을 정리하고, 가장 잘 만든 프로젝트 3-4개를 선택해서 README를 꼼꼼히 작성하세요.

좋은 README에 포함할 것:

• 프로젝트 설명 (무엇을 만들었는지)
• 사용 기술 스택
• 스크린샷 또는 데모 링크
• 설치 및 실행 방법
• 어려웠던 점과 해결 과정

이력서 작성

한 페이지로 작성합니다. 포함할 내용:

• 기술 스택 (사용할 수 있는 언어, 프레임워크, 도구)
• 프로젝트 3-4개 (설명 + 링크)
• 학력
• 이전 직장 경력 (전직 시 전환 가능한 역량 강조)

코딩 테스트 준비

한국 IT 기업 대부분이 코딩 테스트를 진행합니다. 프로그래머스에서 기출문제를 풀고, 백준에서 유형별 문제를 연습하세요.

하루 1-2문제씩, 최소 2개월 준비하면 중소기업 코딩 테스트는 통과할 수 있습니다.

면접 준비

기술 면접에서 자주 나오는 질문:

• "이 프로젝트에서 가장 어려웠던 점은?"
• "React의 Virtual DOM이 무엇인가요?"
• "REST API란 무엇인가요?"
• "Git에서 브랜치를 왜 사용하나요?"

모든 질문에 결론부터 답하고, 이유를 설명하세요.

현실적인 타임라인

직장인 (하루 2시간):

• 6-12개월: 기초 완성 + 포트폴리오 3-4개
• 12-18개월: 취업 준비 + 코딩 테스트 + 면접

전업 학습자 (하루 6-8시간):

• 3-5개월: 기초 완성 + 포트폴리오
• 5-8개월: 취업 준비 + 입사

이 기간은 꾸준히 매일 한다는 전제입니다. 중간에 한 달 쉬면 그만큼 늦어집니다.

흔한 실수 5가지

1. 튜토리얼 지옥

강의만 보고 직접 코드를 안 쓰는 것. 강의를 보는 것은 요리 영상을 보는 것과 같습니다. 직접 요리하지 않으면 실력이 늘지 않습니다. 강의 30%, 직접 코딩 70%가 이상적인 비율입니다.

2. 여러 언어 동시 학습

JavaScript를 배우다가 Python이 좋다고 해서 Python으로, 거기서 또 Java가 취업에 유리하다고 해서 Java로. 이러면 아무것도 깊이 배우지 못합니다. 하나를 제대로 한 후에 다른 것을 배우세요.

3. 기초를 건너뛰기

React가 인기라고 HTML/CSS, JavaScript 기초 없이 바로 React를 배우려는 분이 있습니다. 이것은 기초 체력 없이 마라톤을 뛰려는 것과 같습니다. 기초에 투자한 시간은 절대 낭비가 아닙니다.

4. 혼자 고민만 하기

막힌 부분을 며칠씩 혼자 고민하는 것은 비효율적입니다. 30분 이상 막히면 검색하세요. Stack Overflow, 블로그, AI 챗봇에 물어보세요. 다른 사람의 코드를 읽는 것도 학습입니다.

5. 비교하기

"다른 사람은 3개월 만에 취업했다는데..." 비교는 독입니다. 사람마다 배경, 시간, 학습 속도가 다릅니다. 어제의 나보다 오늘의 내가 나아지면 충분합니다.

마무리: 시작이 반입니다

코딩 학습의 가장 큰 적은 돈이 아니라 미루기입니다. "내일 시작해야지", "좋은 강의를 찾으면 시작하자"하면서 시작을 미루는 것이 가장 큰 장벽입니다.

이 글을 다 읽었다면, 지금 바로 생활코딩이나 freeCodeCamp을 열어보세요. 오늘 30분만 해보세요. 그 30분이 6개월 후의 새로운 커리어, 1년 후의 새로운 인생으로 이어질 수 있습니다.

무료로 배울 수 있는 시대에 태어난 것은 행운입니다. 그 행운을 활용하는 것은 본인의 선택입니다.