์ธํ”„๋Ÿฐ ์˜๋ฌธ ๋ธŒ๋žœ๋“œ ๋กœ๊ณ 
์ธํ”„๋Ÿฐ ์˜๋ฌธ ๋ธŒ๋žœ๋“œ ๋กœ๊ณ 
BEST

[์ฝ”๋“œํŒฉํ† ๋ฆฌ] [์ค‘๊ธ‰] Flutter ์ง„์งœ ์‹ค์ „! ์ƒํƒœ๊ด€๋ฆฌ, ์บ์‹œ๊ด€๋ฆฌ, Code Generation, GoRouter, ์ธ์ฆ๋กœ์ง ๋“ฑ ์ค‘์ˆ˜๊ฐ€ ๋˜๊ธฐ ์œ„ํ•œ ํ•„์ˆ˜ ์Šคํ‚ฌ๋“ค!

์ด ๊ฐ•์˜๋ฅผ ํ†ตํ•ด ์ฃผ๋‹ˆ์–ด๊ธ‰ Flutter ๊ฐœ๋ฐœ์ž๊ฐ€ ์ค‘๊ธ‰ Flutter ๊ฐœ๋ฐœ์ž๊ฐ€ ๋˜๊ธฐ๊นŒ์ง€ ํ•„์š”ํ•œ ํ•„์ˆ˜ ์ง€์‹๋“ค์„ ๋‹จ๊ธฐ๊ฐ„์— ๋ฐฐ์›Œ๋ณผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์ค‘๊ธ‰์ž๋ฅผ ์œ„ํ•ด ์ค€๋น„ํ•œ
[๋ชจ๋ฐ”์ผ ์•ฑ ๊ฐœ๋ฐœ] ๊ฐ•์˜์ž…๋‹ˆ๋‹ค.

์ด๋Ÿฐ ๊ฑธ ๋ฐฐ์šธ ์ˆ˜ ์žˆ์–ด์š”

  • Flutter

  • Riverpod ์ƒํƒœ๊ด€๋ฆฌ

  • Pagination

  • JWT ํ† ํฐ๊ด€๋ฆฌ ๋ฐ ์ธ์ฆ

  • Optimistic Response

  • JsonSerializable

  • GoRouter

  • Retrofit

  • Dio ํ† ํฐ๊ด€๋ฆฌ ์ž๋™ํ™”

  • ์‹ค์ „ OOP

  • Debounce and Throttle

์ค‘๊ธ‰ ํ”Œ๋Ÿฌํ„ฐ ๊ฐœ๋ฐœ์ž๋กœ ์—…๊ทธ๋ ˆ์ด๋“œํ•˜๊ณ  ์‹ถ๋‹ค๋ฉด? 
๋ฏฟ๊ณ ๋ณด๋Š” ์ฝ”๋“œํŒฉํ† ๋ฆฌ์˜ ์‹ค๋ฌด ์ค‘์‹ฌ ๊ฐ•์˜ ๐Ÿ–ฅ

๊ต๋ณด๋ฌธ๊ณ  2023 ์ƒ๋ฐ˜๊ธฐ ๋ฒ ์ŠคํŠธ์…€๋Ÿฌ ์ €์ž๊ฐ€ ์ง์ ‘ ๊ฐ€๋ฅด์ณ์ฃผ๋Š” ๊ฐ•์˜

์ปดํ“จํ„ฐ/IT ๋ถ€๋ฌธ 23์œ„ TOP30 ์ด๋‚ด ์œ ์ผํ•œ ์•ฑ ๊ฐœ๋ฐœ ์„œ์ \

 

ํ”Œ๋Ÿฌํ„ฐ๋งŒ์œผ๋กœ 2022๋…„ ์Šˆํผ๋ฃจํ‚ค ๋‹ฌ์„ฑ!

๋Œ€๊ธฐ์—…์—์„œ๋„ ์ฐพ๋Š” ๊ฐ•์˜! ๋ฆฌ๋ทฐ๊ฐ€ ์ฆ๋ช…ํ•˜๋Š” ์ตœ๊ณ ์˜ ๊ฐ•์˜ ๋ณด์žฅํ•ด๋“œ๋ฆฝ๋‹ˆ๋‹ค!

 

 

