Bagel App Frontend

Welcome to the Bagel App Frontend repository! This React-based frontend application manages and displays information about various bagels. The app leverages modern web technologies to deliver a seamless and interactive user experience.

Features

• Navigation: Easy navigation with a fixed NavBar.
• CRUD Operations: Create, read, update, and delete bagel entries.
• Responsive Design: Mobile-friendly design using Material-UI.
• Custom Cursor: Enhances user experience with a custom cursor icon.
• Error Handling: 404 page for unmatched routes.
• Google Maps Integration: Display locations with Google Maps.

Technologies

• React: A JavaScript library for building user interfaces.
• Vite: A fast build tool and development server.
• Material-UI: A popular React component library for building user interfaces.
• Styled Components: Library for styling React components.
• Framer Motion: Animation library for React.
• Google Maps React: Integration for displaying maps.
• ESLint: Tool for identifying and fixing linting issues in code.

Setup and Installation

1. Clone the Repository:

   git clone https://github.com/renad-lab/bagel-app-front-end-rebranch.git

2. Navigate to the Project Directory:

   cd bagel-app-front-end-rebranch

3. Install Dependencies:

   npm install

4. Run the Development Server:

   npm run dev

   This will start the development server. You can view the app in your browser at http://localhost:4001.

Project Structure

• src/: Contains all the source code for the project.
  • components/: Reusable UI components.
  • pages/: Different pages of the application.
  • styles/: Global and component-specific styles.
  • App.js: Main application file that sets up routing and layout.

Deployment

Front-End

The front-end application is deployed on Netlify. You can view the live version at:

Netlify Deployment URL

Back-End

The back-end API is deployed on Render. You can view the live version at:

Render Deployment URL