goal: make a web app that listens for guitar riffs through the microphone and automatically finds what chords fit the riff and displays suggested chord progressions on the screen.

technologies: react, ,__

deadline:

[ ] first draft by friday sep 17

Because create-react-app has way too much extra boilerplate

src
├── components      # all React components
│   ├── Clock.js    # clock that ticks once a second (useState and useEffect example)
│   ├── Footer.js
│   └── Header.js
├── App.js          # main React app
├── index.css       # root-level styling
└── index.js        # React entrypoint (where React gets inserted into the page)

Root page styling is done in src/index.css. All component styling is done through styled-components (example in src/App.js).

To customize the font, page title, page icon, etc. you can customize the page skeleton over in public/index.html.

All fonts are served through Google Fonts, you can pick and choose your own over there!

Vercel is the recommended way to deploy this site to the internet. Current deployment

A Vite + React starter template.

No configuration or complicated folder structures, just the files you need to build your app:

vite-template-react
├── node_modules
├── public
│   ├── favicon.svg
│   └── robots.txt
└── src
    ├── App.css
    ├── App.jsx
    ├── index.css
    ├── index.jsx
    └── logo.svg
├── .gitignore
├── index.html
├── package.json
├── README.md
├── vite.config.js

To get a local copy of the code, clone it using git:

git clone https://github.com/SafdarJamal/vite-template-react.git
cd vite-template-react

Make it your own:

rm -rf .git && git init && npm init
git add .
git commit -m "Initial commit"

Install dependencies:

npm i

Now, you can start a local web server by running:

npm start

And then open http://localhost:3000 to view it in the browser.

In this project, you can run the following scripts:

Vite Template React is built and maintained by Safdar Jamal.

This project is licensed under the terms of the MIT license.