Skip to content

A webpage for searching for meal recipes gathered from around the world

Notifications You must be signed in to change notification settings

JayKowski/Recipocket

Repository files navigation

Recipocket 🍽

recipocket

Recipocket, Many recipies in one place 😋🍕🍗

About the project

This is a web-based recipe app built on react that serves the purpose of providing recipes for the users

Live Link

Give the app a try using the link below and search for some recipes!
Recipocket

How the App works

it's pretty much straight forward!

Right on the landing page, a user is met by two search types. Category and Meal. The category search contains a drop down menu that lets the user search for meals from a certain category, while the meal search lets a user search for a specific meal by name.

While the meal search returns a single Meal preview bubble, the Category search renders a Meal Preview bubble for every meal retrieved from the given category.

clicking the "see more" button or on the Meal Preview image itself will direct the user to another "page" (this is a single-page application) that displays the information about the Meal. Information entails the meal's ingredients (with respective measurements) and the instructions to prepare the meal.

Prerequisites and instructions

If you would however fancy something more than just using the app online, you can actually download the project locally and make any modifications of your own!

If so, please follow the given instructions. You will need the following environments installed in your pc:

  • Node Js installed

  • NPM or Yarn (NPM preferable)

Cloning Instructions

first off, clone the repo onto your local environment:

https://github.com/JayKowski/Recipocket.git

  • Install the required packages with:

npm install

  • Build and serve with:

npm start

This instance will be running at the port 3000 in your local host. it requires no other configuration and is usable just by running the npm start command.

Testing

After finishing the above cloning process, move to the terminal and run the following command. Make sure that you're still in the project directory.

npm run test

After running the above command, the successful test results will show in green on the terminal. Please note that all tests that currently exist in the project run properly and pass.

Technologies

  • Javascript ES6
  • ReactJS
  • Node
  • Webpack
  • Jest (for testing)

Contact

If you liked this project please, take your time to come hang out with me or checkout my work on:

About

A webpage for searching for meal recipes gathered from around the world

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published