Skip to content

Latest commit

 

History

History
121 lines (82 loc) · 4.67 KB

README.md

File metadata and controls

121 lines (82 loc) · 4.67 KB
Raw

Admin Panel (Nex.js)

This is the Admin Panel(for our Ecommerce Store) Web App made with Next.js and other modern technologies where authorised users can authenticate themself and create/view Products, Categories and Orders. I have added a Properties section to the Categories to create properties such as Color, Weight, Size, etc.

Tech Stacks

Next.js Tailwind CSS MongoDB React Stripe Supabase

Features

  • User Registration and Authentication: Secure user access with Google Auth authentication.
  • User Login and Logout: Easy login and logout for authorized access.
  • Product Management: Create, view, and manage products effortlessly.
  • Category Management: Effective product categorization with properties like color, weight, size, etc.
  • Order Management: Track, update, and complete customer orders.
  • Image Gallery: User-specific image uploads whith Supabase.
  • Responsive Design: Seamlessly adapt to various screen sizes for optimal user experience.
  • Supabase Integration: Backend services including Storage Bucket.
  • Properties Section: Define product properties within categories for better categorization.
  • User-Friendly Interface: Intuitive interface for streamlined management by all users.

Screenshots

Screenshot 1
Screenshot 2
Screenshot 3
Screenshot 4
Screenshot 5

Installation

  1. Clone the repository:
git clone https://github.com/lazyjinchuriki/admin-panel.git
  1. Install dependencies:
cd admin-panel
npm install

  1. Set up Environment Variables:

    • Create a Supabase project on the Supabase Dashboard.
    • Configure storage in your Supabase project settings.
    • Copy your Supabase API URL and public API key.
    • Create an OAuth Account for authentication
    • Create a MongoDB Account for Database Storate.

  2. Create a .env file in the project root and add your configuration:

GOOGLE_ID=""
GOOGLE_SECRET=""
MONGODB_URI=""

NEXT_PUBLIC_SUPABASE_URL=""
NEXT_PUBLIC_SUPABASE_ANON_KEY=""
NEXT_PUBLIC_CDN_URL=""

STRIPE_SECRET_KEY=""

NEXT_PUBLIC_DOMAIN="http://localhost:3000"
  1. Start the development server:
npm run dev

Usage

After running the development server, you can view the app at http://localhost:3000/

Customization

The app Pages can be customized by editing the /pages/ folder. You will find all the components in /components/ folder.

Contributions

Contributions to the project are welcome. Please create an issue or submit a pull request if you would like to contribute.

Contact

If you have any questions or concerns, you can contact the author of this project at rahulkhushalani@proton.me.

Donations

If you found Gallery useful, consider buying me a coffee!

Social

If you're not coding right now, check out my socials:

Instagram LinkedIn