codingstairs
노트에듀라이프연락
⌕검색⌘K
koen

Navigation

  • Intro
  • Blog
  • Life

연락하기

로그인 없이도 보낼 수 있어요. 답변이 필요하면 이메일을 함께 적어 주세요.

  • 익명 폼으로 의견 남기기 →
  • ✉ warragon112@gmail.com
  • 카카오톡 오픈채팅 ↗

© 2026 codingstairs

  • 노트
  • 에듀
  • 검색
  • 라이프
  • 연락
  • 약관
  • RSS
  • GitHub
에듀›처음 시작하는 개발 환경

처음 시작하는 개발 환경

컴퓨터를 켜는 순간부터 첫 코드를 실행하기까지. 비개발자·입문자가 한 칸씩 따라하면 끝.

1단계부터 시작하기 →
난이도
beginner
강의
5

처음 시작하는 개발 환경

개발은 "환경 설정"이라는 첫 계단에서 가장 많이 좌절합니다. 이 강좌는 그 계단을 5단계로 쪼개 천천히 올라갑니다.

누구를 위한 강좌인가

  • 개발자가 되고 싶은데 무엇부터 설치해야 할지 모르는 분
  • 윈도우/맥에 이미 익숙하지만 터미널·Git·VS Code 가 어색한 분
  • 비개발자인데 AI 코딩 도구를 직접 굴려보고 싶은 분

다 끝내면 할 수 있는 것

  • 윈도우 또는 맥에서 터미널을 열어 명령어 입력
  • Git 으로 버전 관리 (commit, push, pull)
  • VS Code 에서 첫 React 프로젝트 실행
  • Claude Code 같은 AI 도구 연결

단계 흐름

[1] 터미널 ──▶ [2] Git ──▶ [3] VS Code ──▶ [4] Node + pnpm ──▶ [5] AI 도구

빈 컴퓨터에서 시작해 한 단계마다 손에 익히는 도구가 한 개씩 추가됩니다.

단계 구성

  1. 터미널과 친해지기 — Windows Terminal / iTerm 설치, cd/ls 기본 명령
  2. Git 첫 커밋 — Git 설치, GitHub 계정, 첫 push
  3. VS Code 와 확장팩 — VS Code 설치, ESLint·Prettier·GitLens
  4. Node.js + pnpm — Node 20 설치, pnpm 활성화, 첫 React 프로젝트
  5. AI 코딩 도구 연결 — Claude Code 설치, 첫 코드 생성 명령

각 단계는 앞 단계의 결과 위에서 한 칸씩 쌓아갑니다. 중간에 멈춰도 다음 세션에서 그대로 이어집니다.

단계별 강의

  1. 1

    1단계 — 터미널과 친해지기

    →
  2. 2

    2단계 — Git 첫 커밋

    →
  3. 3

    3단계 — VS Code 와 확장팩

    →
  4. 4

    4단계 — Node.js + pnpm + 첫 React

    →
  5. 5

    5단계 — AI 코딩 도구 연결

    →

다른 강좌

전체 보기 →
  • HTML/CSS/JS 부터 React, Next, Tailwind 까지
  • Next.js 16 으로 첫 풀스택 앱 만들기
  • Spring Boot 4 로 시작하는 백엔드
  • Python · FastAPI · 데이터 파이프라인
  • AI 시대의 개발 도구 — Claude Code · MCP · 디자인 도구
  • Docker · Caddy · 클라우드 10단계 배포 옵션
  • 중앙 관리자 플랫폼 — 여러 도메인을 한 허브에서
  • 로컬 LLM · pgvector · RAG 챗봇 만들기
  • Tauri 2 — 데스크탑 · 모바일 한 코드베이스
  • 테스트 전략과 품질 게이트
  • 웹 보안의 기초 — JWT · OAuth · OWASP
  • PostgreSQL 깊게 다루기 + Redis · Kafka
  • 공공데이터 크롤러 만들기
  • 모노레포 · SSOT · 계층 분리 사고