๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
๐Ÿ’ป Programming ๊ฐœ๋ฐœ/๐ŸŽธ ๊ธฐํƒ€

๊ตฌ๊ธ€๋“œ๋ผ์ด๋ธŒ ์ด๋ฏธ์ง€๋ฅผ CDN(์›น๋งํฌ)์œผ๋กœ ํ™œ์šฉํ•˜๋Š” ๋ฐฉ๋ฒ• - 2024 ์ตœ์‹ ! ๋ง‰ํžˆ์ง€ ์•Š์•˜์–ด์š”

by kimdee 2024. 9. 12.
๋ฐ˜์‘ํ˜•

 

 

 

์ฐพ์•„๋ณด๋‹ˆ ๊ธฐ์กด์— ๊ณต๊ฐœ๋œ ๋ฐฉ๋ฒ•๋“ค์ด ๋‹ค ๋ง‰ํ˜”๋”๋ผ๊ณ ์š”. 

๊ตฌ๊ธ€์—์„œ ์•ˆ ๋ง‰ํžŒ ์ตœ์‹  ๋ฐฉ๋ฒ• ์ฐพ์•„์„œ ๊ฐ€์ง€๊ณ  ์™”์Šต๋‹ˆ๋‹ค. 

 

(*์ฃผ์˜: ๊ทผ๋ฐ ์•ฝ๊ฐ„ ๋ณต์žกํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.) 

 

 

๊ตฌ๊ธ€๋“œ๋ผ์ด๋ธŒ ์ด๋ฏธ์ง€๋ฅผ CDN(์›น๋งํฌ) ํ™œ์šฉ ๋ฐฉ๋ฒ• 

 

1. ์ผ๋‹จ ๊ตฌ๊ธ€ ๋“œ๋ผ์ด๋ธŒ์— ์ด๋ฏธ์ง€๋ฅผ ์˜ฌ๋ ค์ค๋‹ˆ๋‹ค. ์ €๋Š” ๋‚˜์‚ฌ ํ—ˆ๋ธ” ๋ง์›๊ฒฝ ์ด๋ฏธ์ง€๋ฅผ ์ด๋ ‡๊ฒŒ ์˜ฌ๋ ธ์Šต๋‹ˆ๋‹ค. 

 

 

 

2. ์ค‘์š”!! ๋ฐ˜๋“œ์‹œ ๋งˆ์šฐ์Šค ์˜ค๋ฅธ์ชฝ > ๊ณต์œ  ๋ˆŒ๋Ÿฌ์„œ ๋งํฌ๊ฐ€ ์žˆ๋Š” ๋ชจ๋“  ์‚ฌ์šฉ์ž์— ๋ทฐ์–ด ๊ถŒํ•œ์œผ๋กœ ์„ค์ •ํ•ด์ค๋‹ˆ๋‹ค. ์ด๊ฑธ ์„ค์ •ํ•ด์ฃผ์ง€ ์•Š์œผ๋ฉด ๋งํฌ๊ฐ€ ์žˆ์–ด๋„ ์™ธ๋ถ€์—์„œ ๋ณผ ์ˆ˜ ์—†์–ด์š”! 

 

3. ๊ทธ ๋‹ค์Œ ๊ฐ€์ ธ์˜จ ์ด๋ฏธ์ง€๋ฅผ ๋”๋ธ”ํด๋ฆญํ•˜๋ฉด ์ด๋ ‡๊ฒŒ ๋ฏธ๋ฆฌ๋ณด๊ธฐ ํ™”๋ฉด์ด ๋œฐ๊ฑฐ์—์š”. 

 

 

 

 

4. ํฌ๋กฌ์—์„œ ๊ฐœ๋ฐœ์ž ๋ชจ๋“œ Developer Tools / ์‚ฌํŒŒ๋ฆฌ์—์„œ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์ฝ˜์†” Show Javascript Console ์ด๋ผ๊ณ  ํ•˜์ฃ ? ๊ฐ™์€ ๋ชจ๋“œ์— ์žˆ๋Š” ๊ธฐ๋Šฅ์ด๊ธด ํ•œ๋ฐ์š”. ๋ฐ”๋กœ ์‚ฌ์šฉํ•˜๊ธฐ ์ข‹๊ฒŒ, ํฌ๋กฌ์€ Inspect Elements , ์‚ฌํŒŒ๋ฆฌ๋Š” Web Inspector๋ฅผ ์—ด์–ด์ค๋‹ˆ๋‹ค. ๋‹จ์ถ•ํ‚ค๋Š” ๋งฅ: Alt+Cmd+C / ์œˆ๋„์šฐ: Alt+Ctrl+C ์ž…๋‹ˆ๋‹ค.  

 

 

 

