๐Ÿ’ป ์›น,์ธํ„ฐ๋„ท์ด๋ž€?

Dayยท2022๋…„ 3์›” 29์ผ
0
post-thumbnail
post-custom-banner

WEB , INTERNET

Internet

์ „ ์„ธ๊ณ„ ์ปดํ“จํ„ฐ๊ฐ€ ์„œ๋กœ ์—ฐ๊ฒฐ๋˜์–ด์„œ ์ •๋ณด ๊ตํ™˜ํ•  ์ˆ˜ ์žˆ๋Š” ํ•˜๋‚˜์˜ ๊ฑฐ๋Œ€ํ•œ ์ปดํ“จํ„ฐ ํ†ต์‹ ๋ง

์ „์Ÿ์œผ๋กœ ํ†ต์‹  ๊ธฐ์ˆ ์ด ํ•„์š”ํ•˜๋‹ค๋Š” ๊ฑธ ์•Œ๊ฒŒ ๋˜๊ณ , ์ค‘์•™ ์ง‘์ค‘์ ์ธ ๋„คํŠธ์›Œํฌ ๋ฐฉ์‹์€, ๊ทธ๊ณณ์ด ํŒŒ๊ดด๋˜๋ฉด ํ†ต์‹  ๋‘์ ˆ ๋˜๋‹ˆ๊นŒ ์œ„ํ—˜ํ•˜๋‹ค๋Š” ๊ฑธ ๊นจ๋‹ฌ์Œ

ํ•ต ๊ณต๊ฒฉ์—๋„ ์ƒ์กดํ•  ์ˆ˜ ์žˆ๋Š” ์‹œ์Šคํ…œ์ด ํ•„์š”ํ•˜๋‹ค!

ํ†ต์‹ ๊ธฐ์ˆ ์€ ์ „ํ™”๊ธฐ์—์„œ ์ปดํ“จํ„ฐ๋กœ

๋””์ง€ํ„ธ ๋ฐ์ดํ„ฐ -> ์•„๋‚ ๋กœ๊ทธ ์‹ ํ˜ธ -> ๋””์ง€ํ„ธ ๋ฐ์ดํ„ฐ

์ปดํ“จํ„ฐ์—์„œ ์‚ฌ์šฉํ•˜๋Š” ๋””์ง€ํ„ธ ๋ฐ์ดํ„ฐ๋ฅผ ์ „ํ™”์„ ์ด ํ™œ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ์•„๋‚ ๋กœ๊ทธ ์‹ ํ˜ธ๋กœ ๋ฐ”๊ฟˆ์œผ๋กœ์จ ์ด๋ฏธ ๊ด‘๋ฒ”์œ„ํ•˜๊ฒŒ ์„ค์น˜๋˜์–ด ์žˆ๋Š” ์ „ํ™”์„ ์„ ํ†ตํ•ด ์ปดํ“จํ„ฐ ํ†ต์‹ ์„ ๊ฐ€๋Šฅํ•˜๊ฒŒ ํ•˜๋Š” ์žฅ์น˜

Web

์ธํ„ฐ๋„ท์— ์†ํ•ด์žˆ๋Š”,
์ธํ„ฐ๋„ท ๋„คํŠธ์›Œํฌ๋ฅผ ์ด์šฉํ•ด์„œ ํ†ต์‹ ๋˜๋Š” ์ •๋ณด์˜ ์ง‘ํ•ฉ

์ธํ„ฐ๋„ท์ด ๋“ฑ์žฅํ•˜๊ณ  30๋…„ ๋’ค์— ์›น์ด ๋“ฑ์žฅ (1990)

๋‚ด๊ฐ€ ๋งŒ๋“  ์›น ํŽ˜์ด์ง€๋ฅผ ์ธํ„ฐ๋„ท์„ ํ†ตํ•ด ๋ˆ„๊ตฌ๋‚˜ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ•˜๋Š” ๊ฒƒ์ด ๋ชฉํ‘œ์ด๋‹ค.

์ธํ„ฐ๋„ท์ด๋ผ๋Š” ๋„คํŠธ์›Œํฌ ์•ˆ์— ์›น์ด๋ผ๋Š” ์„œ๋น„์Šค๊ฐ€ ์žˆ๋Š” ๊ฒƒ.

