๐Ÿ“ŒLanguage/JavaScript

[Deep Dive] ajax

hellohailie 2022. 12. 20. 23:11

โœ”๏ธ ์ด๋ฒˆ ์ •๋…์„ ํ†ตํ•ด ์•Œ๊ฒŒ ๋œ ๊ฒƒ
Ajax๋ž€ ๋ฌด์—‡์ธ๊ฐ€์š”?

 

<๋‹ต ๋ฏธ๋ฆฌ๋ณด๊ธฐ>

๐Ÿค” Ajax๋ž€ ๋ฌด์—‡์ธ๊ฐ€์š”?

๐Ÿค“ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋ฅผ ์‚ฌ์šฉํ•ด์„œ ๋ธŒ๋ผ์šฐ์ €๊ฐ€ ์„œ๋ฒ„์—๊ฒŒ ๋น„๋™๊ธฐ ๋ฐฉ์‹์œผ๋กœ ๋ฐ์ดํ„ฐ๋ฅผ ์š”์ฒญํ•˜๊ณ , ์„œ๋ฒ„๊ฐ€ ์‘๋‹ตํ•œ ๋ฐ์ดํ„ฐ๋ฅผ ์ˆ˜์‹ ํ•˜์—ฌ ์›นํŽ˜์ด์ง€๋ฅผ ๋™์ ์œผ๋กœ ๊ฐฑ์‹ ํ•˜๋Š” ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๋ฐฉ์‹์„ ๋งํ•ฉ๋‹ˆ๋‹ค. 

 


โœ”๏ธ Ajax

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋ฅผ ์‚ฌ์šฉํ•ด์„œ ๋ธŒ๋ผ์šฐ์ €๊ฐ€ ์„œ๋ฒ„์—๊ฒŒ ๋น„๋™๊ธฐ ๋ฐฉ์‹์œผ๋กœ ๋ฐ์ดํ„ฐ๋ฅผ ์š”์ฒญํ•˜๊ณ , ์„œ๋ฒ„๊ฐ€ ์‘๋‹ตํ•œ ๋ฐ์ดํ„ฐ๋ฅผ ์ˆ˜์‹ ํ•˜์—ฌ ์›นํŽ˜์ด์ง€๋ฅผ ๋™์ ์œผ๋กœ ๊ฐฑ์‹ ํ•˜๋Š” ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๋ฐฉ์‹์„ ๋งํ•œ๋‹ค.

 

Ajax๋Š” ๋ธŒ๋ผ์šฐ์ €์—์„œ ์ œ๊ณตํ•˜๋Š” Web API์ธ XMLHttpRequest ๊ฐ์ฒด๋ฅผ ๊ธฐ๋ฐ˜์œผ๋กœ ๋™์ž‘ํ•œ๋‹ค. XMLHttpRequest๋Š” HTTP ๋น„๋™๊ธฐ ํ†ต์‹ ์„ ์œ„ํ•œ ๋ฉ”์„œ๋“œ์™€ ํ”„๋กœํผํ‹ฐ๋ฅผ ์ œ๊ณตํ•œ๋‹ค. (์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋ฅผ ์‚ฌ์šฉํ•ด์„œ HTTP ์š”์ฒญ์„ ์ „์†กํ•˜๋ ค๋ฉด XMLHttpRequest ๊ฐ์ฒด๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค. )

 

โ˜…Ajax๋กœ ์ธํ•ด ๋ธŒ๋ผ์šฐ์ €์—์„œ๋„ ๋ฐ์Šคํฌํ†ฑ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜๊ณผ ์œ ์‚ฌํ•œ ๋น ๋ฅธ ํผํฌ๋จผ์Šค์™€ ๋ถ€๋“œ๋Ÿฌ์šด ํ™”๋ฉด ์ „ํ™˜์ด ๊ฐ€๋Šฅํ•ด์กŒ๋‹ค. 

→ ์„œ๋ฒ„๋กœ๋ถ€ํ„ฐ ์›นํŽ˜์ด์ง€์˜ ๋ณ€๊ฒฝ์— ํ•„์š”ํ•œ ๋ฐ์ดํ„ฐ๋งŒ ๋น„๋™๊ธฐ ๋ฐฉ์‹์œผ๋กœ ์ „์†ก๋ฐ›์•„ ์›นํŽ˜์ด์ง€๋ฅผ ๋ณ€๊ฒฝํ•  ํ•„์š”๊ฐ€ ์—†๋Š” ๋ถ€๋ถ„์€๋‹ค์‹œ ๋ Œ๋”๋งํ•˜์ง€ ์•Š๊ณ , ๋ณ€๊ฒฝํ•  ํ•„์š”๊ฐ€ ์žˆ๋Š” ๋ถ€๋ถ„๋งŒ ํ•œ์ •์ ์œผ๋กœ ๋ Œ๋”๋งํ•˜๋Š” ๋ฐฉ์‹์ด ๊ฐ€๋Šฅํ•ด์กŒ๋‹ค. 

 


โœ”๏ธ Ajax์˜ ์žฅ์ 

1. ๋ณ€๊ฒฝํ•  ๋ถ€๋ถ„์„ ๊ฐฑ์‹ ํ•˜๋Š” ๋ฐ ํ•„์š”ํ•œ ๋ฐ์ดํ„ฐ๋งŒ ์„œ๋ฒ„๋กœ๋ถ€ํ„ฐ ์ „์†ก๋ฐ›๊ธฐ ๋•Œ๋ฌธ์— ๋ถˆํ•„์š”ํ•œ ๋ฐ์ดํ„ฐ ํ†ต์‹ ์ด ๋ฐœ์ƒํ•˜์ง€ ์•Š๋Š”๋‹ค. 

2. ๋ณ€๊ฒฝํ•  ํ•„์š”๊ฐ€ ์—†๋Š” ๋ถ€๋ถ„์€ ๋‹ค์‹œ ๋ Œ๋”๋งํ•˜์ง€ ์•Š๋Š”๋‹ค. ๋”ฐ๋ผ์„œ ํ™”๋ฉด์ด ์ˆœ๊ฐ„์ ์œผ๋กœ ๊นœ๋ฐ•์ด๋Š” ํ˜„์ƒ์ด ๋ฐœ์ƒํ•˜์ง€ ์•Š๋Š”๋‹ค. 

3. ํด๋ผ์ด์–ธํŠธ์™€ ์„œ๋ฒ„์™€์˜ ํ†ต์‹ ์ด ๋น„๋™๊ธฐ ๋ฐฉ์‹์œผ๋กœ ๋™์ž‘ํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์„œ๋ฒ„์—๊ฒŒ ์š”์ฒญ์„ ๋ณด๋‚ธ ์ดํ›„ ๋ธ”๋กœํ‚น์ด ๋ฐœ์ƒํ•˜์ง€ ์•Š๋Š”๋‹ค. 

 

 

 

๐Ÿ‘ฉ‍๐Ÿ’ป ๋ชจ๋˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ Deep Dive๋ฅผ ์ •๋…ํ•˜๊ณ  ์ œ๊ฐ€ ์ดํ•ดํ•œ ๋‚ด์šฉ์„ ์ •๋ฆฌํ•œ ๊ธ€์ž…๋‹ˆ๋‹ค ๐Ÿ‘ฉ‍๐Ÿ’ป