Git Product home page Git Product logo

netflex's Introduction

NetFlex

Description

Recreate a web application like Netflix to train and learn soft / web level technologies

Technologies utilisées

  • Docker (deployement) :
    • docker-compose
    • Dockerfile
  • Postman (API tests)

Frontend

  • ReactJS
  • HTML
  • CSS
  • JavaScript
  • TailwindCSS

Backend

  • NodeJS
  • JavaScript
  • ExpressJS

Base de données

  • MariaDB
  • PhpMyAdmin
  • SQL

Schema base de donnée

netflex.sql :

CREATE DATABASE IF NOT EXISTS netflex
    COLLATE utf8mb4_unicode_ci;

USE netflex;

CREATE TABLE IF NOT EXISTS user
(
    id BIGINT unsigned NOT NULL AUTO_INCREMENT,
    firstname VARCHAR(255) NOT NULL,
    name VARCHAR(255) NOT NULL,
    nickname VARCHAR(255) UNIQUE,
    email VARCHAR(255) UNIQUE,
    password VARCHAR(255) NOT NULL,
    create_at DATETIME NOT NULL DEFAULT current_timestamp,
    image_url TEXT NOT NULL DEFAULT "https://cdn-icons-png.flaticon.com/512/5089/5089983.png",
    PRIMARY KEY (id)
);

CREATE TABLE IF NOT EXISTS films
(
    id BIGINT unsigned NOT NULL AUTO_INCREMENT,
    show_id VARCHAR(255) UNIQUE,
    type VARCHAR(255) NOT NULL,
    title VARCHAR(255) NOT NULL,
    director VARCHAR(255),
    cast text,
    country VARCHAR(100) NOT NULL,
    date_added DATETIME NOT NULL,
    release_year VARCHAR(4) NOT NULL,
    rating VARCHAR(5) NOT NULL,
    duration VARCHAR(10) NOT NULL,
    listed_in VARCHAR(100) NOT NULL,
    description text NOT NULL,
    picture text NOT NULL,
    PRIMARY KEY (id)
);

CREATE TABLE IF NOT EXISTS logs
(
    id BIGINT unsigned NOT NULL AUTO_INCREMENT,
    user_email VARCHAR(255) NOT NULL,
    connected_at DATETIME NOT NULL DEFAULT current_timestamp,
    user_agent VARCHAR(255) NOT NULL,
    navigateur VARCHAR(255) NOT NULL,
    platform VARCHAR(255) NOT NULL,
    language VARCHAR(255) NOT NULL,
    encoding VARCHAR(255) NOT NULL,
    is_on_mobile BOOLEAN NOT NULL DEFAULT false,
    ip_address VARCHAR(255) NOT NULL,
    country VARCHAR(255) NOT NULL,
    PRIMARY KEY (id)
);

Installation

To install NetFlex at home, please follow the instructions bellow at the root of the project (The docker-compose is not yet functional):

Attention : If you are lazy just run the installation.sh script at the root of the project. Then refer to the Quickstart part

cat netflex.sql | mysql -u root -p
cd backend
node json_to_db.js
npm install
cd frontend
npm install

Quickstart

Always at the root of the project, start the API (in a first terminal) :

cd backend
npm run start

or (if you use Nodemon) :

cd backend
npm run dev

Then, start the React application :

cd frontend
npm start

React will automatically redirect you to the home page of the website (localhost:3000)

Routes Backend (en développement)

Route Method Protected Description
/register POST NO Register a new user
/login POST NO Connect a user
/films GET YES Get all movies and tv shows in the database
/films/type POST YES Get 10 movies or tv shows depending on type given in the request body
/films/:id GET YES Get a film by its ID
/films/browse POST YES Get films by keywords search
/user GET YES Get user information using his Token
/user DELETE YES Delete user using his Token
/user/profile_image PUT YES Change user profile picture using an image url and his token

Features Frontend (in development)

Home page (not connected)

Home Not Logged In

Home page (connected)

Home Logged In

Login page

Login

Register page

Register

Account settings (base)

AccountBasics

Account settings (profile picture choice)

AccountPP

Account settings (delete account)

AccountDeleteModal

Movies page

Movies

TV-Shows page

TV Shows

Search results page

Search

404 page

404

Mainteners

netflex's People

Contributors

zerlock avatar

Stargazers

 avatar  avatar  avatar  avatar

Watchers

 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.