์›น์ด ์ถœํ˜„ํ•˜๋ฉด์„œ ์ธํ„ฐ๋„ท ํ†ต์‹ ์ด ๋Œ€์ค‘์ ์œผ๋กœ ์‚ฌ์šฉ๋จ

์›น์˜ ์•„๋ฒ„์ง€ ํŒ€ ๋ฒ„๋„ˆ์Šค ๋ฆฌ ๊ฐ€ www ๋ผ๋Š” ํ”„๋กœ๊ทธ๋žจ ๊ฐœ๋ฐœ

์ดํ›„๋กœ,

์ •๋ณด ์œ ํ†ต

(์ข…์ด์‹ ๋ฌธ ๋ฐฐ๋‹ฌํ•˜๋‹ค๊ฐ€ ์ธํ„ฐ๋„ท ์‹ ๋ฌธ์„ ๋ณธ๋‹ค.)

์›น ๊ธฐ๋ฐ˜ SW ์„œ๋น„์Šค๋“ค์ด ๋งŽ์ด ๋งŒ๋“ค์–ด์ง€๊ณ , ์ž๊ธฐ๋„ค SW ํŒ๋งคํ•˜๋Š” ํšŒ์‚ฌ๋“ค์ด ๋งŽ์ด ๋‚˜์˜ด

์‹ค๋ฆฌ์ฝ˜ ๋ฐธ๋ฆฌ, Yahoo, Google, Amazon, etc (2000๋…„๋Œ€)

Web ์ง„ํ™”

์›น์€ client , server ๋กœ ๋‚˜๋ˆ„์–ด ๋ณผ ์ˆ˜ ์žˆ๋‹ค.

client ๋Š” ๊ณ ๊ฐ, ์‚ฌ์šฉ์ž, ์ •๋ณด๋ฅผ ์š”์ฒญํ•˜๋Š” ์ปดํ“จํ„ฐ

server ๋Š” ์ •๋ณด(์›น ์„œ๋น„์Šค)๋ฅผ ์ œ๊ณตํ•˜๋Š” ์‚ฌ๋žŒ(์ปดํ“จํ„ฐ)

1์„ธ๋Œ€ web

1์„ธ๋Œ€๋Š” ์„œ๋ฒ„์—์„œ ํด๋ผ์ด์–ธํŠธ๋กœ ์ผ๋ฐฉ์ ์œผ๋กœ html ํŽ˜์ด์ง€ ์ „์ฒด๋ฅผ ์คŒ

html, css ๋ฐ–์— ์—†์—ˆ๊ณ  ์ •์ ์ด๋‹ค.

๋‹จ์ˆœ ์ •๋ณด ์ œ๊ณต, user interaction ์ด๋Ÿฐ๊ฑฐ ์—†์Œ

2์„ธ๋Œ€ web

์–‘๋ฐฉํ–ฅ. javascript๊ฐ€ ์ถ”๊ฐ€๋˜์—ˆ๋‹ค.

๋™์ ์ธ ์›น

์„œ๋ฒ„๋ž‘ ํด๋ผ์ด์–ธํŠธ๊ฐ€ ์„œ๋กœ ์ƒํ˜ธ์ž‘์šฉํ•œ๋‹ค. (User interaction)

ํ”„๋ก ํŠธ, ๋ฐฑ์—”๋“œ ๊ตฌ๋ถ„์€ ์•„์ง ์—†์Œ

3์„ธ๋Œ€ web

spa๋ฐฉ์‹(Single Page Application)์˜ ๋“ฑ์žฅ ๋‹จ์ผ html ํŽ˜์ด์ง€๋กœ ์ „์ฒด ์›น์„œ๋น„์Šค ๊ตฌํ˜„

ํŽ˜์ด์Šค๋ถ์˜ html ํŒŒ์ผ์€ ์ด 1๊ฐœ๋‹ค.

html ํŒŒ์ผ ์•ˆ์— javascript ํŒŒ์ผ์ด ํฌํ•จ๋˜์–ด ์žˆ์Œ

java๊ฐ€ html์š”์†Œ ์ƒ์„ฑ, ๋ชจ๋“  ํŽ˜์ด์ง€๋ž‘ ๊ธฐ๋Šฅ์„ ๋™์ ์œผ๋กœ ์ฒ˜๋ฆฌํ•œ๋‹ค.

