https://github.com/boolfalse/online-radio
Simple online radio project
https://github.com/boolfalse/online-radio
Last synced: 7 months ago
JSON representation
Simple online radio project
- Host: GitHub
- URL: https://github.com/boolfalse/online-radio
- Owner: boolfalse
- Created: 2023-06-30T10:10:12.000Z (over 2 years ago)
- Default Branch: master
- Last Pushed: 2023-07-27T02:24:47.000Z (over 2 years ago)
- Last Synced: 2025-02-27T08:08:52.959Z (11 months ago)
- Language: TypeScript
- Size: 2.33 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Online Radio
This is a simple online radio app built with following technologies:
- [React.js](https://react.dev/)
- [Node.js](https://nodejs.org/)
- [Vite](https://vitejs.dev/)
- [TypeScript](https://www.typescriptlang.org/)
- [AudioContext (Web API)](https://developer.mozilla.org/en-US/docs/Web/API/AudioContext)
- [Express](https://expressjs.com/)
- [socket.io](https://socket.io/)
- [ESLint](https://eslint.org/)
---
### Installation:
- Clone this repository:
```bash
git clone git@github.com:boolfalse/online-radio.git && cd online-radio
```
- Install frontend and backend dependencies:
```bash
npm install && cd backend && npm install && cd ..
```
- Make sure to have a [GitHub Gist](https://gist.github.com/boolfalse/6b66a0065c70a33f95e0e831cb0c7e9f#file-tracks-json) JSON file with the tracks in it.
- JSON file sample:
```json
[
{
"title": "Harp Arpeggio - Medieval Tune",
"file": "https://cdn.freesound.org/previews/564/564024_12539862-lq.mp3",
"image": "https://dummyimage.com/480x360/c2ccb2/ff6200&text=Harp%20Arpeggio%20-%20Medieval%20Tune",
"source_url": "https://freesound.org/people/gertraut_hecher/sounds/564024/"
},
{
"title": "Punta Secca Waves 2",
"file": "https://cdn.freesound.org/previews/353/353102_2874677-lq.mp3",
"image": "https://dummyimage.com/480x360/c2ccb2/ff6200&text=Punta%20Secca%20Waves%202",
"source_url": "https://freesound.org/people/microsome/sounds/353102/"
}
]
```
- For minimizing the track before uploading to the cloud you can run:
```shell
# following command will convert "input.mp3" to "output.mp3" with the 96 kbit/second quality
ffmpeg -i input.mp3 -codec:a libmp3lame -b:a 96k output.mp3
```
- Setup environment variables in ".env" file as described in ".env.example" file.
```dotenv
NODE_VERSION="18.16.0"
APP_ENV="development"
RADIO_GIST_ID="6b66a0065c70a33f95e0e831cb0c7e9f"
RADIO_PLAYLIST_FILE="tracks"
VITE_BACKEND_PORT=5000
VITE_SERVER_PORT=5001
VITE_SOCKET_PORT=3000
```
- Run the app:
```bash
# development
npm run dev
# production (TODO: review before production)
npm run build && npm run start
```
- Check out [http://localhost:5001](http://localhost:5001) on local environment.
- For checking linting (ESLint) errors and warnings:
```bash
npm run lint
```
### Notes:
- This app uses [GitHub Gist](https://gist.github.com/6b66a0065c70a33f95e0e831cb0c7e9f) as a database for storing tracks ("tracks.json" file).
- Frontend UI inspired by: [Daily UI IX: Music Player #009](https://codepen.io/lgkonline/pen/BQdeyZ) & [3D Cube Slider](https://codepen.io/fghty/pen/WNORPYW).
- Background image from: [GIPHY](https://www.pinterest.com/pin/406942516311166244/).
- Track images taken from [YouTube thumbnails](https://i.ytimg.com/vi/6k_NWX0Fo8g/hqdefault.jpg).
- Testing tracks taken from [freesound.org](https://freesound.org/search/?q=&f=&w=&s=Duration+%28shortest+first%29&advanced=0&g=1&page=9000#sound).
- Testing images generated by [dummyimage.com](https://dummyimage.com/480x360/c2ccb2/ff6200&text=Harp%20Arpeggio%20-%20Medieval%20Tune).
- This app was built with the help of [OpenAI's Chatbot](https://chat.openai.com/).
- Similar online radio app: [freeCodeCamp Radio](https://coderadio.freecodecamp.org/).
### Author:
- [BoolFalse](https://boolfalse.com)