๐ŸŒ ์›น ์‚ฌ์ดํŠธ Website์™€ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(=์›น ์•ฑ) Web application์˜ ์ฐจ์ด์ 

Hayoungยท2021๋…„ 5์›” 3์ผ
6

Web

๋ชฉ๋ก ๋ณด๊ธฐ
1/2

์–ธ์ œ๋ถ€ํ„ด๊ฐ€ ์›น ์‚ฌ์ดํŠธ(Website)์™€ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์ด๋ผ๋Š” ์šฉ์–ด๋ฅผ
๊ตฌ๋ถ„์—†์ด ๋‚จ์šฉ(?)ํ•˜๊ฒŒ ๋œ ๊ฒƒ ๊ฐ™์•„์„œ,
์›น ์‚ฌ์ดํŠธ(Website)์™€ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์˜ ์ฐจ์ด์ ์— ๋Œ€ํ•ด ์กฐ์‚ฌํ•ด๋ณด์•˜๋‹ค.

๊ฒฐ๋ก ๐Ÿ’โ€โ™€๏ธ

๋ถ€ํ„ฐ ๋งํ•˜์ž๋ฉด,
๏ผˆ์Šคํฌ์ผ๋Ÿฌ๏ผ‰

ํ˜„์žฌ์— ๋“ค์–ด์„œ๋Š” ์›น ์‚ฌ์ดํŠธ(Website)์™€ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์˜ ๊ฒฝ๊ณ„๊ฐ€ ๋ชจํ˜ธํ•ด์กŒ๊ธฐ ๋•Œ๋ฌธ์—

๐Ÿ‘ฉโ€๐Ÿ’ป: ์ด๊ฑด ์›น ์‚ฌ์ดํŠธ(Website)์ž„.
๐Ÿง‘โ€๐Ÿ’ป: ใ„ดใ„ด ์ด๊ฑด ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์ž„.

์ด๋ผ๊ณ  ์ •์˜๋ฅผ ์ด๋ถ„ํ™” ์ง“๊ณ  ํŒ๋‹จํ•˜๋Š” ๊ฒƒ์ด ์–ด๋ ต๋‹ค๊ณ  ํ•œ๋‹ค.

๊ทธ๋ ‡๊ธฐ ๋•Œ๋ฌธ์— ์›น ์‚ฌ์ดํŠธ(Website)์™€ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์ด
๊ฐ๊ฐ ์–ด๋–ค ๊ฒƒ์„ ๋œปํ•˜๋Š”์ง€ ์ปจ์…‰๊ณผ ๊ฐœ๋…๋งŒ ์ธ์ง€ํ•˜๊ณ  ์žˆ์œผ๋ฉด ๋  ๋“ฏ ํ•˜๋‹ค.


์›น ์‚ฌ์ดํŠธ Website?

์›น ์‚ฌ์ดํŠธ Website๋ฅผ ์นญํ•˜๋Š” ๋‹ค์–‘ํ•œ ๋ช…์นญ๋“ค

  • ์›น ์‚ฌ์ดํŠธ Website
  • ์›น ํŽ˜์ด์ง€ Webpage
  • ์›น Web
  • ์‚ฌ์ดํŠธ site
  • ํŽ˜์ด์ง€ page
  • etc...

์ด ๊ธ€์—์„œ๋Š” ์›น ์‚ฌ์ดํŠธ(Website)๋ผ๋Š” ๋ช…์นญ์œผ๋กœ ํ†ต์ผํ•ด์„œ ์‚ฌ์šฉํ•˜๋„๋ก ํ•˜๊ฒ ๋‹ค.

์›น ์‚ฌ์ดํŠธ(Website)๋ž€?

์›น ์‚ฌ์ดํŠธ(Website)๋Š”, ์ •๋ณด ๊ด€๋žŒ์„ ๋ชฉ์ ์œผ๋กœ ํ•œ ์ •๋ณด๋ฅผ ์ œ๊ณตํ•˜๋Š” ์ •์ (้™็š„)์ธ "์‚ฌ์ดํŠธ"์ด๋‹ค.