์›น ํŽ˜์ด์ง€ ๋ Œ๋”๋ง์— ํ•„์š”ํ•œ Javascript ์ฝ”๋“œ๋Š” ์ตœ์ดˆ์˜ ํ†ต์‹ ์—์„œ ํ•œ๋ฒˆ์— ์†ก์ˆ˜์‹ 

๊ทธ ์ดํ›„๋กœ๋Š” ์„œ๋ฒ„์™€ ์‹ค์‹œ๊ฐ„์œผ๋กœ ๋ฐ์ดํ„ฐ๋ฅผ ์ฃผ๊ณ  ๋ฐ›์œผ๋ฉฐ ํ•„์š”ํ•œ ํ™”๋ฉด์„ ๋™์ ์œผ๋กœ ๊ตฌ์„ฑํ•œ๋‹ค.

ํ”„๋ก ๋“œ์—”๋“œ, ๋ฐฑ์—”๋“œ ๊ฐœ๋ฐœ ๋ถ„๋ฆฌ

์„œ๋ฒ„ ๋ถ„๋ฆฌ, ์—…๋ฌด ๋ถ„๋ฆฌ

Modern Web Architecture


ํด๋ผ์ด์–ธํŠธ ์ข…๋ฅ˜๊ฐ€ ๋‹ค์–‘ํ•ด์ง (๋ชจ๋ฐ”์ผ)

๋ฐฑ์—”๋“œ ์„œ๋ฒ„ api๊ฐœ์ˆ˜๊ฐ€ ๋งŽ์•„์ ธ์„œ ์ด๊ฑธ ๊ด€๋ฆฌํ•˜๋Š” api gateway๋ผ๋Š”๊ฒŒ ์ƒ๊น€(๋ฐ์ดํ„ฐ ์š”์ฒญ ๋ถ„์‚ฐ ์ฒ˜๋ฆฌ๋ฅผ ์œ„ํ•œ ๊ฒƒ)

์ ์  ๋” ๋งŽ์€ ์œ ์ €, ๋ฐ์ดํ„ฐ๋ฅผ ํšจ์œจ์ ์œผ๋กœ.

๋™์‹œ์ ‘์†์ž. ๋ฐ์ดํ„ฐ์–‘์ด ๋ฌธ์ œ์˜€๋‹ค.

๋ฐ๋ธŒ์˜ต์Šค ์ธํ”„๋ผ ์‹œ์Šคํ…œ ๊ด€๋ฆฌํ•˜๋Š” ์‚ฌ๋žŒ

์‹œ์Šค์˜ต์Šค๋Š” ํฐ ์‹ค์ œ ์„œ๋ฒ„์‹ค ๊ด€๋ฆฌํ•˜๋Š” ์‚ฌ๋žŒ? ์š”์ƒˆ๋Š” ๊ฑฐ์˜ ์—†๋‹ค.

ํผ๋ธ”๋ฆฌ์…” ๋Š” ํ•œ๊ตญ์—๋งŒ ์กด์žฌํ–ˆ์—ˆ๋‹ค. jquery ๊ฐ™์€ ๊ฑธ๋กœ ๋””์ž์ด๋„ˆ๊ฐ€ ๊ฐœ๋ฐœ๋„ ํ•˜๊ฒŒ ๋” ํ•ด์„œ ๋‚˜์˜จ๊ฒŒ ์•„๋‹๊นŒ.

api๋งŒ๋“œ๋Š” ์ž‘์—…์„ ํ•˜๋Š”๊ฒŒ ์ฃผ๋‹ˆ์–ด ๊ฐœ๋ฐœ์ž

db๋ฅผ ๋งŒ๋“œ๋Š” ๊ฑด ์Šคํƒ€ํŠธ์—…์—์„œ ๊ฐ€๋Šฅ. ํฐ ํšŒ์‚ฌ๋“ค์€ ํ•จ๋ถ€๋กœ ๋ชป๊ฑด๋“œ๋ฆฌ๊ฒŒ ํ•œ๋‹ค.

post-custom-banner

0๊ฐœ์˜ ๋Œ“๊ธ€