ํฌ์ŠคํŠธ

๐ŸŒ’ Web Browser ์›น ๋ธŒ๋ผ์šฐ์ €

๐Ÿ’ซ Web Browser ์›น ๋ธŒ๋ผ์šฐ์ €


URL ์ž…๋ ฅ์„ ํ†ตํ•ด Web Page๋ฅผ ๋‹ค์šด ๋ฐ›๊ณ ,
์ด๋ฅผ Rendering ํ•˜์—ฌ ๋ณด์—ฌ์ฃผ๋Š” GUI ํ”„๋กœ๊ทธ๋žจ
= ์›๊ฒฉ์ง€ ๋ฌธ์„œ ๋ทฐ์–ด

์ฃผ์†Œ ์ž…๋ ฅ์ฐฝ์— URL Uniform Resource Locator ์ž…๋ ฅ
โ†’ (์ผ๋ฐ˜์ ์œผ๋กœ) HTTPS๋ฅผ ํ†ตํ•ด Resource(๋ฌธ์„œ/Web Page๋„ Resource)๋ฅผ Web Server๋กœ ๋ถ€ํ„ฐ Get-Read/Post ํ•˜๊ฒ ๋‹ค๋Š” ๊ฒƒ
โ†’ CMD ๋ช…๋ น์–ด ์ž…๋ ฅํ•˜๋Š” ๊ฑฐ๋ž‘ ๋‹ค๋ฅผ ๊ฒŒ ์—†์Œ (DNS Domain Name System, URL โ†’ IP)
โ†’ Search Query๋ฅผ ์ž…๋ ฅํ•˜๋ฉด ์„ค์ •ํ•ด๋‘” Search Engine์œผ๋กœ ๊ฒ€์ƒ‰

๊ฐœ๋ฐœ์ž ๋„๊ตฌ/๋„คํŠธ์›Œํฌ ํƒญ์„ ํ†ตํ•ด,
Web Browser๊ฐ€ Resource๋ฅผ ์–ด๋–ป๊ฒŒ ๋‹ค์šด๋กœ๋“œํ•˜๊ณ  ์žˆ๋Š”์ง€ ํ™•์ธ ๊ฐ€๋Šฅ

Web Page๋Š” HTML, CSS, JavaScript๋กœ ๊ตฌ์„ฑ๋จ

  • ๋‹ค์šด๋กœ๋“œ ์ˆœ์„œ
    1. HTML ๋ฌธ์„œ
    2. HTML ๋ฌธ์„œ๊ฐ€ ์ฐธ์กฐํ•˜๋Š” CSS
    3. CSS๊ฐ€ ์ฐธ์กฐํ•˜๋Š” ํฐํŠธ?
    4. ๋ Œ๋”๋ง ์‹œ์ž‘๊ณผ ๋™์‹œ์—, ์ด๋ฏธ์ง€ (Favicon๋„ ์ด๋•Œ)

HTML ๋ฌธ์„œ๋Š” ์‚ฌ๋žŒ์ด ์ฝ๊ธฐ ์–ด๋ ค์›€
So, Web Browser๋Š” ๋‹ค์Œ ๊ณผ์ •์„ ํ†ตํ•ด ์ฝ๊ธฐ ์‰ฝ๊ฒŒ ๋ณด์—ฌ์คŒ

  1. Parsing ๊ตฌ๋ฌธ ๋ถ„์„์„ ํ†ตํ•ด DOM (์ž๋ฃŒ๊ตฌ์กฐ - ๋น„์„ ํ˜• ํŠธ๋ฆฌ๊ตฌ์กฐ) ์ƒ์„ฑ
  2. DOM์„ ๊ธฐ๋ฐ˜์œผ๋กœ Rendering (์ถœ๋ ฅ)

๐Ÿ’ซ ์ฐธ๊ณ 


๋„๋„ํ•œ ๊ฐœ๋ฐœ์ž - ์ดˆ์ฐฝ๊ธฐ ์›น ์„œ๋น„์Šค ๊ตฌ์กฐ
๊ฐ€์žฅ ์‰ฌ์šด ์›น๊ฐœ๋ฐœ with Boaz - ๋ธŒ๋ผ์šฐ์ €์— URL์„ ์ž…๋ ฅํ•˜๋ฉด ์–ด๋–ค ๊ณผ์ •์ด ์ง„ํ–‰๋ ๊นŒ?

์ด ๊ธฐ์‚ฌ๋Š” ์ €์ž‘๊ถŒ์ž์˜ CC BY 4.0 ๋ผ์ด์„ผ์Šค๋ฅผ ๋”ฐ๋ฆ…๋‹ˆ๋‹ค.