A simple web application for searching and displaying nutrition information using an external API.
This project is a Vue.js web application that allows users to search for nutrition information of various food items. It utilizes an external API to retrieve the nutrition data based on the user's search query. The retrieved data includes details such as serving size, calories, protein, and fat content.
- Search for nutrition information of food items
- Display nutrition details such as serving size, calories, protein, and fat content
- Professional and user-friendly interface
- Easy-to-use search bar and search button
- Error handling for invalid or unavailable search queries
- Clone the repository.
- Navigate to the project directory.
- Install the dependencies using the package manager of your choice. For example:
npm install
- Run the application using the package manager. For example:
npm run serve
- Access the application by opening the provided URL in a web browser.
- Enter a search query in the search bar to retrieve nutrition information for the corresponding food item.
- Click the search button to initiate the search.
- The retrieved nutrition information will be displayed on the page, including serving size, calories, protein, and fat content.
The application uses an API key to access the external nutrition data API. The API key is stored in a seperate file for demonstration purposes. Please go to config.js and get your own API key by following the instructions in the file.
Contributions are welcome! If you have any suggestions or would like to improve the project, please open an issue or submit a pull request.
This project is licensed under the MIT License. Feel free to use and modify the code as per the license terms.