2021-01-29(Fri)

ํ•ญ๋ชฉ

๋‚ด์šฉ

ํ•™์Šต ๋‚ ์งœ

2021-01-29(๊ธˆ)

ํ•™์Šต ์‹œ๊ฐ„

10:00~24:00

ํ•™์Šต ๋ฒ”์œ„ ๋ฐ ์ฃผ์ œ

Backbone

ํ•™์Šต ๋ชฉํ‘œ

๋™๋ฃŒ ํ•™์Šต ๋ฐฉ๋ฒ•

eunhkim, yohlee๋‹˜๊ณผ adobe xd๋กœ ํŽ˜์ด์ง€๋ฅผ ๋””์ž์ธํ•˜์˜€๋‹ค.

์ƒ์„ธ ํ•™์Šต ๋‚ด์šฉ

์ „์ฒด ํ™”๋ฉด์— ๋Œ€ํ•œ HTML ํŒŒ์ผ์„ ๋ฏธ๋ฆฌ ๋‹ค ์ž‘์„ฑํ•ด๋ฒ„๋ฆฌ๊ณ  ๋ชจ๋“ˆ์„ ๋‚˜๋ˆ ์„œ ํ”„๋กœ์ ํŠธ๋ฅผ ์ง„ํ–‰ํ• ์ง€, ์•„๋‹ˆ๋ฉด ์–ด๋Š ํ•œ ๋ชจ๋“ˆ์— ํ•„์š”ํ•œ HTML ํŒŒ์ผ์„ ์„ค๊ณ„ํ•˜๊ณ  ํ•ด๋‹น ๋ชจ๋“ˆ์— ์˜ํ–ฅ์„ ๋ฏธ์น˜๋Š” ํ”„๋ก ํŠธ์—”๋“œ ๊ตฌํ˜„๊ณผ ๋ฐฑ์—”๋“œ ๊ตฌํ˜„์„ ๋งˆ์ณ๋ฒ„๋ฆด์ง€ ๊ฒฐ์ •์ด ํ•„์š”ํ–ˆ๋‹ค.

ํ›„์ž๋ฅผ ํ†ตํ•ด '๊ตฌํ˜„ ์Šคํƒ€์ผ'์„ ์žก๊ณ  ๊ฐ ๋ชจ๋“ˆ์—์„œ ์ฐธ๊ณ ํ•˜๋ฉด์„œ ์ง„ํ–‰ํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•˜๋Š” ๊ฒƒ์ด ๋ฐ”๋žŒ์งํ•˜๋‹ค๊ณ  ํŒ๋‹จํ–ˆ๋‹ค. ํ”„๋ก ํŠธ์—”๋“œ ๊ตฌํ˜„ํ•˜๋Š”๋ฐ ์“ฐ์ด๋Š” ๋ฐฑ๋ณธ์ด '๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ'์ด๋‹ค๋ณด๋‹ˆ ์ฐธ ๋‹ค์–‘ํ•œ ๋ฐฉ์‹์œผ๋กœ ๊ตฌํ˜„ํ•  ์ˆ˜ ์žˆ๊ธฐ ๋•Œ๋ฌธ์ด๋‹ค. ๊ฐ€๋ น ๋ถ€๋ชจ ๋ทฐ ์•ˆ์— ์ž์‹ ๋ทฐ๋ฅผ ์–ด๋–ป๊ฒŒ ๊ตฌํ˜„ํ• ์ง€์— ๋Œ€ํ•ด์„œ ์ฐพ์€ ๊ฒƒ๋งŒ 5๊ฐ€์ง€ ์Šคํƒ€์ผ์ด ์žˆ์—ˆ๋‹ค..;

