/next-store

Primary LanguageTypeScript

Welcome to my NextJS shop

❗❗❗DISCLAIMER❗❗❗

The project is currently not working in Vercel, so you must download it locally.

NodeJS version: v16.13.1

Installation

  1. You must install NodeJS v16.13.1
  2. Run npm install --save --save-dev in the project root folder
  3. Run npm run dev to start the development environment

Project idea

This is a simple learning project that I made with the intention to get into TypeScript. It's a simple shop, using which you can:

  1. Register
  2. Login
  3. Browse and filter products
  4. Search for products
  5. Add products to cart
  6. Change website theme

Tech Stack

Front-end

For the front-end I'm using NextJS with styled-components for the styles and TypeScript.

Back-end

For the back-end I'm using NextJS's API Routes.

  1. Validation- Joi
  2. Database - Sqlite
  3. Password hashing - Bcrypt
  4. Sessions - JWT

Why did I choose that specific tech stack?

Front-end

Well, firstly I'm a ReactJS developer and this project was made with the intention for me to learn TypeScript. Then I chose styled-components, because I like the flexibility it gives me while writing CSS and at the same time both the logic and the style is in the same file, which makes it easy to read and understand.

Back-end

I chose API Routes, since it's already integrated into NextJS and at the same time I don't have a lot of requirements, since the project was not meant to scale. Then for the database I chose Sqlite, since I only need a small database.

Front-end

File structure

  1. Components - /components
  2. Context API - /context
  3. Styles - /styles
  4. Pages - /pages
  5. Types - /types

Back-end

File structure

  1. API routes - /pages/api
  2. Migrations - /migrations
  3. Initial - ./database.js
  4. Database - ./database.sqlite

Server status codes

  1. success - The operation was successful
  2. db-error - There was an error in the database
  3. {something}-exists - The thing we are trying to add already exists in the database
  4. invalid-data - The data we are providing does not match the required data
  5. invalid-email - There is no such user
  6. invalid-password - User exists, but the password is wrong
  7. updated - Databse item updated
  8. deleted - Database item deleted