바이브코딩 1강-01 | PHP MVC 웹 프로젝트 환경 세팅

terminal 초보자를 위한 바이브코딩 강의

PHP MVC 웹 프로젝트
환경 세팅

PHP, MySQL, jQuery, Tailwind CSS를 사용해 MVC 방식 웹 프로젝트의 기본 개발 환경을 AI와 함께 단계별로 구성합니다.

PHP MySQL MVC

이번 강의의 목표

처음부터 외우지 말고,
구조를 설명하는 힘을 기릅니다.

architecture

구조 잡기

MVC 프로젝트가 어떤 폴더와 흐름으로 구성되는지 먼저 이해합니다.

forum

AI와 대화하기

“코드 짜줘”가 아니라 방향, 구조, 조건을 구체적으로 요청합니다.

published_with_changes

확인하며 완성

실행하고, 오류를 보고, 수정하는 반복 흐름을 익힙니다.

Technology Stack

이번 프로젝트에서 사용하는 기술

PHP

서버 요청 처리, DB 연결, 화면 데이터 전달

MySQL

회원, 게시글, 상품, 주문 같은 데이터 저장

jQuery

버튼 클릭, 입력값 확인, AJAX 요청 처리

Tailwind

빠르게 화면 디자인을 구성하는 CSS 프레임워크

MVC

역할별로 코드를 나눠 관리하기 쉬운 구조

MVC Pattern

MVC를 쉽게 이해하기

MVC는 복잡한 코드를 역할별로 나누는 약속입니다. 초보자는 “누가 무엇을 담당하는가”만 먼저 잡으면 됩니다.

MODEL

데이터 담당

회원 정보를 DB에서 가져오거나 저장합니다.

VIEW

화면 담당

HTML 페이지를 사용자에게 보여줍니다.

CONTROLLER

중간 처리

요청을 받아 Model과 View를 연결합니다.

예시: 사용자가 /users 주소로 접속하면?

Router가 주소를 확인하고, UserController가 실행되고, UserModel이 DB에서 회원 데이터를 가져오고, View가 목록 화면을 보여줍니다.

Request Flow

MVC 프로젝트의 핵심 흐름

사용자 요청

→

public/index.php

→

Router

→

Controller

Model

→

Database

→

View 출력

사용자 요청 → public/index.php → Router → Controller → Model → Database → View → 사용자 화면 출력

Folder Structure

프로젝트 폴더 구조

이번 강의에서는 public_html 아래에 MVC에 필요한 폴더를 역할별로 나눕니다.

가장 중요한 파일

public/index.php

모든 요청이 처음 들어오는 프론트 컨트롤러입니다.

public_html/
├── app/
│   ├── Controllers/
│   ├── Models/
│   ├── Views/
│   └── Core/
├── public/
│   ├── index.php
│   └── assets/
├── config/
│   └── database.php
├── routes/
│   └── web.php
├── storage/
├── vendor/
├── .env
├── composer.json
├── package.json
└── README.md

Folder Roles

각 폴더의 역할

app

Controllers, Models, Views, Core 등 실제 PHP 코드가 들어가는 핵심 폴더입니다.

public

브라우저가 직접 접근하는 index.php와 CSS, JS, 이미지 파일을 둡니다.

config

database.php처럼 프로젝트 설정을 관리합니다.

routes

주소와 컨트롤러를 연결하는 web.php를 둡니다.

storage

로그, 캐시, 업로드 파일처럼 저장이 필요한 데이터를 둡니다.

vendor / .env

vendor는 Composer 라이브러리, .env는 DB 비밀번호 같은 민감 정보를 관리합니다.

Remote MySQL

MySQL은 원격 서버를 사용합니다

내 컴퓨터에 MySQL 서버를 설치하지 않아도 됩니다. 대신 원격 MySQL 서버에 접속하기 위한 클라이언트 도구가 필요할 수 있습니다.

Windows 확인

mysql --version
where mysql

Linux / macOS 확인

mysql --version
which mysql

핵심 구분

MySQL 서버는 데이터를 저장하는 본체이고, MySQL 클라이언트는 그 서버에 접속하는 도구입니다.

Setup Sequence

초보자용 개발 환경 세팅 순서

1-4

PHP, Composer, Node.js/npm, MySQL 클라이언트 설치 여부 확인

5-6

프로젝트 폴더 생성 후 MVC 폴더 구조 만들기

7-8

Composer autoload와 Tailwind CSS 빌드 환경 설정

9-10

.env에 DB 접속 정보 저장 후 PDO 원격 MySQL 연결 테스트

Router, Controller, Model, View 기본 구조 만들기

서버 구성 정보를 문서로 저장하기

처음에는 이 순서를 외우기보다, AI에게 이 순서대로 작업을 요청하면 됩니다.

Documentation

서버 구성 정보를 저장해야 하는 이유

“내 PHP 버전이 뭐였지?”

“MySQL 접속 정보가 어디 있었지?”

“프로젝트 실행 명령어가 뭐였지?”

“배포할 때 어떤 설정이 필요했지?”

AI에게 요청할 때의 핵심 프롬프트

PHP, MySQL, jQuery, Tailwind CSS를 사용해서 MVC 방식의 웹 프로젝트를 만들려고 합니다.

MySQL은 원격 서버를 사용할 예정입니다.
로컬에는 MySQL 서버를 설치하지 않고, MySQL 클라이언트 설치 여부만 먼저 확인해주세요.

프로젝트 구조는 public_html 아래에 app, public, config, routes, storage, vendor,
.env, composer.json, package.json, README.md를 두는 방식으로 구성해주세요.

public/index.php를 프론트 컨트롤러로 사용하고,
Router, Controller, Model, View 기본 구조를 만들어주세요.

DB 접속 정보는 .env 파일에서 관리하고,
PDO를 사용해서 원격 MySQL 연결을 구성해주세요.

Tailwind CSS 빌드 환경과 jQuery 사용 환경도 함께 구성해주세요.
마지막으로 서버 구성 정보를 docs/server-config.md 파일에 정리해주세요.
DB 비밀번호는 문서에 직접 저장하지 말고 .env 파일에서만 관리해주세요.

Teaching Point

코드를 외우는 것보다 구조를 이해하는 것이 먼저입니다.

AI에게 요청할 때도 MVC 흐름을 기준으로 말하면 결과물이 훨씬 정확해집니다.

나쁜 요청

회원 목록 페이지 만들어줘.

좋은 요청

MVC 구조에 맞춰 회원 목록 기능을 만들어주세요. 라우트는 /users로 설정하고, UserController에서 요청을 처리하고, UserModel에서 DB 회원 목록을 가져오고, View에서 회원 목록을 테이블로 출력해주세요.

One Line Summary

이번 세팅의 핵심

PHP로 백엔드를 만들고,
MySQL은 원격 서버를 사용하고,
jQuery로 화면 동작을 처리하고,
Tailwind CSS로 디자인을 구성하고,
MVC 구조로 코드를 깔끔하게 나눕니다.

바이브코딩은 한 번에 완벽한 코드를 만드는 방식이 아닙니다. 구조를 만들고, 실행해보고, 오류를 확인하고, 다시 수정하는 흐름을 AI와 함께 반복하는 개발 방식입니다.

PHP MVC 웹 프로젝트환경 세팅

처음부터 외우지 말고,구조를 설명하는 힘을 기릅니다.