인프런 커뮤니티 질문&답변

엔코아님의 프로필 이미지

작성한 질문수

워드프레스 제대로 개발하기 - 어드민 편

내 테마 만들기

phpstorm에서 LIve server 기능을 사용하는 방법이 궁금합니다.

해결된 질문

24.05.13 19:40 작성

·

195

0

VS Code를 처음 설치해보고 Live Server 기능을 이용해서 php 파일을 수정하면 크롬에서 바로 반영되서 보이게 썼었는데요, 강의 보고 phpstorm을 쓰다보니 여기서는 어떻게 live server 기능을 사용할 수 있는지 찾을 수가 없어서요... 혹시 가능한 방법을 알 수 있을까요?

답변 2

0

워드프레스 개발님의 프로필 이미지
워드프레스 개발
지식공유자

2024. 05. 22. 23:47

안녕하세요. 질문 감사합니다.

VSCode의 Live Server는 사용해 본 적이 없습니다만, 저는 일반적으로 웹 개발을 새로고침해 주는 BrowserSync를 사용합니다.

npm install -g browser-sync로 브라우저 싱크를 글로벌로 설치한 뒤 아래 명령으로 서버를 돌리면 localhost:3000으로 접속할 수 있습니다.

browser-sync start --proxy "bookstore.localhost" --files 'wp-content/themes/bookstore/**/*.php, wp-content/themes/bookstore/**/*.css, wp-content/themes/bookstore/**/*.js, !wp-content/themes/bookstore/vendor/**/*'

보면 아시겠지만 --proxy에 로컬 접속 도메인을 적어 줍니다.

--files에는 변경을 감지할 파일의 경로를 적어 줍니다. /**/은 0개 이상의 폴더를 뜻합니다. 또한 !를 적으면 해당 경로는 제외하라는 뜻입니다.

더 자세한 내용은 BrowserSync 웹사이트에서 문서를 참고해 보시면 됩니다. 윈도우를 사용중이시라면 문서를 좀 참고해 보시긴 해야 할 겁니다.

감사합니다.

(AI 인턴의 답에서 spring-boot-devtools는 자바 스프링부트에 사용하는 툴이니 참고하지 않으시는 게 좋습니다.)

0

인프런 AI 인턴님의 프로필 이미지

2024. 05. 15. 19:46

안녕하세요, 인프런 AI 인턴입니다.
님의 관심사에 대해 직접적인 정보는 제공되지 않았지만, 개발 환경 설정과 관련하여 유사한 기능을 제공하는 spring-boot-devtools를 참고하시면 일부 도움이 될 수 있습니다. spring-boot-devtools 모듈에는 리소스가 변경될 때 브라우저 새로고침을 트리거할 수 있는 내장 LiveReload 서버가 포함되어 있습니다. PhpStorm에서 Live Server 기능을 사용하고자 하신다면, 외부 플러그인을 찾거나, 내장된 기능 중 자동으로 웹 페이지가 업데이트 되는 기능을 찾아보시는 것을 추천드립니다. PhpStorm 공식 문서나 커뮤니티에서 더 구체적인 방법을 찾아볼 수도 있습니다.

추가적으로, PhpStorm 환경에서 Live Server와 유사한 기능을 구현하기 위한 대안으로는 외부 도구를 사용하는 방법이 있을 수 있습니다. 예를 들어, Browsersync와 같은 도구를 설정하여 파일이 변경될 때 자동으로 브라우저를 새로 고침하게 할 수 있습니다. 이 방법은 개발 프로세스를 자동화하고 효율성을 높이는데 도움이 될 수 있습니다.

마지막으로, PhpStorm과 같은 IDE에서 특정 기능을 사용하기 위해 외부 도구나 플러그인의 도움을 받을 때는 호환성과 사용성을 잘 확인하시기 바랍니다.

필요한 정보를 명확히 찾지 못하여 도움을 드리지 못한 점 양해 부탁드립니다.