당근 iOS 프로젝트 성장기

Let'Swift 2023 발표자료

Transcript

1. 4֙р੄ ׼Ӕ ೐۽ં౟ ߸ചী ؀೧ ࣗѐ೧ਃ Ray Software Engineer, iOS Github @OhKanghoon ׼Ӕ iOS ೐۽ં౟ ࢿ੢ӝ
2. Contents 1. Architecture ੄ ߸ച 2. UI ੄ ߸ച 3. Feed ੄ ߸ച 4. Ҋ޹ೞҊ ੓ח ޙઁٜ
3. Architecture ੄ ߸ച
4. Architecture ੄ ߸ച Modular Architecture জਸ ੘਷ ױਤ۽ ܻ࠙ೞח Architecture ׼Ӕ জ਷ ࣻߔѐ੄ ݽٕ۽ ҳࢿؽ Feature-level E.g. Transfer Bank Page, Deposit Page Domain-level E.g. Transfer, Bank, Account Core-level E.g. Network, Experiment, Analytics Shared-level E.g. Common UI, Logging, Utils
5. Architecture ੄ ߸ച Modular Architecture ݽٕച ܳ ਤ೧ о੢ ݢ੷ ೙ਃೠ Ѫ਷ জ੄ ੄ઓࢿ ޙઁܳ ೧Ѿೞח Ѫ ׼Ӕ ౱਷ ஹ౵ੌ द੼ী উ੹ೣ੉ ࠁ੢غח ੄ઓࢿ ઱ੑ ߑधਸ ࢶఖೣ
6. Architecture ੄ ߸ച Builder ഝਊ ೞ૑݅, ݽٚ ੄ઓࢿਸ ஹ౵ੌ द੼ী ੿੄ೞח Ѫ਷ ࠛоמೣ ஹ౵ੌ द੼ী ੿੄ೡ ࣻ ੓ח Dependency ৬ ۠ఋ੐ী Dynamic Dependency ܳ ࢎਊ೧ ё୓ܳ ࢤࢿೡ ࣻ ੓ח Builder ܳ ੿੄ জ੄ ੄ઓࢿ ౟ܻ ҳࢿীח IoC Container ܳ ೣԋ ഝਊ
7. Architecture ੄ ߸ച Builder ഝਊ Builder ܳ ഝਊ೧ ё୓ܳ ز੸ਵ۽ ࢤࢿೞח ৘द
8. Architecture ੄ ߸ച ׮নೠ ಁఢਸ জ ղীࢲ ഝਊ ੄ઓࢿ ӏ஗ਸ ݅઒ೞݶ п ചݶ੄ ইఃఫ୊ ಁఢী ઁೠਸ ف૑ ঋ਺ ূ૑פযо ചݶী ੸೤ೠ ҳઑܳ ࢶఖೞח Ѫਸ ӂ੢ೣ Clean Swift ReactorKit RIBs
9. UI ੄ ߸ച
10. UI ੄ ߸ച Texture Texture ח ۣࠗ٘Ҋ ߈਽੉ ࡅܲ ੋఠಕ੉झܳ ਤೠ UI Framework ੑפ׮. Auto-layout ژח Storyboard ܳ ࢎਊೞ૑ ঋҊ Texture Layout API ܳ ࢎਊ೧ UI ۽ ࠗఠ ੌযաח ಌನݢझ ੉गա ׮নೠ ߡӒ ೧Ѿী ؀ೠ ࠗ׸хਸ ઴ੌ ࣻ ੓णפ׮. … ……
11. UI ੄ ߸ച Texture рױೞѱ ੿ܻೞݶ
12. UI ੄ ߸ച Texture ࢿמ੉ ୭੸ചػ UI ܳ औѱ ੘ࢿೡ ࣻ ੓ח Framework
13. UI ੄ ߸ച Texture ੄ ъ۱ೠ API 1. ׮নೠ Node : ழޭפ౭ ࢲ࠺झীࢲ ೙ਃೠ ݆਷ ஹನք౟৬ ӝמ ઁҕ 2. LayoutSpec : Flexbox ӝ߈੄ ࡅܰҊ ਬোೠ ۨ੉ইਓ ࢸ҅о оמ 3. Intelligent Preloading : झ௼܀ী ٮܲ ஶబஎ ۽٘ܳ ୭੸ച 4. Interface State: ࠭ (Cell) о ࠁৈ૑Ҋ ࢎۄ૑ח ੿ഛೠ द੼ਸ ౵ঈ оמ
14. UI ੄ ߸ച Intelligent Preloading https://youtu.be/wrctPJxskhI
15. UI ੄ ߸ച Texture ীࢲ ߊࢤೠ ޙઁ੼ 1. ֫਷ ૓ੑ੢߷ Flexbox ഋక੄ ۨ੉ইਓ ߑध ࡺ݅ ইפۄ Texture ੄ ة੗੸ੋ LifeCylce җ ةౠೠ ز੘ٜਸ ೣԋ ೟ण೧ঠ ೮যਃ
 ੉۽ ੋ೧ UI ߡӒ ߊࢤद ূ૑פযীѱ ௾ झ౟ۨझ۽ ੘ਊ೮যਃ
