Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/mahmoudahmadosman/vast-burgers-api

React application focused on burgers, where users can view and order delicious burgers from the VAST BURGERS online.
https://github.com/mahmoudahmadosman/vast-burgers-api

axios bootstrap5 css3 html5 reactjs

Last synced: about 4 hours ago
JSON representation

React application focused on burgers, where users can view and order delicious burgers from the VAST BURGERS online.

Awesome Lists containing this project

README

        

# VAST BURGERS - React JS Project

Welcome to the VAST BURGERS React JS project! This project is a web application focused on burgers, where users can view and order delicious burgers from the VAST BURGERS company. The project utilizes React JS, Bootstrap 5, HTML5, CSS3, and pure JavaScript to create an interactive and visually appealing user experience.

## Features

- **Burger Listing**: View a list of mouthwatering burgers available from VAST BURGERS.
- **Burger Details**: Click on a burger to see its details, including ingredients and price.
- **Burger Ordering**: Add burgers to your cart and place an order.
- **Cart**: Manage your burger selections in the cart before placing an order.
- **API Integration**: The project connects to a remote server to fetch burger data.

## Technologies Used

- React JS: A popular JavaScript library for building user interfaces.
- Bootstrap 5: A CSS framework for responsive and mobile-first web development.
- HTML5: The latest version of the Hypertext Markup Language for structuring web content.
- CSS3: The latest version of Cascading Style Sheets for styling web content.
- JavaScript: A powerful programming language for adding interactivity to web pages.

## Prerequisites

Before running this project locally, ensure you have the following installed:

- Node.js: [Download and install Node.js](https://nodejs.org/en/download/) to run JavaScript applications.
- Git: [Download and install Git](https://git-scm.com/downloads) for version control and project management.

## Getting Started

To get a local copy of the project up and running, follow these steps:

1. Clone the repository:

```bash
git clone https://github.com/MahmoudAhmadOsman/vast-burgers-api.git
```

2. Navigate to the project directory:

```bash
cd vast-burgers-api
```

3. Install the dependencies:

```bash
npm install
```

4. Start the development server:

```bash
npm start
```

5. Open your browser and visit [http://localhost:3000](http://localhost:3000) to see the VAST BURGERS web application in action.

## API Integration

This project relies on a remote server to fetch burger data. The API endpoints are provided by the VAST BURGERS company. Make sure the API is accessible and running properly for the application to function correctly.

## Folder Structure

The project's folder structure is organized as follows:

```
vast-burgers-react/
├── public/ # Public assets and HTML template
├── src/ # React source code
│ ├── components/ # Reusable components
│ ├── pages/ # Application pages
│ ├── services/ # API integration services
│ ├── styles/ # CSS stylesheets
│ ├── App.js # Root component
│ └── index.js # Entry point
├── .gitignore # Git ignore configuration
├── package.json # Project metadata and dependencies
└── README.md # Project documentation (you are here)
```

### VAST BURGERS - HOMEPAGE

![HOMEPAGE](https://github.com/MahmoudAhmadOsman/vast-burgers-api/blob/master/public/assets/images/burger-home-page.png)

### VAST BURGERS - LANGING PAGE

![LANDING PAGE](https://github.com/MahmoudAhmadOsman/vast-burgers-api/blob/master/public/assets/images/burgers-landing-page.png)

### VAST BURGERS - SINGLE PAGE

![SINGLE PAGE](https://github.com/MahmoudAhmadOsman/vast-burgers-api/blob/master/public/assets/images/burger-view.png.png)

### VAST BURGERS - SHOPPING CART

![VSHOPPING CART](https://github.com/MahmoudAhmadOsman/vast-burgers-api/blob/master/public/assets/images/burger-shopping-cart..png)

### VAST BURGERS - ORDER PAGE

![ORDER PAGE](https://github.com/MahmoudAhmadOsman/vast-burgers-api/blob/master/public/assets/images/order-landing-page.png)

## Contributing

Contributions to this project are welcome! If you find any issues or have suggestions for improvements, please open an issue or submit a pull request on the project's GitHub repository.

## License

This project is licensed under the [MIT License](LICENSE).

---

Enjoy your burger browsing and ordering experience with VAST BURGERS!