Skip to content

accesstechnology-mike/drumclick.app

Repository files navigation

🎵 Click Track Generator

A sleek, modern web application for musicians and music enthusiasts to create customisable click tracks with ease, built entirely by AI

🌟 Features

  • 🕒 Multiple time signatures (2/4, 3/4, 4/4, 5/4, 6/8, 7/8)
  • 🎚️ Adjustable tempo from 40 to 300 BPM
  • 🔊 Option to accent the first beat of each measure
  • 💡 Visual beat indicator lights
  • 🖱️ Intuitive slider and manual input for tempo adjustment
  • 🎨 Sleek, responsive design

🚀 Getting Started

Prerequisites

  • Node.js (v14 or later)
  • npm or yarn

Installation

  1. Clone the repository:

    git clone https://github.com/accesstechnology-mike/click-track-generator.git
    
  2. Navigate to the project directory:

    cd click-track-generator
    
  3. Install dependencies:

    npm install
    # or
    yarn install
    
  4. Start the development server:

    npm run dev
    # or
    yarn dev
    
  5. Open http://localhost:3000 in your browser to see the application.

🖥️ Usage

  1. Select your desired time signature from the dropdown menu.
  2. Adjust the tempo using the slider or by typing directly into the input field.
  3. Toggle the "Accent First Beat" switch if you want to emphasize the first beat of each measure.
  4. Click the "Play" button to start the click track.
  5. The visual beat indicators will light up in sync with the audio.
  6. Click "Stop" to end the click track.

🛠️ Built With

  • Next.js - The React framework for production
  • React - A JavaScript library for building user interfaces
  • TypeScript - Typed superset of JavaScript
  • Tailwind CSS - A utility-first CSS framework
  • Web Audio API - For generating audio in the browser

🤝 Contributing

Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

📜 License

Distributed under the MIT License. See LICENSE for more information.

📞 Contact

Your Name - @mikethrussell - mike@accesstechnology.co.uk

Project Link: https://github.com/accesstechnology-mike/click-track-generator

🙏 Acknowledgments


Made with ❤️ by Mike Thrussell and Claude Sonnet 3.5

About

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •