웹 개발 기초 – 웹 서버 구축과 배포 – 로컬 개발 환경 구축 (XAMPP, WAMP 등)
안녕하세요 😊
웹 개발을 처음 시작하시는 분들이라면 꼭 먼저 알아야 할 게 바로 로컬 개발 환경 구축이에요!
웹 개발을 한다는 건 단순히 코드를 작성하는 것만이 아니라, 그 코드가 동작할 서버 환경을 이해하고 직접 구성할 수 있어야 한다는 뜻이랍니다.
마치 요리사가 요리를 하기 위해 주방을 준비하듯이, 웹 개발자도 본격적인 개발 전에 작업할 공간을 만드는 게 중요해요.
그 공간을 만들어주는 도구가 바로 XAMPP, WAMP와 같은 통합 개발 환경 도구들이랍니다!
로컬 개발 환경이란?
**로컬(Local)**은 말 그대로 ‘내 컴퓨터’라는 뜻이고,
개발 환경은 ‘개발을 하기 위한 도구들과 설정’이에요.
즉, 로컬 개발 환경이란 인터넷에 연결하지 않아도 내 컴퓨터 안에서 웹사이트처럼 작동하는 서버를 구성하는 것을 말해요.
✅ 인터넷 없이도 웹 페이지 테스트 가능
✅ 빠르게 수정하고 결과 확인 가능
✅ 실제 서버에 올리기 전에 디버깅 가능
왜 XAMPP나 WAMP를 사용할까요?
웹사이트를 작동시키려면 보통 아래 세 가지가 필요해요.
| 구성 요소 | 역할 |
|---|---|
| Apache | 웹서버 (브라우저 요청을 받아 응답해주는 역할) |
| PHP | 동적 웹 페이지를 구동하는 언어 |
| MySQL | 데이터를 저장하고 불러오는 데이터베이스 |
이걸 각각 설치하고 설정하려면 꽤 복잡한 과정을 거쳐야 하는데요,
XAMPP나 WAMP는 이 세 가지를 한 번에 설치할 수 있도록 도와주는 패키지 프로그램이에요!
1. XAMPP 설치 방법 (Windows, macOS, Linux 지원)
✅ 설치하기
- XAMPP 공식 사이트에 접속
- 사용하는 운영체제에 맞는 버전 다운로드
- 설치 파일 실행 후 ‘Next → Next → Finish’로 간단 설치
- 설치가 완료되면 ‘XAMPP Control Panel’이 실행돼요!
✅ 주요 컴포넌트 실행
- Apache : ‘Start’ 버튼 클릭 → 웹 서버 시작
- MySQL : ‘Start’ 버튼 클릭 → DB 서버 시작
✅ 확인 방법
브라우저 주소창에 아래 입력 👇
http://localhostXAMPP의 기본 웹 페이지가 보이면 성공입니다!
2. WAMP 설치 방법 (Windows 전용)
✅ 설치하기
- WAMP 공식 사이트에 접속
- Windows 비트 수(32/64bit)에 맞는 버전 다운로드
- 설치 중에 브라우저와 텍스트 에디터 경로 설정 필요
- 설치 후 시스템 트레이에 ‘W’ 아이콘 생성
✅ 서버 실행 확인
- W 아이콘이 초록색이면 서버 정상 실행 중
- 브라우저에서
http://localhost또는http://127.0.0.1접속하여 확인
3. 기본 웹 파일 저장 위치
설치가 끝나면 이제 웹 페이지를 만들어 볼 차례죠?
그럼 파일은 어디에 저장해야 할까요?
| 환경 | 웹 루트 디렉터리 |
|---|---|
| XAMPP | C:\xampp\htdocs |
| WAMP | C:\wamp64\www |
예를 들어, index.php 파일을 만들어 htdocs에 넣었다면
http://localhost/index.php 로 접근 가능해요!
4. 예제: PHP 테스트 해보기
htdocs 또는 www 폴더에 아래처럼 test.php 파일을 만들어주세요.
<?php
echo "안녕하세요! PHP가 잘 작동하고 있어요 😄";
?>브라우저에서 http://localhost/test.php로 접속했을 때
“안녕하세요! PHP가 잘 작동하고 있어요 😄” 라는 문장이 보이면 성공이에요!
5. phpMyAdmin으로 데이터베이스 관리
XAMPP나 WAMP는 phpMyAdmin이라는 웹 기반 DB 관리 도구도 함께 설치돼요.
✅ 접속 방법
브라우저에 입력:
http://localhost/phpmyadmin✅ 할 수 있는 일
- 데이터베이스 생성
- 테이블 생성 및 데이터 삽입
- SQL 쿼리 실행
- 사용자 권한 관리
복잡한 명령어 없이도 마우스 클릭으로 대부분의 DB 작업을 처리할 수 있어요!
6. 로컬 서버 작업 시 유용한 팁들
- 기본 포트 충돌 주의 : Apache는 기본적으로 80번 포트를 사용해요. Skype나 다른 웹 서버와 충돌할 수 있으니 포트 변경이 필요할 수 있어요.
- 폴더 권한 설정 : 프로젝트 폴더의 읽기/쓰기 권한을 올바르게 설정해야 오류가 없어요.
- 환경변수 설정 (선택사항) : CLI에서
php,mysql명령어를 바로 쓰고 싶다면 시스템 환경변수에 해당 경로 추가하세요. - 서비스 자동실행 : 자주 쓴다면 Apache/MySQL을 윈도우 시작 시 자동 실행 설정하는 것도 좋아요.
🔐 주의해야 할 점 정리
| 항목 | 주의할 점 |
|---|---|
| 보안 설정 | 로컬 개발용이므로 보안은 기본 설정으로 충분하나 외부 접근은 차단해야 해요. |
| 관리자 권한 | 설치나 실행 시 관리자 권한이 필요할 수 있어요. |
| 방화벽 예외 | Apache, MySQL이 방화벽에서 차단되지 않도록 설정 필요 |
| 백신 충돌 | 일부 백신 프로그램이 서버 실행을 방해할 수 있으니 예외 등록이 필요해요. |
마무리하며 😊
로컬 개발 환경을 구축하는 건 웹 개발의 첫걸음이자 아주 중요한 단계예요!
XAMPP나 WAMP만 설치하면 웹 서버, PHP, 데이터베이스까지 한 번에 셋업 가능하니 너무 좋죠!
이제 로컬 서버 위에서 HTML, CSS, PHP, 데이터베이스 등을 자유롭게 실험하고 개발해보세요.
다음 시간에는 FTP를 통해 파일을 서버에 업로드하거나,
도메인을 연결해서 실서버에 배포하는 방법도 알아볼게요!
언제나 활기찬 개발 되세요! 💻✨