Home

MusicWith

소개

MusicWith는 음악을 들으며 감상을 나누는 플랫폼입니다. '지금 나와 함께 이 음악을 듣는 사람이 있으면 좋겠다'는 생각으로 시작한 프로젝트입니다.

사용 기술

앱

• 언어: Swift
• UI: SwiftUI

서버

• 언어: Rust
• Web Framework: Rocket

설계

앱

.
├── Control
│   ├── ChatView.swift
│   ├── ControlCoreView.swift
│   └── LyricsView.swift
├── ControlView.swift
├── CustomViews
│   └── CustomTabView.swift
├── Main
│   ├── PlayListView.swift
│   ├── PlayListsView.swift
│   ├── RecommendView.swift
│   └── SearchView.swift
├── MainView.swift
├── MusicWithApp.swift
├── State
│   ├── ControlState.swift
│   ├── PlayState.swift
│   └── SpotifyAuthState.swift
└── Util
    ├── Chat.swift
    ├── PlayList.swift
    ├── RecentSearch.swift
    ├── SheetHeight.swift
    ├── Song.swift
    ├── Spotify
    │   ├── SpotifyArtist.swift
    │   ├── SpotifyPlayList.swift
    │   ├── SpotifySearch.swift
    │   ├── SpotifyTrack.swift
    │   └── SpotifyUser.swift
    └── SpotifyAPI.swift

• MainView, Main/xxx: 메인 화면 및 그 아래의 네비게이션 구조에 대한 View 입니다.
• ControlView, Control/xxx: 음악을 재생할 때 표시되는 Bottom Sheet Modal 및 그 아래의 네비게이션 구조에 대한 View 입니다.
• State/xxx: 재생 상태와 인증 상태 (token) 를 관리하는 ObservableObject 입니다.
• Util/SpotifyAPI, Util/Spotify/xxx: Spotify API를 사용해 필요한 정보를 가져옵니다.

서버

sequenceDiagram
    participant App as 앱
    participant Server as 서버
    participant Spotify as Spotify

    App->>Server: 1. 로그인 요청<br/>(http://localhost:8000/login)
    Server->>Spotify: 2. 리다이렉트 [인증 요청]<br/>(https://accounts.spotify.com/authorize)
    Spotify->>App: 3. 권한 요청 화면 표시
    App->>Spotify: 4. 권한 승인
    Spotify->>Server: 5. code 전달<br/>(http://localhost:8000/callback)
    Server->>Spotify: 6. POST [토큰 요청]<br/>(https://accounts.spotify.com/api/token)
    Spotify->>Server: 7. 응답 [access_token, refresh_token]
    Server->>App: 8. 리다이렉트 [access_token, refresh_token]<br/>(com.kimhappy.musicwith://callback)

Loading

• /login: 앱에서 로그인을 위해 접근하는 엔드포인트 입니다.
• /callback: Spotify에서 access_token과 refresh_token을 제공하는 엔드포인트 입니다.