Developed a web project focusing on nutrition and healthy eating, utilizing a tech stack that includes HTML, CSS, JavaScript, Fetch API, Promises, Async/Await, various HTTP methods (GET, POST, PUT, DELETE), LocalStorage, Modules, Imports/Exports, Webpack, and Babel.
The project offers multiple dietary plans to choose from and features a contact form for user engagement. Additionally, it includes a calorie calculator to aid in meal planning. The use of Fetch API and the various HTTP methods allows for seamless communication with a server to retrieve, save, update, and delete dietary information.
The project employs LocalStorage to store user preferences, while leveraging modern JavaScript features such as Promises, Async/Await, and module-based architecture. Webpack and Babel are used to bundle and transpile the code for browser compatibility, ensuring a smooth user experience across different environments.
output.compress-video-online.com.2.mp4
- Install all needed dependencies:
npm install - Run the json-server (back app), your server must work on localhost:3000:
npx json-server db.json - Run the front app with some server (you can use MAMP for example). Attention: do not use LiveServer from VS Code for this as it can cause problems with POST / PUT / DELETE requests to the server.
- HTML
- CSS
- Javascript
- Fetch API
- Promises
- Async / Await
- GET / POST / PUT / DELETE methods
- LocalStorage
- Modules (Imports / Exports)
- Webpack
- Babel