[programmers] TIL_DAY-10

๊น€๋ฏผ๊ธฐยท2022๋…„ 3์›” 30์ผ
0

Programmers_TIL

๋ชฉ๋ก ๋ณด๊ธฐ
10/21
post-thumbnail

๐Ÿ—’ ๋ชฉ์ฐจ

  1. HTML5๊ณผ CSS3
  2. DOM ๊ฐ์ฒด

    ์ถœ์ฒ˜: HTML์€ ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์–ธ์–ด์ธ๊ฐ€? ๋ผ๋Š” ๋…ผ์Ÿ๋ณด๋‹ค ์ค‘์š”ํ•œ๊ฒƒ

โœ… 1. HTML5 & CSS3

HTML5

ย  HTML5๋Š” ์™œ ๋งŒ๋“ค์–ด ์กŒ๋Š”๊ฐ€? ์›น์ด ๋ฐœ์ „ํ•˜๋ฉด์„œ ๋งŽ์€ ๋ธŒ๋ผ์šฐ์ €๋“ค์ด ์ƒ๊ฒจ๋‚ฌ์ง€๋งŒ W3C์˜ ๊ทœ์ •์„ ๋ฌด์‹œํ•˜๊ณ  plug-in, Active-x์™€ ๊ฐ™์€ ๋น„ํ‘œ์ค€ ๊ธฐ์ˆ ์„ ์‚ฌ์šฉํ•˜๋Š” ๋ธŒ๋ผ์šฐ์ €๋“ค๊ณผ ๋ธŒ๋ผ์šฐ์ € ๋งˆ๋‹ค ์ƒํ˜ธ ๋‹ค๋ฅธ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๊ธฐ๋Šฅ์„ ์ถ”๊ฐ€ํ•˜์—ฌ ์›น ํŽ˜์ด์ง€์˜ ์›น ๋ธŒ๋ผ์šฐ์ € ํ˜ธํ™˜์„ฑ์ด ๋ฌด๋„ˆ์กŒ๋‹ค.

ย  ์ด๋Ÿฐ ์ƒํ™ฉ์—์„œ ๋ชจ๋ฐ”์ผ ๊ธฐ์ˆ ์˜ ๋ฐœ์ „์— ๋”ฐ๋ผ PCํ™˜๊ฒฝ์—์„œ ๊ฐœ๋ฐœ๋œ ์›น ์‚ฌ์ดํŠธ๋“ค์„ ๋ชจ๋ฐ”์ผ์—์„œ ์‹คํ–‰ํ•  ์ˆ˜ ์—†๊ธฐ ๋•Œ๋ฌธ์— ๋ชจ๋ฐ”์ผ์šฉ ์›น ์‚ฌ์ดํŠธ๋ฅผ ๋”ฐ๋กœ ๋งŒ๋“ค์–ด์•ผ ํ–ˆ๋‹ค. ๊ฐœ๋ฐœ์ž๋“ค์€ ๋””๋ฐ”์ด์Šค, ์›น ๋ธŒ๋ผ์šฐ์ €์— ๋”ฐ๋ผ์„œ ๊ฐœ๋ฐœ์„ ๋ฐ˜๋ณตํ•ด์•ผ ํ–ˆ๋‹ค.

ย ๋•Œ๋ฌธ์— ๋ชจ๋“  ๋””๋ฐ”์ด์Šค, ๋ธŒ๋ผ์šฐ์ €์—์„œ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ๋ฒ”์šฉ ์›น ํ‘œ์ค€์ด ํ•„์š”ํ–ˆ๊ณ  ๊ทธ์— ๋”ฐ๋ผ HTML5 ํ‘œ์ค€์ด ํƒ„์ƒํ•˜๊ฒŒ ๋˜์—ˆ๋‹ค.

