본문 바로가기

코딩

영어 많이 듣자! (시스템 설계서)

728x90
반응형

영어 많이 듣자! 시스템 설계서 🏗️

📋 목차

  1. 시스템 개요
  2. 아키텍처 설계
  3. 기술 스택
  4. 데이터베이스 설계
  5. API 설계
  6. 보안 설계
  7. 성능 최적화

🎯 시스템 개요

시스템 목적

영화 대사 검색을 통한 영어 학습 지원 모바일 애플리케이션

핵심 요구사항

  • 다국어 지원: 한국어-영어 자동 번역
  • 멀티모달 검색: 텍스트 및 음성 입력 지원
  • 실시간 처리: 빠른 검색 및 번역 응답
  • 미디어 스트리밍: 영화 영상 재생 기능
  • 오프라인 지원: 기본 기능 로컬 캐싱

시스템 범위

  • 클라이언트: Flutter 모바일 앱 (Android/iOS)
  • 서버: Django REST API 백엔드
  • 외부 서비스: 번역 API, 음성 인식 서비스
  • 저장소: 영화 데이터베이스, 미디어 파일

🏛️ 아키텍처 설계

전체 시스템 아키텍처

┌─────────────────────────────────────────────────────────────┐
│                     Client Layer                           │
├─────────────────────────────────────────────────────────────┤
│  Flutter Mobile App (Android/iOS)                          │
│  ├── Presentation Layer (UI/UX)                            │
│  ├── Business Logic Layer (Services)                       │
│  └── Data Layer (Local Storage + API Client)               │
└─────────────────────────────────────────────────────────────┘
                              │
                              │ HTTPS/REST API
                              ▼
┌─────────────────────────────────────────────────────────────┐
│                   API Gateway Layer                        │
├─────────────────────────────────────────────────────────────┤
│  Django REST Framework                                     │
│  ├── Authentication & Authorization                        │
│  ├── Request Validation & Rate Limiting                    │
│  └── Response Formatting & Error Handling                  │
└─────────────────────────────────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────┐
│                  Business Logic Layer                      │
├─────────────────────────────────────────────────────────────┤
│  Django Backend Services                                   │
│  ├── Movie Search Service                                  │
│  ├── Quote Management Service                              │
│  ├── User History Service                                  │
│  └── Statistics Service                                    │
└─────────────────────────────────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────┐
│                    Data Layer                              │
├─────────────────────────────────────────────────────────────┤
│  ├── PostgreSQL Database (Structured Data)                │
│  ├── Redis Cache (Session & Temporary Data)                │
│  └── File Storage (Media Files)                            │
└─────────────────────────────────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────┐
│                 External Services                          │
├─────────────────────────────────────────────────────────────┤
│  ├── MyMemory Translation API                              │
│  ├── Google Speech-to-Text API                             │
│  └── CDN for Media Delivery                                │
└─────────────────────────────────────────────────────────────┘

클라이언트 아키텍처 (Flutter)

lib/
├── main.dart                    # 앱 진입점
├── models/                      # 데이터 모델
│   ├── movie_result.dart        # 영화 결과 모델
│   └── search_history.dart      # 검색 기록 모델
├── services/                    # 비즈니스 로직
│   ├── movie_api_service.dart   # Django API 통신
│   ├── translation_service.dart # 번역 서비스
│   └── speech_service.dart      # 음성 인식 서비스
├── screens/                     # 화면 컴포넌트
│   └── movie_phrase_screen.dart # 메인 화면
├── widgets/                     # UI 컴포넌트
│   ├── header_section.dart      # 헤더 영역
│   ├── search_section.dart      # 검색 영역
│   ├── movie_results_section.dart # 결과 표시
│   └── video_modal.dart         # 비디오 플레이어
└── utils/                       # 유틸리티
    └── constants.dart           # 상수 정의

서버 아키텍처 (Django)

backend/
├── movie_search/               # 메인 프로젝트
│   ├── settings.py             # 설정 파일
│   ├── urls.py                 # URL 라우팅
│   └── wsgi.py                 # WSGI 설정
├── apps/
│   ├── movies/                 # 영화 앱
│   │   ├── models.py           # 데이터베이스 모델
│   │   ├── views.py            # API 뷰
│   │   ├── serializers.py      # 데이터 직렬화
│   │   └── urls.py             # URL 패턴
│   ├── search/                 # 검색 앱
│   │   ├── services.py         # 검색 서비스
│   │   └── utils.py            # 검색 유틸리티
│   └── analytics/              # 분석 앱
│       ├── models.py           # 사용자 통계
│       └── views.py            # 통계 API
├── media/                      # 미디어 파일
│   ├── posters/                # 포스터 이미지
│   └── videos/                 # 영화 비디오
└── requirements.txt            # 의존성 목록

🛠️ 기술 스택

Frontend (Mobile)

Framework: Flutter 3.24.x
Language: Dart 3.5.x
State Management: StatefulWidget (기본)

Key Dependencies:
  - http: ^1.4.0              # HTTP 통신
  - speech_to_text: ^7.0.0    # 음성 인식
  - permission_handler: ^11.3.1 # 권한 관리
  - video_player: ^2.10.0     # 비디오 재생
  - shared_preferences: ^2.5.3 # 로컬 저장
  - url_launcher: ^6.3.1      # URL 처리

Build Tools:
  - Android: Gradle 8.7.2
  - Kotlin: 1.9.10
  - NDK: 27.0.12077973

Backend (Server)

```yaml
Framework: Django 4.2.x
Language: Python 3.11+
API: Django REST Framework

Key Dependencies:

  • django-cors-headers # CORS 처리
  • django-filter # 필터링
  • pillow # 이미지 처리
  • psycopg2 # PostgreSQL 연결
  • redis # 캐싱
  • celery # 비동기 작업

Database:

  • Primary: PostgreSQL 15+
728x90
반응형