๊ทธ๋ฆฌ๊ณ  ๋ฐฑ์—”๋“œ์™€ ํ”„๋ก ํŠธ๋ฅผ ํ†ต์‹ ์‹œํ‚ค๋Š”๋ฐ๋„ ์‹œํ–‰์ฐฉ์˜ค๊ฐ€ ์žˆ์—ˆ๋‹ค. ๋ฐฑ๋ณธ Model ๊ฐ์ฒด๊ฐ€ JSON ํŒŒ์ผ์„ ์ˆ˜์‹ ํ•˜์—ฌ ์Šค์Šค๋กœ๋ฅผ ์—…๋ฐ์ดํŠธํ•˜๋„๋ก ํ•˜๋Š” ๊ฒƒ์€ ๋ณ„ ์ด์Šˆ๊ฐ€ ์—†์—ˆ์œผ๋‚˜ Collection ๊ฐ์ฒด๋ฅผ ํ†ตํ•ด fetch ํ•จ์ˆ˜๋ฅผ ๋™์ž‘์‹œํ‚ฌ ๋•Œ๋Š” ์ •์ƒ์ž‘๋™ํ•˜์ง€ ์•Š์•˜๋˜ ๊ฒƒ์ด๋‹ค. ๊ฒฐ๊ณผ์ ์œผ๋กœ Collection ๊ฐ์ฒด์— parse ๋ฉ”์„œ๋“œ๋ฅผ ์„ค์ •ํ•ด๋‘” ์ƒํƒœ์—์„œ Collection ๊ฐ์ฒด์— ์—ฐ๊ฒฐ๋œ Model ๊ฐ์ฒด๋„ parse ๋ฉ”์„œ๋“œ๋ฅผ ๊ฐ€์ง€๊ณ  ์žˆ์œผ๋ฉด, ์ด parse ๋ฉ”์„œ๋“œ๊ฐ€ ๋‘ ๋ฒˆ ์ž‘๋™ํ•˜๋ฉฐ JSON ๋ฐ์ดํ„ฐ๊ฐ€ ์–ด๊ทธ๋Ÿฌ์ง„๋‹ค๋Š” ๊ฒƒ์„ ์•Œ๊ฒŒ ๋˜์—ˆ๋‹ค.

https://github.com/jashkenas/backbone/issues/4035

ํ•™์Šต ๋‚ด์šฉ์— ๋Œ€ํ•œ ๊ฐœ์ธ์ ์ธ ์ดํ‰

์˜ค์ „ 10์‹œ๋ถ€ํ„ฐ ์ƒˆ๋ฒฝ 2์‹œ๊นŒ์ง€ ๊ทผ์„ฑ..์žˆ๊ฒŒ ํ”„๋กœ์ ํŠธ๋ฅผ ์ง„ํ–‰ํ•˜์˜€๋‹ค. ๊ฒฐ๊ณผ์ ์œผ๋กœ ladder ๋ชจ๋“ˆ ํŽ˜์ด์ง€ ๊ตฌํ˜„์€ ์„ฑ๊ณตํ–ˆ์œผ๋‹ˆ hash fragment url routing์„ ํ†ตํ•ด ๋‹ค๋ฅธ ๋ทฐ๋ฅผ ํ˜ธ์ถœํ•˜์—ฌ ํ™”๋ฉด์„ ๋ Œ๋”๋งํ•˜๋Š” ๋ฐฉ์‹๋งŒ ์ž˜ ๊ตฌํ˜„ํ•˜๋ฉด ๋ชจ๋“ˆ๋ณ„๋กœ ๋ถ„๋ฆฌํ•  ์ˆ˜ ์žˆ์„ ๊ฒƒ ๊ฐ™๋‹ค. SPA๋กœ ๊ตฌํ˜„ํ•ด์•ผํ•˜๋‹ค๋ณด๋‹ˆ ์ƒ๋‹นํžˆ ์„ค๊ณ„์— ๊ณต์ˆ˜๊ฐ€ ๋“œ๋Š” ๋Š๋‚Œ..

๋‹ค์Œ ํ•™์Šต ๊ณ„ํš

  • ํ”„๋ก ํŠธ์—”๋“œ routing ์ „๋žต ๊ฒฐ์ •

Last updated