Giter Club home page Giter Club logo

shubham001official / grofers Goto Github PK

View Code? Open in Web Editor NEW
0.0 1.0 0.0 895 KB

An online grocery store built with Next.js 14, Tailwind CSS, Strapi, and PostgreSQL. Features a user-friendly UI/UX, categorized products, sound effects, and secure PayPal payments. Deployed on Vercel and Render. ๐Ÿš€

Home Page: https://grofers.vercel.app

License: MIT License

JavaScript 95.06% CSS 4.94%
ecommerce fullstack-development nextjs14 paypal-integration postgresql reactjs render responsive-design shopping-cart strapi-cms tailwindcss vercel-deployment web-development online-grocery-store

grofers's Introduction

Grofers - Online Grocery Store ๐Ÿ›’

Welcome to Grofers, your go-to online grocery store for a seamless shopping experience. Purchase groceries and household essentials from the comfort of your home with just a few clicks. ๐ŸŒŸ

Grofers

๐ŸŒŸ Features

  • Login & Sign Up: Secure and easy authentication for a personalized experience.
  • Product Categories: Browse through a variety of categories like Vegetables, Fruits, Milk & Juice, Personal Health Care, Egg & Chicken, and more.
  • Sound Effects: Enjoy delightful sound effects for adding items to the cart and successful checkouts.
  • User-Friendly UI/UX: Clean, attractive, and responsive design for the best user experience.
  • Secure Payments: Seamless transactions with PayPal integration.
  • Validation: Robust form validation for smooth user interactions.

๐Ÿš€ Purpose

Grofers aims to revolutionize the online grocery shopping experience by providing:

  • Convenience: Shop for groceries from anywhere, anytime.
  • Wide Product Range: Find all your household essentials in one place.
  • Engaging Features: Enjoy unique features like sound effects and a responsive interface.
  • Security: Trustworthy transactions with PayPal.

๐Ÿ› ๏ธ Technologies

Frontend

  • Next.js 14: For a powerful and scalable React-based framework.
  • Tailwind CSS: To style the application with utility-first CSS.
  • Stripe: For secure and seamless payment integration.

Backend

  • Strapi: A headless CMS for managing content.
  • PostgreSQL: A robust and scalable relational database.

๐ŸŒ Deployment

  • Frontend: Deployed on Vercel.
  • Backend: Deployed on Render.

๐Ÿ“ธ Screenshots

Homepage

Homepage

Create Account Page

Create Account Page

Sign-in Page

Sign-in Page

Popular Products

Popular Products

Shop by Category

Shop by Category

My Cart

My Cart

Checkout Process

Checkout Process

Payment Gateway

Payment Gateway

Order Successful

Order Successful

My Orders

My Orders

๐Ÿ“ฅ Installation & Setup

Prerequisites

  • Node.js and npm installed
  • PostgreSQL database (local or cloud instance)

Environment Variables

Create a .env.local file in the root directory and add the following:

NEXT_PUBLIC_STRIPE_PUBLIC_KEY=your-stripe-public-key
DATABASE_URL=your-postgresql-database-url

Steps

  1. Clone the repository:

    git clone https://github.com/shubham001official/grofers.git
  2. Install dependencies:

    cd grofers
    npm install
  3. Run the development server:

    npm run dev
  4. Open your browser and visit: http://localhost:3000

๐Ÿค Contributing

Contributions are welcome! Feel free to open an issue or submit a pull request.

  1. Follow consistent code style and adhere to linting rules.
  2. Provide detailed descriptions for any new features or bug fixes.

๐Ÿ“ง Contact

For support or feedback, reach out via email: [email protected]

grofers's People

Contributors

shubham001official avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.