๊ฐ€์žฅ ์ „ํ˜•์ ์ธ ์›น ์‚ฌ์ดํŠธ(Website)์˜ ์˜ˆ์‹œ๋Š” ๋ฐ”๋กœ ์œ„ํ‚คํ”ผ๋””์•„์ด๋‹ค.
์œ„ํ‚คํ”ผ๋””์•„๋Š” ์œ ์ €์—๊ฒŒ ์˜ค๋กœ์ง€ ์ •๋ณด๋ฅผ ์ œ๊ณตํ•˜๊ธฐ ์œ„ํ•ด์„œ ์กด์žฌํ•œ๋‹ค.

์ฆ‰, ์›น ์‚ฌ์ดํŠธ(Website)๋Š” ์‚ฌ์ดํŠธ ๋‚ด์˜ ์ปจํ…์ธ ๋ฅผ ์œ ์ €๊ฐ€ ๊ทธ์ € "์ˆ˜๋™์ "์œผ๋กœ "๊ด€๋žŒ"ํ•˜๋Š” ๊ณณ์ด๋‹ค.

๋˜๋‹ค๋ฅธ ์˜ˆ์‹œ๋กœ๋Š”
CNN, BBC News, NHK NEWS WEB ๋“ฑ๊ณผ ๊ฐ™์€ ์ธํ„ฐ๋„ท ๋‰ด์Šค ํŽ˜์ด์ง€๋‚˜,
์šฐ๋ฆฌ ๊ฐœ๋ฐœ์ž๋“ค์ด ์• ์šฉํ•˜๋Š” React ๊ณต์‹ ๋ฌธ์„œ์™€ ๊ฐ™์€ ๊ฐ์ข… ๊ณต์‹ ๋ฌธ์„œ ํŽ˜์ด์ง€๊ฐ€ ์žˆ๋‹ค.

์›น ์‚ฌ์ดํŠธ(Website)๋ฅผ ๋ฐฉ๋ฌธํ•œ ์œ ์ €๊ฐ€ ์›น ์‚ฌ์ดํŠธ(Website) ์ƒ์—์„œ ํ–‰ํ•  ์ˆ˜ ์žˆ๋Š” ํ–‰๋™์€
๊ธฐ๋ณธ์ ์œผ๋กœ "๊ด€๋žŒ" ๋ฟ์ด๋‹ค.


์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ Web application?

์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ Web application์„ ์นญํ•˜๋Š” ๋‹ค์–‘ํ•œ ๋ช…์นญ๋“ค

  • ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ Web application
  • ์›น ์–ดํ”Œ๋ฆฌ์ผ€์ด์…˜ Web application
  • ์›น ์•ฑ Web app
  • ์›น ์„œ๋น„์Šค Web service
  • etc...

์ด ๊ธ€์—์„œ๋Š” ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)๋ผ๋Š” ๋ช…์นญ์œผ๋กœ ํ†ต์ผํ•ด์„œ ์‚ฌ์šฉํ•˜๋„๋ก ํ•˜๊ฒ ๋‹ค.

์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)๋ž€?

์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์€ ๋™์ ์ธ ๊ธฐ๋Šฅ์„ ๊ฐ€์ง„ ์›น์œผ๋กœ,
์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)๊ณผ ์œ ์ €์˜ ์ƒํ˜ธ์ž‘์šฉ=์†Œํ†ต์„ ๊ฐ€๋Šฅํ•˜๊ฒŒ ํ•จ์œผ๋กœ์จ,
์œ ์ €๊ฐ€ "๋Šฅ๋™์ "์œผ๋กœ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ์ƒ์˜ ์„œ๋น„์Šค๋ฅผ ์ด์šฉํ•˜๋Š” ๊ฒƒ์„ ๋ชฉ์ ์œผ๋กœ ํ•œ๋‹ค.

์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์˜ ๋Œ€ํ‘œ์ ์ธ ์˜ˆ์‹œ๋Š”,
Google maps, ๋„ค์ด๋ฒ„ ์ง€๋„, ์นด์นด์˜ค๋งต๊ณผ ๊ฐ™์€ ์ง€๋„ ์„œ๋น„์Šค์ด๋‹ค.

์šฐ๋ฆฌ๋Š” ๋ชฉ์ ์ง€๊นŒ์ง€์˜ ๊ธธ์ด๋‚˜ ๊ตํ†ต์ˆ˜๋‹จ์„ ์ฐพ๊ธฐ ์œ„ํ•ด
๋„ค์ด๋ฒ„ ์ง€๋„์™€ ๊ฐ™์€ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์„ ์ด์šฉํ•œ๋‹ค.

