The idea of the Website is:
"A lyrics fetcher website that lets you sync songs from discord server with Hydra music bot".
PS: The site is not just for discord users, but for any audience interested in a lyrics' fetcher. All code within this site can be reused in any lyrics project or other projects inside this context!
This project is part of my personal portfolio, so, I'll be happy if you could provide me any feedback about the project, code, structure, or anything that you can report that could make me a better developer!
Email-me: jg.limamarinho202@gmail.com
Contact me at Twitter.
Also, you can use this Project as you wish, be for study, be for make improvements or earn money with it!
It's free!
1 – There are still several functions to be made available in the following versions of the application, like more platforms for synchronization and lyrics time sync.
2 – This app also is linked with a discord bot and a node.js backend.
If you want to test this Website in the Production mode, the website links are listed below:
Test Deployments: Soon!
- Get the lyrics of any music posted on Spotify or Deezer
- Synchronize the music with your discord server and get the lyrics with the time
To run this project in the development mode, you'll need to have a basic environment to run a Next.js App, that can be found here.
Cloning the Repository
$ git clone https://github.com/JoaoGabriel-Lima/SingWatch
$ cd SingWatch
Installing dependencies
$ yarn
or
$ npm install
1 – This site uses Next.js serverless functions to make connections to the backend socket and lyrics API.
2 – After cloning the repository, go to the /.env.development file and edit the MONGODB_URI, MONGO_DB, NEXT_PUBLIC_SOCKET_URL, GENIUS_API and MUSIC_INFO_URI according to your own information.
3 - You also need to read the discord bot and node.js backend readme before start coding.
With all dependencies installed, and the environment properly configured, you can now run the website:
yarn
$ yarn run dev
npm
$ npm run dev
The website will start on the default port 3000
- React - A JavaScript library for building user interfaces
- Next.js - The React Framework
for Production - Axios - HTTP Client
- ESlint - Linter
- Dotenv - Configs from .env file
- MongoDB - Distributed Database
- Prettier - Code Formatter
- Babel - JavaScript Compiler
- Styled-Components - Styles
- react-icons - Icons Library
- genius-lyrics-api - Lyrics fetcher
- TailwindCSS - CSS framework
- Vercel - Host Service
You can send me as many PR's as you want, I would be glad to analyze and accept them! And if you have any question about the project…
Email-me: jg.limamarinho202@gmail.com
Contact me at Twitter.
Thank you!
This project is licensed under the MIT License – see the LICENSE.md file for details