{"id":27707722,"url":"https://github.com/nikkiaung/snap-shop","last_synced_at":"2026-05-11T05:34:47.947Z","repository":{"id":288159835,"uuid":"967000323","full_name":"NikkiAung/snap-shop","owner":"NikkiAung","description":"Currently learning \u0026 developing nextjs full-stack website 🤍","archived":false,"fork":false,"pushed_at":"2025-04-24T00:00:34.000Z","size":158,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-24T01:18:50.543Z","etag":null,"topics":["drizzle-orm","neondb","nextjs","posgresql","send-email","shadcn-ui","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/NikkiAung.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-04-15T19:16:07.000Z","updated_at":"2025-04-24T00:00:37.000Z","dependencies_parsed_at":"2025-04-20T05:00:39.859Z","dependency_job_id":null,"html_url":"https://github.com/NikkiAung/snap-shop","commit_stats":null,"previous_names":["nikkiaung/snap-shop"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NikkiAung%2Fsnap-shop","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NikkiAung%2Fsnap-shop/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NikkiAung%2Fsnap-shop/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NikkiAung%2Fsnap-shop/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/NikkiAung","download_url":"https://codeload.github.com/NikkiAung/snap-shop/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250955398,"owners_count":21513499,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["drizzle-orm","neondb","nextjs","posgresql","send-email","shadcn-ui","typescript"],"created_at":"2025-04-26T07:57:39.771Z","updated_at":"2026-05-11T05:34:47.940Z","avatar_url":"https://github.com/NikkiAung.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Snap-Shop 🛒\n\n## Description 📚\n\nSnap-Shop is a comprehensive e-commerce web application built with Next.js, designed to allow users to browse products, manage a cart, register, log in, authenticate, and utilize a dashboard for order and account management. It leverages modern web technologies and frameworks to provide a robust and user-friendly shopping experience.\n\n## Demo 🎥\n\n#### **Project Demo** : [e-commerce web Vd Demo](https://drive.google.com/file/d/16BOw26JqHRnalH7-1NAL09g2pWOS98IK/view?usp=sharing)\n\n#### **Home Page**\n\n![Snap-Shop Demo Screenshot](./public/demo.png)\n\n## Features 👾\n\n- **User Authentication:** Secure login, registration, and password reset functionalities.\n- **Product Browsing:** Display and browse products with detailed information.\n- **Shopping Cart:** Add items to cart, view cart contents, and proceed to checkout.\n- **Payment Processing:** Integration with Stripe for secure payment processing.\n- **User Account Management:** Profile management, settings adjustments, and two-factor authentication.\n- **Dashboard:** Order management and analytics dashboard for administrators.\n- **Product Management:** Product creation and management capabilities within the dashboard.\n- **Image Uploading:** Utilizes Uploadthing for image uploads.\n- **Responsive Design:** Implemented with Tailwind CSS for a consistent user experience across devices.\n- **Database Interaction:** Uses Drizzle ORM for efficient database interactions.\n- **Email Functionality:** Integration with Resend for email confirmations and password resets.\n\n## Installation ⚔️\n\nTo get started with Snap-Shop, follow these installation steps:\n\n1.  **Clone the Repository:**\n\n    ```bash\n    git clone \u003crepository_url\u003e\n    cd snap-shop\n    ```\n\n2.  **Install Dependencies:**\n\n    ```bash\n    npm install\n    ```\n\n3.  **Set up Environment Variables:**\n\n    Create a `.env.local` file in the root directory and configure the required environment variables. Key variables include:\n\n    - `DATABASE_URL`: Connection string for your PostgreSQL database (e.g., from Neon).\n    - `NEXTAUTH_SECRET`: A secret for NextAuth.\n    - `NEXTAUTH_URL`: The base URL of your application.\n    - `STRIPE_SECRET_KEY`: Your Stripe secret key.\n    - `STRIPE_WEBHOOK_SECRET`: Your Stripe webhook secret.\n    - `UPLOADTHING_SECRET`: Secret for Uploadthing\n    - `UPLOADTHING_APP_ID`: App ID for Uploadthing\n    - `RESEND_API_KEY`: Your Resend API key.\n\n4.  **Database Setup:**\n\n    - Run database migrations using Drizzle Kit:\n\n    ```bash\n    npm run db:push  # Or npm run db:generate if you need to generate migrations\n    ```\n\n5.  **Run the Application:**\n\n    ```bash\n    npm run dev\n    ```\n\n    This will start the development server. You can then access the application in your web browser, typically at `http://localhost:3000`.\n\n## Usage Examples 🤝\n\n- **Accessing the Homepage:** Navigate to the root URL (e.g., `http://localhost:3000`) to view the homepage (`app/page.tsx`).\n- **User Authentication:**\n  - Register a new user through the registration page (`app/auth/register/page.tsx`).\n  - Log in with your credentials via the login page (`app/auth/login/page.tsx`).\n- **Product Detail Page:** View product details by navigating to `/products/[id]` (e.g., `/products/123`).\n- **Dashboard Access:** Log in and access the dashboard by navigating to `/dashboard`.\n- **Server Actions Example:** The application likely uses server actions in `server/actions/*` to handle form submissions, such as login (`server/actions/login-action.ts`), registration (`server/actions/register-action.ts`), and password resets (`server/actions/reset-password.ts`).\n\n## Tech Stack and Dependencies 🧑🏻‍🔧\n\n- **Languages:** TypeScript, JavaScript, Postgresql\n- **Frameworks:** Next.js, React\n- **Styling:** Tailwind CSS\n- **Database:** Drizzle ORM, PostgreSQL (via Neon or similar)\n- **Authentication:** NextAuth\n- **State Management:** Zustand\n- **Form Handling:** React Hook Form\n- **Payment Processing:** Stripe\n- **File Uploads:** Uploadthing\n- **UI Components:** Radix UI, Recharts, Vaul, Sonner, Shadcn\n- **Other Dependencies:** Zod (validation), bcrypt, date-fns, Resend, various UI component libraries.\n\n## Project Structure Overview 🦾\n\n```\nsnap-shop/\n├── app/                    # Next.js application routes and components\n│   ├── auth/               # Authentication routes (login, register, reset password)\n│   ├── dashboard/          # Dashboard routes and components\n│   ├── products/           # Product related routes\n│   ├── api/                # API routes (NextAuth, Uploadthing)\n│   ├── layout.tsx          # Main application layout\n│   └── page.tsx            # Homepage\n├── components/             # Reusable React components\n│   ├── cart/               # Cart related components\n│   ├── auth/               # Authentication components\n│   ├── navigation/         # Navigation components\n│   ├── setting/            # User setting components\n│   ├── products/           # Product display and management components\n│   ├── ui/                 # UI components (button, input, etc.)\n│   ├── analytics/          # Analytics components\n│   └── ...\n├── lib/                    # Utility functions and helpers\n├── store/                  # Zustand store for state management (e.g., cart)\n├── server/                 # Server-side logic\n│   ├── actions/            # Server actions\n│   ├── migrations/         # Database migrations\n│   ├── schema.ts           # Database schema\n│   └── index.ts            # Server entry point\n├── types/                  # TypeScript type definitions\n├── public/                 # Static assets (images, etc.)\n├── drizzle.config.ts       # Drizzle configuration\n├── next.config.ts          # Next.js configuration\n├── package.json            # Project dependencies and scripts\n├── tsconfig.json           # TypeScript configuration\n└── README.md               # This README file\n```\n\n## Contributing 🤍\n\nContributions are welcome! Please follow these guidelines:\n\n1.  **Fork the repository.**\n2.  **Create a new branch** for your feature or bug fix.\n3.  **Make your changes** and commit them with clear, concise messages.\n4.  **Test your changes** thoroughly.\n5.  **Submit a pull request.**\n\n## License\n\nThis project is licensed under the [MIT License](LICENSE).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnikkiaung%2Fsnap-shop","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnikkiaung%2Fsnap-shop","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnikkiaung%2Fsnap-shop/lists"}