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