Transfer Commit

.env.example

@@ -0,0 +1,2 @@
+VITE_SHAZAM_CORE_RAPID_API_KEY=
+VITE_GEO_API_KEY=

.eslintrc.js

@@ -0,0 +1,56 @@
+module.exports = {
+  env: {
+    browser: true,
+    es2021: true,
+  },
+  extends: ['plugin:react/recommended', 'airbnb'],
+  parserOptions: {
+    ecmaFeatures: {
+      jsx: true,
+    },
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+  },
+  plugins: ['react'],
+  rules: {
+    'max-len': 0,
+    'no-param-reassign': 0,
+    'jsx-a11y/label-has-associated-control': 0,
+    'react/function-component-definition': 0,
+    'react/react-in-jsx-scope': 0,
+    'import/extensions': 0,
+    'react/prop-types': 0,
+    'linebreak-style': 0,
+    'react/state-in-constructor': 0,
+    'import/prefer-default-export': 0,
+    'no-multiple-empty-lines': [
+      'error',
+      {
+        max: 1,
+        maxEOF: 1,
+      },
+    ],
+    'no-underscore-dangle': [
+      'error',
+      {
+        allow: ['_d', '_dh', '_h', '_id', '_m', '_n', '_t', '_text'],
+      },
+    ],
+    'object-curly-newline': 0,
+    'react/jsx-filename-extension': 0,
+    'react/jsx-one-expression-per-line': 0,
+    'jsx-a11y/click-events-have-key-events': 0,
+    'jsx-a11y/alt-text': 0,
+    'jsx-a11y/no-autofocus': 0,
+    'jsx-a11y/no-static-element-interactions': 0,
+    'react/no-array-index-key': 0,
+    'jsx-a11y/anchor-is-valid': [
+      'error',
+      {
+        components: ['Link'],
+        specialLink: ['to', 'hrefLeft', 'hrefRight'],
+        aspects: ['noHref', 'invalidHref', 'preferButton'],
+      },
+    ],
+  },
+};

.gitignore

@@ -0,0 +1,28 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+.env
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+# vscode
+.vscode

README.md

@@ -0,0 +1,136 @@
+# Project Lyrics
+
+Develop an elegant React.js Music Application. 
+
+Check out the complete project requirements [here](https://docs.google.com/document/d/13PeFwRlPEhMw_HPyrIrInvQuKaVWnpNmcv-y3NA208s/edit?usp=sharing)
+
+# Contributing
+
+When contributing to this repository, please first discuss the change you wish to make via issue.
+Please note we have a [code of conduct](CODE_OF_CONDUCT.md), please follow it in all your interactions with the project.
+
+
+## System Requirements
+
+To get started with development, you need to install few tools
+
+1. git 
+
+   `git` version 2.13.1 or higher. Download [git](https://git-scm.com/downloads) if you don't have it already.
+
+   To check your version of git, run:
+
+   ```shell
+    git --version
+   ```
+
+2. node 
+
+   `node` version 16.15.1 or higher. Download [node](https://nodejs.org/en/download/) if you don't have it already.
+
+   To check your version of node, run:
+
+   ```shell
+    node --version
+   ```
+
+3. npm
+
+   `npm` version 5.6.1 or higher. You will have it after you install node.
+
+   To check your version of npm, run:
+
+   ```shell
+    npm --version
+   ```
+
+## Setup
+
+To set up a development environment, please follow these steps:
+
+1. Clone the repo
+
+   ```shell
+    git clone https://github.com/JavaScript-Mastery-PRO/project1_team4_repository.git
+   ```
+
+2. Change directory to the project directory
+
+    ```shell
+    cd project1_team4_repository
+    ```
+
+3. Install the dependencies
+
+    ```shell
+     npm install
+    ```
+
+    If you get an error, please check the console for more information.
+
+    If you don't get an error, you are ready to start development.
+
+4. Run the app
+   
+    ```shell
+    npm run dev
+    ```
+
+    Project will be running in the browser.
+
+    Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
+
+## Issues
+
+You've found a bug in the source code, a mistake in the documentation or maybe you'd like a new feature? You can help us by [submitting an issue on GitHub](https://github.com/orgs/JavaScript-Mastery-PRO/projects/8). Before you create an issue, make sure to search the issue archive -- your issue may have already been addressed!
+
+Please try to create bug reports that are:
+
+- _Reproducible._ Include steps to reproduce the problem.
+- _Specific._ Include as much detail as possible: which version, what environment, etc.
+- _Unique._ Do not duplicate existing opened issues.
+- _Scoped to a Single Bug._ One bug per report.
+
+
+## Pull Request
+
+There are 2 main work flows when dealing with pull requests:
+
+* Pull Request from a [forked repository](https://help.github.com/articles/fork-a-repo)
+* Pull Request from a branch within a repository
+
+Here we are going to focus on 2. Creating a Topical Branch:
+
+
+1. First, we will need to create a branch from the latest commit on master. Make sure your repository is up to date first using
+
+   ```bash
+    git pull origin main
+   ```
+
+   *Note:* `git pull` does a `git fetch` followed by a `git merge` to update the local repo with the remote repo. For a more detailed explanation, see [this stackoverflow post](http://stackoverflow.com/questions/292357/whats-the-difference-between-git-pull-and-git-fetch).
+
+2. To create a branch, use `git checkout -b <new-branch-name> [<base-branch-name>]`, where `base-branch-name` is optional and defaults to `main`. 
+   
+   Use a standard convention for branch names. For example, `<your-name>-dev`. It will be easier to track your pull requests if you use this convention.
+   
+   I'm going to create a new branch called `jsm-dev` from the `main` branch and push it to github.
+
+   ```bash
+    git checkout -b jsm-dev main
+    git push origin jsm-dev
+   ```
+
+3. To create a pull request, you must have changes committed to your new branch.
+
+4. Go to [Pull Requests](https://github.com/JavaScript-Mastery-PRO/project1_team4_repository/pulls) and click on the `New Pull Request` button.
+
+5. Select the `main` branch as the `base` branch and the `jsm-dev` branch as the `compare` branch.
+
+6. Follow the template and fill in the proper information for the pull request.
+
+7. Click on the `Submit` button.
+
+8. You have successfully created a pull request. Now wait for mentor approval. Once approved, you can merge the pull request.
+
+#

index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en" class="h-full bg-gray-50">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/src/assets/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Audiora</title>
+  </head>
+  <body class="h-full overflow-hidden">
+    <div id="root"></div>
+    <script type="module" src="/src/index.jsx"></script>
+  </body>
+</html>