Frontend Documentation
Home

Home Page Implementation Guide


Purpose The Home Page serves as the entry point of your website, showcasing featured products, collections, categories, blogs, and other highlights to engage users.

File Structure The file utilizes a combination of components and Firebase service functions for dynamic content. Ensure the following directory structure matches your project:

Components


/components/HomeSlider /components/_user/home/blogs /components/_user/home/Banners/BannerBottom /components/_user/home/brands /components/_user/home/category /components/_user/home/Collections /components/_user/home/FeaturedProducts /components/_user/home/newCollection /components/_user/home/newsletter /components/_user/home/whyus

Firebase Services


/firebase/Brands/GetBrands /firebase/Category/GetCategory /firebase/Collections/GetCollections /firebase/Blogs/GetBlog /firebase/Products/GetProduct Page Functionality Data Fetching

The page fetches data from Firebase services for: Featured Products Collections Categories Brands Blogs Products It uses Promise.all() for concurrent requests, improving performance by fetching all data in parallel.

 
const [featuredProducts, collections, categories, brands, products, blogs] = await Promise.all([
  getFeaturedProducts(),
  getCollections(),
  getCategories(),
  getBrands(),
  getProducts(),
  getBlogs(),
]);
 

Revalidation


The page is set to revalidate every 30 seconds to ensure the content remains fresh without requiring a manual rebuild.

 
export const revalidate = 30;