HKT 2023 버스 위치 추적 시스템

해커톤 프로젝트로 개발된 실시간 버스 위치 추적 시스템입니다. 사용자용 앱과 기사용 앱으로 구성되어 있으며, Google Maps API를 활용하여 실시간으로 버스 위치를 추적하고 표시합니다.

📋 프로젝트 개요

이 프로젝트는 두 개의 Flutter 앱으로 구성되어 있습니다:

• Client 앱: 사용자가 버스 위치를 실시간으로 확인할 수 있는 앱
• Driver 앱: 기사가 자신의 위치를 서버로 전송하는 앱

🏗️ 프로젝트 구조

hkt/
├── client/          # 사용자용 Flutter 앱
│   ├── lib/
│   │   ├── components/      # 재사용 가능한 UI 컴포넌트
│   │   │   ├── my_login_button.dart
│   │   │   ├── my_square_tile.dart
│   │   │   └── my_textfield.dart
│   │   ├── screen/          # 화면 구성
│   │   │   ├── login_screen.dart      # 로그인 화면
│   │   │   ├── service_screen.dart    # 노선 선택 화면
│   │   │   ├── route_anyang.dart      # 안양 노선 지도 화면
│   │   │   └── route.beomgye.dart    # 범계 노선 화면
│   │   └── main.dart
│   └── pubspec.yaml
│
└── driver/          # 기사용 Flutter 앱
    ├── lib/
    │   ├── components/      # 재사용 가능한 UI 컴포넌트
    │   ├── screen/          # 화면 구성
    │   │   ├── login_screen.dart      # 로그인 화면
    │   │   └── service_screen.dart   # GPS 전송 화면
    │   └── main.dart
    └── pubspec.yaml

🚀 시작하기

사전 요구사항

• Flutter SDK (3.0.5 이상)
• Dart SDK
• Android Studio 또는 Xcode (모바일 개발용)
• Google Maps API 키

설치 방법

1. 저장소 클론

   git clone <repository-url>
   cd hkt

2. 의존성 설치

   Client 앱:

   cd client
   flutter pub get

   Driver 앱:

   cd driver
   flutter pub get