๐Ÿ™‹โ€โ™‚๏ธ ์ˆ˜๊ฐ• ์ „ ์ฐธ๊ณ ์‚ฌํ•ญ


  • ์ด ๊ฐ•์˜๋Š” ๋‹จ์ˆœํžˆ "๋ฐฐ๋‹ฌ์•ฑ"์„ ๋งŒ๋“ค๊ธฐ ์œ„ํ•ด ์ œ์ž‘๋œ ๊ฐ•์˜๊ฐ€ ์•„๋‹™๋‹ˆ๋‹ค! ์ ˆ๋Œ€ ํด๋ก  ์ฝ”๋”ฉ์ด ์•„๋‹ˆ๋‹ˆ ๋‹จ์ˆœํžˆ ๋ฐฐ๋‹ฌ์•ฑ์„ ๋งŒ๋“œ๋Š” ๋ฐฉ๋ฒ•์„ ๋ฐฐ์šฐ๊ณ  ์‹ถ์€ ๋ถ„์—๊ฒ ์ ํ•ฉํ•˜์ง€ ์•Š์€ ๊ฐ•์˜์ผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋ฐฐ๋‹ฌ์•ฑ ์ปจ์…‰์€ ์ œ๊ฐ€ ์ „๋‹ฌํ•˜๋ ค๋Š” ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์ง€์‹์˜ ๋งค๊ฐœ์ฒด ์—ญํ• ์„ ํ• ๋ฟ์ž…๋‹ˆ๋‹ค. ์–ด๋–ค ์•ฑ์ด๋“  ๊ผญ ์•Œ์•„์•ผํ•˜๊ณ  ์ ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ์ง€์‹์„ ๋‹ด์•˜์œผ๋‹ˆ ์ฐธ๊ณ ํ•ด์ฃผ์„ธ์š”!
  • ์ฝ”๋“œํŒฉํ† ๋ฆฌ Flutter ์ดˆ๊ธ‰ ๊ฐ•์˜์— ๋น„ํ•ด ๋‚œ์ด๋„๊ฐ€ ๋งค์šฐ ๋†’์Šต๋‹ˆ๋‹ค! ์‹ค์ „์— ๊ผญ ํ•„์š”ํ•œ ์ง€์‹๋“ค์„ ๋‹ด์•˜์œผ๋‹ˆ ์—ฌ๋Ÿฌ ๋ฒˆ ๋ฐ˜๋ณตํ•ด์„œ ์™„์ „ ๋‚ด ๊ฒƒ์œผ๋กœ ๋งŒ๋“ ๋‹ค๋Š” ๋งˆ์ธ๋“œ๋กœ ์ˆ˜๊ฐ•ํ•ด์ฃผ์„ธ์š”. 100% ํก์ˆ˜ํ•˜๊ณ  ๋‚˜๋ฉด ๋‹น์žฅ ์‹ค๋ฌด ํˆฌ์ž…์ด ๊ฐ€๋Šฅํ•œ ๊ฐœ๋ฐœ์ž๊ฐ€ ๋˜๋ฆฌ๋ผ๊ณ  ์ž์‹ ํ•ฉ๋‹ˆ๋‹ค!
  • ์ด๋ฒˆ ํ”„๋กœ์ ํŠธ๋Š” ์‹ค์ œ ์„œ๋ฒ„ ์—ฐ๋™ ์‹ค์ „๊ฐ๊ฐ์„ ํ‚ค์šฐ๊ธฐ ์œ„ํ•ด ์ œ๊ฐ€ ์ง์ ‘ ์ œ์ž‘ํ•œ NestJS๊ธฐ๋ฐ˜์˜ REST API ์„œ๋ฒ„๋ฅผ ์ œ๊ณตํ•ด๋“œ๋ฆฝ๋‹ˆ๋‹ค. Swagger ์„œ๋ฒ„ ๋‹คํ๋ฉ˜ํ…Œ์ด์…˜์„ ๋ณด๋ฉด์„œ ์‹ค์ „์ฒ˜๋Ÿผ API ์—ฐ๋™์„ ์ง„ํ–‰ํ•˜๋ฉฐ ์ฃผ๋‹ˆ์–ด ๊ฐœ๋ฐœ์ž๋“ค์ด ์•Œ์•„์•ผ ํ•  ํ•„์ˆ˜ ์ง€์‹๋“ค์„ ์ตํž™๋‹ˆ๋‹ค.

ํ•™์Šต ๋‚ด์šฉ ๐Ÿ“š


1) Authentication (์ธ์ฆ ๋กœ์ง)

ํ˜„๋Œ€์— ๊ฐ€์žฅ ๋งŽ์ด ์‚ฌ์šฉ๋˜๋Š” Token Authentication ์ค‘์—์„œ๋„ Refresh Token๊ณผ Access Token์„ ์‚ฌ์šฉํ•ด์„œ ์ธ์ฆ์„ ์ง„ํ–‰ํ•˜๋Š” ์‹œ์Šคํ…œ์„ ๊ณต๋ถ€ํ•ฉ๋‹ˆ๋‹ค. Dio๋ฅผ ์ด์šฉํ•ด์„œ ์ž๋™์œผ๋กœ ํ† ํฐ์„ ๊ฐฑ์‹ ํ•˜๋Š” ๋ฐฉ๋ฒ•๋„ ํ•™์Šตํ•ฉ๋‹ˆ๋‹ค.


2) Pagination

Page ๊ธฐ๋ฐ˜์˜ Pagination๊ณผ Cursor ๊ธฐ๋ฐ˜์˜ Pagination ์ด๋ก ์„ ๋ฐฐ์šด ํ›„ Cursor Pagination์„ OOP๋กœ ํšจ์œจ์ ์œผ๋กœ ํ’€์–ด๋ณผ ์ˆ˜ ์žˆ๋Š” ๋ฐฉ๋ฒ•์— ๋Œ€ํ•ด ๊นŠ๊ฒŒ ํ•™์Šตํ•ฉ๋‹ˆ๋‹ค.


3) JsonSerializable

JsonSerializable์€ ๋ชจ๋ธ์„ ์ƒ์„ฑํ• ๋•Œ JSON์„ ์˜ค๋ธŒ์ ํŠธ๋กœ Serializeํ•˜๋Š” ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•  ํ•„์š”๊ฐ€ ์—†๊ฒŒ ๋งŒ๋“ค์–ด์ค๋‹ˆ๋‹ค. JsonSerializable ๊ธฐ๋ณธ ์‚ฌ์šฉ๋ฒ•๊ณผ Pagination๊ณผ ์—ฐ๋™ํ•œ Inheritance ์ ์šฉ๋ฒ•๋„ ๋ฐฐ์›Œ๋ด…๋‹ˆ๋‹ค.


4) Retrofit

Retrofit์€ Flutter์˜ Code Generation ์ค‘ ๊ฐ€์žฅ ์œ ์šฉํ•œ ํˆด์ด๊ณ , REST API ๋งคํ•‘์„ ์ž๋™์œผ๋กœ ํ•ด์ฃผ๋ฉฐ JsonSerializable๊ณผ ํ˜ธํก์ด ๋งค์šฐ ์ข‹์€ ํŒจํ‚ค์ง€์ž…๋‹ˆ๋‹ค. Retrofit์„ ์ด์šฉํ•ด์„œ ๋ชจ๋“  API ๋งคํ•‘์„ ์ง„ํ–‰ํ•ฉ๋‹ˆ๋‹ค.


5) Riverpod ๋ฐ Cache ๊ด€๋ฆฌ

Riverpod์— ์กด์žฌํ•˜๋Š” ๋ชจ๋“  Provider๋“ค์˜ ์‚ฌ์šฉ๋ฒ•์„ ๋ฐฐ์›Œ๋ณด๊ณ  ์‹ค์ „์— ์ ์šฉ๋„ ํ•ด๋ด…๋‹ˆ๋‹ค. ์ถ”๊ฐ€์ ์œผ๋กœ ์—ฌ๋Ÿฌ Provider๋ฅผ ๋™์‹œ์— ๊ด€๋ฆฌํ•˜๋ฉฐ Cache๋ฅผ ์ตœ์ ํ™”ํ•ด์„œ ๊ด€๋ฆฌํ•˜๋Š” ๋ฐฉ๋ฒ•๋„ ๋ฐฐ์›Œ๋ด…๋‹ˆ๋‹ค.

 

