This repo contains the course project I did throughout the React JS course which is part of the Full Stack Web Developer Program at Business College Helsinki. Here is a link to the initial design on Figma. You can see the live demo here.
Built with:
- HTML
- JS
- CSS
- Reactjs 17
Hosted on:
- Netlify
Inside the root, with Node 16 run:
npm install
npm run startTo deploy run, with netlify-cli:
netlify deploy- The data comes from an API I created in my Programming in PHP course. You can see the API repo here.
- Most pictures are courtesy of Johann Trasch from cocktailbar.de.
- Arrow Icon by BECRIS on freeicons.io.
Mentor: Margit Tennosaar
- Make a clean create-react-app
- Clean it and start to work with it
- Make App, Header, Main, Footer, Nav, Home, Recipes, About components
- Using React Router set up simple navigation with three pages – home, recipes, about
- Start styling your app
- Create a json file which contains some recipes
- Have a new page “Recipes” – where GET list of all recipies from db.json
- In Recipes page, include a search for your recipes
- Make meaningful commits, so teacher can see what you have been doing there
- Post your project GH link to group Teams wiki
- Have a placeholder for images that are still loading
- Add a reset button next to the search bar on the recipe page
- On mobile, visually indicate horizontal scrolling and seperate categories