5. ์ด์ œ ํ™”๋ฉด์— ์žˆ๋Š” ์ด๋ฏธ์ง€๋ฅผ ์„ ํƒํ•ด์ฃผ๋ฉด ์˜ค๋ฅธ์ชฝ ์ฝ˜์†”์˜ Elements ํƒœ๋ฒต์„œ <img src="์šฐ๋ฆฌ๊ฐ€ ์›ํ•˜๋Š” ์ด๋ฏธ์ง€ ์ฃผ์†Œ"> ํ˜•ํƒœ๋กœ ํŒŒ๋ž—๊ฒŒ ํ•˜์ด๋ผ์ดํŠธ ๋˜๋Š” ๊ฒƒ์„ ๋ณผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. 

 

๋งŒ์•ฝ ํด๋ฆญํ–ˆ๋Š”๋ฐ๋„ ํŒŒ๋ž€์ƒ‰ ์˜์—ญ์ด ์ œ๋Œ€๋กœ ์•ˆ ์žกํžŒ๋‹ค๋ฉด ์•„๋ž˜ ๋ฒ„ํŠผ์„ ๋ˆŒ๋Ÿฌ์ฃผ์„ธ์š”. 

์œˆ๋„์šฐ์˜ ๊ฒฝ์šฐ (๋„ค๋ชจ ์ ์„ ์— ํ™”์‚ดํ‘œ๊ฐ€ ์•„๋ž˜์— ์žˆ๋Š” ์•„์ด์ฝ˜ ํด๋ฆญ!)

 

 

๋งฅ์˜ ๊ฒฝ์šฐ (๋™๊ทธ๋ผ๋ฏธ์— ์‹ญ์ž๋ชจ์–‘ ์žˆ๋Š” ์•„์ด์ฝ˜ ํด๋ฆญ)

 

6. ํ•ด๋‹น ๋งํฌ๋ฅผ ๋”๋ธ” ํด๋ฆญํ•˜๊ณ  ๋งˆ์šฐ์Šค ์˜ค๋ฅธ์ชฝ ๋ˆŒ๋Ÿฌ์„œ Copy Link๋กœ ๋ณต์‚ฌํ•ด์ค๋‹ˆ๋‹ค. 

 

์œˆ๋„์šฐ์˜ ๊ฒฝ์šฐ
๋งฅ์˜ ๊ฒฝ์šฐ

 

 

8. ํ•ด๋‹น ๋งํฌ๋ฅผ ๋‹ค์‹œ ์›น๋ธŒ๋ผ์šฐ์ €๋กœ ์—ด๊ฒŒ ๋˜๋ฉด ๋ฆฌ๋‹ค์ด๋ ‰ํŠธ ๋˜๋Š” ๊ฒƒ์„ ๋ณผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. 

 

9. ํ•ด๋‹น ์ด๋ฏธ์ง€์— ๋งˆ์šฐ์Šค ์˜ค๋ฅธ์ชฝ ๋ฒ„ํŠผ์„ ๋ˆŒ๋Ÿฌ [Copy Image Address]๋ฅผ ๋ˆ„๋ฅด๋ฉด ๋ฉ๋‹ˆ๋‹ค. ์ด์ œ ์ด ๋งํฌ๊ฐ€ ์ €ํฌ๊ฐ€ ์‚ฌ์šฉํ•˜๊ฒŒ ๋  ๋งํฌ์ž…๋‹ˆ๋‹ค. ์ด ๋งํฌ๋ฅผ ๊ฐ€์ง€๊ณ  ์ด๋ฏธ์ง€๋ฅผ ๋ถˆ๋Ÿฌ์˜ค๋ฉด ๋ฉ๋‹ˆ๋‹ค.

 

 

