Flutter/project
-
[Flutter] 위젯, 뷰, 컴포넌트, 스크린 어떤 차이일까? UI 구조를 잡아보자!Flutter/project 2024. 1. 30. 11:06
처음 flutter 개발을 시작하면 가장 먼저 접하는 것이 widget을 이용해 간단한 UI를 제작하는 것입니다. 학습을 하는 단계에서는 위젯을 간단하게 사용해서 화면을 만들지만, UI/UX디자이너와 협업을 하게 되면 요구되는 디자인에 맞게 거의 대부분의 위젯을 커스텀하는 작업이 필요합니다. UI를 구조를 잡기 전엔 제작한 위젯과 화면이 많아질수록 파일 간 이동할 일 있을 때, 방금 작업한 파일의 위치도 생각이 나지 않아 하나하나 파일을 눌러 코드를 보면서 찾았던 기억이 있습니다. 그때 스스로 학습한 것을 바탕으로 프로젝트에 개념을 적용했던 과정을 글로 남겨보도록 하겠습니다. ✓ Widget 플러터에서 위젯은 UI를 구성하는 기본 단위입니다. 위의 화면은 단순히 모든 위젯을 노란박스로 표시한 상태입니..
-
[Flutter] 실제 Repository 패턴 프로젝트 구조 파헤치기#3 (Presentation-Layer)Flutter/project 2024. 1. 30. 10:31
이전 글에서는 클라이언트단의 비즈니스 로직을 다루는 Application-Layer에 대해 말하면서 Result 패턴을 활용해 레이어 간의 독립성을 강화시키는 법 등을 소개했었습니다. 이번에는 사용자와 가장 근접해 있는 view, screen, widget 등을 다루는 Presentation-Layer에 대해 이야기를 나눠보겠습니다. 제 프로젝트를 기반으로 설명하는 거라 아키텍처와 무관한 내용이 포함될 수 있습니다. ❗️주의: 스스로 학습하며 구성한 프로젝트라 현직자 분들이 보시면 이상하게 느끼실 수 있습니다. "쟤는 저런 식으로 해봤구나" 정도로만 봐주시고 만약 틀린 부분을 발견하셨다면 피드백 남겨주시면 감사하겠습니다 해당 글은 이전 글에서 계속 이어집니다. 순서대로 보시고 싶은 분은 아래 글을 참고..
-
[Flutter] 실제 Repository 패턴 프로젝트 구조 파헤치기#1 (Data, Domain)Flutter/project 2024. 1. 22. 19:18
창업 아이템이 정해지고 나서 Flutter를 학습했기 때문에 프로젝트의 모든 과정이 새로웠다. 특히 아키텍처의 도입은 볼륨이 커질수록 생각만큼 매끄럽게 적용하기 어려웠습니다. 이때 제가 겪었던 시행착오들이 다음 개발의 인사이트가 될 수 있을 거라 기대하며 실제 프로젝트의 아키텍처, 폴더 구조를 정리하는 시간을 가져보겠습니다. ❗️주의: 스스로 학습하며 구성한 프로젝트라 현직자 분들이 보시면 이상하게 느끼 실수 있습니다. "쟤는 저런 식으로 해봤구나" 정도로만 봐주시고 만약 틀린 부분을 발견하셨다면 피드백 남겨주시면 감사하겠습니다 이전에 관심사에 대해 다뤘던 글에서 나는 'Layer-First'에 기반한 아키텍처및 프로젝트 구조를 구성했었다고 말했다. 아키텍처에는 정답이 없으며 '팀의 구조를 따라간다'라는..
-
[Flutter] 관심사가 우선일까, 레이어가 우선일까?Flutter/project 2024. 1. 18. 19:34
레포지토리 패턴으로 구성된 리버팟 아키텍처로 프로젝트를 진행하다가 크게 아키텍처 구조를 갈아엎은 적이 있었다. 이유는 어떤 특정한 기준으로 아키텍처 구조를 잡았다가 볼륨이 커지면서 레어어간의 질서를 깨뜨리는 도메인들이 등장했기 때문이었다. 개발자라면 한 번쯤 깊게 고민해 봤을 법한 주제인 거 같아 실제 프로젝트를 하면서 느꼈던 것들을 글로 남겨보려고 한다. "해당 글의 내용은 프로젝트는 레포지토리 패턴으로 구성된 리버팟 아키텍처를 배경으로 하고 있습니다. 특정 아키텍처 패턴에 종속된 주제는 아니지만 리버팟 아키텍처에 대해 배경지식이 필요하다면 아래 글을 참고해 주세요" [Flutter] Repository pattern + Riverpod feat.안드레아 로그인 회원가입 등 구현에 대해 이야기하기 ..
-
[Flutter] 실제 Repository 패턴 프로젝트 구조 파헤치기#2 (Application-Layer)Flutter/project 2024. 1. 17. 21:07
이전 글에선 Data-Layer와 Domain-Layer를 실제 코드와 함께 정리했었습니다. 데이터 레이어와 도메인 레이어는 대부분 api 통신에 관한 코드들로 구성되어 있었습니다. 이번 글에서는 클라이언트단의 비즈니스 로직들을 다루는 Application-Layer 부분을 다뤄보겠습니다. 제 프로젝트를 기반으로 설명하는 거라 아키텍처와 무관한 내용이 포함될 수 있습니다. ❗️주의: 스스로 학습하며 구성한 프로젝트라 현직자 분들이 보시면 이상하게 느끼 실수 있습니다. "쟤는 저런 식으로 해봤구나" 정도로만 봐주시고 만약 틀린 부분을 발견하셨다면 피드백 남겨주시면 감사하겠습니다 해당 글은 이전 글에서 계속 이어집니다. 이해가 필요하신 분은 아래의 글을 참고해 주세요! [Flutter] 실제 Reposit..
-
[Flutter] 에러 핸들링, Custom Exception 관리하기Flutter/project 2024. 1. 15. 19:00
에러가 일어나지 않는 애플리케이션은 세상에 존재할 수없다. 로그인할 때조차도 값을 잘못 입력하면 '비밀번호가 틀렸습니다' 라며 에러가 발생한다. 일반적으로 http통신을 사용해본 적이 있다면 statusCode(상태코드)를 확인하고 try/catch를 이용한 에러핸들링은 접해본 적이 있을 것이다. 하지만 실제로 협업을 하다 보면 사내 또는 팀에서 정한 커스텀 에러코드를 사용하는 일이 훨씬 많다. 이번시간에는 내가 효율적으로 에러 핸들링을 하기 위해 어떻게 예외처리를 했는지 정리하려고 한다. 보통 강의를 보게되면 상태코드를 통한 에러처리만 가르쳐 준다. 틀린 것은 아니지만 팀 프로젝트에 쓰기엔 부족하다. 에러가 일어나게 되는 상황은 매우 다양한데 서버 측에서도 그런 다양한 에러들을 성격에 맞게 커스텀하며 ..
-
[Flutter] Repository 패턴과 아키텍처feat.RiverpodFlutter/project 2024. 1. 14. 16:14
로그인 회원가입 등 구현에 대해 이야기하기 전, 아키텍처에 관해 이야기를 먼저 해야 구현 부분을 매끄럽게 이어갈 수 있을거 같아 글을 쓰게 되었습니다. 아키텍처에 대해 진지하게 생각한 것은 한 백엔드 팀원이 들어오고 난 직후였습니다. 이전의 나는 강의의 내용을 조금씩 수정하며 내가 정확히 어떤 아키텍처를 사용하고 있는지도 모르고 개발을 하고 있었습니다. 그렇게 아키텍처에 대해 학습하고 프로젝트에 적용하는 과정을 거칠 때, 진심으로 개발다운 개발을 하고 있다는 느낌이 들었습니다. 오늘은 길었던 아키텍처 도입 여정에 대해 얘기해보도록 하겠습니다. * 이 글은 codewithAdrea의 riverpod, repository 관련 아티클을 참고하여 작성했습니다. Flutter에서 상태관리 라이브러리들은 동시..
-
[Project] 로그인&회원가입 기능을 설계할 때, UX관점에서 고려해야하는 부분Flutter/project 2024. 1. 12. 05:18
소셜 로그인은 왜 필요한가? 로그인과 회원가입의 경우 앱의 성격에 따라 굉장히 다양하게 흘러간다. '미리'를 제작할 때 비슷한 서비스를 제공하는 앱들을 조사하고 그들이 어떤 형태로 진행고 그 이유는 무엇이며, 우리는 nomal-dev.tistory.com 이전 글에서는 소셜로그인을 사용해야 하는 이유에 대해 알아보았습니다. 그렇다면 실제 '미리' 앱을 예시로, 소셜 로그인이 포함된 로그인&회원가입은 어떤 식으로 설계되는지 그 흐름에 대해 알아보겠습니다. ✓ "미리" 프로젝트의 로그인 및 회원가입 요약 [Project] 맛있는 외식의 시작, '미리' ✓ What Project? "지역 소상공인 식음료매장들의 당일 재고 상품을 파격적인 할인가로 제공하는 O2O 커머스 서비스" 코로나로 인해 전국의 학교들이 ..