Skip to content

๐Ÿ—๏ธ MVC MVP MVVM

saeyoung Oh edited this page Dec 13, 2023 · 1 revision

-> MVVM ํŒจํ„ด์„ ์„ ํƒํ•œ ์ด์œ 

๐Ÿ’ก MVC - ์š”์†Œ ๊ฐ„ ์˜์กด์„ฑ์ด ๊ฐ•ํ•˜๋‹ค๋Š” ๋‹จ์ ์ด ์กด์žฌํ•จ. view ๋ฅผ ์ˆ˜์ •ํ•  ๊ฒฝ์šฐ controller ๋ฅผ, controller ๋ฅผ ์ˆ˜์ •ํ•  ๊ฒฝ์šฐ 
model ๊นŒ์ง€ ์ˆ˜์ •ํ•ด์•ผ ํ•˜๋Š” ๊ฒฝ์šฐ๊ฐ€ ์ƒ๊ธธ ์ˆ˜ ์žˆ์Œ. ๋˜ํ•œ view ์™€ model ์ด controller ๋ฅผ ์ค‘์‹ฌ์œผ๋กœ ๋ณต์žกํ•˜๊ฒŒ ์—ฐ๊ฒฐ๋  ์ˆ˜ ์žˆ๊ธฐ ๋•Œ๋ฌธ์— 
controller ๊ฐ€ ๋น„๋Œ€ํ•ด์ง€๋Š” ๊ฒฝ์šฐ๊ฐ€ ๋ฐœ์ƒํ•  ์ˆ˜ ์žˆ์–ด ์„ ํƒํ•˜์ง€ ์•Š์Œ.

MVP -  view ํ•˜๋‚˜๋ฅผ ๋งŒ๋“ค ๋•Œ๋งˆ๋‹ค presenter๋ฅผ ๋ชจ๋‘ ํ•˜๋‚˜์”ฉ ๋งŒ๋“ค์–ด์ค˜์•ผ ํ•˜๋ฉฐ, view - presenter ์‚ฌ์ด์— ๋งค์šฐ ๋†’์€ ์˜์กด์„ฑ. 
๊ทธ๋ ‡๊ธฐ ๋•Œ๋ฌธ์— view ์˜ ์ด๋ฒคํŠธ์— ๋”ฐ๋ผ model ์˜ ์ƒํƒœ ๋ณ€๊ฒฝ์ด ํ•„์š”ํ•œ ๊ฒฝ์šฐ ๋ณ€๊ฒฝ ํ›„ ๋‹ค์‹œ view ์— ์ ์šฉํ•˜๊ธฐ ์œ„ํ•ด presenter ๊ฐ€ ํ•ด์•ผํ•˜๋Š” ์ผ์ด ๋Š˜์–ด๋‚จ.

โ†’ ์œ„์™€ ๊ฐ™์€ ์ด์œ ๋กœ ๋‚˜๋จธ์ง€ ํŒจํ„ด์ด ์•„๋‹Œ MVVM ํŒจํ„ด์„ ์„ ํƒํ•จ.



MVC


Model + View + Controllor

  • Model
    • UI์ƒํƒœ, ๋น„์ฆˆ๋‹ˆ์Šค ๋กœ์ง, ๋ฐ์ดํ„ฐ๋ฅผ ์ฒ˜๋ฆฌํ•จ
    • ๋ฐ์ดํ„ฐ์˜ ์ƒํƒœ๊ฐ€ ๋ณ€๊ฒฝ๋˜๋ฉด ์ผ๋ฐ˜์ ์œผ๋กœ view ์— ์•Œ๋ ค์คŒ.
  • View
    • ์œ ์ €์—๊ฒŒ ๋ณด์—ฌ์ง€๋Š” UI ๋ฅผ ๋‚˜ํƒ€๋‚ด๋Š” ์—ญํ• ์„ ํ•˜๋ฉฐ, model ๋กœ๋ถ€ํ„ฐ ํ‘œ์‹œํ•  ๋ฐ์ดํ„ฐ๋ฅผ ๋ฐ›์Œ.
    • view ๋Š” controller ๋ฅผ ๋ชจ๋ฆ„
  • Controller
    • ์œ ์ € ์ž…๋ ฅ์— ๋”ฐ๋ผ model ์ด๋‚˜ view ๋ฅผ ๋ณ€ํ™”์‹œํ‚ด
      • ์œ ์ €์˜ ์ž…๋ ฅ์ด controller ์— ๋“ค์–ด์˜ค๋ฉด controller ๋Š” model ์„ ์—…๋ฐ์ดํŠธํ•˜๊ณ  ์ด ๋ฐ์ดํ„ฐ๋ฅผ ๋‚˜ํƒ€๋‚ผ view ๋ฅผ ์„ ํƒํ•˜๊ฒŒ ๋จ.
      • model ์—์„œ ์—…๋ฐ์ดํŠธ ํ•œ ๊ฐ’์„ view ๋กœ ๋ณด๋‚ด๊ฑฐ๋‚˜, ๋ฐ์ดํ„ฐ ๋ณ€๊ฒฝ์ด ์•„๋‹Œ ๋ณด์—ฌ์ง€๋Š” ๋ฐฉ์‹์ด ๋‹ฌ๋ผ์ง€๋Š” ๊ฒฝ์šฐ (ex. ๊ธฐ์กด ๋ฐ์ดํ„ฐ ์ •๋ ฌ) controller ์—์„œ ์ฒ˜๋ฆฌํ•ด์„œ view ๋กœ ๋ณด๋‚ด์คŒ.
    • Controller ์™€ View ๋Š” 1:n ๊ตฌ์กฐ

