Skip to main content

지역 검색 앱 과제 시작!

· 6 min read
Junseok Yang
Football Loving Programmer

플러터 숙련 주차 개인 과제는

지역 검색 앱 만들기였다!

과제 Key Point

  • Reverpod 상태관리
  • API 활용하기
  • Firebase를 사용한 위치기반 검색 앱 제작
  • 안정성과 사용성
    • 안정성은 예외처리 잘 하기
    • 사용성 UI와 함께 User experience 잘 고려하기

기능 구현

  1. 네이버 검색 Open API를 이용하여 지역검색 기능 구현
  2. Riverpod을 이용하여 MVVM 구조로 프로젝트를 설계
  3. WebView를 사용하여 모바일 앱에서 웹사이트를 출력
  4. GPS를 사용하여 디바이스의 좌표값을 이용
  5. VWORLD OPEN API 를 이용

필수기능

HomePage 구현

  1. AppBar 구현
  2. ListView 구현
    1. ChildrenWidget
      1. title
      2. category
      3. roadAddress
  3. 네이버 검색 Open API를 애용해 지역 검색 기능 구현
    1. API키로 요청 테스트
    2. Location 모델 클래스 생성
    3. LocationRepository 클래스 생성 후 dio 패키지를 사용하여 검색 메서드 구현
    4. flutter_riverpod 패키지를 사용해 뷰 모델을 만든 후 HomePage 위젯과 연결
    5. DetailPage를 만든 후 Location 객체의 link 속성이 https 라는 문자열로 시작하면 DetailPage로 link를 전달하여 이동

도전 기능

현재 위치의 주소 조회 후 네이버 API로 검색

  1. geolocator 패키지를 사용하여 디바이스의 현재 좌표값을 가져오기
  2. HomePage 상태를 관리하는 뷰모델에 위도, 경도 값으로 VWORLD API에서 주소를 가져와 네이버 검색 API로 요청하는 메서드를 추가하기
  3. HomePage Actions 속성에 Icons.gps_fixed 아이콘 데이터를 사용하는 Icon 위젯을 배치
  4. Icon 위젯 터치 시 현재 위치를 가져와 뷰모델에 요청

Readme 작성

  • 이 프로젝트가 무엇인지? 를 알기 쉽게 전달해주는 중요한 역할
  • 프로젝트를 수행하며 조금씩 추가하기
    • 한 가지 기능을 완성했다면 바로 README에 작성하기
  • 간결하고 알기 쉽게

어떤 내용을 추가하면 좋은가?

  • 무엇을 위한 것인가
  • 이 프로젝트를 만들며 어떤 기술적 의사결정을 했는지
  • 어떻게 작동하는가
  • 어떤 트러블이 있었고 트러블 슈팅은 어떻게 진행했는가
  • 예시
    # 프로젝트 이름

    ## 📖 목차

    1. [프로젝트 소개](#프로젝트-소개)
    2. [팀소개](#팀소개)
    3. [프로젝트 계기](#프로젝트-계기)
    4. [주요기능](#주요기능)
    5. [개발기간](#개발기간)
    6. [기술스택](#기술스택)
    7. [서비스 구조](#서비스-구조)
    8. [와이어프레임](#와이어프레임)
    9. [API 명세서](#API-명세서)
    10. [ERD](#ERD)
    11. [프로젝트 파일 구조](#프로젝트-파일-구조)
    12. [Trouble Shooting](#trouble-shooting)

    ## 👨‍🏫 프로젝트 소개

    ## 팀소개

    ## 프로젝트 계기

    ## 💜 주요기능

    - 기능 1

    - 기능 2

    - 기능 3

    - 기능 4

    ## ⏲️ 개발기간

    - 2024.02.26(월) ~ 2024.04.04(목)

    ## 📚️ 기술스택

    ### ✔️ Language

    ### ✔️ Version Control

    ### ✔️ IDE

    ### ✔️ Framework

    ### ✔️ Deploy

    ### ✔️ DBMS

    ## 서비스 구조

    ## 와이어프레임

    ## API 명세서

    ## ERD

    ## 프로젝트 파일 구조

    ## Trouble Shooting

트러블 슈팅

  • [상황 인지]
    • 어떤 현상을 발견했다.
    • 오류가 발생했거나, 잘 작동하고 있어도 개선이 필요한 부분이거나 등
    • 꼭 ‘문제’가 아니더라도 트러블 슈팅을 작성할 수 있습니다! (프로그래밍에는 끝이 없다!)
  • [고민]
    • 이 상황이 생겼을까?
    • 어떻게 대응하면 좋을까?
  • [적용]
    • 내가 알고 있는 방법 적용하기
    • 팀원 또는 튜터님께서 알려주신 방법 적용하기
  • [결과]
    • 문제가 해결되었다
    • 코드가 개선되었다
    • 그래서 나는 무엇을 배웠는지

과제 진행

지금까지 과제는 급하게 하느라 Readme 및 트러블슈팅 기록을 자세히 기록하지 못했는데 그런 부분들을 보충해 가면서 진행하고 싶다.

그리고 Github 프로젝트를 진행해 내가 만들어야 되는 기능들을 Issue화 시켜서 이슈별로 브랜치를 나누고 푸시 컨벤션을 지난 조별과제에서 배웠던 것처럼 진행을 해야겠다! 비록 혼자서 하는 거지만 조별과제라고 생각하고 브랜치 전략과 이슈를 잘 나눠서 진행을 해봐야겠다!