Giter Site home page Giter Site logo

front-end-capstone's Introduction

front-end-capstone

This is a single-page, React application that allows users to share incomplete songs, and invite others to help complete the songs.

Share, Contribute, Complete

  • User A can upload an incomplete song
  • User B can upload a stem (isolated audio of music) to be considered for the song
  • User A can include the audio provided by User B in the final version of the song

Tech Stack

  • Firebase
  • JavaScript
  • React
  • React-Router-Dom
  • React Audio Player
  • React Bootstrap
  • HTML
  • CSS

front-end-capstone's People

Contributors

will-bishop-imprivata avatar

Watchers

 avatar

Forkers

tedmarov

front-end-capstone's Issues

User Can Login and Register

Login and Register

Given a user wants to use featurist
When the user first accesses the application
Then the user should see the login button
And a register button

Given a user wants to use featurist
When the user has previously authenticated
Then the user should see the featurist browse/home page

Given the user fills out the registration form
When the user clicks on the register button
And the username is unique
Then the login and register form should disappear and the featurist browse/home page should appear

Given the user fills out the login form
When the user clicks on the login button
And the username exists
And the password matches the stored password for the username
Then the login and register form should disappear and the featurist browse/home page should appear

The User Wants to Delete a Song

Given a user wants to delete a song/stem
When the user clicks the x or trash can icon (yet to be determined)
Then the song/stem should be deleted
And the deleted item will be removed from the user's profile

A User Can Upload A Stem

Given a user wants to upload an stem to be considered for another user's song
And they are viewing another user's incomplete song page
When the user clicks the add to the song button
Then a form should be presented to the user where they can upload an audio file
And a field to enter in the title
And a field to enter in the description
And a button to submit the file

The Browse / Home Page

Browse / Home

Given an active user sees an incomplete song from another user
When the user clicks on the title of the song
Then the user will be taken to the selected song page

Given an active user sees an incomplete song from another user
When the user clicks on the username
Then the user will be taken to the selected user page

Given an active user sees an incomplete song from another user
When the user clicks on the play button
Then the user will hear the incomplete audio file

Given an active user sees an incomplete song from another user
When the user clicks on the three dots within the audio player
Then the user will be presented with an option to download the selected audio file

User Can Upload Incomplete Songs

Upload Incomplete Songs

Given a user wants to upload an incomplete song
When the user clicks the upload option from the NavBar
Then a form should be presented to the user where they can upload an audio file
And a field to enter in the title
And a field to enter in the description
And a button to submit the file

A User Can Mark a Song as Complete

Given a user wants to complete a song
When the user is viewing their own incomplete song
And the user clicks the mark complete button
Then a form should be presented to the user where they can upload a file
And a dropdown to select which stems were included in the final version
And a field to enter in the description
And a button to submit the file

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.