MVP


View + Presenter + Model

UI (View) ์™€ ๋น„์ง€๋‹ˆ์Šค ๋กœ์ง (Model) ์„ ๋ถ„๋ฆฌํ•˜๊ณ  ์„œ๋กœ ๊ฐ„์˜ ์ƒํ˜ธ์ž‘์šฉ์— Presenter๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด์„œ ๋‘˜์˜ ์˜์กด์„ฑ์„ ์ตœ์†Œํ™”.

  • Model
    • ์•ฑ ์ „๋ฐ˜์—์„œ ์“ฐ์ด๋Š” ๋ฐ์ดํ„ฐ ์ฒ˜๋ฆฌ
    • ๋‹ค๋ฅธ ๋‘ ์š”์†Œ์— ์˜์กด์ ์ด์ง€ ์•Š์Œ.
  • View
    • ์œ ์ €์—๊ฒŒ ๋ณด์—ฌ์ง€๋Š” UI ๋ฅผ ๋‚˜ํƒ€๋‚ด๋Š” ์—ญํ• 
    • Model์—์„œ ์ฒ˜๋ฆฌ๋œ ๋ฐ์ดํ„ฐ๋ฅผ Presenter์—์„œ ๋ฐ›์•„ ์œ ์ €์—๊ฒŒ ๋ณด์—ฌ์ฃผ๊ธฐ ๋•Œ๋ฌธ์— Presenter์— ๋งค์šฐ ์˜์กด์ .
  • Presenter
    • view์—์„œ input ์ด ๋“ค์–ด์˜ค๋ฉด ์ด๋ฅผ model ๋กœ ๊ฐ€๊ณตํ•˜์—ฌ view ์— ์ „๋‹ฌํ•ด์คŒ.
    • ํ™”๋ฉด ๊ทธ ์ž์ฒด๋Š” ์•„๋‹ˆ์ง€๋งŒ, ๋ณด์—ฌ์ค„ ๊ฒƒ์„ ๊ด€๋ฆฌํ•ด์•ผ ํ•˜๊ธฐ ๋•Œ๋ฌธ์— view์™€ presenter๋Š” 1:1 ๊ด€๊ณ„.

MVVM


View + ViewModel + Model

  • Model
    • ์‚ฌ์šฉ๋˜๋Š” ๋ฐ์ดํ„ฐ์™€ ๋ฐ์ดํ„ฐ๋ฅผ ์ฒ˜๋ฆฌํ•˜๋Š” ๋ถ€๋ถ„
  • view
    • ์‚ฌ์šฉ์ž์˜ ์•ก์…˜์„ ๋ฐ›์Œ.
    • ์œ ์ €์—๊ฒŒ ๋ณด์—ฌ์ง€๋Š” UI ๋ฅผ ๋‚˜ํƒ€๋‚ด๋Š” ์—ญํ• 
    • viewModel์˜ ๋ฐ์ดํ„ฐ๋ฅผ ๊ด€์ฐฐํ•ด์„œ (live data, observe) UI ๋ฅผ ๊ฐฑ์‹ . ๋ฐ์ดํ„ฐ์˜ ๋ณ€ํ™”๋ฅผ ์•Œ์•„์ฐจ๋ฆฌ๊ณ  ์ž๋™์œผ๋กœ ํ™”๋ฉด์„ ๊ฐฑ์‹ ํ•  ์ˆ˜ ์žˆ๋‹ค.
    • view ๋Š” viewmodel์™€ data binding ์„ ํ†ตํ•ด ํ™”๋ฉด์„ ๋‚˜ํƒ€๋ƒ„
  • viewModel
    • view ๋ฅผ ๊ทธ๋ฆฌ๋Š” ๊ฒƒ์—๋Š” ๊ด€์—ฌํ•˜์ง€ ์•Š๊ณ  view ๋ฅผ ๋‚˜ํƒ€๋‚ด์ฃผ๊ธฐ ์œ„ํ•œ ๋ฐ์ดํ„ฐ ์ฒ˜๋ฆฌ๋ฅผ ๋‹ด๋‹น.
    • view๊ฐ€ ์š”์ฒญํ•œ ๋ฐ์ดํ„ฐ๋ฅผ model๋กœ ์š”์ฒญํ•˜๊ณ  model ๋กœ๋ถ€ํ„ฐ ์š”์ฒญํ•œ ๋ฐ์ดํ„ฐ๋ฅผ ๋ฐ›์Œ.
    • viewModel ๊ณผ view ์˜ ๊ด€๊ณ„๋Š” 1:1 ์ด ์•„๋‹ˆ์–ด๋„ ๋˜๋ฉฐ, 1:N ๋„ ๊ฐ€๋Šฅํ•จ.
    • presenter ์™€ ๋‹ค๋ฅด๊ฒŒ ์žฌ์‚ฌ์šฉ์ด ๊ฐ€๋Šฅํ•จ.
Clone this wiki locally