A beautiful, Apple Music-inspired web radio player built with React + TypeScript + Vite. Supports live radio streaming with an immersive UI, ambient sleep sounds, and Android APK packaging via Capacitor.
- Live Radio Streaming — 45 built-in stations, including 28 domestic China stations
- China Radio Discovery — news, traffic, finance, music, classical, arts, stories, and health channels
- Grid/List Browsing — switch between tile cards and dense list mode; preference is persisted
- Quick Presets — one-tap filters for China picks, commute traffic, markets, and story channels
- Region & Category Filters — combine search, country chips, and station categories
- Random Play — jump into a station from the current filtered result set
- Lofi Zone — 7 curated 24/7 lofi/chill streams for studying and relaxing
- Vinyl Player — full-screen player with spinning vinyl record animation
- Radio Map — interactive SVG world map to discover stations by country
- Sleep Mode — timer presets plus ambient sound mixer for rain, ocean, fireplace, birds, wind, and cafe
- Dark / Light Theme — glassmorphism UI with smooth theme transitions
- i18n — Chinese and English language support
- Mobile-First — optimized for mobile and packaged as Android APK via Capacitor
# Install dependencies
npm install
# Start dev server
npm run dev
# Build for production
npm run build# Build web assets
npm run build
# Sync to Android
npx cap sync android
# Build debug APK
cd android
.\gradlew assembleDebug
# Output: android/app/build/outputs/apk/debug/app-debug.apkTo build the unsigned release APK:
cd android
.\gradlew assembleRelease
# Output: android/app/build/outputs/apk/release/app-release-unsigned.apkPrerequisites: JDK 21 and Android SDK must be installed. If Gradle cannot find the SDK, create
android/local.propertieswithsdk.dir=....
Latest release: AirWave v1.0.0
Published APK assets:
AirWave-v1.0.0-debug.apk— debug-signed APK for direct sideload testingAirWave-v1.0.0-release-unsigned.apk— release build output without a production signing key
See CHANGELOG.md for release notes.
src/
├── audio/ # Ambient sound MP3 files
├── components/ # TabBar, StationCard, MiniPlayer, FullPlayer
├── data/ # Station definitions & metadata
├── hooks/ # useAudioPlayer (HLS + MP3 streaming)
├── i18n/ # Chinese & English translations
├── pages/ # Discover, MyStation, RadioMap, Sleep, Settings
├── store/ # Zustand stores (player, favorites, settings)
├── App.tsx # Root component with routing
├── main.tsx # Entry point
└── index.css # Design system & animations
| Layer | Technology |
|---|---|
| Framework | React 18 |
| Language | TypeScript |
| Build | Vite |
| State | Zustand (persisted) |
| Routing | React Router DOM |
| Streaming | hls.js + HTML5 Audio |
| i18n | i18next |
| Mobile | Capacitor (Android) |
| Category | Stations |
|---|---|
| China News | CNR Voice of China, International News Radio, Beijing News Radio, Shanghai News Radio, Guangdong News Radio, Shenzhen News Radio, Sichuan News Radio, Tianjin News Radio |
| Traffic | Beijing Traffic Radio, Shanghai Traffic Radio, Guangdong Traffic Radio, Jinan Traffic Radio |
| Finance | Shanghai CBN Radio, Guangdong Stock Radio, Pearl River Economy Radio |
| China Music | Shanghai Dynamic 101, Shanghai Classic FM, Shanghai Golden Hits, Guangzhou Golden Music, Huaiji Music Radio, Morning Music Radio, 500 Chinese Classics, AsiaFM Cantonese |
| Culture & Stories | Beijing Arts Radio, Anhui Storytelling Radio, Jinan Story Radio, Shanghai Opera Radio, Health Radio |
| International News | BBC Radio 4, BBC World Service, NPR Live |
| International Music | BBC Radio 1/2/6, Classic FM, Jazz FM, Smooth Radio |
| Lofi | Lofi Hip Hop, France Culture Lofi, Mouv Lofi, 24/7 Lofi, Chillhop, Lofi HipHop FM, Lofi Lounge |
MIT