Ultimate Tab - Ads-free Ultimate Guitar tabs

Note

The project is currently no longer hosted on https://ultimate-tab.com. If you would like to know the reasons and see the project evolve and be hosted again, please give me feedback here 🙂 : #18 (comment)

Link : https://ultimate-tab.com

A web application that delivers an enhanced, ads-free and fast responsive interface to browse guitar tabs scraped from Ultimate Guitar.

Features

• Browse responsive guitar tabs scraped in real time from Ultimate Guitar.
• Chords visualizer with official diagrams from Ultimate Guitar.
• Chords transposer.
• Backing track player (using YouTube API).
• Add tabs to favorites without the need for an account (stored in local storage).

Features in Development

• Autoscroll tab.
• Export tab as PDF.

Technologies

Ultimate Tab has been built with a modern stack, including:

• NextJS - React Framework
• Puppeteer - Headless browser used for web scraping
• React Query - Server state management
• React Context API - Client state management
• ChakraUI - UI Component Library
• Vexchords - Chords renderer library

Installation

To run Ultimate Tab locally, you must have Node.js and NPM or Yarn installed on your computer. Follow these steps to get started:

1. Clone this repository using git clone https://github.com/BenoitBellegarde/UltimateTab.git
2. Navigate to the project directory using the terminal or command prompt.
3. Run npm install or yarn install to install the dependencies.
4. Run npm run dev or yarn dev to start the development server.
5. Create .env.local file and add a variable YOUTUBE_API_KEY with a YouTube API key as value to get backing tracks
6. Open http://localhost:3000 in your web browser to see Ultimate Tab running.

Contributing

Contributions are welcome! Please feel free to submit a pull request or open an issue for any features or bug fixes.

License

Ultimate Tab is licensed under the MIT License.