๐ŸŽจ Front-End

[ํฌ๋กฌ ๊ฐœ๋ฐœ์ž ๋„๊ตฌ] ์ „์ฒด ๊ฒ€์ƒ‰(์ „์—ญ ๊ฒ€์ƒ‰)ํ•˜๋Š” ๋ฐฉ๋ฒ•

์˜ฌใ„น1๋ธŒ 2020. 1. 20. 01:16
๋ฐ˜์‘ํ˜•

๋Œ€๋ถ€๋ถ„ ๊ทธ๋ ‡๊ฒ ์ง€๋งŒ ๋ณต์žกํ•œ ๊ตฌ์กฐ์—์„œ JS ๋””๋ฒ„๊น…์„ ํ•˜๋ ค๋ฉด ์–ด๋ ค์šด ๋ถ€๋ถ„์ด ๋งŽ๋‹ค.

๋‹น์—ฐํžˆ ctrl์„ ๋ˆ„๋ฅด๊ณ  ํ•จ์ˆ˜๋ช…์„ ํด๋ฆญํ•˜๋ฉด ๋„˜์–ด๊ฐ€๊ธฐ๋„ ํ•˜์ง€๋งŒ, ๊ฐ€๋”์€ ์ด ์†Œ์Šค๊ฐ€ ์–ด๋””์—์„œ๋ถ€ํ„ฐ ์‹œ์ž‘๋˜์—ˆ๋Š”์ง€์กฐ์ฐจ ๋ชจ๋ฅด๋Š” ๊ฒฝ์šฐ๊ฐ€ ๋งŽ๋‹ค.

๊ทธ๋ž˜์„œ ์˜ค๋Š˜์€ ํฌ๋กฌ ๊ฐœ๋ฐœ์ž ๋„๊ตฌ์—์„œ ์ „์ฒด ๊ฒ€์ƒ‰ํ•˜๋Š” ๋ฐฉ๋ฒ•์— ๋Œ€ํ•ด ์ž‘์„ฑํ•˜๊ณ ์ž ํ•œ๋‹ค.

(๊ฐœ๋ฐœ์ž์ ์ธ ์–ดํœ˜์ผ์ง€๋Š” ๋ชจ๋ฅด๋‚˜ ์ „์—ญ ๊ฒ€์ƒ‰์ด๋ผ๋Š” ํ‘œํ˜„๋„ ๊ดœ์ฐฎ์„ ๊ฒƒ ๊ฐ™์•„ ๋„ฃ์–ด๋ณด์•˜์Šต๋‹ˆ๋‹ค.)

์ด ๊ฒ€์ƒ‰์˜ ํ•ต์‹ฌ์€, ๋‚ด๊ฐ€ ์›ํ•˜๋Š” ๋ฌธ์ž์—ด์„ ์ „์ฒด ๋ชจ๋“  ํŒŒ์ผ ๋‚ด์—์„œ ๊ฒ€์ƒ‰์ด ๊ฐ€๋Šฅํ•˜๋‹ค๋Š” ์ ์ด๋‹ค.

 

1. F12๋ฅผ ๋ˆŒ๋Ÿฌ ๊ฐœ๋ฐœ์ž๋„๊ตฌ ์˜คํ”ˆํ•œ๋‹ค.

2. ์šฐ์ธก ์ƒ๋‹จ์˜ ์  ์„ธ๊ฐœ (Customize and control DevTools) ํด๋ฆญ > Settings ํด๋ฆญ

3. Preferences > Sources > Search in anonymous and content scripts ํด๋ฆญํ•˜๋ฉด ์„ธํŒ…์€ ๋

4. ๊ฒ€์ƒ‰ํ•˜๊ธฐ ์œ„ํ•ด์„œ๋Š” F12 ๊ฐœ๋ฐœ์ž๋„๊ตฌ๊ฐ€ ์ผœ์ง„ ์ƒํƒœ์—์„œ (์œˆ๋„์šฐ) Ctrl + Shift + F  (๋งฅ) Command + Option + F ๋ฅผ ๋ˆ„๋ฅธ๋‹ค. ๊ทธ๋Ÿฌ๋ฉด ํ•˜๋‹จ Console ํƒญ ์˜†์— "Search"๊ฐ€ ์ƒ๊ธฐ๊ณ  ๊ฒ€์ƒ‰ํ•  ์ˆ˜ ์žˆ๋Š” ์ธํ’‹ ๋ฐ•์Šค๊ฐ€ ๋‚˜ํƒ€๋‚œ๋‹ค.

5. ์—”ํ„ฐ๋ฅผ ๋ˆ„๋ฅด๋ฉด ์›ํ•˜๋Š” ๊ฒ€์ƒ‰์ด ๊ฐ€๋Šฅํ•ด์ง. ๊ตฟ.

๋ฐ˜์‘ํ˜•