ย HTML5 ํ‘œ์ค€์—์„œ๋Š” ์›น ํŽ˜์ด์ง€๋ฅผ ๊ตฌ์กฐ์™€ ๋‚ด์šฉ(Structure), ๋ชจ์–‘(Presentation), ํ–‰๋™(Behavior)์„ ๋ช…ํ™•ํ•˜๊ฒŒ ๋ถ„๋ฆฌํ•˜์—ฌ ๊ฐœ๋ฐœํ•  ์ˆ˜ ์žˆ๋„๋ก

  1. HTML ํƒœ๊ทธ์—์„œ ๋ฌธ์„œ์˜ ๋ชจ์–‘๊ณผ ๊ด€๊ณ„๋œ ํƒœ๊ทธ๋‚˜ ์†์„ฑ์„ ํ๊ธฐํ•˜์˜€๋‹ค.
  2. ๋ฌธ์„œ ๊ตฌ์„ฑ์„ ๋ช…ํ™•ํžˆ ํ•˜๋Š” ํƒœ๊ทธ๋ฅผ ๋„์ž…ํ•˜์—ฌ ์›น ๋ฌธ์„œ ๊ตฌ์„ฑ์˜ ํŽธ์˜์„ฑ, ๋ช…ํ™•์„ฑ์„ ํ™•๋ณดํ–ˆ๋‹ค.
  3. ์™ธ๋ถ€ ํ”Œ๋Ÿฌ๊ทธ์ธ ์—†์ด ๋ฉ€ํ‹ฐ๋ฏธ๋””์–ด๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ฒŒ ๋˜์—ˆ๋‹ค.

CSS3

ย CSS๋Š” HTML๋ฌธ์„œ์— ์ƒ‰์ด๋‚˜ ๋ชจ์–‘, ์ถœ๋ ฅ ์œ„์น˜ ๋“ฑ ์™ธ๊ด€์„ ๊พธ๋ฏธ๋Š” ์–ธ์–ด์ด๋ฉฐ, CSS๋กœ ์ž‘์„ฑ๋œ ์ฝ”๋“œ๋ฅผ Style Sheet๋ผ๊ณ  ๋ถ€๋ฅธ๋‹ค.

ย HTMLํŒŒ์ผ ๋‚ด๋ถ€์—์„œ headํƒœ๊ทธ ๋ฐ‘์— styleํƒœ๊ทธ๋ฅผ ๋งŒ๋“ค์–ด์„œ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ณ , ํƒœ๊ทธ ๋‚ด๋ถ€์— inline์œผ๋กœ ์‚ฌ์šฉํ•  ์ˆ˜ ๋„ ์žˆ๋‹ค. ๊ฐ€์žฅ ์ •์„์ ์ธ ๋ฐฉ๋ฒ•์€ ์™ธ๋ถ€์— css ํŒŒ์ผ์„ ๋งŒ๋“ค๊ณ  link๋ฅผ ์‚ฌ์šฉํ•ด์„œ ์ ์šฉ์‹œํ‚ค๋Š” ๋ฐฉ๋ฒ•์ด๋‹ค.

ย CSS๋ฅผ ์ž˜ ์‚ฌ์šฉํ•˜๊ธฐ ์œ„ํ•ด์„œ๋Š” HTML ํƒœ๊ทธ๋ฅผ ์ž˜ ์ฐพ์•„์™€์•ผ ํ•œ๋‹ค. HTML๋ฌธ์„œ๊ฐ€ ์ปค์งˆ ์ˆ˜๋ก ๋งŽ์€ ํƒœ๊ทธ๋ฅผ ์‚ฌ์šฉํ•˜๊ธฐ ๋•Œ๋ฌธ์— ํ•„์š”ํ•œ ํƒœ๊ทธ๋ฅผ ์ฐพ์„ ์ˆ˜ ์žˆ์–ด์•ผ ํ•œ๋‹ค. ์ด๋ฅผ ์œ„ํ•ด์„œ Selector๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค.

  1. TagName Selector
    ํƒœ๊ทธ์˜ ์ด๋ฆ„์„ ์‚ฌ์šฉํ•˜๊ณ , ๊ฐ™์€ ์ด๋ฆ„์„ ๊ฐ–๋Š” ๋ชจ๋“  ํƒœ๊ทธ์— ์Šคํƒ€์ผ์„ ์ ์šฉํ•œ๋‹ค.
  2. Class Selector
    ํƒœ๊ทธ์˜ class ์†์„ฑ์„ ์‚ฌ์šฉํ•˜๊ณ , ๊ฐ™์€ class๋ฅผ ๊ฐ–๋Š” ๋ชจ๋“  ํƒœ๊ทธ์— ์Šคํƒ€์ผ์„ ์ ์šฉํ•œ๋‹ค.
  3. ID Selector
    ํƒœ๊ทธ์˜ ID ์†์„ฑ์„ ์‚ฌ์šฉํ•ด์„œ ์ผ์น˜ํ•˜๋Š” id๋ฅผ ๊ฐ–๋Š” ํƒœ๊ทธ์—๋งŒ ์Šคํƒ€์ผ์„ ์ ์šฉํ•œ๋‹ค.

