Learn how to build a responsive grid of products using CSS Grid. We'll walk through how we can dynamically add products from a JSON file, use those products to create a grid in our UI, and how we can add some styles to make it look like an online store!
🧐 What's Inside
00:00 - Intro to Responsive Grid of Products with CSS Grid
00:08 - Preview of Ecommerce on the Jamstack
00:29 - What to expect and tools we'll use like CSS Grid
01:16 - Updating the header and footer of the store
05:50 - Creating a grid of products with CSS Grid
11:33 - Adding products dynamically from a static JSON source
15:59 - Styling and creating a custom button component for the product grid
21:13 - Debugging Next.js linting error on Netlify
22:11 - Using Next.js image for product images
23:55 - Outro
#css #webdev