Recipe-app-reactjs

React Recipe App with all basic functionalities used

This is developed with youtube crash course for React.

We can view example usage for

pages
components
Route
Routes
useLocation
Link
BrowserRouter
styled-components
react-icons
useEffect
useState
useParams
API fetch (https://api.spoonacular.com)
Conditional Display of divs eg: {activeTab === 'instructions' && (
This is the content only display if condition true
)
conditional class for element eg: className={activeTab === 'ingredients' ? 'active' : ''}
Inline function call eg: onClick={() => setactiveTab('instructions')}
framer-motion - basic animation
React Slide using @splidejs/react-splide
css import from a npm package eg: import '@splidejs/splide/dist/css/splide.min.css';
search functionality with navigation
useNavigate

.env files required

REACT_APP_SPOONACULAR_API_KEY=********

rfce - to generate react functional component exportable