์ด ์™ธ์—๋„ Selector๋ฅผ ์กฐํ•ฉํ•˜๋Š” ๋ฐฉ๋ฒ•์ด๋‚˜ pseudo-class Selector๊ฐ€ ์žˆ๋‹ค.

โœ… 2. DOM

ย  HTML ํŽ˜์ด์ง€๊ฐ€ ๋ธŒ๋ผ์šฐ์ € ์œˆ๋„์šฐ๋‚˜ ํƒญ์— ๋กœ๋“œ๋˜๋ฉด ๋ธŒ๋ผ์šฐ์ €๋กœ๋ถ€ํ„ฐ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์ฝ”๋“œ์—์„œ ํ™œ์šฉ ๊ฐ€๋Šฅํ•œ ๋งŽ์€ ๊ฐ์ฒด๋“ค์„ ์ œ๊ณต ๋ฐ›๋Š”๋‹ค. DOM ,BOM, Core

  1. ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ core ๊ฐ์ฒด๋Š” ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ํ”„๋กœ๊ทธ๋žจ์—์„œ ํ•ญ์ƒ ํ™œ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ๊ธฐ๋ณธ ๊ฐ์ฒด๋“ค์ด๋‹ค.(String, Math, Array, Function... ๋“ฑ)

  2. ๋ธŒ๋ผ์šฐ์ €์— ๊ด€ํ•œ ์ •๋ณด๋ฅผ ์ œ๊ณตํ•˜๊ฑฐ๋‚˜ ๋ธŒ๋ผ์šฐ์ €์˜ ๋ชจ์–‘์„ ์ œ์–ดํ•˜๋„๋ก ์ œ๊ณต๋˜๋Š” ๊ฐ์ฒด๋“ค์„ BOM ๊ฐ์ฒด๋ผ๊ณ  ๋ถ€๋ฅธ๋‹ค.(window, history, screen... ๋“ฑ)

  3. DOM ๊ฐ์ฒด
    ๋ธŒ๋ผ์šฐ์ €๋Š” HTMLํŽ˜์ด์ง€๋ฅผ ๋กœ๋“œํ•˜๋Š” ๊ณผ์ •์—์„œ ๊ฐ HTML ํƒœ๊ทธ๋ฅผ ํ•˜๋‚˜์˜ ๊ฐ์ฒด๋กœ ๋งŒ๋“ ๋‹ค.

ย ๋ธŒ๋ผ์šฐ์ €๋Š” ์™œ HTML ํŽ˜์ด์ง€๋ฅผ ๋กœ๋“œํ•˜๋ฉด์„œ ํƒœ๊ทธ๋ฅผ ๊ฐ์ฒด๋กœ ๋งŒ๋“œ๋Š”๊ฐ€? HTML ํŽ˜์ด์ง€๊ฐ€ ์ถœ๋ ฅ๋œ ํ›„ DOM ๊ฐ์ฒด๋ฅผ ํ†ตํ•ด HTML ํƒœ๊ทธ๊ฐ€ ์ถœ๋ ฅ๋œ ๋ชจ์–‘๊ณผ ์ปจํ…์ธ ๋ฅผ ์ œ์–ดํ•˜๊ธฐ ์œ„ํ•ด์„œ๋‹ค.

