Git Product home page Git Product logo

replay's Introduction

Project 3 - Replay

License: ISC

Table of Contents

  1. Description
  2. Criteria
  3. Wireframe
  4. User Flow Diagram
  5. User Story
  6. Elevator Pitch
  7. APIs and Technologies Used
  8. Installation
  9. Usage
  10. Contributing
  11. Issues
  12. Credits
  13. License
  14. Questions

Description

This is our final project, and we did our best to bring together everything we have learned over the course.

This application involves user authentication, MongoDB database storage including Model relationships, allows user interaction via CRUD operations, stores encrypted passwords, uses an external API, is made using ReactJS, utilizes a Node and Express server, hides sensitive API key information, and more.

We're very happy with what we managed to achieve with this app! There is still plenty of room for growth, but we achieved what we set out to accomplish and even some stretch goals.

View of homepage

Criteria

  • Must use ReactJS

  • Must use a Node and Express Web Server

  • Must use a backend by a MySQL or MongoDB Database with a Sequelize or Mongoose ORM

  • Must have both GET and POST routes for retrieving and adding new data

  • Must be deployed using Heroku (with Data)

  • Must utilize at least two libraries, packages, or technologies that we haven't discussed

  • Must allow for or involve the authentication of users in some way

  • Must have a polished frontend/UI

  • Must have folder structure that meets MVC Paradigm

  • Must meet good quality coding standards (indentation, scoping, naming)

  • Must not expose sensitive API key information on the server

Wireframe

Landing page

Wireframe - landing page

Login/Signup Page

Wireframe - login/signup page

Dashboard

Wireframe - dashboard

Search page

Wireframe - search page

UserFlowDiagram

UserFlowDiagram

UserStory

As a music enthusiast, I want to build playlists based my taste in music so that I can create a playlist for every occasion.

ElevatorPitch

This application is made for users to be able to create their own playlists with curated video choices from the youtube API to watch.

APIsAndTechnologies

These are the API's and technologies that we used that we have not discussed previously:

  • Youtube API
  • connect-mongo
  • googleapis
  • he
  • react-youtube

Installation

Files must be downloaded from Github. Then run npm install to get the necessary node modules. Lastly run npm start.

Usage

With this application, a user can create custom playlists and view the videos in their playlists on the playlist page. They can search for videos on the search page. After done for the day, users can log out via the logout button in the navbar, or they will be logged out automatically after 12 hours.

Contributing

For contributions, please create a fork to work on then, when done, create a Pull Request.

Issues

Submit an Issue through Github for any bugs or problems.

Credits

Assignment was developed as part of the SMU Coding Bootcamp.

License

Copyright Ashley Wright, Amanda Rodriguez, and Olivia Lopez 2021

This is covered under the ISC license.

Questions

Feel free to contact through the following with any questions:

Ashley's Github: ashleyaggie

Amanda's Github: amandardz

Olivia's Github: DoubleLForce5

replay's People

Contributors

amandardz avatar doublelforce5 avatar ashleyaggie avatar

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.