6) GoRouter

์•ฑ/์›น์—์„œ ์‚ฌ์šฉํ•œ ๋ผ์šฐํŒ… ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์ธ GoRouter๋Š” Dynamic Link, Deep Link, Redirect, Refresh๋ฃฐ๋“ฑ ์œ ์šฉํ•œ ๊ธฐ๋Šฅ์„ ๊ธฐ๋ณธ์œผ๋กœ ์ œ๊ณตํ•ด์ค๋‹ˆ๋‹ค. ์ด๋ฅผ ํ†ตํ•ด ์ธ์ฆ ์‹œ์Šคํ…œ์„ ์™„๋ฒฝํžˆ ๊ตฌ์„ฑํ•ด๋ด…๋‹ˆ๋‹ค.


7) Debounce and Throttle

Debounce์™€ Throttle์€ ์„œ๋ฒ„์˜ ๊ณผ๋ถ€ํ•˜๋ฐ ์•ฑ์˜ ์ตœ์ ํ™”๊นŒ์ง€ ์ƒ๊ฐํ•ด๋ณผ ์ˆ˜ ์žˆ๋Š” ์ค‘์š”ํ•œ ๊ธฐ์ˆ ์ž…๋‹ˆ๋‹ค. ์ด๋ฒˆ ๊ฐ•์˜์—์„œ Debounce๋ฐ Throttle์˜ ์ ์ ˆํ•œ ์‚ฌ์šฉ ์ƒํ™ฉ๊ณผ ์‚ฌ์šฉ๋ฒ•์„ ๋ฐฐ์›Œ๋ด…๋‹ˆ๋‹ค.


8) Swagger

์„œ๋ฒ„ ๊ฐœ๋ฐœ์ž๊ฐ€ ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์ž์™€ ์†Œํ†ตํ•˜๊ธฐ์œ„ํ•ด ๊ฐ€์žฅ ๋งŽ์ด ์‚ฌ์šฉํ•˜๋Š” ๋‹คํ๋ฉ˜ํ…Œ์ด์…˜ ํˆด์ธ Swagger๋ฅผ ์‚ฌ์šฉํ•ด์„œ API ๊ทœ๊ฒฉ์„ ์ดํ•ดํ•˜๊ณ  ํ”„๋ก ํŠธ์—”๋“œ ์ฝ”๋“œ๋กœ ์†Œํ™”์‹œํ‚ค๋Š” ๋ฐฉ๋ฒ•์„ ๋ฐฐ์›๋‹ˆ๋‹ค.


9) Optimistic Response

Optimistic Response๋Š” ๊ธ์ •์  ์‘๋‹ต์„ ์˜ˆ์ธกํ•ด์„œ ๋ฏธ๋ฆฌ ์บ์‹œ๋ฅผ ์—…๋ฐ์ดํŠธํ•˜๋Š” ๊ธฐ์ˆ ์ž…๋‹ˆ๋‹ค. ์–ด๋–ค ์ƒํ™ฉ์— ์–ด๋–ป๊ฒŒ ์ ์šฉํ•˜๋ฉด ์ข‹์€์ง€ ์ด ๊ฐ•์˜์—์„œ ๋ฐฐ์›Œ๋ณผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.


์†Œ๊ฐœํ•ฉ๋‹ˆ๋‹ค,
ํ”„๋กœ์ ํŠธ ์Šคํฌ๋ฆฐ! ๐Ÿคธโ€โ™€๏ธ

#1 ์Šคํ”Œ๋ž˜์‹œ ์Šคํฌ๋ฆฐ

์ฒซ ์•ฑ ์‹คํ–‰ ์‹œ ํ•„์š”ํ•œ ์ธ์ฆ/๊ฒ€์ฆ ๋กœ์ง๊ณผ ๋ผ์šฐํŒ… ๋กœ์ง์„ ์„ธํŒ…ํ•ฉ๋‹ˆ๋‹ค.

#2 ๋กœ๊ทธ์ธ ํŽ˜์ด์ง€

๋กœ๊ทธ์ธ ์Šคํฌ๋ฆฐ์ž…๋‹ˆ๋‹ค.

#3 ๋ ˆ์Šคํ† ๋ž‘ ๋ฆฌ์ŠคํŠธ ํŽ˜์ด์ง€

๋ ˆ์Šคํ† ๋ž‘ ์ •๋ณด๋ฅผ Paginationํ•˜๋Š” ํ™ˆ์Šคํฌ๋ฆฐ์ž…๋‹ˆ๋‹ค.
Pagination๊ณผ Throttle์— ๋Œ€ํ•ด ๋ฐฐ์›Œ๋ณด๊ณ  ์ง์ ‘ ์‹ค์ „์— ์ ์šฉํ•ด๋ด…๋‹ˆ๋‹ค.

#4 ๋ ˆ์Šคํ† ๋ž‘ ์ƒ์„ธํŽ˜์ด์ง€

๋ ˆ์Šคํ† ๋ž‘์˜ ์ƒ์„ธํŽ˜์ด์ง€๋กœ ์ฃผ๋ฌธํ•  ์Œ์‹์„ ์„ ํƒํ•  ์ˆ˜ ์žˆ๊ณ , ์•„๋ž˜๋กœ ์Šคํฌ๋กคํ•˜๋ฉด ๋ ˆ์Šคํ† ๋ž‘ ๋ฆฌ๋ทฐ๋„
์กฐํšŒ ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค. Custom Scroll View๋ฅผ ์ด์šฉํ•ด ์—ฌ๋Ÿฌ ๊ฐœ์˜ Sliver List๋ฅผ ์‹ค์ „์— ์ ์šฉํ•ด๋ด…๋‹ˆ๋‹ค.

#5 ์žฅ๋ฐ”๊ตฌ๋‹ˆ ํŽ˜์ด์ง€

