Skip to content

janaabf/ecommerce-store

Repository files navigation

Cumuli

This is an e-commerce store built as a practice project during the upLeveled web development bootcamp. The site is simulating a real e-commerce shopping experience excluding the payment process and without saving any personal data.

Technologies used

  • Next.js
  • PostgreSQL
  • Emotion

Languages:

  • Javascript
  • JSX
  • Typescript
  • TSX

Example

(insert pictures)

Setup

  1. Clone the project on your local machine (run each line individually):
git clone <url>
cd <repo name>
yarn
  1. Connect to default database as admin:
  • On Windows
psql -U postgres
  • On macOS
psql postgres
  • On Linux
sudo -u postgres psql
  1. Set up the database:
CREATE DATABASE <database name>;
CREATE USER <user name> WITH ENCRYPTED PASSWORD '<user password>';
GRANT ALL PRIVILEGES ON DATABASE <database name> TO <user name>;
  1. After queries are successfully ran, quit psql and connect to the database
\q
  • On Windows & macOS
psql -U `<user name>` `<database name>
  • On Linux
sudo -u <user name> psql -U <user name> <database name>
  1. In the repository's directory, run migrations using ley:
yarn migrate up
  1. Create a .env file:
  • Open the project in your code editor
  • Copy the content of the .env.example file into the .env file
  • Replace XXXXXXXX with the access information
  • add .env file to .gitignore
  1. (Optional) Start development server:
yarn dev

Open http://localhost:3000 with your browser to see the result.

Deployment Guide

Heroku was used to deploy this site,

Setup Heroku

  1. Sign up for Heroku: https://signup.heroku.com/
  2. Create a new App
  3. Choose a name and select the "Europe" Region
  4. Click on the button in the middle called "Connect to GitHub"
  5. Search for your repository in the search box at the bottom of the page and click on the "Connect" button
  6. Click on the button for "Enable Automatic Deploys"
  7. Go back to the Overview tab and click on "Configure Add-On"
  8. Search for "Postgres" and select "Heroku Postgres" from the results
  9. Deploy your app

Configure Application

Connect to Heroku PostgreSQL Database via psql

Enjoy

Now everything should be up and running! Congratulations :)

About

E-Commerce Store with Next.js

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published