16. UI ੄ ߸ച Texture ীࢲ ߊࢤೠ ޙઁ੼ 2. ೐ۨ੐ਕ௼ ҙܻ ࠗ੤ Texture ݫੋప੉ցٜ੄ Pinterest ృࢎ ١ ׮নೠ ੉ਬ۽ ҙܻ ࠗ੤ iOS 15 ࠗఠ ߊࢤೞח ஖ݺ੸ੋ ޙઁٜ੉ ೧Ѿغ૑ ঋ਺ ࢜۽਍ iOS ߡ੹੉ ܾܻૉ ؼ ٸ݃׮ ௾ ܻझ௼۽ ৈѹ૗
17. UI ੄ ߸ച UIKit ਵ۽ ഥӈ ׼Ӕ ౱ীࢲח ׮द UIKit ਸ ࢎਊೞӝ۽ Ѿ੿ೠ ٍ UI ܳ ؊ ࡅܰҊ ਬোೞѱ ѐߊೡ ࣻ ੓ח ߑߨী ؀೧ Ҋ޹ೞӝ द੘೮যਃ
18. UI ੄ ߸ച FlexLayout & PinLayout ӝઓী ࢎਊೞ؍ Flexbox ӝ߈੄ ۨ੉ইਓ ߑधਸ ഝਊೡ ࣻ ੓Ҋ, ࢿמ੉ ڪযդ FlexLayout ਸ ଻ఖ೮যਃ
19. UI ੄ ߸ച FlexLayout & PinLayout SwiftUI Preview ܳ ഝਊ೧ ূ૑פয੄ ࢤ࢑ࢿਸ ֫ৈਃ
20. UI ੄ ߸ച о੢ ઺ਃೠ ߸ച 1. Frame Layout 2. Auto Layout 3. FlexLayout & PinLayout 4. SwiftUI ചݶী ٮۄ ਬܻೠ ۨ੉ইਓ ߑध੉ ઓ੤ ূ૑פযח যڃ ജ҃ীࢲب ࢎਊೡ ࣻ ੓ח UI Component ܳ ѐߊ೧ঠ ೣ
21. UI ੄ ߸ച ٣੗ੋ दझమ UI ࢤ࢑ࢿਸ ӓ؀ചೡ ࣻ ੓ח ٣੗ੋ दझమ ѐߊ ٣੗ੋ दझమ ஹನք౟ܳ ࢎਊೞݶ জ ಿ૕ب ૐо • ׮নೠ জ ੽Ӕࢿ ૑ਗ • Figma ৬ ాੌػ ੋఠಕ੉झ ઁҕ • ஘੺ೠ ب௸ݢ౟
22. UI ੄ ߸ച ٣੗ੋ दझమ ஠ఎ۽Ӓ
23. UI ੄ ߸ച Listing Framework ܻझ౟ ഋక੄ UI ௏٘ܳ ѐࢶೞӝ ਤೠ ֢۱ب द੘೮যਃ
24. UI ੄ ߸ച KarrotListingUI View ৬ োѾغח Component ܳ ٜ݅Ҋ
25. UI ੄ ߸ച KarrotListingUI List ী ೡ׼ೞݶ
26. UI ੄ ߸ച KarrotListingUI Component ݽ؛ী োѾػ ܻझ౟ ഋక੄ UI о ۪؊݂
27. UI ੄ ߸ച KarrotListingUI Concept ח SwiftUI ৬ ਬࢎೣ ࢿמ੉ ୭੸ചػ UI ܳ औѱ Ӓܾ ࣻ ੓ب۾ ׮নೠ ӝמٜਸ ୶о઺
28. Feed ੄ ߸ച
29. Feed ੄ ߸ച झ௼܀ ࠭ ஶబஎ੄ ֢୹ ஏ੿ 100% ࠁৈ૗ 100% ࠁৈ૗ 60% ࠁৈ૗ -> ޷֢୹ ചݶী ࠁৈ૑ח ࠺ਯী ٮۄ ֢୹ ৈࠗܳ ౸ױೞҊ੗ ೣ
30. Feed ੄ ߸ച झ௼܀ ࠭ ஶబஎ੄ ֢୹ ஏ੿ ׼Ӕ ౱੄ David ਷ ഥ੹ୡߏ ૘ীࢲ ূо৬ ୡߏਸ ૑ெࠁ׮ ই੉٣যܳ ঳ѱ ظਃ
31. Feed ੄ ߸ച SushiBelt ࠭ܳ ૑ெࠁҊ ӝ؀ೞח ࠺ਯী ب׳ೞݶ ঌ۰઱ח ۄ੉࠳۞ܻܳ ѐߊ೮যਃ
32. Feed ੄ ߸ച SushiBelt ز੘ ৔࢚
33. Ҋ޹ೞҊ ੓ח ޙઁٜ
34. Ҋ޹ೞҊ ੓ח ޙઁٜ ݽ߄ੌ೒ۖಬ ౱ ҅੿, ঌܿ, ؘ੉ఠ, प೷, ࠁউ ١ ࢲ࠺झ੄ ӝ߈੉ غח ௏য ӝמਸ ׮द ࢸ҅ ੗زച৬ Horizontal Component ѐߊਸ ాೠ ূ૑פয੄ ࢤ࢑ࢿ ૐ؀ بݫੋ ѐߊਸ ਤೠ উ੿੸ੋ ࢸ҅ ߑೱ о੉٘
35. Ҋ޹ೞҊ ੓ח ޙઁٜ ଻౴౱ Ҵղ৬ ׮ܲ ҃೷ਸ о૓ Ӗ۽ߥ ࢲ࠺झ ѐߊ ݆਷ ࢎਊ੗о ଵৈೡ ࣻ ੓ח Ӓܛ ଻౴ ӝמ ѐߊ ઺ҊѢې, ز֎ࢤഝ, ز֎ঌ߄ ١ ׮নೠ ࢲ࠺झ োز ׮নೠ ӝמਸ ೠ ചݶীࢲ ҳഅೡ ࣻ ੓ח ਬোೠ ҳઑ ࢸ҅
36. Ҋ޹ೞҊ ੓ח ޙઁٜ ޙઁܳ э੉ ೧Ѿೡ زܐܳ ଺Ҋ ੓যਃ
37. Q&A
38. хࢎ೤פ׮