3. 앱 설정 파일 생성

   ⚠️ 중요: 민감한 정보(API 키, 서버 주소)는 설정 파일로 관리됩니다.

   Client 앱:

   cd client/lib/config
   cp app_config.example.dart app_config.dart

   그 다음 app_config.dart 파일을 열어 다음 값을 설정하세요:

   • googleMapsApiKey: Google Maps API 키
   • serverBaseUrl: 서버 기본 URL (예: http://your-server.com:9080)

   Driver 앱:

   cd driver/lib/config
   cp app_config.example.dart app_config.dart

   그 다음 app_config.dart 파일을 열어 다음 값을 설정하세요:

   • serverBaseUrl: 서버 기본 URL (예: http://your-server.com:9080)

4. Google Maps API 키 설정

   Android (Client 앱):

   • client/android/app/src/main/AndroidManifest.xml 파일에서 YOUR_GOOGLE_MAPS_API_KEY를 실제 API 키로 변경하거나
   • app_config.dart 파일의 googleMapsApiKey 값을 사용하도록 수정하세요.

   <meta-data
       android:name="com.google.android.geo.API_KEY"
       android:value="YOUR_GOOGLE_MAPS_API_KEY" />

   iOS (Client 앱):

   • client/ios/Runner/AppDelegate.swift 파일에서 YOUR_GOOGLE_MAPS_API_KEY를 실제 API 키로 변경하거나
   • app_config.dart 파일의 googleMapsApiKey 값을 사용하도록 수정하세요.

   GMSServices.provideAPIKey("YOUR_GOOGLE_MAPS_API_KEY")

5. 권한 설정

   Android:

   • android/app/src/main/AndroidManifest.xml에 다음 권한 추가:

   <uses-permission android:name="android.permission.INTERNET" />
   <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
   <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />

   iOS:

   • ios/Runner/Info.plist에 다음 추가:

   <key>NSLocationWhenInUseUsageDescription</key>
   <string>using precise location</string>
   <key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
   <string>using approximate location</string>

💻 실행 방법

Client 앱 실행

cd client
flutter run

Driver 앱 실행

cd driver
flutter run

특정 플랫폼에서 실행

Android:

flutter run -d android

iOS (Mac만 가능):

flutter run -d ios

Windows:

flutter run -d windows

웹:

flutter run -d chrome

🔧 주요 기능

Client 앱 (사용자용)

1. 로그인

   • 사용자 ID와 비밀번호로 로그인
   • 서버 주소는 app_config.dart 파일에서 설정

2. 노선 선택

   • ROUTE ANYANG (안양 노선)
   • ROUTE BEOMGYE (범계 노선)

3. 실시간 버스 위치 추적 (안양 노선)

   • Google Maps를 통한 실시간 버스 위치 표시
   • 1초마다 서버에서 버스 위치 업데이트
   • 버스가 특정 위치 근처에 도착하면 알림 메시지 표시
   • 정류장 마커 표시 (안양역, 대림대학교)

Driver 앱 (기사용)

1. 로그인

   • 기사 ID와 비밀번호로 로그인
   • 서버 주소는 app_config.dart 파일에서 설정

2. GPS 위치 전송

   • 노선 선택 (ROUTE ANYANG 또는 ROUTE BEOMGYE)
   • 선택한 노선에 대해 3초마다 GPS 위치를 서버로 전송
   • 서버 주소는 app_config.dart 파일에서 설정

📡 API 엔드포인트

프로젝트에서 사용하는 서버 API (서버 주소는 app_config.dart에서 설정):

• 로그인: POST {serverBaseUrl}/hk/login.php

  • Body: { "id": "username", "pwd": "password" }

• GPS 데이터 입력 (기사용): POST {serverBaseUrl}/hk/gps_input.php

  • Body: { "bid": 1, "x": "latitude", "y": "longitude", "time": "yyyy-MM-dd HH:mm:ss" }

• GPS 데이터 조회 (사용자용): POST {serverBaseUrl}/hk/gps_output.php

  • Body: { "bid": "1" }

📦 주요 의존성

Client 앱

• flutter: SDK
• http: ^1.0.0: HTTP 요청
• google_maps_flutter: ^2.3.0: Google Maps 통합
• geolocator: ^9.0.2: GPS 위치 서비스
• intl: ^0.18.1: 날짜/시간 포맷팅

Driver 앱

• flutter: SDK
• http: ^1.0.0: HTTP 요청
• geolocator: ^7.0.1: GPS 위치 서비스
• intl: ^0.18.1: 날짜/시간 포맷팅
• flutter_svg: ^0.22.0: SVG 이미지 지원

⚠️ 주의사항

1. 설정 파일 보안:

   • app_config.dart 파일은 .gitignore에 포함되어 있어 GitHub에 업로드되지 않습니다.
   • 실제 사용 시 app_config.example.dart를 복사하여 app_config.dart를 만들고 값을 입력하세요.
   • 절대로 실제 API 키나 서버 주소를 GitHub에 커밋하지 마세요.

2. Google Maps API 키:

   • Google Cloud Console에서 발급받은 API 키를 app_config.dart에 설정하세요.
   • Android/iOS 네이티브 설정에도 API 키를 추가해야 합니다.

3. 서버 주소:

   • 서버 주소는 app_config.dart 파일의 serverBaseUrl에서 설정합니다.
   • 프로덕션 환경에서는 HTTPS를 사용하는 것을 권장합니다.

4. 의존성 업그레이드: 모든 의존성을 최신 버전으로 업그레이드하려면:

   flutter pub upgrade --major-versions

5. GPS 권한: 앱이 정상적으로 작동하려면 위치 권한이 필요합니다.

🛠️ 개발 환경

• Flutter SDK: >=3.0.5 <4.0.0
• Dart SDK: >=3.0.5 <4.0.0
• 플랫폼 지원: Android, iOS, Windows, Web

📝 라이선스

이 프로젝트는 해커톤 프로젝트입니다.

👥 기여자

해커톤 2023 팀

---

참고: 이 프로젝트는 해커톤 프로젝트로, 실제 운영 환경에서 사용하기 전에 보안 및 성능 최적화가 필요할 수 있습니다.