DOM Tree

ย ๋ธŒ๋ผ์šฐ์ €๋Š” HTML ํŽ˜์ด์ง€๋ฅผ ๋กœ๋“œํ•˜๋ฉด์„œ HTML ํƒœ๊ทธ์˜ ํฌํ•จ ๊ด€๊ณ„์— ๋”ฐ๋ผ DOM ๊ฐ์ฒด๋“ค์„ ํŠธ๋ฆฌ ๊ตฌ์กฐ๋กœ ๋งŒ๋“ ๋‹ค. ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์ฝ”๋“œ๋Š” DOM ํŠธ๋ฆฌ๋ฅผ ๋”ฐ๋ผ์„œ DOM ๊ฐ์ฒด๋“ค์„ ๋งˆ์Œ๋Œ€๋กœ ์ ‘๊ทผํ•  ์ˆ˜ ์žˆ๋‹ค.

DOM Tree๋Š” ๋„ค ์ข…๋ฅ˜์˜ ๋…ธ๋“œ๋กœ ๊ตฌ์„ฑ๋œ๋‹ค.

  1. ๋ฌธ์„œ ๋…ธ๋“œ
    ํŠธ๋ฆฌ์˜ ์ตœ์ƒ์œ„์— ์กด์žฌํ•˜๋ฉฐ, ์š”์†Œ ๋…ธ๋“œ, ์†์„ฑ ๋…ธ๋“œ, ํ…์ŠคํŠธ ๋…ธ๋“œ์— ์ ‘๊ทผํ•˜๋ ค๋ฉด ๋ฌธ์„œ ๋…ธ๋“œ๋ฅผ ํ†ตํ•ด์„œ ์ ‘๊ทผํ•  ์ˆ˜ ์žˆ๋‹ค. DOM Tree์˜ root Node
  2. ์š”์†Œ ๋…ธ๋“œ
    HTML ์š”์†Œ๋ฅผ ํ‘œํ˜„ํ•œ๋‹ค. ์†์„ฑ ๋…ธ๋“œ, ํ…์ŠคํŠธ ๋…ธ๋“œ์— ์ ‘๊ทผํ•˜๋ ค๋ฉด ์š”์†Œ ๋…ธ๋“œ๋ฅผ ํ†ตํ•ด ์ ‘๊ทผํ•  ์ˆ˜ ์žˆ๋‹ค.
    DOM ํŠธ๋ฆฌ์—์„œ ์šฐ๋ฆฌ๊ฐ€ ์ฐพ์œผ๋ ค๋Š” ์š”์†Œ๋ฅผ ์–ด๋–ป๊ฒŒ ์ฐพ๋Š”๊ฐ€? ์ „์œ„ ์ˆœํšŒ ๋ฐฉ๋ฒ•์œผ๋กœ ์ฐพ๋Š”๋‹ค!!
  3. ์†์„ฑ ๋…ธ๋“œ
    ์†์„ฑ ๋…ธ๋“œ๋Š” ์š”์†Œ ๋…ธ๋“œ์— ๋ถ™์–ด ์žˆ๋Š” ๋…ธ๋“œ๋กœ์„œ ์š”์†Œ ๋…ธ๋“œ์˜ ์ž์‹ ๋…ธ๋“œ๋Š” ์•„๋‹ˆ๋‹ค. HTML์— ์ •์˜๋˜์–ด ์žˆ๋Š” ์†์„ฑ์— ์ ‘๊ทผํ•  ์ˆ˜ ์žˆ๋‹ค.
  4. ํ…์ŠคํŠธ ๋…ธ๋“œ
    ์š”์†Œ์˜ ํ…์ŠคํŠธ๋ฅผ ํ‘œํ˜„ํ•˜๊ณ  ์ž์‹ ๋…ธ๋“œ๋ฅผ ๊ฐ€์งˆ ์ˆ˜ ์—†๊ธฐ ๋•Œ๋ฌธ์— DOM ํŠธ๋ฆฌ์—์„œ ๋‹จ๋ง ๋…ธ๋“œ๊ฐ€ ๋œ๋‹ค.

