foodies-app 🍱

Developed by Grace Chen Abudi 👩🏽‍💻

📣 Overview:

• foodies-app 🍱
  • 📣 Overview:
  • 🔎 Intro:
  • 🧰 Tech Stack:
  • 🛠️ Techniques & Tools:
  • 🔗 Additional Link:
  • Visit the Course 👉🏽 HERE !

---

🔎 Intro:

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.

🧰 Tech Stack:

• NextJS
• ReactJS
• JavaScript
• SQL & SQLite3 Database
• CSS Modules
• Responsive Layout
• Slugify
• XSS Protection

🛠️ Techniques & Tools:

• 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).

---

🔗 Additional Link:

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! 🌺