์ด์ œ ์ด ๋งํฌ๋ฅผ <img> ํƒœ๊ทธ๋ฅผ ์ด์šฉํ•ด ๋ถˆ๋Ÿฌ์˜จ ๋ชจ์Šต์ž…๋‹ˆ๋‹ค. ์ž˜ ๋˜๋Š” ๊ฒƒ์„ ํ™•์ธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. 

 


 

๋งˆ์น˜๋ฉฐ

์ œ๊ฐ€ ์š”์ƒˆ ๊ฐ‘์ž๊ธฐ ํ”„๋ก ํŠธ์—”๋“œ๋กœ ํŒ€์ด ๋ฐ”๋€Œ๋ฉด์„œ ๊ณต๋ถ€ํ•˜๋‹ค๋ณด๋‹ˆ ๊ธ‰ํ•˜๊ฒŒ ์ด๋ฏธ์ง€ ์›น๋งํฌ๊ฐ€ ํ•„์š”ํ•  ๋•Œ๊ฐ€ ์žˆ์–ด์„œ ์ง์ ‘ ์ฐพ์•„ ์ •๋ฆฌํ•ด๋ณด์•˜์Šต๋‹ˆ๋‹ค. 

ํ˜น์‹œ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋„ ๊ถ๊ธˆํ•˜์‹œ๋ฉด ์•„๋ž˜ ๋งํฌ ๋ด์ฃผ์„ธ์š”! 

 

2024.07.11 - [๐Ÿ’ป Programming ๊ฐœ๋ฐœ/๐ŸŒŠ Javascript, Typescript] - [์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ] ๊ธฐ์ดˆ๋ฌธ๋ฒ• ๊ณต๋ถ€๋…ธํŠธ - ์ธํ”„๋Ÿฐ Amazing Javascript ํ›„๊ธฐ ๋ฐ ์ถ”์ฒœ!

 

[์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ] ๊ธฐ์ดˆ๋ฌธ๋ฒ• ๊ณต๋ถ€๋…ธํŠธ - ์ธํ”„๋Ÿฐ Amazing Javascript ํ›„๊ธฐ ๋ฐ ์ถ”์ฒœ!

์‹œ์ž‘ํ•˜๋ฉฐ์ด๋ฒˆ์— ์บกํ‹ดํŒ๊ต๋‹˜์˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋ฌด๋ฃŒ๊ฐ•์˜๊ฐ€ ์ƒˆ๋กœ ์˜คํ”ˆ๋๋‹ค.์‚ฌ์‹ค ์บกํ‹ดํŒ๊ต๋‹˜ ๊ฐ•์˜ ์˜คํ”ˆ ์†Œ์‹์€, ๊ฐœ์ธ์ ์œผ๋กœ ์ข‹์•„ํ•˜๊ณ  ์กด๊ฒฝํ•˜๋Š” ๊ฐœ๋ฐœ์ž ์œ ๋ฅด๋งˆ๋ฌด๋‹˜์„ ํ†ตํ•ด ์•Œ๊ฒŒ๋˜์—ˆ๋Š”๋ฐ ์ดํ›„ ๊ฐœ์ธ

kimdee.tistory.com

 

 

์˜ค๋Š˜๋„ ์ฝ์–ด์ฃผ์…”์„œ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค. 

 

๊ถ๊ธˆํ•˜๊ฑฐ๋‚˜ ๋‚˜๋ˆ„๊ณ  ์‹ถ์€ ์–˜๊ธฐ๊ฐ€ ์žˆ์œผ์‹œ๋ฉด ๋Œ“๊ธ€๋กœ ์•Œ๋ ค์ฃผ์„ธ์š”!

์žฌ๋ฐŒ๊ฒŒ ์ฝ์œผ์…จ๋‹ค๋ฉด ๊ณต๊ฐ๊ณผ ๊ตฌ๋…์€ ํฐ ํž˜์ด ๋ฉ๋‹ˆ๋‹ค. 

 

ํ•ญ์ƒ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค.

 

๋ฐ˜์‘ํ˜•

๋Œ“๊ธ€