Virtual DOM

ย ๋งŒ์•ฝ ํ•œ ๋ฒˆ์— ์—ฌ๋Ÿฌ ๊ฐœ์˜ DOM ๊ฐ์ฒด๋ฅผ ์ˆ˜์ •ํ•œ๋‹ค๋ฉด? 100๊ฐœ์˜ DOM ๊ฐ์ฒด๋ฅผ ์ˆ˜์ •ํ•ด์•ผํ•œ๋‹ค๋ฉด ๋ธŒ๋ผ์šฐ์ €๋Š” ๋žœ๋”๋ง์„ 100๋ฒˆ ์‹คํ–‰ํ•ด์•ผ ํ•œ๋‹ค. ๋ธŒ๋ผ์šฐ์ €๋Š” HTML ํŒŒ์ผ์„ ์ฝ์–ด์„œ DOM ํŠธ๋ฆฌ, CSS ํŠธ๋ฆฌ๋ฅผ ๋งŒ๋“ค๊ณ  DOM์˜ ๋ ˆ์ด์•„์›ƒ์„ ์„ค์ •ํ•˜๊ณ  ๋žœ๋”๋ง์„ ํ•œ๋‹ค. ์ด ๊ณผ์ •์„ 100๋ฒˆ ๋˜๋Š” ๊ทธ ์ด์ƒํ•˜๊ฒŒ ๋œ๋‹ค๋ฉด, ๋ธŒ๋ผ์šฐ์ €์˜ ํšจ์œจ์ด ๋–จ์–ด์ง€๊ฒŒ ๋œ๋‹ค.

ย ์ด๋Ÿฌํ•œ ๋ฌธ์ œ์ ์„ ํ•ด๊ฒฐํ•˜๊ณ ์ž ๊ฐ€์ƒ ๋”(Virtual DOM)์„ ์‚ฌ์šฉํ•˜๋Š”๋ฐ, ์ด๋ฏธ React.js , Vue.js์—์„œ๋„ ๊ฐ€์ƒ ๋”์„ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ๋‹ค. ๊ฐ€์ƒ ๋”์€ ์‰ฝ๊ฒŒ ์ƒ๊ฐํ•˜๋ฉด ๋ธŒ๋ผ์šฐ์ €๋ฅผ ์œ„ํ•œ ๋ฒ„ํผ๋กœ ์ƒ๊ฐํ•  ์ˆ˜ ์žˆ๋‹ค. DOM ์ˆ˜์ • ์š”์ฒญ์„ ์ฆ‰๊ฐ์ ์œผ๋กœ ์‹คํ–‰ํ•˜๋Š” ๊ฒƒ์ด์•„๋‹ˆ๋ผ ๊ฐ€์ƒ ๋”์ด๋ผ๋Š” ๋ฒ„ํผ์— ๋‹ด์•„ ๋‘์—ˆ๋‹ค๊ฐ€ ์‹คํ–‰ํ•จ์œผ๋กœ ์จ ๋žœ๋”๋ง ํšŸ์ˆ˜๋ฅผ ์ค„์ผ ์ˆ˜ ์žˆ๊ณ  ๋ธŒ๋ผ์šฐ์ €์˜ ํšจ์œจ์„ ๋†’์ผ ์ˆ˜ ์žˆ๋‹ค๋Š” ๊ฒƒ์ด๋‹ค.

