Skip to content

Latest commit

 

History

History
93 lines (72 loc) · 2.53 KB

README.md

File metadata and controls

93 lines (72 loc) · 2.53 KB

Recipe App (React)

Login

Table of contents

Overview

Description

This project aims to view recipes and content using the Edamam Recipe Search Api. There is a search feature according to the entered word.The application is started with the login page. The login page background is using a random image. On the login page, e-mail and password are stored in localstorage by default. It checks the password from localstorage with the e-mail entered, if it is correct, it redirects to the home page, and if it is wrong, it gives an alert. This project uses "styled-components".

Project Skeleton

recipe-app (folder)
       public(folder)
           |----index.html 
       src (folder)
           |----app.js 
           |----app.css 
           |----index.js
           |----index.css 
           assets (folder)
                |----food-truck.gif
                |----loading.gif
                |----paper-bag.gif
           components (folder)
                header (folder)
                      |----Form.jsx
                      |----Header.jsx
                      |----Header.styled.jsx
                
                navbar (folder)
                      |----Navbar.jsx
                      |----Navbar.styled.jsx
           pages (folder)
                about (folder)
                      |----About.jsx
                      |----About.styled.jsx
                contact (folder)
                      |----Contact.jsx
                      |----Contact.styled.jsx
                details (folder)
                      |----Details.jsx
                      |----Details.styled.jsx
                home (folder)
                      |----Home.jsx
                      |----Home.styled.jsx
                      |----RecipeCard.jsx
                login (folder)
                      |----Login.jsx
                      |----Login.styled.jsx
           router (folder)
                |----AppRouter.jsx
               

Screenshot

screenshot

Links

Built with

  • REACT.JS
  • JAVASCRİPT
  • HTML5
  • Styled-Components
  • Responsive Design
  • React-router-dom
  • React-icons
  • Axios