/foodBangla

a simple foodBangla

Primary LanguageJavaScript

Youtube Facebook Instagram LinkedIn

FoodBangla - A Simple Recipe Representation

Show Live preview

Feature

  1. User can create his account using G-mail,GitHub,and Custom Mail and Password
  2. If User try to create account with same mail multiple times,an toast message will be shown.
  3. In Home Banner,there shown a marquee of recipes.
  4. First section contain chef list. Each chef card a recipe button.By clicking this ,an user can show the that chef details.
  5. Without login ,a user cannont access the recipes of a chef.
  6. A chef details page contains chef name,chef Photo,chef bio,experience and his some popular recipe.
  7. For each recipe card,there have a react icon. If u like this recipe,u can click on it and the item will be added to favourites pages.
  8. In favourite pages shown those items which you are added as favourite. It will be stored even you close the browser. If you want to delete an item ,u can hit the delete icon.
  9. There have a section which can calculate your BMI.
  10. The Section named as Diet Plan shows you a simple diet routine. By clicking day name,you can see that days diet routine.
  11. There have a blog page. where have some important questions answer.
  12. If you take mouse in profile image on top,you can see the User Name.
  13. A starndard footer added showing important links.

Focused On

  • Using Components
  • Routing
  • State Management
  • Context API
  • API Calls
  • Using Server
  • Styling with using Tailwind and DaisyUI Framework
  • Showing Customized Error Page
  • Show loader page when data fetch

    Getting Started With Create-React-App

    1. Install NodeJS and npm (Node Package Manager).
    2. Open Terminal or Command Prompt, navigate to the directory where you want your project folder to be created.
    3. Open Terminal or Command Prompt.
    4. Navigate to the directory where you want your project folder to be created.
    5. Run
    npm create vite@latest myAPP

    replacing "myAPP" with whatever name you prefer for your app.

    1. Wait until it finishes installing all dependencies.
    2. Once finished, navigate into the newly created project folder using:
    cd myApp
    1. To start the development server run:
    npm run dev

    This will open a new browser window displaying your application at http://localhost:5173

    Resource Used

    1. For Animation: Lottifiles
    2. For Icons: Heroicons

    Clone This Repository

    You can clone this repository by running following command in terminal/command prompt:

    https://github.com/ahsanulhoqueabir/foodBangla.git

    or download zip file from here