나만의 포트폴리오 웹페이지 만들기 - 3 (로컬세팅)

로컬(작업컴퓨터)에서 웹페이지 코드를 수정하고 웹서버에 연동하여 개발을 진행하기 위해 

 

XAMPP(Apache) / VS Code(Editer) 설치 및 가상호스트 설정을 하였습니다.

 

 

■ 프로그램 설치

 

 - XAMPP : https://www.apachefriends.org/download.html

Download XAMPP

 - VS Code : https://code.visualstudio.com/download

Download Visual Studio Code - Mac, Linux, Windows

 

 

■ 가상호스트 설정

 

 웹서버에서 도매인을 연결하여 웹 브라우저로 웹페이지를 여는 것처럼 로컬에서도 가상호스트 설정을 통해 도메인으로  웹페이지를 확인할 수 있습니다.

 

 - hosts 설정 (경로 : C:\Windows\System32\drivers\etc)

hosts파일 하단에 stage.test.devs로 연결 시 127.0.0.1(localhost)로 연결되도록 설정

 

 - httpd.conf 설정 (경로 : C:\xampp\apache\conf)

외부에서 D:project 디렉토리 접근권한 허용

<Directory "D:/project">
   AllowOverride None
   Require all granted
</Directory>

 

 - httpd-vhost.conf 설정 (경로 : C:\xampp\apache\conf\extra)

stage.test.devs 접근 시 D:\project/test 디렉토리로 접근하도록 설정

<VirtualHost *:80>
	##ServerAdmin webmaster@dummy-host.example.com
	DocumentRoot "D:/project/test"
	ServerName stage.test.devs
	ServerAlias stage.test.devs
	##ErrorLog "logs/dummy-host.example.com-error.log"
	##CustomLog "logs/dummy-host.example.com-access.log" common
</VirtualHost>

 

 

가상호스트 설정이 모두 완료된 후 XAMPP Apache를 재시작하게 되면 브라우저에서 http://stage.test.devs 주소 접근 시 D:\project\test 폴더 내부의 index파일을 볼 수 있습니다.

 

php -> echo "Welcome";

 

 

여기까지 작업환경 설정이 완료되었습니다. 

 

다음에는 작업환경과 웹서버 연동을 위한 git hub 설치에 대해 포스팅하겠습니다.