Songs I know

Created by @johnslipper to get inspiration when holding a guitar and nothing comes to mind.

Start storing your own songs on the live app at songs-i-know-2020.web.app.

Features

• Add song chords and lyrics for the songs you know
• Song artwork (via iTunes API)
• Chord search (via uberchord API)
• Chord fretboard visualisation
• Custom chord creation
• Hear the chords you add
• Custom tunings
• Capo adjustment
• Song import/export/clear
• Offline support

Screenshots

Roadmap

• TypeScript ✅
• Switch from firebase storage to in-browser ✅
• Improve accessibility:
  • Routing ✅
  • Tabs ✅
  • Toasts ✅
  • Modals ✅
  • Dropdown ✅
  • Song editing
• Lyrics API
• Lyrics font size adjust
• Lyrics auto-scrolling
• Better quality artwork API

Development

Install the dependencies...

npm install

...then start the dev server

npm run dev

Navigate to localhost:5000. You should see your app running. Edit a component file in src, save it, and reload the page to see your changes.

If you're using Visual Studio Code we recommend installing the official extension Svelte for VS Code. If you are using other editors you may need to install a plugin in order to get syntax highlighting and intellisense.

TypeScript

To start TypeScript checking and watch files for changes:

npm run check

Building and running in production mode

To create an optimised version of the app:

npm run build

You can then run the newly built production app:

npm run preview

Deploying to the web

Currently deployed on Firebase hosting. Any PRs merged into the main branch within github will be automatically deployed to production.

Creating a pull request will also generate a preview site for checking prior to merging.