์„ ํƒํ•œ ์Œ์‹์„ ํ™•์ธํ•  ์ˆ˜ ์žˆ๋Š” ์žฅ๋ฐ”๊ตฌ๋‹ˆ ์Šคํฌ๋ฆฐ์ž…๋‹ˆ๋‹ค.
Optimistic Response์™€ Debounce ๊ธฐ๋Šฅ์„ ๋ฐฐ์›Œ๋ณด๊ณ  ์ ์šฉํ•ด๋ด…๋‹ˆ๋‹ค.

#6 ์Œ์‹ ๋ฆฌ์ŠคํŠธ ํƒญ

์Œ์‹๋“ค์„ ๋ฆฌ์ŠคํŠธ๋กœ ์กฐํšŒํ•  ์ˆ˜ ์žˆ๋Š” ํŽ˜์ด์ง€์ž…๋‹ˆ๋‹ค.
Pagination ์ผ๋ฐ˜ํ™” ๋ฐ ๊ณ ๊ธ‰ ์บ์‹œ๊ด€๋ฆฌ ๊ธฐ๋Šฅ์„ ๋ฐฐ์›Œ๋ด…๋‹ˆ๋‹ค.

#7 ์ฃผ๋ฌธ ๋ฆฌ์ŠคํŠธ ๋žฉ

์ฃผ๋ฌธ๋“ค์„ ์กฐํšŒํ•  ์ˆ˜ ์žˆ๋Š” ํƒญ์œผ๋กœ, Pagination ์ผ๋ฐ˜ํ™”๋ฅผ ํ•ด๋ด…๋‹ˆ๋‹ค.

#8 ํ”„๋กœํ•„ ํƒญ

๋กœ๊ทธ์•„์›ƒ ๊ธฐ๋Šฅ์ด ์žˆ๋Š” ํ”„๋กœํ•„ ํƒญ์ž…๋‹ˆ๋‹ค.


๊ฐ•์˜ ํ•œ ๋งˆ๋”” ๐ŸŽ™

Flutter๊ฐ€ ์ถœ์‹œ๋œ ๋’ค๋กœ ์ˆ˜๋งŽ์€ ํฌ๊ณ  ์ž‘์€ ํ”„๋กœ์ ํŠธ๋ฅผ ์ง์ ‘ ๊ฒฝํ—˜ํ•ด๋ดค์Šต๋‹ˆ๋‹ค. ๊ทธ๋ฆฌ๊ณ  ์ตœ๊ทผ์—๋Š” ์ฑ„์šฉ๊ณผ ์ปจ์„คํŒ…์˜ ๋ชฉ์ ์œผ๋กœ ๋งŽ์€ ์ธํ„ฐ๋ทฐ๋ฅผ ๋ณด๋ฉด์„œ ๋งŽ์€ ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์ž๋“ค์ด ๋‹จ์ˆœํžˆ UI๋ฅผ ๊ทธ๋ ค๋‚ด๋Š”๋ฐ ํฌ์ปค์Šค๋ฅผ ๊ณผํ•˜๊ฒŒ ๋งž์ถ˜๋‹ค๋Š” ์ƒ๊ฐ์ด ๋“ค์—ˆ์Šต๋‹ˆ๋‹ค. ๋ฌผ๋ก  ๋ณด๊ธฐ์ข‹์€ UI๋ฅผ ๊ทธ๋ ค๋‚ด๋Š” ๊ฒƒ์€ ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์ž์˜ ๊ฐ€์žฅ ์ค‘์š”ํ•œ ์Šคํ‚ฌ ์ค‘ ํ•˜๋‚˜์ž…๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ ์ •ํ™•ํ•œ ์ปดํ“จํ„ฐ ๊ณตํ•™์  ์ดํ•ด๋„์™€ ํ”„๋กœ์ ํŠธ๋ฅผ ๊ฐ–์ถ”๊ณ  ๊ตฐ๋”๋”๊ธฐ ์—†๋Š” ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•ด ๋‚˜๊ฐ€๋Š” ๊ฒƒ ๋˜ํ•œ ๊ทธ์— ๋ชป์ง€์•Š๊ฒŒ ์ค‘์š”ํ•ฉ๋‹ˆ๋‹ค.

์ด๋ฒˆ ๊ฐ•์˜๋Š” ์‹ค๋ฌด ๊ฒฝํ—˜์ด ๋ถ€์กฑํ•œ Flutter ๊ฐœ๋ฐœ์ž๋“ค์ด ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•  ๋•Œ ์›ํ™œํ•œ ํ˜‘์—…๊ณผ ์œ ์ง€๊ด€๋ฆฌ์˜ ๊ด€์ ์—์„œ ์–ด๋–ค ๊ณ ๋ฏผ์„ ํ•ด์•ผ ํ•˜๋Š”์ง€ ํ•™์Šตํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. Flutter ์ดˆ๋ณด๊ฐ•์˜์™€ ๋‹ค๋ฅด๊ฒŒ ์ด ๊ฐ•์˜๋Š” ํ•˜๋‚˜์˜ ํ”„๋กœ์ ํŠธ๋ฅผ ์ง„ํ–‰ํ•˜๋ฉฐ ์ค‘๊ธ‰ Flutter ๊ฐœ๋ฐœ์ž๋กœ์„œ ๊ผญ ์•Œ์•„์•ผํ•˜๋Š” ์ง€์‹๊ณผ ์ข‹์€ ์ฝ”๋“œ ์ž‘์„ฑ ๋ฐฉ์‹์— ์ง‘์ค‘ํ•ฉ๋‹ˆ๋‹ค. ํ”„๋กœ์ ํŠธ์˜ ์ค‘๊ฐ„๋งˆ๋‹ค ๊ณ ์˜์ ์œผ๋กœ ํ•จ์ •๋“ค์„ ์‹ฌ์–ด๋‘๊ณ  ์ด๋ฅผ ๊ทน๋ณตํ•ด๋‚˜๊ฐ€๋ฉฐ ์–ด๋–ป๊ฒŒ ๋”์šฑ ์ข‹์€ ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•  ์ˆ˜ ์žˆ๋Š”์ง€ ๋งˆ์Œ์œผ๋กœ ์ง์ ‘ ๋А๋ผ๋Š”๋ฐ ์ง‘์ค‘์„ ํ–ˆ์Šต๋‹ˆ๋‹ค. ์ฃผ๋‹ˆ์–ด ์ˆ˜์ค€์˜ Flutter ๊ฐœ๋ฐœ์ž๋ฅผ ์‹ค๋ฌด์— ํˆฌ์ž…์ด ๊ฐ€๋Šฅํ•œ ์ˆ˜์ค€๊นŒ์ง€ ์‹ค๋ ฅ์„ ๋Œ์–ด์˜ฌ๋ฆฌ๋Š”๋ฐ ์ดˆ์ ์ด ๋งž์ถฐ์ ธ์žˆ์Šต๋‹ˆ๋‹ค. ์‹ค์ œ ํ”„๋กœ์ ํŠธ์—์„œ ๊ผญ ์•Œ๊ณ ์žˆ์–ด์•ผํ•˜๋Š” ํ•„์ˆ˜ ์ง€์‹์ธ Authentication ์‹œ์Šคํ…œ, Refresh, Access Token ๊ด€๋ฆฌ, ๊ธ€๋กœ๋ฒŒ ์ƒํƒœ๊ด€๋ฆฌ, Pagination, Debounce์™€ Throttle ๋“ฑ์„ ํ•œ๋ฒˆ์— ์‹ค์ œ ํ”„๋กœ์ ํŠธ์— ์ ์šฉํ•ด๋ณด๋ฉฐ ๊ณต๋ถ€ํ•ฉ๋‹ˆ๋‹ค.