๋„ค์ด๋ฒ„ ์ง€๋„๋ฅผ ์ด์šฉํ•  ๋•Œ ๊ทธ์ € ๋„ค์ด๋ฒ„ ์ง€๋„ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์„ ์ผœ๋†“๊ณ 
๋ฉ๋•Œ๋ฆฌ๋ฉด์„œ ์ง€๋„๋งŒ ๋ณด๊ณ  ์žˆ๋Š” ์‚ฌ๋žŒ์€ ์—†์ง€ ์•Š์€๊ฐ€๐Ÿ˜‚
(์ง€๋„ ๋ณด๊ธฐ ์ข‹์•„ํ•˜๋Š” ์‚ฌ๋žŒ์€ ๊ทธ๋Ÿด ์ˆ˜๋„ ์žˆ๊ฒ ์ง€๋งŒ๐Ÿคญ)

  • ๋ชฉ์ ์ง€๊นŒ์ง€ ์–ด๋–ป๊ฒŒ ๊ฐ€๋Š”์ง€.
  • ์‹œ๊ฐ„์ด ์–ผ๋งˆ๋‚˜ ์†Œ์š”๋˜๋Š”์ง€.
  • ์–ด๋””์— ์œ„์น˜ํ•˜๊ณ  ์žˆ๋Š”์ง€.
  • ์ฃผ๋ณ€์— ๊ดœ์ฐฎ์€ ๋ง›์ง‘์ด ์žˆ๋Š”์ง€.
  • ์˜์—…์‹œ๊ฐ„์€ ์–ธ์ œ๋ถ€ํ„ฐ ์–ธ์ œ๊นŒ์ง€์ธ์ง€.
  • ์˜ˆ์•ฝ์ด ๊ฐ€๋Šฅํ•œ์ง€.
  • ์ถœ๋ฐœ์ง€๊ฐ€ ์–ด๋”˜์ง€. ๋“ฑ๋“ฑ๋“ฑ

์—ฌ๋Ÿฌ ๊ฐ€์ง€ ์ •๋ณด๋ฅผ ๊ฒ€์ƒ‰ํ•ด๋ณด๊ฑฐ๋‚˜, ์ง€๋„๋ฅผ ํ™•๋Œ€ํ•ด๋ณด๊ณ  ์ถ•์†Œํ•ด๋ณด๋Š” ๋“ฑ
์ง€๋„ ์ •๋ณด๋ฅผ ๊ด€๋žŒํ•  ๋ฟ ์•„๋‹ˆ๋ผ,

์œ ์ €๊ฐ€ ์ง€๋„ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application) ๋‚ด์—์„œ
๊ทธ ์žฅ์†Œ์— ๋Œ€ํ•œ ๋ฆฌ๋ทฐ๋ฅผ ์ง์ ‘ ์ž‘์„ฑํ•˜๋Š” ๊ฒƒ๋„ ๊ฐ€๋Šฅํ•˜๋‹ค.

๋˜ํ•œ ๋ฆฌ๋ทฐ์— ๋Œ€ํ•ด ๋Œ“๊ธ€์„ ์ž‘์„ฑํ•˜๊ฑฐ๋‚˜,
์ข‹์•„์š”๐Ÿ‘๋‚˜ ๋ณ„๋กœ์—์š”๐Ÿ‘Ž ๋ฒ„ํŠผ์„ ํ†ตํ•ด ๊ทธ ๋ฆฌ๋ทฐ์— ๋Œ€ํ•œ ๊ฐ์ƒ์„ ํ‘œํ˜„ํ•˜๋Š” ๋“ฑ
์œ ์ €๊ฐ€ ์ ๊ทน์ ์œผ๋กœ ์„œ๋น„์Šค์— ์ฐธ๊ฐ€ํ•˜๋Š” ๊ฒƒ์ด ๊ฐ€๋Šฅํ•˜๋‹ค.

์ด๋ ‡๊ฒŒ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์€
์œ ์ € ๋ณธ์ธ์œผ๋กœ๋ถ€ํ„ฐ ๋‹ค์–‘ํ•œ ์ •๋ณด์™€ ์ˆ˜๋‹จ์„ ์กฐ์‚ฌํ•˜๊ณ  ๋Šฅ๋™์ ์œผ๋กœ ์ด์šฉํ• ์ˆ˜ ์žˆ๊ฒŒ ํ•˜๋Š” ๊ฒƒ ๋ฟ๋งŒ ์•„๋‹ˆ๋ผ,
์œ ์ €๋กœ๋ถ€ํ„ฐ ์ •๋ณด๋ฅผ ์ฐฝ์ถœํ•˜๋Š” ๊ฒƒ์„ ๊ฐ€๋Šฅํ•˜๊ฒŒ ํ•œ๋‹ค.


