Welcome to the Official Bakery Shop project! This is a React-based web application where you can explore different bakery categories and items like cakes, pastries, and more. The project is a practice ground for learning key concepts of React, along with incorporating modern frontend tools and libraries.
- Category Selection: Choose from different categories like cakes, pastries, and more.
- Item Cards: View detailed bakery item cards, including images, descriptions, and prices.
- Add to Cart: Add items to your cart and see the cart update dynamically.
- Responsive Design: Built with Bootstrap for mobile and desktop responsiveness.
- Modal Interactions: Open modal windows to view more item details.
- Sass Integration: Styling is managed using Sass for easy customization.
- React: For building interactive UI components.
- Bootstrap: For styling and layout responsiveness.
- FontAwesome: For adding icons to the app.
- Sass: For enhanced styling with variables and mixins.
- JavaScript (ES6+): Using modern JavaScript features like the spread operator and destructuring.
- Component-based Architecture: Breaking down the UI into reusable components.
- State Management: Using
useState
to manage categories and the cart system. - Props: Passing data between components using props and spreading properties (
...props
). - Event Handling: Handling click events, such as adding items to the cart.
- Conditional Rendering: Displaying components based on user interaction.
In the project directory, you can run:
Runs the app in development mode.
Open http://localhost:3000 to view it in your browser.
The page will reload if you make edits.
You will also see any lint errors in the console.
Launches the test runner in the interactive watch mode. See the section about running tests for more information.
Builds the app for production to the build
folder.
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified, and filenames include the hashes.
Your app is ready to be deployed!