This application features a login system, a registration form, and a dashboard with product management functionalities. The project integrates Auth0 for authentication and the Fake Store API for product CRUD operations. All styling is done using Bootstrap, and the project is deployed on Vercel.

• Login Page:
  • Connects to Auth0 for authentication.
  • Fields for username/email and password.
  • Redirects to the registration page upon successful login.

• Registration Page:
  • Displays after the first authentication.
  • Redirects to the dashboard upon "completion."

• Dashboard Structure:

  • Contains two main pages: Product List Page and Product Details Page.

• Product List Page:

  • Fetches and displays a list of products from the Fake Store API.
  • Displays product name, description, and price.
  • Uses React Table for displaying the products in a tabular format.
  • Includes buttons for:
    • Edit Product: Allows editing of an existing product.
    • Delete Product: Deletes a product from the list.
  • "Add New Product" button is placed at the top right corner of the table.

• Product Details Page:

  • Navigates to a detailed view of the product when clicked from the list.
  • Displays all details of the selected product.
  • Option to return to the product list.

• Redux Toolkit:
  • Manages the global state of the application.
• Context API:
  • Manages user authentication state.
  • Redux Toolkit manages product data and form states.

• Fake Store API:
  • Connects the product list and CRUD operations.
  • API calls are handled using Axios.

• React Router DOM:
  • Implements routing in the application.

• Bootstrap:
  • Styles the entire application.

The project is deployed on Vercel.

1. Clone the repository:

   git clone https://github.com/akifzdemir/ila

2. Navigate to the project directory:

   cd ila

3. Install dependencies:

   npm install

4. Create a .env file in the root directory and add your Auth0 credentials:

   REACT_APP_AUTH0_DOMAIN=your-auth0-domain
   REACT_APP_AUTH0_CLIENT_ID=your-auth0-client-id
   

5. Start the application:

   npm run dev

6. Visit http://localhost:5173 to view the application.

• React.js
• Auth0
• Redux Toolkit
• React Router DOM
• Bootstrap
• Axios
• Vercel