Skip to content

Osama-NA/Health-and-Fitness-Website

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

31 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Health Website

Health and fitness website using ReactJs and Sass.

Docs

Fonts

Fonts are from google fonts: https://fonts.google.com/ Fonts used: Courgette, Raleway, poppins

Icons

This project uses Font Awesome icons. Link to Font Awesome

Images

Home background image:

Services background image:

Services images:

Recommendation images:

Recipes page background image:

Tool used to compress images: https://imagecompressor.io/

Contact Form

Contact form is submitted using FORMSUBMIT: https://formsubmit.co/

In this project the contact form is submitted using a fetch post request to the URL: https://formsubmit.co/ajax/[admin email mask here]

admin email mask is found in the admin email email account which is used to activate form submit

The contact form has to be activated whenever deployed. After deployment, when a contact form is submitted the admin will get an activation link in his email, after clicking 'Activate form' the contact form will be activated and the admin will be able to receive feedback / messages.

Recipes Search

Recipes are provided by the Edamam Recipe Search API (https://developer.edamam.com/edamam-recipe-api)

Current Edamam Recipe API service which is being used is the free developer package which provides:

  • 10,000 API calls/month
  • 10 throttling calls/minute

An API call request to the Recipe Search API is made in two cases:

  1. User types a recipe/food/ingredient name and clicks search button
  2. User clicks one of the listed top 10 healthy foods

Recipes are fetched from this URL which requires a query and id + key of the registered package account (https://api.edamam.com/api/recipes/v2?type=public&q=${query}s&app_id=${id}&app_key=${key})

The id and key are found in the registered account Dashboard > Applications > View

Favorite recipes are stored in context api and then stored in localStorage which is done inside the favorites context reducer

Calorie Calculator

The calorie calculator uses the Fitness Calculator from RapidAPI (https://rapidapi.com/malaaddincelik/api/fitness-calculator) which is free with unlimited requests