์›น ์‚ฌ์ดํŠธ Website์™€ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ Web application์˜ ๊ณตํ†ต์ 

์›น ์‚ฌ์ดํŠธ(Website)์™€ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application) ๋ชจ๋‘
ํ™”๋ฉด์ด HTML๊ณผ ๊ฐ™์€ ๋งˆํฌ์—… ์–ธ์–ด๋กœ ํ‘œํ˜„๋˜์–ด ์žˆ์œผ๋ฉฐ,
Chrome, Firefox, Safari ๋“ฑ๊ณผ ๊ฐ™์€ ์›น ๋ธŒ๋ผ์šฐ์ € ์ƒ์—์„œ ๊ตฌ๋™๋œ๋‹ค๋Š” ์ .

๊ทธ๋ ‡๊ธฐ ๋•Œ๋ฌธ์— ์›น ์‚ฌ์ดํŠธ(Website)์™€ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application) ๋ชจ๋‘,
๋ช…์นญ์— "์›น(Web)"์ด๋ผ๋Š” ๋‹จ์–ด๊ฐ€ ๋“ค์–ด๊ฐ€์žˆ๋‹ค.


ํ•˜์ง€๋งŒ...ํ™•์‹คํžˆ "์ด๊ฑฐ๋‹ค!"๋ผ๊ณ  ๋งํ•˜๊ธฐ๊ฐ€ ์ข€ ์• ๋งคํ•˜๋‹จ ๋ง์ด์ง€๐Ÿค”

๊ฒฐ๋ก ๐Ÿ’โ€โ™€๏ธ์—์„œ ์Šคํฌ์ผ๋Ÿฌํ–ˆ๋“ฏ์ด,
ํ˜„์žฌ๋Š” ์›น ์‚ฌ์ดํŠธ(Website)์™€ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์˜ ๊ฒฝ๊ณ„๊ฐ€ ๋ชจํ˜ธํ•ด์กŒ๊ธฐ ๋•Œ๋ฌธ์—
๊ทธ ์ •์˜๋ฅผ ์ด๋ถ„ํ™” ์ง“๊ณ  ํŒ๋‹จํ•˜๋Š” ๊ฒƒ์ด ์–ด๋ ต๋‹ค๊ณ  ํ•œ๋‹ค.

์•ž์„œ ์›น ์‚ฌ์ดํŠธ(Website)๋ž€?์—์„œ ์˜ˆ์‹œ๋กœ ๋“ค์—ˆ๋˜ ๋‰ด์Šค ์‚ฌ์ดํŠธ์˜ ๊ฒฝ์šฐ๋„
์›น ์‚ฌ์ดํŠธ(Website)์™€ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application), ๊ธฐ์ˆ ์ด ์ ์  ๋ฐœ์ „ํ•จ์— ๋”ฐ๋ผ
๊ทธ ๊ฒฝ๊ณ„๊ฐ€ ๋ฌด๋„ˆ์ง€๋ฉด์„œ
๋‰ด์Šค ์‚ฌ์ดํŠธ์—๋„ ๊ฒ€์ƒ‰ ๊ธฐ๋Šฅ, ๋Œ“๊ธ€ ๊ธฐ๋Šฅ ๋“ฑ
์—ฌ๋Ÿฌ ๊ฐ€์ง€ ๋™์ ์ธ ๊ธฐ๋Šฅ์ด ํฌํ•จ๋œ ์›น ์‚ฌ์ดํŠธ(Website)๊ฐ€ ๋˜์–ด๋ฒ„๋ ธ๋‹ค.

๊ทธ๋ž˜์„œ

๐Ÿ‘ฉโ€๐Ÿ’ป: ์ด๊ฑด ์›น ์‚ฌ์ดํŠธ(Website)์ž„.
๐Ÿง‘โ€๐Ÿ’ป: ใ„ดใ„ด ์ด๊ฑด ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์ž„.

๋ผ๊ณ  ๋‹จ์–ธํ•˜๊ธฐ ์• ๋งคํ•ด์ง„ ์ƒํ™ฉ์ด๋‹ค.