์ด๋Ÿฐ ๋ถ„๋“ค์—๊ฒŒ ์ถ”์ฒœํ•ด์š” ๐Ÿ–

์ด์ œ ๋ง‰ Flutter ์ดˆ๋ณด ๋”ฑ์ง€๋ฅผ ๋—€ ์ƒํƒœ๋กœ
ํ•œ ๋‹จ๊ณ„ ์ง€์‹ ๋ ˆ๋ฒจ์—…์„ ํ•˜๊ณ ์‹ถ์œผ์‹  ๋ถ„

์–ด๋А ์ •๋„ Flutter ํ”„๋กœ๊ทธ๋ž˜๋ฐ์— ๋Œ€ํ•ด ์•Œ์ง€๋งŒ
๋ง‰์ƒ ํ”„๋กœ์ ํŠธ๋ฅผ ์‹œ์ž‘ํ•˜๋ ค๋‹ˆ ๋ง‰๋ง‰ํ•˜์‹  ๋ถ„


์ˆ˜๊ฐ•ํ›„๊ธฐ๋ฅผ ๋ชจ์•˜์–ด์š” ๐Ÿ“œ


์ตœ๊ณ ์˜ ์ปค๋ฎค๋‹ˆ์ผ€์ด์…˜ ๐Ÿง‘๐Ÿผโ€๐Ÿซ

๋งค์ฃผ ์œ ํŠœ๋ธŒ ๋ผ์ด๋ธŒ๋ฅผ ํ†ตํ•ด ์งˆ์˜์‘๋‹ต์„ ๋ฐ›์œผ๋ฉฐ ํ•™์ƒ๋“ค๊ณผ ์†Œํ†ตํ•ฉ๋‹ˆ๋‹ค!

์œ ํŠœ๋ธŒ ๋ผ์ด๋ธŒ ํ‘ธ์‰ฌ์•Œ๋ฆผ์„ ๋ฐ›๊ณ ์‹ถ์œผ์‹œ๋ฉด ์•„๋ž˜ ์ฝ”๋“œํŒฉํ† ๋ฆฌ ์œ ํŠœ๋ธŒ ์ฑ„๋„์„ ๊ตฌ๋…ํ•ด์ฃผ์„ธ์š”!

> ์ฝ”๋“œํŒฉํ† ๋ฆฌ ์œ ํŠœ๋ธŒ ์ฑ„๋„ ๋ฐ”๋กœ๊ฐ€๊ธฐ

 


์ฝ”๋“œํŒฉํ† ๋ฆฌ ์ง‘ํ•„ ์„œ์ 

Must Have ์ฝ”๋“œํŒฉํ† ๋ฆฌ์˜ ํ”Œ๋Ÿฌํ„ฐ ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์„œ์ ์€ ์ œ๊ฐ€ ์˜ค๋žœ ๊ธฐ๊ฐ„ ํˆฌ์žํ•ด์„œ ์ง์ ‘ ์ง‘ํ•„ํ•œ ์ฑ…์ž…๋‹ˆ๋‹ค!
์ดˆ๊ธ‰ ๊ฐ•์˜์™€ ๊ณ‚์น˜๋Š” ๋‚ด์šฉ๋„ ์žˆ๊ณ  ์ดˆ๊ธ‰๊ฐ•์˜์—๋Š” ์—†๋Š” Firebase ๋ฐ ๊ด‘๊ณ ๋“ฑ์—๋Œ€ํ•œ ๊ฐ•์˜๋„ ์žˆ์Šต๋‹ˆ๋‹ค!
EBook์ด๋‚˜ ์‹ค๋ฌผ ์„œ์ ์„ ์ข‹์•„ํ•˜์‹œ๋Š” ๋ถ„๋“ค์—๊ฒŒ ์ถ”์ฒœ๋“œ๋ฆฝ๋‹ˆ๋‹ค!
์„œ์ ์€ ๊ต๋ณด๋ฌธ๊ณ , Yes24, ์•Œ๋ผ๋”˜๋“ฑ ๋ฉ”์ด์ € ์„œ์ ์—์„œ ๋งŒ๋‚˜ ๋ณผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค!
์•„๋ž˜ ์ด๋ฏธ์ง€๋ฅผ ํด๋ฆญํ•ด์„œ ์ด๋™ํ•ด์ฃผ์„ธ์š”!


Q&A ๐Ÿ’ฌ

