# 비개발자를 위한 웹 개발 기초 개념 > AI로 코드를 만들었는데, 이걸 어떻게 세상에 공개하지? > > 이 글은 개발 경험이 없는 분들이 "배포"까지 가는 여정을 이해할 수 있도록 돕기 위해 작성되었습니다. --- ## 목차 1. [전체 구조 한눈에 보기](#1-전체-구조-한눈에-보기) 2. [클라이언트와 서버](#2-클라이언트와-서버) 3. [프론트엔드와 백엔드](#3-프론트엔드와-백엔드) 4. [데이터베이스](#4-데이터베이스) 5. [파일 스토리지](#5-파일-스토리지) 6. [네트워크와 HTTPS](#6-네트워크와-https) 7. [SSR과 CSR](#7-ssr과-csr) 8. [인프라란?](#8-인프라란) 9. [배포란?](#9-배포란) 10. [Vercel - 배포를 쉽게](#10-vercel---배포를-쉽게) --- ## 1. 전체 구조 한눈에 보기 웹 서비스는 **레스토랑**과 비슷합니다. 먼저 전체 그림을 보고 시작할게요. ```mermaid fl
