This readme can also be read in Brazilian Portuguese or English.
You can access it through this link Store 88
The e-commerce project is a concrete example of my work in web development, demonstrating my skills and knowledge. This application represents a complete solution for online shopping, covering everything from the customer experience to product administration.
This project makes use of a modern and essential technology stack, including:
-
next-sanity: Integration between Next.js and Sanity CMS.
-
react-hook-form: Library for building forms with React, providing form validation and handling.
-
sanity/client: Official Sanity client library for JavaScript.
-
stripe/stripe-js: JavaScript library for interacting with the Stripe API.
-
typescript: A typed superset of JavaScript that compiles to plain JavaScript.
-
zod: TypeScript-first schema validation library.
-
next: Framework for server-rendered React applications.
-
next-auth: Authentication library that simplifies session management and ensures user security in Next.js applications.
-
react: JavaScript library for building user interfaces.
-
react-dom: Entry point to the DOM and server renderers for React.
-
tailwindcss: A utility CSS framework that accelerates the development of user interfaces with consistent styles.
-
prisma/client: Prisma client for database access and ORM.
-
nodemailer: Nodemailer is a module for Node.js applications to allow easy as cake email sending.
-
And many others: Additionally, technologies such as shadcn, Radix UI and React Email to create a complete and robust experience.
- app: Main application directory containing various pages and components.
- app/api: Directory for API endpoints related to authentication, cart, user registration, etc.
- app/cart: Handles functionality related to the user's shopping cart.
- app/dashboard: Contains components and pages related to the admin dashboard.
- app/products: Manages functionality related to displaying and managing products.
- components: Reusable UI components used throughout the application.
- config: Directory for project configuration files.
- prisma: Contains database schema and migration files.
- public: Directory for static assets and public files.
- sanity: Handles content management using Sanity CMS.
Products Features
| Feature | Check? | Description |
|---|---|---|
| Add a Product | ✔ | Ability of Add a Product on the System |
| List Products | ✔ | Ability of List Products |
| Edit a Product | ✔ | Ability of Edit a Product |
| Delete a Product | ✔ | Ability of Delete a Product |
Purchase Features
| Feature | Check? | Description |
|---|---|---|
| Create a Cart | ✔ | Ability of Create a new Cart |
| See Cart | ✔ | Ability to see the Cart and it items |
| Remove a Cart | ✔ | Ability of Remove a Cart |
| Add Item | ✔ | Ability of add a new Item on the Cart |
| Remove a Item | ✔ | Ability of Remove a Item from the Cart |
| Checkout | ✔ | Ability to Checkout |
User Features
| Feature | Check? | Description |
|---|---|---|
| Create a User | ✔ | Ability of Create a new User |
| User Login | ✔ | Ability to Login |
| User Logoff | ✔ | Ability to Logoff |
| Password Recovery | ✔ | Ability to recover a User Password |
- Task #1: page with list of orders with private route.
- Task #2: authentication flow.
- Task #3: creating a store user's purchase history, persisting in the database.
- [ ] Task #4: email order information after purchase.
- more others...
.env.example
# Sanity Settings
NEXT_PUBLIC_SANITY_PROJECT_ID=
NEXT_PUBLIC_SANITY_DATASET=
NEXT_PUBLIC_SANITY_API_VERSION=
NEXT_PUBLIC_SANITY_USE_CDN=
NEXT_PUBLIC_SANITY_TOKEN=
# Stripe API Key
NEXT_PUBLIC_STRIPE_PUBLIC_KEY=
STRIPE_SECRET_KEY=
# Prisma Database URL
DATABASE_URL=
# NextAuth
NEXT_PUBLIC_SECRET=
NEXTAUTH_URL=
# Google Provider
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
# E-mail Provider (Nodemailer)
EMAIL_MAIL=
EMAIL_PASSWORD=
# Production Nodemailer
NODEMAILER_DOMAIN=
DOMAIN=You must have the following installed on your machine to run this project:
1.Clone the e-commerce repository:
git clone https://github.com/ThiLourenco/e-commerce2.Install the dependencies with one of the package managers listed below:
pnpm install
npm install
3.Start the development mode:
pnpm dev
npm run dev
This project is licensed under the MIT License - see the MIT License file for details.