Q. ์ฝ”๋“œํŒฉํ† ๋ฆฌ Flutter ์ดˆ๋ณด๊ฐ•์˜๋ฅผ ๊ผญ ์ˆ˜๊ฐ•ํ•ด์•ผํ•˜๋‚˜์š”?

์ฝ”๋“œํŒฉํ† ๋ฆฌ Flutter ์ดˆ๋ณด๊ฐ•์˜์— ์ค€ํ•˜๋Š” ์ง€์‹์ด ์ด๋ฏธ ์žˆ๋‹ค๋ฉด ์ถ”๊ฐ€๋กœ ์ˆ˜๊ฐ•ํ•  ํ•„์š”๋Š” ์—†์Šต๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ ์ฝ”๋“œํŒฉํ† ๋ฆฌ Flutter ์ดˆ๋ณด๊ฐ•์˜๋ฅผ ์ˆ˜๊ฐ•ํ–ˆ๋‹ค๋Š” ๊ฐ€์ •ํ•˜์— ์ œ์ž‘๋œ ๊ฐ•์˜์ด๊ธฐ ๋•Œ๋ฌธ์— ์ด๋ฏธ ์„ค๋ช…ํ•œ ๊ฐœ๋…์€ ๋ฐ˜๋ณตํ•ด์„œ ์„ค๋ช…ํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์ตœ์†Œ ์ฝ”๋“œํŒฉํ† ๋ฆฌ Flutter ์ดˆ๋ณด๊ฐ•์˜์— ์ค€ํ•˜๋Š” ์ง€์‹์ด ์—†๋‹ค๋ฉด ๋”ฐ๋ผ์˜ค๊ธฐ ํž˜๋“  ๊ฐ•์˜์ด๋‹ˆ ์ดˆ๋ณด ๊ฐ•์˜๋ถ€ํ„ฐ ์ˆ˜๊ฐ•ํ•ด์ฃผ์„ธ์š”!

Q. ๋ฐฐ๋‹ฌ์•ฑ์„ ์ œ์ž‘ํ•˜๋Š” ๊ฐ•์˜์ธ๊ฐ€์š”?

์ง„ํ–‰ํ•˜๋Š” ํ”„๋กœ์ ํŠธ์˜ ์ปจ์…‰์€ ๋ฐฐ๋‹ฌ์•ฑ์ด ๋งž์Šต๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ ๋ฐฐ๋‹ฌ์•ฑ์˜ UI/UX๋‚˜ ๊ธฐ๋Šฅ์˜ ํ”Œ๋กœ์šฐ์™€ ์ „ํ˜€ ๊ด€๋ จ์ด ์—†๋Š” ๊ฐ•์˜์ž…๋‹ˆ๋‹ค. "์ปจ์…‰"๋งŒ ์ง€์‹์„ ์ „๋‹ฌํ•˜๋Š” ๋งค๊ฐœ์ฒด๋กœ ์‚ฌ์šฉํ•  ๋ฟ์ด๊ณ  ์ฃผ๋‹ˆ์–ด Flutter ๊ฐœ๋ฐœ์ž๊ฐ€ ์ค‘๊ธ‰ Flutter ๊ฐœ๋ฐœ์ž๊ฐ€ ๋˜๊ธฐ์œ„ํ•ด ๊ผญ ์•Œ์•„์•ผํ•˜๋Š” ๋ณดํŽธ์ ์ธ ์ง€์‹๋“ค์„ ์Šต๋“ํ•˜๋Š” ๊ฐ•์˜์ž…๋‹ˆ๋‹ค. ๋‹จ์ˆœํžˆ "๋ฐฐ๋‹ฌ์•ฑ ์ œ์ž‘๋ฒ•"์„ ์œ„ํ•ด์„œ๋Š” ์ด ๊ฐ•์˜๋ฅผ ์ˆ˜๊ฐ•ํ•˜์ง€ ๋งˆ์„ธ์š”!

Q. ์ด ๊ฐ•์˜๋ฅผ ์ˆ˜๊ฐ•ํ•˜๋ฉด ์–ด๋А์ •๋„ ์ˆ˜์ค€์˜ ๊ฐœ๋ฐœ์ž๊ฐ€ ๋  ์ˆ˜ ์žˆ๋‚˜์š”?

ํ•œ๋งˆ๋””๋กœ ๋งํ•˜๋ฉด ๋‹น์žฅ ์‹ค๋ฌด ํˆฌ์ž…์ด ๊ฐ€๋Šฅํ•œ ์ˆ˜์ค€์ด ๋œ๋‹ค๊ณ  ์ƒ๊ฐํ•ฉ๋‹ˆ๋‹ค. ์˜ค๋žœ ๊ธฐ๊ฐ„ ๋™์•ˆ ์—ฌ๋Ÿฌ ํ”„๋กœ์ ํŠธ์™€ ์ธํ„ฐ๋ทฐ๋ฅผ ๋ด์˜ค๋ฉด์„œ Flutter ๊ฐœ๋ฐœ์ž๊ฐ€ ๊ผญ ์•Œ๊ณ ์™”์œผ๋ฉด ์ข‹๊ฒ ๋‹ค๊ณ  ์ƒ๊ฐํ•œ ์ง€์‹๋“ค์„ ๋‹ด์•˜์Šต๋‹ˆ๋‹ค.


๋” ๋งŽ์€ ์ฝ”๋“œํŒฉํ† ๋ฆฌ๋‹˜์˜ ๊ฐ•์˜๋Š”?

[์ž…๋ฌธ] Dart ์–ธ์–ด
4์‹œ๊ฐ„๋งŒ์— ์™„์ „์ •๋ณต

  • Dart ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์–ธ์–ด
  • ๊ฐ์ฒด์ง€ํ–ฅ ํ”„๋กœ๊ทธ๋ž˜๋ฐ
  • ํ•จ์ˆ˜ํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ
  • ๋น„๋™๊ธฐ ํ”„๋กœ๊ทธ๋ž˜๋ฐ

