CS391 Project2

Project Members

  • Ege Öztaş
  • Arda Sümbül
  • Ayberk Akbalık
  • Hüseyin Gökay

    • Project Description

      This Project's main purpose is to provide and direct to a selection of memes and other digital "joke" entertainment.

      This project will also have the capability to make someone log-in and sing-up and access to entertainment. Webstorage is used to keep users' data


      Possible scenarios

      First time user scenario: User must first Sign-up, after that they will be redirected to the login page as a signed user.

      To sign up they must fill out the signup form with their information. These information have to be in the constraints given below:

      • Password must be at least 8 figures and max 15 figures, at least one of each must be in the password: one uppercase and one lowercase char, one number and one special character.
      • Mail and mail control must be the same.
      • Password and password control must be the same.
      • Mail and username should be unique.

      Signed user scenario: If User has an account they will fill out their account information (E-mail & password). If these are correct and valid then the page will direct to memes page. Once there you can log back out from headers button.

      New user scenario: If User does not have an account they must go to sign in to the website. They must fill out the given form. If these are correct and valid then the page will direct back to log in page. Then Signed user scenario will start.

      The main page. If they can't pass throught validation then an error will pop up. Once on the main page the user can view the digital entertainment (as also known as memes.)


      Mission Contribution

      • Mehmet Arda Sümbül: Created responsive Navbar with react-bootstrap and Footer for pages.
      • Ege Öztaş: Created the signup page using react-bootstrap. Created the validation and user storage systems.
      • Hamza Ayberk Akbalık: Created memes page, responsive cards of meme images by using react-bootstrap.
      • Hüseyin Gökay: Created login page with its method isUserExists by using react-bootstrap, created app.js by using react-router and created folder structure.

      Instructions for running the application

      • Install Node.js https://nodejs.org/en/
      • Clone the repo by using the link provided by github. Run "git clone https://github.com/huseyingokay/cs391-project2" command in on cmd to clone the repo
      • Run "npm install" command on cmd for the first setup
      • Run "npm install react-router-dom" on cmd for react-router library installation
      • Run "npm install react-bootstrap bootstrap" on cmd for react-bootstrap library installation
      • Run "npm start" command on cmd to run the application