This is the project Blog for Synapsis Frontend Test work, by Muhammad Ferdian Iqbal

Demo Project

🪂Getting Started🪂

First, clone this project:

git clone https://github.com/ferdianqbl/cmlabs-frontend-parttime-test.git

Then, install the dependencies:

cd cmlabs-frontend-parttime-test
npm install

Then, create a .env.local file at the root of the project and copy the environments from .env.example:

cp .env.example .env.local

Then, fill in the variables according to your environment:

NEXT_PUBLIC_API_URL=https://www.themealdb.com/api/json/v1/1

Then, run the development server:

npm run dev

Open http://localhost:3000 with your browser to see the result.

🚀Features🚀

Home

5 Latest Ingredients, Categories, and Areas

Ingredients

All Ingredients with Search by Ingredient Name and Pagination

Detail Ingredient

All Foods by Ingredient with Search by Food Name and Pagination

Categories

All Categories with Search by Category Name and Pagination

Detail Category

All Foods by Category with Search by Food Name and Pagination

Areas

All Areas with Search by Area Name and Pagination

Detail Area

All Foods by Area with Search by Food Name and Pagination

Detail Food / Meal

  • Food Header (Image, category, country, and Recipe Reference)
  • Food Recipes
  • Food Instructions
  • Food Tutorial