맥북 vscode php live server 안될 때 xampp 사용법

Visual Studio Code  

1. vscode php 라이브 서버가 안될 때 쓸 수 있는 방법

차라리 xampp를 사용하는 게 속 편하다 

 

닷홈에서 무료호스팅을 이용하는 방법도 있다

닷홈 무료 호스팅은 1개월 무료 제공에 PHP 7.4가 세팅돼 있고 아파치니 어쩌니 잘도 알아서 세팅돼 있다

그냥 ftp로 파일 업로드 하고 vscode로 편집하는 방법이 제일 쉽다

 

그래도 꼭 로컬호스트에서 라이브서버를 사용하고 싶다면

vscode 확장 프로그램을 쓰면 좋은데 -_-; 

잘 쓰다가 안된다 setting.json이 뭔가 잘못된 느낌적인 느낌

 

아, live server 확장 프로그램이 정상적으로 작동되더라도 php 라이브 서버는 안돼서 ㅎ 별도의 확장 프로그램을 또 깔아야 된다 

귀찮고 시키는 대로 해도 자꾸 먹통이라 그냥 xampp를 사용하기로 했다

 

증상은 아래와 같다 아파치 가상서버

크롬 php 파일 실행하는 방법  크롬 php 파일 여는 방법 크롬 php파일 열기

1.1 live server 확장프로그램을 사용하던 중 나타난 증상

vscode liveserver php error  라이브서버 php 오류

php 위치를 못 찾겠다는 것 같은데 정확히는 모르겠다  이런 건 라이브서버가 좀 알아서 해결해주면 안되나? ㅠ 

안되나 보다 

 

라이브서버 이놈들이 XAMPP를 인스톨하고 다운로드 하란다 

반응형

2. XAMPP 다운로드 하기 

 

XAMPP 다운받기

https://www.apachefriends.org/index.html

 

XAMPP Installers and Downloads for Apache Friends

링크에 들어가면 XAMPP를 다운받을 수 있다 

초록색 화살표 다운로드 우측으로 나열된 것 중 본인이 가진 컴퓨터 운영체제에 맞는 것을 다운로드 한다 

 

나는 맥이니 당근 for OS X를 다운 받았다

 

아, XAMPP 설명을 빠뜨렸다 왜냐하면 나도 잘 모르기 때문이다

그냥 가상서버 정도로만 이해해도 될 것 같다 

XAMPP 홈페이지에선 이렇게 말하고 있다

---

What is XAMPP?

XAMPP is the most popular PHP development environment

XAMPP is a completely free, easy to install Apache distribution containing MariaDB, PHP, and Perl. The XAMPP open source package has been set up to be incredibly easy to install and to use.

 

> 파파고 번역 : 

 

XAMPP가 가장 인기 있는 PHP 개발 환경이다.

 

XAMPP는 MariaDB, PHP 및 Perl을 포함하는 완전히 무료이며 설치가 쉽습니다. XAMPP 오픈 소스 패키지는 설치와 사용이 매우 용이하도록 설정되어 있습니다.

---

그렇다고 오해하지 마시라,  html이나 js등 php 외에 다른 언어로 작성된 파일들도 XAMPP로  미리보기 할 수 있다

가상서버 같은 거라고 했으니 그냥 당연하게 받아들이면 된다

3. XAMPP 실행하기

다운로드 폴더에서 xampp dmg를 클릭하면 아래와 같은 창이 열린다

하단에 보면 인스톨하려면 더블 클릭하라고 되어 있는데 막상 더블클릭을 하면 보안 때문인지 열 수 없다고 한다

 

더블클릭 하라는 말은 무시하고 XAMPP 아이콘에서 오른쪽 마우스를 클릭하면 나타나는 대화상자에서 열기를 클릭한다

그러면 정상적으로 인스톨된다 

맥북 XAMPP 인스톨 방법

맥북 XAMPP 인스톨 방법

앗.. ! 깜빡하고 설치하는 장면을 캡쳐해두지 않았다

별다른 설정할 것 없이 그냥 다음 다음 완료.. 뭐 이런 식으로 직관적으로 누르면 알아서 잘 설치된다

3. XAMPP 사용하기

XAMPP 사용법

XAMPP를 실행하면 나오는 첫번째 창(General)에서 Start를 클릭한다

시작하겠다는 거다 

 

Status에 있는 빨간 점이 -> 연두색 점으로 바뀌면 정상적으로 시동이 걸린 것이다

 

XAMPP 사용법

Services 탭으로 가서 3가지 항목에 모두 연두색 불이 들어와있다면 그대로 두면된다

만약 빨간색 불이 들어와 있으면

Strat나 Restart를 눌러서 연두색 불로 만들어준다 

 

XAMPP 사용법 포트 설정

Network탭을 누르면 로컬호스트 2가지 항목 모두 빨간 불이 들어와있다 

8080이 번호가 쉬우니까 localhost:8080만 선택해서 Enable을 눌러주면

 

XAMPP 사용법 포트설정

이렇게 또 연두색 불이 들어오게된다 

 

여기에서 localhost:8080이 내 로컬호스트 주소다 

이 주소를 크롬이나 브라우저 주소창에 넣었을 때 XAMPP 대시보드가 나오면 정상적으로 작동되고 있는 것이다

 

XAMPP 사용법

 

정상적으로 나오는지만 확인하고 다시 XAMPP 창으로가서 Volumes 탭을 눌러서

Mount 버튼을 눌러준다  맥북 라이브서버 안됨

 

이게 핵심이다

XAMPP 마운트하기

 

마운트 버튼을 누르고 나서 바탕화면을 확인하면 lampp 폴더 바로가기가 생긴다

XAMPP  htdocs폴더

lampp 폴더를 열어보면 htdocs 폴더가 있다

이 폴더 내에 프로젝트 폴더를 만들어서 vscode에서 사용하면 된다

XAMPP  htdocs폴더

나는 folderfolder라는 폴더를 만들어서 사용했고

folderfolder 내부에는 다음과 같은 파일들이 들어있다

 

XAMPP  htdocs폴더

 

이 상태에서 라이브서버를 사용하기 위해서는?

사용하는 브라우저에 단지 내 로컬호스트 주소와 htdocs 폴더 내부에 있는 파일 경로를 넣어주기만 하면된다 

예를 들면 

htdocs 폴더 내에 folderfolder 폴더 안 baeyeol.php를 라이브 서버로 열러보려면 

 

브라우저 주소창에 

localhost:8080/folderfolder/baeyeol.php

라고만 넣으면! 브라우저에서 php 파일을 실행할 수 있다 (php 아니라 html이든 뭐든 가능)

 

맥북 php라이브서버