CDN 2

[AWS] CloudFront(CDN)์ด๋ž€?

CloudFront๋ž€? CloudFront๋Š” AWS์—์„œ ์ œ๊ณตํ•˜๋Š” CDN ์„œ๋น„์Šค์ž…๋‹ˆ๋‹ค. ์บ์‹ฑ์„ ํ†ตํ•ด ์‚ฌ์šฉ์ž์—๊ฒŒ ์ข€ ๋” ๋น ๋ฅธ ์ „์†ก ์†๋„๋ฅผ ์ œ๊ณตํ•จ์„ ๋ชฉ์ ์œผ๋กœ ํ•ฉ๋‹ˆ๋‹ค. CloudFront๋Š” ์ „ ์„ธ๊ณ„ ์ด๊ณณ์ €๊ณณ์— Edge Server(Location)์„ ๋‘๊ณ  Client์— ๊ฐ€์žฅ ๊ฐ€๊นŒ์šด Edge Server๋ฅผ ์ฐพ์•„ Latency๋ฅผ ์ตœ์†Œํ™”์‹œ์ผœ ๋น ๋ฅธ ๋ฐ์ดํ„ฐ๋ฅผ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. Origin Server : ์›๋ณธ ๋ฐ์ดํ„ฐ๋ฅผ ๊ฐ€์ง€๊ณ  ์žˆ๋Š” ์„œ๋ฒ„์ž…๋‹ˆ๋‹ค. ๋ณดํ†ต AWS์—์„œ์˜ Origin Server๋Š” S3, EC2, Instance ์ž…๋‹ˆ๋‹ค. Edge Server = Edge Location : AWS์—์„œ ์‹ค์งˆ์ ์œผ๋กœ ์ œ๊ณตํ•˜๋Š” ์ „ ์„ธ๊ณ„์— ํผ์ ธ์žˆ๋Š” ์„œ๋ฒ„์ž…๋‹ˆ๋‹ค. Edge Server์—๋Š” ์š”์ฒญ ๋ฐ›์€ ๋ฐ์ดํ„ฐ์— ๋Œ€ํ•ด์„œ ๊ฐ™์€ ์š”์ฒญ์— ๋Œ€ํ•ด์„œ ๋น ๋ฅด๊ฒŒ ์‘๋‹ตํ•ด..

AWS 2023.08.02

[Vue.js] Vue.js ๊ธฐ๋ณธ - Vue Router, Axios

Router Vue Router๋Š” Vue ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์ด์šฉํ•˜์—ฌ ์‹ฑ๊ธ€ ํŽ˜์ด์ง€ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๊ตฌํ˜„ํ•  ๋•Œ ์‚ฌ์šฉํ•˜๋Š” ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์ž…๋‹ˆ๋‹ค. ํŽ˜์ด์ง€ ์ด๋™ ์‹œ ์‚ฌ์šฉํ•˜๋Š” ๊ธฐ๋Šฅ์œผ๋กœ, ํ”„๋กœ์ ํŠธ์— Vue Router๋ฅผ ์„ค์น˜ํ•˜๋Š” ๋ฐฉ๋ฒ•์€ CDN, NPM 2๊ฐ€์ง€ ๋ฐฉ์‹์ด ์žˆ์Šต๋‹ˆ๋‹ค. CDN ๋ฐฉ์‹ Axios Axios๋Š” Vue์—์„œ ๊ฐ€์žฅ ๋งŽ์ด ์‚ฌ์šฉํ•˜๋Š” Promise ๊ธฐ๋ฐ˜ HTTP ํ†ต์‹  ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์ž…๋‹ˆ๋‹ค. CDN๊ณผ NPM ์„ค์น˜ ๋ฐฉ์‹ ๋ชจ๋‘ ์ง€์›ํ•˜๋ฉฐ ์ƒ๋Œ€์ ์œผ๋กœ ๋‹ค๋ฅธ HTTP ํ†ต์‹  ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋“ค์— ๋น„ํ•ด ๋ฌธ์„œํ™”๊ฐ€ ์ž˜๋˜์–ด ์žˆ๊ณ  API๊ฐ€ ๋‹ค์–‘ํ•ฉ๋‹ˆ๋‹ค. script ์ฝ”๋“œ๋ฅผ ์ž…๋ ฅํ•˜๊ณ  ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์„ค์น˜ํ•ฉ๋‹ˆ๋‹ค. npm install axios axios์˜ ๊ธฐ๋ณธ๊ตฌ์กฐ๋Š” ์•„๋ž˜์™€ ๊ฐ™์Šต๋‹ˆ๋‹ค. methods: { fetchData: function() { axios.get(..

Framework/Vue.js 2022.07.25
๋ฐ˜์‘ํ˜•