[์ดˆ๊ธ‰] Flutter 3.0 ์•ฑ ๊ฐœ๋ฐœ
- 10๊ฐœ์˜ ํ”„๋กœ์ ํŠธ๋กœ ์ดˆ๋ณด ํƒˆ์ถœ!

  • Dart ์–ธ์–ด ๋งˆ์Šคํ„ฐ
  • Flutter๋กœ ์˜ˆ์œ UI ์ œ์ž‘
  • SQLite ๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค ํ™œ์šฉ๊ธฐ
  • ๋™์˜์ƒ ํ”Œ๋ ˆ์ด์–ด ์•ฑ ์ œ์ž‘

[์ค‘๊ธ‰] Flutter ์ง„์งœ ์‹ค์ „!
์ค‘์ˆ˜๊ฐ€ ๋˜๊ธฐ ์œ„ํ•œ ํ•„์ˆ˜ ์Šคํ‚ฌ๋“ค

  • GoRouter
  • JsonSerializable
  • Dio ํ† ํฐ๊ด€๋ฆฌ ์ž๋™ํ™”
  • Debounce and Throttle

๊ธฐํƒ€ ์‚ฌํ•ญ โœ”๏ธ

(1) ๋„์›€๋ฐ›๊ณ  ๋ฐฐ์šธ ์ˆ˜ ์žˆ๋Š” ๋‹ค๋ฅธ ์ฑ„๋„๋“ค!

๐Ÿญ ์ฝ”๋“œํŒฉํ† ๋ฆฌ ์œ ํŠœ๋ธŒ
๐Ÿ”ฅ ์ฝ”๋“œํŒฉํ† ๋ฆฌ Discord
๐Ÿ’ฌ ์ฝ”๋“œํŒฉํ† ๋ฆฌ ์นด์นด์˜ค ์˜คํ”ˆํ†ก

(2) ๊ฐ•์˜์šฉ์œผ๋กœ ๊ณต์œ ๋˜๋Š” ์ด๋ฏธ์ง€

๊ฐ•์˜์—์„œ ์ œ๊ฐ€ ์ œ๊ณตํ•ด๋“œ๋ฆฌ๋Š” ์ด๋ฏธ์ง€๋“ค์€ ์œ ๋ฃŒ๋กœ ์ง์ ‘ ๊ตฌ๋งคํ•œ ์ด๋ฏธ์ง€๋“ค์ด์˜ˆ์š”. ์ €๋Š” ์ฐฝ์ž‘๋ฌผ์„ ๋งŒ๋“ค์–ด ๋ฐฐํฌํ•ด๋“œ๋ฆด ์ˆ˜ ์žˆ๋Š” ๊ถŒ๋ฆฌ๋ฅผ ๊ตฌ๋งคํ–ˆ์ง€๋งŒ ์—ฌ๋Ÿฌ๋ถ„๋“ค์€ ์ ˆ๋Œ€๋กœ ๋‹ค๋ฅธ ์‚ฌ๋žŒ ๋˜๋Š” ์ธํ„ฐ๋„ท์— ์ด๋ฏธ์ง€๋ฅผ ๋ฐฐํฌํ•˜์‹œ๋ฉด ์•ˆ๋ผ์š”! ์ €์ž‘๊ถŒ ์œ„๋ฐ˜์œผ๋กœ ๋ฒ•์  ๋ฌธ์ œ๊ฐ€ ์ƒ๊ธธ ์ˆ˜ ์žˆ์œผ๋‹ˆ ๊ณต๋ถ€ํ•˜๋Š” ์šฉ๋„ ์™ธ๋กœ ์ด๋ฏธ์ง€๋“ค์„ ์‚ฌ์šฉํ•˜์ง€ ๋งˆ์„ธ์š”.

(3) ์งˆ๋ฌธํ•˜๋Š” ๋ฒ•

ํ”„๋กœ๊ทธ๋ž˜๋ฐ์„ ๋ฐฐ์šฐ๋ฉด์„œ ์ •๋ง ๋น ๋ฅด๊ฒŒ ์‹ค๋ ฅ์„ ๋Š˜๋ฆด ์ˆ˜ ์žˆ๋Š” ๋ฒ•์€ ์˜ฌ๋ฐ”๋ฅด๊ฒŒ ์ •ํ™•ํ•œ ์งˆ๋ฌธ์„ ํ•˜๋Š” ๋ฒ•์„ ๊นจ์šฐ์น˜๋Š”๊ฑฐ์˜ˆ์š”. ํ”„๋กœ๊ทธ๋ž˜๋ฐ์˜ ํŠน์„ฑ์ƒ ์ฝ”๋“œ์˜ ์ „์ฒด๋ฅผ ๋‹ค ๋ด์ฃผ๊ธฐ ์–ด๋ ค์›Œ์š”. ๊ทธ๋Ÿฌ๋‹ˆ ๋ฌธ์ œ๊ฐ€ ๋˜๋Š” ์œ„์ ฏ์˜ ์ฝ”๋“œ๋ฅผ ํ†ต์งธ๋กœ ์˜ฌ๋ฆฐ ํ›„ "์ด๊ฑฐ ์•ˆ๋ผ์š”!" ํ•˜์‹œ๋ฉด ์ œ๊ฐ€ ๋‹ต๋ณ€์„ ํ•ด๋“œ๋ฆฌ๊ธฐ ์–ด๋ ค์›Œ์š”.
์งˆ๋ฌธ์„ ํ•˜์‹ค ๋•Œ๋Š”, ๋ฐ‘์˜ 3๋‹จ๊ณ„๋กœ ์ž˜ ์ •๋ฆฌํ•ด์„œ ์ „๋‹ฌํ•ด์ฃผ์‹œ๋ฉด ํ›จ์”ฌ ๋น ๋ฅด๊ฒŒ ์†Œํ†ตํ•˜๊ณ  ๋‹ต๋ณ€์„ ๋“œ๋ฆด ์ˆ˜ ์žˆ์–ด์š”!

