GithubHelp home page GithubHelp logo

gynaa78 / full-stack-project-assessment Goto Github PK

View Code? Open in Web Editor NEW

This project forked from codeyourfuture/full-stack-project-assessment

0.0 0.0 0.0 1.53 MB

HTML 34.02% CSS 6.78% JavaScript 59.20%

full-stack-project-assessment's Introduction

Video Recommendation App

Background

Before you continue to final projects we have to make sure that you can meaningfully contribute to a technical project.

This means that we need to be sure that you can create a Full Stack App.

Challenge

In this project you will be building a project that fulfills the following User Stories

  • As a user, I want to be able to view a list of all YouTube videos posted on the site
  • As a user, I want to be able to post videos that I like from YouTube to my website.
  • As a user, I want to be able to delete videos from the website that I no longer like.
  • As a user, I want to be able to watch the videos embedded in the website.
  • As a user, I want to be able to "Up Vote" a video if I like it.
  • As a user, I want to be able to "Down Vote" a video if I dislike.

You don't need to worry about storing the video content itself - we'll rely on YouTube for this.

Levels

This project is split into several levels that you should complete each week of the three week project.

You can find each of the levels split into separate files, linked below.

Note: Some of the levels are optional which means that you will build a working project without them. However, to make something really impressive you will need to complete as much as you can.

Week 1 - Front End

  • Level 100
    • A core version of the React front end of the app
  • Level 199 (Optional)
    • Stretch goals for the front end if you have time

Week 2 - Back End (without Database)

  • Level 200
    • A core version of the Node + Express back end of the app
  • Level 250
    • Connect your Front End and Back End together
  • Level 299 (Optional)
    • Stretch goals for the back end if you have time

Week 3 - Back End (with Database)

  • Level 300
    • Integrate the back end with a database
  • Level 399 (Optional)
    • Stretch goals for the database if you have time
  • Level 999 (Optional)
    • More optional goals for if you have time

Sample Solution

Here is an example solution of the Front End:

https://vid-rec2.netlify.app/

Note: You can design the website to look however you like.

Here is an example solution for the Back End:

https://video-rec.herokuapp.com

Design

You are welcome to use Bootstrap or any other design framework to help you build this app.

Getting Started

Fork this repository and then clone it to your computer.

Progress to Level 100 when you are ready.

full-stack-project-assessment's People

Contributors

chrisowen101 avatar gynaa78 avatar illicitonion avatar youssef910 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.