https://github.com/robertdavidwest/practice-makes-performer
Designed to help musicians of all kinds improve their skills by customizing the playback of any song... and saving the state.
https://github.com/robertdavidwest/practice-makes-performer
nextjs react tailwindcss typescript vercel
Last synced: 2 months ago
JSON representation
Designed to help musicians of all kinds improve their skills by customizing the playback of any song... and saving the state.
- Host: GitHub
- URL: https://github.com/robertdavidwest/practice-makes-performer
- Owner: robertdavidwest
- License: mit
- Created: 2023-03-21T17:56:16.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2025-07-19T18:03:31.000Z (11 months ago)
- Last Synced: 2025-07-19T18:38:45.422Z (11 months ago)
- Topics: nextjs, react, tailwindcss, typescript, vercel
- Language: TypeScript
- Homepage: https://practicemakesperformer.com
- Size: 8.37 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
Designed to help musicians of all kinds improve their skills by customizing the playback of any song... and saving the state.
Introduction ·
Tech Stack ·
Author
## Introduction
**Practice Makes Performer** is a tool designed to help musicians of all kinds improve their skills by customizing the playback of any song, you can:
- Create multiple players for your track and save the state of each
- Adjust the tempo as you're learning
- Select specific parts of the song to focus on and seamlessly loop these parts to practice until you get it right.
- Plus, you can save your progress and easily resume your practice session at any time
https://user-images.githubusercontent.com/2637612/228921951-227400eb-fd14-43bc-8ad9-9313fe6e8b59.mp4
## Tech Stack
### Frameworks
Practice Makes Performer is built with:
- [Next.js](https://nextjs.org/) – React framework for building performant apps with the best developer experience
- [Auth.js](https://authjs.dev/) – Handle user authentication with ease with providers like Google, Twitter, GitHub, etc.
- [Prisma](https://www.prisma.io/) – Typescript-first ORM for Node.js
### Platforms
and deployed to:
- [Vercel](https://vercel.com/) – Easily preview & deploy changes with git
- [Railway](https://railway.app/) – Easily provision a PostgreSQL database
### UI
- [Tailwind CSS](https://tailwindcss.com/) – Utility-first CSS framework for rapid UI development
- [Radix](https://www.radix-ui.com/) – Primitives like modal, popover, etc. to build a stellar user experience
- [Framer Motion](https://framer.com/motion) – Motion library for React to animate components with ease
- [Lucide](https://lucide.dev/) – Beautifully simple, pixel-perfect icons
- [`@next/font`](https://nextjs.org/docs/basic-features/font-optimization) – Optimize custom fonts and remove external network requests for improved performance
- [`@vercel/og`](https://vercel.com/docs/concepts/functions/edge-functions/og-image-generation) – Generate dynamic Open Graph images on the edge
- [`react-wrap-balancer`](https://github.com/shuding/react-wrap-balancer) – Simple React component that makes titles more readable
- [`Material UI`](https://mui.com/) - MUI offers a comprehensive suite of UI tools to help you ship new features faster
## Author
- Robert West ([@robertdavidwest](https://twitter.com/robertdavidwest))