1๏ธโƒฃ  ๋‚ด๊ฐ€ ์ƒ๊ฐํ–ˆ์„๋•Œ ์–ด๋–ค ์‹์œผ๋กœ ์ž‘๋™์ด ๋˜์–ด์•ผ ํ•˜๋Š”์ง€
2๏ธโƒฃ  ํ˜„์žฌ ์–ด๋–ป๊ฒŒ ์ž‘๋™๋˜๋Š”์ง€
3๏ธโƒฃ  ์ •ํ™•ํ•œ ์ฝ”๋“œ์˜ ์œ„์น˜์™€ ์–ด๋–ค ๋ฌธ์ œ๊ฐ€ ์ƒ๊ธฐ๋Š”์ง€ (์˜ˆ์ œ๊นŒ์ง€ ์žˆ์œผ๋ฉด๐Ÿ‘)

์ด๋Ÿฐ ๋ถ„๋“ค๊ป˜
์ถ”์ฒœ๋“œ๋ ค์š”!

ํ•™์Šต ๋Œ€์ƒ์€
๋ˆ„๊ตฌ์ผ๊นŒ์š”?

  • ์–ด๋ ค์šด ์ปจ์…‰์ด๋ผ๋„ ๋ฐ˜๋ณต์ ์œผ๋กœ ์ˆ˜๊ฐ•ํ•˜๊ณ  ํก์ˆ˜ํ•  ์ž์‹ ์ด ์žˆ๋Š”๋ถ„

  • ํ”Œ๋Ÿฌํ„ฐ ๊ฐœ๋ฐœ ๋Šฅ๋ ฅ์„ ํ•œ๋‹จ๊ณ„ ์—…๊ทธ๋ ˆ์ด๋“œ ํ•˜๊ณ ์‹ถ์€๋ถ„

  • ์ฝ”๋“œํŒฉํ† ๋ฆฌ Flutter ์ดˆ๊ธ‰ ๊ฐ•์˜๋ฅผ ์™„์ „ ํก์ˆ˜ํ•˜์‹ ๋ถ„

  • ์‹ค๋ฌด ํ”„๋กœ์ ํŠธ๋ฅผ ๊ฒฝํ—˜ํ•˜๊ณ ์‹ถ์œผ์‹ ๋ถ„

  • ํšŒ์‚ฌ์— ์‹œ๋‹ˆ์–ด ์—”์ง€๋‹ˆ์–ด๊ฐ€ ์—†๋Š” ์ฃผ๋‹ˆ์–ด ๊ฐœ๋ฐœ์ž

์„ ์ˆ˜ ์ง€์‹,
ํ•„์š”ํ• ๊นŒ์š”?

  • Flutter ์ฃผ๋‹ˆ์–ด ๊ฐœ๋ฐœ์ž ์ˆ˜์ค€์˜ ์ง€์‹

์•ˆ๋…•ํ•˜์„ธ์š”
์ฝ”๋“œํŒฉํ† ๋ฆฌ์ž…๋‹ˆ๋‹ค.

26,648

๋ช…

์ˆ˜๊ฐ•์ƒ

1,333

๊ฐœ

์ˆ˜๊ฐ•ํ‰

1,829

๊ฐœ

๋‹ต๋ณ€

5.0

์ 

๊ฐ•์˜ ํ‰์ 

6

๊ฐœ

๊ฐ•์˜

์•ˆ๋…•ํ•˜์„ธ์š” ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๊ฐ•์‚ฌ ์ฝ”๋“œํŒฉํ† ๋ฆฌ์ž…๋‹ˆ๋‹ค!

์ฝ”๋“œํŒฉํ† ๋ฆฌ ํ†ตํ•ฉ ๋งํฌ
https://links.codefactory.ai

 

๐Ÿญ ์ฝ”๋“œํŒฉํ† ๋ฆฌ ์œ ํŠœ๋ธŒ ๋ฐ”๋กœ๊ฐ€๊ธฐ
๐Ÿ”ฅ ์ฝ”๋“œํŒฉํ† ๋ฆฌ Discord ๋ฐ”๋กœ๊ฐ€๊ธฐ
๐Ÿ’ฌ ์ฝ”๋“œํŒฉํ† ๋ฆฌ ์นด์นด์˜ค ์˜คํ”ˆํ†ก ๋ฐ”๋กœ๊ฐ€๊ธฐ

 

๐Ÿ’ผ ์ฃผ์‹ํšŒ์‚ฌ ์ฝ”๋“œํŒฉํ† ๋ฆฌ ๋Œ€ํ‘œ

 

๐Ÿ† 2023๋…„ ์ธํ”„๋Ÿฐ ๋ฒ ์ŠคํŠธ์…€๋Ÿฌ ์ˆ˜์ƒ

๐Ÿ† <<Must Have ์ฝ”๋“œํŒฉํ† ๋ฆฌ์˜ ํ”Œ๋Ÿฌํ„ฐ ํ”„๋กœ๊ทธ๋ž˜๋ฐ>> ์„œ์  2023 ์ƒ๋ฐ˜๊ธฐ ๊ต๋ณด๋ฌธ๊ณ  ์ปดํ“จํ„ฐ/IT ๋ถ€๋ฌธ ๋ฒ ์ŠคํŠธ์…€๋Ÿฌ 23์œ„

๐Ÿ† AWS Certified Developer Associate

๐Ÿ† AWS Certified Solutions Architect

๋”๋ณด๊ธฐ

์ปค๋ฆฌํ˜๋Ÿผ

์ „์ฒด

147๊ฐœ โˆ™ (21์‹œ๊ฐ„ 6๋ถ„)

ํ•ด๋‹น ๊ฐ•์˜์—์„œ ์ œ๊ณต:

์ˆ˜์—…์ž๋ฃŒ
๊ฐ•์˜ ๊ฒŒ์‹œ์ผ: 
๋งˆ์ง€๋ง‰ ์—…๋ฐ์ดํŠธ์ผ: 

์ˆ˜๊ฐ•ํ‰

์•„์ง ์ถฉ๋ถ„ํ•œ ํ‰๊ฐ€๋ฅผ ๋ฐ›์ง€ ๋ชปํ•œ ๊ฐ•์˜์ž…๋‹ˆ๋‹ค.
๋ชจ๋‘์—๊ฒŒ ๋„์›€์ด ๋˜๋Š” ์ˆ˜๊ฐ•ํ‰์˜ ์ฃผ์ธ๊ณต์ด ๋˜์–ด์ฃผ์„ธ์š”!