๋งˆ์น˜๋ฉฐ

๊ฐœ์ธ์ ์ธ ์ƒ๊ฐ์ด์ง€๋งŒ,
์š”์ฆ˜๊ฐ™์ด ์ปค๋ฎค๋‹ˆ์ผ€์ด์…˜=์†Œํ†ต์ด ์•„์ฃผ ์ค‘์š”ํ•œ ๊ฐ€์น˜๋กœ ์ฃผ๋ชฉ๋ฐ›๊ณ  ์žˆ๋Š” ์‹œ๋Œ€์—๋Š”
๋‹จ์ˆœํžˆ ์ •๋ณด ๊ด€๋žŒ์„ ๋ชฉ์ ์œผ๋กœ ํ•˜๋Š” ์›น ์‚ฌ์ดํŠธ(Website)๋ณด๋‹ค
์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)๋กœ ์ข€ ๋” ๋ณดํŽธํ™”๋˜์–ด๊ฐ€๊ณ  ์žˆ์ง€ ์•Š๋‚˜ ์‹ถ๋‹ค.

๋งค์ผ๊ฐ™์ด ์ด์šฉํ•˜๊ณ  ์žˆ๋Š” Gmail๊ณผ ๊ฐ™์€ ๋ฉ”์ผ ์„œ๋น„์Šค๋„ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์ด๋ฉฐ,
ํ•„์š”ํ•œ ๋ฌผ๊ฑด์„ ๊ตฌ๋งคํ•˜๊ธฐ ์œ„ํ•ด ์‚ฌ์šฉํ•˜๋Š” ์ฟ ํŒก๊ณผ ๊ฐ™์€ EC์‚ฌ์ดํŠธ๋„ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์ด๋‹ค.
๊ทธ๋ฆฌ๊ณ  ์ง€๊ธˆ ์ด ๊ธ€์„ ์ž‘์„ฑํ•˜๊ณ  ์žˆ๋Š” Velog ์กฐ์ฐจ๋„ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application).

๊ทธ๋ž˜์„œ ์š”์ฆ˜์— ๋‹ค๋“ค ํ”ํžˆ ์›น ์‚ฌ์ดํŠธ(Website)๋ผ๊ณ  ์นญํ•˜๋Š” ๊ฒƒ์€
๋ฐ”๋กœ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)๋ฅผ ์นญํ–ˆ๋˜ ๊ฒƒ ๊ฐ™์€ ๋Š๋‚Œ...

๊ทธ๋ž˜์„œ

์›น ์‚ฌ์ดํŠธ(Website) โ‰  ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)
โฌ‡๏ธ
์›น ์‚ฌ์ดํŠธ(Website) = ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)
โฌ‡๏ธ
์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application) = ์›น ์‚ฌ์ดํŠธ(Website)
โฌ‡๏ธ
๐ŸŒ€

์ด๋ ‡๊ฒŒ ๋˜๋ฒ„๋ฆฐ ๋“ฏํ•œ ๋Š๋‚Œ...
๐Ÿ˜ตโ€๐Ÿ’ซ

...

๊ทธ๋Ÿฌํ•˜๋‹ค.

๊ธ€ ๋งˆ๋ฌด๋ฆฌ๋ฅผ ์–ด๋–ป๊ฒŒํ•˜์ง€...

๊ทธ๋ž˜๋„ ์›น ์‚ฌ์ดํŠธ(Website)์™€ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(Web application)์— ๋Œ€ํ•ด
๊ณ ๋ฏผํ•ด๋ณผ ์ˆ˜ ์žˆ์—ˆ๋˜ ์ข‹์€ ์‹œ๊ฐ„์ด์—ˆ๋˜ ๊ฒƒ ๊ฐ™๋‹ค.

ํ‹€๋ฆฐ ์ •๋ณด๊ฐ€ ์žˆ๋‹ค๋ฉด ๋งˆ๊ตฌ๋งˆ๊ตฌ ์ง€์ ํ•ด์ฃผ์‹œ๋ฉด ๊ฐ์‚ฌํ•˜๊ฒ ์Šต๋‹ˆ๋‹ค!๐Ÿ™‡โ€โ™€๏ธ

profile
Frontend Developer. ๋ธ”๋กœ๊ทธ ์ด์‚ฌํ–ˆ์–ด์š” ๐Ÿšš โ†’ https://iamhayoung.dev

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