Flimmr

Flimmr is a clone site of Flickr, a website were users can store and share their photos. Flimmr is a fullstack application.

Technologies

• Frontend: Javascript React/Redux, HTML5, CSS
• Backend: JSON API
• Cloud Image Hosting: Cloudinary
• Database: PostgreSQL
• Hosting: Heroku
• Control System: GIT

Features

Users can:

• sign up, log in, and log out
  • default users: anne@user.io; jan@user.io(demo); lars@user.io
• choose a demo site, with pre-loaded photos

Logged-in users can:

• see only the photos that they upload onto their photostream (C)
• upload, update, and delete photos (RUD)

Screenshots

Upload Page

User Photostream

Individual Photo Page

Setup

• In the backend folder, run npm install

• In the frontend folder, run npm install

• In the backend folder, create a .env file with the following variables

PORT=5000
DB_USERNAME=auth_app
DB_PASSWORD=«auth_app user password»
DB_DATABASE=auth_db
DB_HOST=localhost
JWT_SECRET=«generate_strong_secret_here»
JWT_EXPIRES_IN=604800

Sequelize Setup

• Create a user with the ability to create databases using the credentials in the .env file
• Create a database auth_db
• Run npx dotenv sequelize db:migrate to run migration files
• Run npx dotenv sequelize db:seed:all to populate database.

Run

• In the backend folder, run npm start
• In the frontend folder, run npm start