Live Server

<aside> πŸ’‘

λΈŒλΌμš°μ €μ—μ„œ html νŒŒμΌμ„ μ„œλ²„ ν™˜κ²½μ—μ„œ μ‹€ν–‰ν•΄ λ³΄κ² μŠ΅λ‹ˆλ‹€

</aside>

  1. Live Server μ„€μΉ˜
    1. https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer
    2. [Extension] (ν™•μž₯) πŸ› 
    3. Live Server 검색
  2. Live Server μ‹€ν–‰
    1. [Go Live] (우츑 ν•˜λ‹¨)
    2. [Open with Liver Server] (HTML 파일 우클릭, 에디터 우클릭)
    3. ALT + L ➑ O
  3. Live Server μ’…λ£Œ
    1. 🚫 Port :55xx (Click to close server)
    2. [Stop Live Server] (에디터 우클릭)
    3. ALT + L ➑ C

image.png

Live Reload (μ‹€μ‹œκ°„ νŽ˜μ΄μ§€ λ¦¬λ‘œλ“œ)

<aside> βœ…

HTML, CSS, JS νŒŒμΌμ„ μˆ˜μ •ν•˜κ³  μ €μž₯ν•  λ•Œλ§ˆλ‹€ λΈŒλΌμš°μ €κ°€ μžλ™μœΌλ‘œ μƒˆλ‘œκ³ μΉ¨λ˜μ–΄ μˆ˜μ •λœ κ²°κ³Όλ₯Ό μ¦‰μ‹œ 확인할 수 μžˆμŠ΅λ‹ˆλ‹€.

</aside>

image.png