A modern, full-stack e-commerce platform for book lovers built with Next.js 15, featuring secure authentication, shopping cart functionality, and seamless payment processing.
- NextAuth.js Integration - Secure user authentication with JWT tokens
- Role-based Access Control - Customer, Admin, and Seller roles
- Password Recovery - Forgot password and reset functionality
- Session Management - Secure session handling with refresh tokens
- Product Catalog - Browse books with detailed information
- Shopping Cart - Add/remove items with real-time updates
- Book Details - Comprehensive product pages with descriptions
- Search & Filter - Find books by category, author, or title
- Stripe Integration - Secure payment processing
- Multiple Payment Methods - Credit/debit card support
- Order Management - Complete checkout flow with order tracking
- Address Management - Shipping address collection
- Responsive Design - Works seamlessly on all devices
- Dark/Light Theme - Toggle between themes
- Smooth Animations - Framer Motion for delightful interactions
- Loading States - User-friendly loading indicators
- Next.js 15 - React framework with App Router
- TypeScript - Type-safe development
- Tailwind CSS - Utility-first CSS framework
- Framer Motion - Animation library
- React Hook Form - Form handling with validation
- Zod - Schema validation
- Shadcn - UI library
- NextAuth.js - Authentication framework
- Server Actions - Server-side data fetching
- RESTful API - External book store API integration
- Stripe - Payment processing
- TanStack Query - Server state management
- React Query - Data fetching and caching
- ESLint - Code linting
- TypeScript - Static type checking
- Vercel - Deployment platform
- Node.js 18+
- npm or yarn
- Git
-
Clone the repository
git clone https://github.com/yourusername/redify.git cd redify -
Install dependencies
npm install
-
Run the development server
npm run dev
-
Open your browser Navigate to http://localhost:3000
src/
├── app/ # Next.js App Router
│ ├── (dashboard)/ # Dashboard layout
│ ├── api/ # API routes
│ ├── auth/ # Authentication pages
│ └── dashboard/ # Main application pages
├── components/ # Reusable UI components
│ └── ui/ # Shadcn/ui components
├── lib/ # Utility functions and configurations
│ ├── actions/ # Server actions
│ ├── forms/ # Form schemas and components
│ ├── providers/ # Context providers
│ └── types/ # TypeScript type definitions
└── middleware.ts # Next.js middleware
The app uses NextAuth.js with credentials provider. Configure your authentication in src/auth.ts:
Update the API endpoint in your environment variables to connect to your backend:
API=https://upskilling-egypt.com:3007/api-
Connect your repository to Vercel
-
Set environment variables in Vercel dashboard:
NEXTAUTH_URL- https://redifyy.vercel.app/NEXTAUTH_SECRET-pk_test_51Rzb4zCOiEjbFq7dLnouInOiXpXlU4rtP9AsEJn5vkGfXtjTerfdu3edQ3bJbXL0JK8KwHV6mQP1zN0Gtp0HzqqI00mTBNT89fAPI-(https://upskilling-egypt.com:3007/api)
-
Deploy
vercel --prod
We welcome contributions! Please follow these steps:
- Fork the repository
- Create a feature branch
git checkout -b feature/amazing-feature
- Commit your changes
git commit -m 'Add some amazing feature' - Push to the branch
git push origin feature/amazing-feature
- Open a Pull Request
If you have any questions or need help, please:
- Open an issue on GitHub
- Contact us at ramyesam701@gmail.com
Made with ❤️ by Ramy Essam