1. 입문: 웹 인프라 및 사이트 제작
"바이브코딩의 원리를 이해하고 원하는 아이디어를 직접 구현하는 과정"
코딩 실력 이전에 웹의 본질적인 원리(서버, DNS, DB)를 직관적으로 학습합니다.
AI 협업 코딩 기법인 바이브코딩 패러다임을 이해하고, 나만의 실질적인 웹 프로젝트를 인프라 위에 안전하게 구축해보세요.
핵심 주제 (Common Core)
바이브코딩의 원리와 마인드셋
코딩 지식 한계를 뛰어넘어 AI와 매끄럽게 협업하는 프롬프트(Role/Goal/Constraints) 소통 원리 이해
웹 작동원리 (Client-Server)
브라우저(Client)가 웹서버(Server)에 자원을 요청하고 화면을 렌더링하는 핵심 흐름 이해
도메인(Domain)과 DNS 구조
도메인 구매부터 DNS 네임서버 연결을 통해 가상 호스팅 서버 IP와 문자 주소를 수동 매핑하는 과정 체득
프레임워크 & 라이브러리 스택
React, Next.js 등의 모던 프레임워크와 기술스택의 차이점을 파악하고 비즈니스 목적에 맞게 매칭
데이터베이스(DB) 입문 기초
데이터를 안정적으로 관리하고 보존하기 위한 RDBMS(MySQL)의 가치와 필요성 이해
웹 아키텍처 모델링
호스팅 서버, 데이터베이스, 스토리지 등 기본적인 웹서비스 아키텍처의 설계 모델 파악
프롬프트 명시도 및 구체성 훈련
AI가 엉뚱한 코드를 짜지 않도록 목표와 제한사항을 정교하게 제어하는 개발 명세 훈련
선택형 실습 트랙 (Optional Tracks)
본인의 비즈니스 목표에 맞는 최적의 실습 트랙을 선택하세요. (중복 실습을 적극 추천합니다)
서버 및 도메인
국내 웹 호스팅 환경을 기반으로 실제 가상 서버를 개설하고, 도메인 연결 및 통신 원리를 실전에 바로 적용해봅니다.
실습 01. 가상 호스팅 개설 & 도메인 DNS 맵핑
국내 호스팅사를 이용해 가상 웹 서버 공간을 활성화하고, 구입한 도메인의 네임서버(DNS) 정보와 서버 IP를 수동으로 매칭합니다.
실습 02. 클라이언트-서버 웹 통신 추적
브라우저 개발자 도구를 열어 Client의 HTTP 요청 정보가 웹서버에 도달하고 리소스를 전송받는 실시간 네트워크 흐름을 확인합니다.
웹 프로젝트 구현
기획과 디자인 단계부터 AI 협업 바이브코딩을 접목하여, 반응형 정적 웹페이지를 온전히 제작하고 서버에 올려 론칭합니다.
실습 01. 사이트 기획 & 반응형 레이아웃 디자인
만들고자 하는 웹페이지의 요구사항을 명확히 하고, 모바일 및 데스크톱 디바이스 규격에 대처하는 반응형 구조를 기획/디자인합니다.
실습 02. 바이브코딩 코딩 & FTP 서버 업로드
AI 비서에게 구체적인 HTML/CSS 작성을 제안하여 사이트 코딩을 신속하게 완수하고, FTP로 호스팅 공간에 전송하여 실시간 오픈합니다.
DB 및 기술스택
데이터를 수집하고 비즈니스를 유연하게 확장할 수 있도록 DB 설계 및 프레임워크 선택 안목을 탄탄히 합니다.
실습 01. 호스팅 MySQL DB 연동 & 스키마 기본
호스팅에서 제공하는 MySQL DB 서버를 열고, 사용자 계정 설정 및 DB 테이블 스키마 생성과 기본적인 저장 쿼리(SELECT/INSERT)를 실습합니다.
실습 02. 서비스 최적화 프레임워크 & 기술 아키텍처 매칭
내 서비스 유형(단순 랜딩, 데이터 수집, 동적 앱)에 꼭 들어맞는 라이브러리/프레임워크 스택과 호스팅/클라우드 매핑 설계를 도출합니다.