JNX Tennis Store

JNX Tennis Store is an online store that offers high-quality tennis equipment and accessories for players of all levels. Our mission is to provide the best tennis gear to enhance your game.

Features

• High-Quality Products: We offer a wide range of professional and beginner tennis rackets, balls, and accessories.
• User Authentication: Secure login and registration using Firebase.
• Product Reviews: Users can leave reviews and ratings for products.
• Order Management: Track your order history and manage your account.
• Responsive Design: Optimized for both desktop and mobile devices.
• Real-Time Notifications: Stay updated with the latest offers and order status.

Technologies Used

• Next.js: React framework for server-side rendering and static site generation.
• Tailwind CSS: Utility-first CSS framework for styling.
• Firebase: Backend services for authentication, database, and storage.
• Cloudinary: Image and video management.
• FontAwesome: Icons for UI components.
• React Hook Form: Form validation and handling.
• Radix UI: Accessible UI components.
• React Hot Toast: Notifications and alerts.

Getting Started

Prerequisites

• Node.js (v14 or higher)
• npm or yarn

Installation

1. Clone the repository:

   git clone https://github.com/your-username/jnx-tennis-store.git
   cd jnx-tennis-store

2. Install dependencies:

   npm install
   # or
   yarn install

3. Create a .env.local file in the root directory and add your environment variables:

   CLOUDINARY_CLOUD_NAME=your_cloud_name
   CLOUDINARY_API_KEY=your_api_key
   CLOUDINARY_API_SECRET=your_api_secret
   
   NEXT_PUBLIC_CLOUDFLARE_SITE_KEY=your_site_key
   CLOUDFLARE_SECRET_KEY=your_secret_key
   
   NEXT_PUBLIC_FIREBASE_API_KEY=your_firebase_api_key
   NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=your_firebase_auth_domain
   NEXT_PUBLIC_FIREBASE_PROJECT_ID=your_firebase_project_id
   NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=your_firebase_storage_bucket
   NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=your_firebase_messaging_sender_id
   NEXT_PUBLIC_FIREBASE_APP_ID=your_firebase_app_id
   NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID=your_firebase_measurement_id
   NEXT_PUBLIC_FIREBASE_DATABASE_URL=your_firebase_database_url
   
   NEXT_PUBLIC_GHN_TOKEN=your_ghn_token
   NEXT_PUBLIC_GHN_SHOP_ID=your_ghn_shop_id
   NEXT_PUBLIC_GHN_SERVICE_ID=your_ghn_service_id

4. Run the development server:

   npm run dev
   # or
   yarn dev

5. Open http://localhost:3000 with your browser to see the result.

Learn More

To learn more about Next.js, take a look at the following resources:

• Next.js Documentation - Learn about Next.js features and API.
• Learn Next.js - An interactive Next.js tutorial.

You can check out the Next.js GitHub repository - Your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Live

Visit the deployed website at: https://jnxstore.id.vn/