ย ํ•˜์ง€๋งŒ ์ด๋Ÿฐ ๊ฐ€์ƒ ๋”์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด DOM๋งŒ์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ๋ณด๋‹ค ๋น ๋ฅด๋‹ค๋Š” ๊ฒƒ์€ ์•„๋‹ˆ๋‹ค. ์ƒ๊ฐํ•ด๋ณด๋ฉด ์›๋ณธ DOM ๊ฐ์ฒด์™€ ์ด๋ฅผ ๋ณต์‚ฌํ•œ Virtual DOM ๊ฐ์ฒด 2๊ฐœ๋ฅผ ๊ฐ–๊ณ  ์žˆ๋‹ค๋Š” ๊ฒƒ๋ถ€ํ„ฐ ์†๋„์™€๋Š” ๊ฑฐ๋ฆฌ๊ฐ€ ์žˆ์–ด๋ณด์ธ๋‹ค. ๊ฒŒ๋‹ค๊ฐ€ ํƒ์ƒ‰ ํšŸ์ˆ˜๋„ Virtual DOM, DOM ๋‘ ๋ฒˆ ์‹คํ–‰ํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์‹ค์ œ๋กœ๋Š” ๋” ๋Š๋ฆฌ๋‹ค.

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

DocumentFragment

ย  document.createDocumentFragment()์—์„œ DocumentFragment ๋…ธ๋“œ๋ฅผ ์ƒ์„ฑํ•ด์„œ ์‚ฌ์šฉํ•˜๋ฉด ๋ผ์ด๋ธŒ DOM ํŠธ๋ฆฌ ์™ธ๋ถ€์— ๊ฒฝ๋Ÿ‰ํ™”๋œ ๋ฌธ์„œ DOM์„ ๋งŒ๋“ค ์ˆ˜ ์žˆ๋‹ค. ๋งˆ์น˜ ๋ผ์ด๋ธŒ DOM ํŠธ๋ฆฌ์ฒ˜๋Ÿผ ์ž‘๋™ํ•˜๋˜, ๋ฉ”๋ชจ๋ฆฌ์ƒ์—์„œ๋งŒ ์กด์žฌํ•˜๋Š” ๋นˆ ๋ฌธ์„œ ํ…œํ”Œ๋ฆฟ์œผ๋กœ ์ƒ๊ฐํ•  ์ˆ˜ ์žˆ๋‹ค. ์ž์‹ ๋…ธ๋“œ๋ฅผ ๋ฉ”๋ชจ๋ฆฌ์ƒ์—์„œ ์†์‰ฝ๊ฒŒ ์กฐ์ž‘ํ•œ ํ›„ ๋ผ์ด๋ธŒ DOM์— ์ถ”๊ฐ€ํ•˜๋Š” ๊ฒƒ๋„ ๊ฐ€๋Šฅํ•˜๋‹ค. ๋ฉ”๋ชจ๋ฆฌ ์ƒ์—์„œ๋งŒ ์กด์žฌํ•˜๊ณ  ๋ผ์ด๋ธŒ DOM ํŠธ๋ฆฌ์˜ ์ผ๋ถ€๊ฐ€ ์•„๋‹ˆ๊ธฐ ๋•Œ๋ฌธ์— ํ•˜์œ„ ํ•ญ๋ชฉ์„ ์ถ”๊ฐ€ํ•ด๋„ ํŽ˜์ด์ง€ ๋ฆฌํ”Œ๋กœ์šฐ๊ฐ€ ๋ฐœ์ƒํ•˜์ง€ ์•Š๋Š”๋‹ค. ๋”ฐ๋ผ์„œ ๊ฐ€์ƒ๋”์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ฒ˜๋Ÿผ ๋งค๋ฒˆ ๋žœ๋”๋ง์„ ์š”์ฒญํ•˜์ง€ ์•Š๊ณ  DocumentFragment๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ๋ธŒ๋ผ์šฐ์ €์˜ ๋žœ๋”๋ง ํ”„๋กœ์„ธ์Šค๋ฅผ ์ค„์ผ ์ˆ˜์žˆ๋‹ค.

๊ฐ€์ƒ๋”(Virtual DOM)?

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