Developed by Grace Chen Abudi 👩🏽💻
This is a Full-Stack application developed with NextJS, showcasing a foodies app that allows to view meals recipes, share them, and be part of a foodies community.
- NextJS
- ReactJS
- JavaScript
- SQL & SQLite3 Database
- CSS Modules
- Responsive Layout
- Slugify
- XSS Protection
-
Custom Components
-
Dynamic Routes
-
Images Slideshow
-
Next Client Component Hook:- usePathname: Is a hook that lets you read the current URL's pathname.
-
React Router Dom Components:- NavLink: Is used for navigation between pages.
-
Loading
-
React Components:- Suspense: Is a built-in React component which lets us temporarily render a fallback UI while its children are still loading.
-
Handling Errors + Not Found Page
-
React Hooks:-
useRef: Is a hook that lets you reference a value that's not needed for rendering.
-
useFormStatus: Is a hook that provides status information of the last form submission.
-
useFormState: Is a custom hook that allows you to subscribe to each form state, and isolate the re-render at the custom hook level.
Note: It has its scope in terms of form state subscription, so it would not affect other useFormState and useForm. Using this hook can reduce the re-render impact on large and complex form applications.
-
-
Server Actions
-
Server Side Validation
-
revalidatePath: Allows you to purge cached data on-demand for a specific path.
-
Static & Dynamic Metadata
Note: Uploaded images could be stored in the cloud (AWS S3, Vercel Blob or somewhere else).
If you want to strengthen your knowledge and skills of React, Redux, NextJS and more... along the Best Practices, Feel free to check this course on Udemy by Maximilian Schwarzmüller:
Visit the Course 👉🏽 HERE !
Shoutout to Maximilian Schwarzmüller for all of the lectures, the exercises, and the React course in Udemy. Mahalo, Thank you! 🌺