Gatsby JS Course: Overlapping Sections with CSS Grid and React
Create the section that will hold the content cards and learn how to overlap elements with CSS grid. This is a single video in a series of 26 lessons. Watch the entire course at this playlist here: https://www.youtube.com/playlist?list=PLW0RabRDhwwzVNhlOgQQgw6HJzXdM1MnT Want to support the channel? We make our courses free to watch so anyone can access our content and level up their skills. For our larger courses, like this one, we sell the final code and design files for a small price to help support the creation of free educational content like this. You can purchase the course files belowβany support is greatly appreciated! π LIVE DEMO π https://angry-bohr-9e84bc.netlify.app/ π PURCHASE FILES & SUPPORT THE CHANNEL π https://gum.co/LkpZQ π COURSE RESOURCES π Setup dev environment: https://www.gatsbyjs.org/tutorial/part-zero/ Gatsby Hello World Starter: https://github.com/gatsbyjs/gatsby-starter-hello-world Gatsby Transformer Sharp: https://www.gatsbyjs.org/packages/gatsby-transformer-sharp/ Gatsby Plugin MDX: https://www.gatsbyjs.org/packages/gatsby-plugin-mdx/ Gatsby Plugin Google Fonts: https://www.gatsbyjs.org/packages/gatsby-plugin-google-fonts/ Styled Components in Gatsby: https://www.gatsbyjs.org/docs/styled-components/ React Developer Tools for Chrome: https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en Gatsby Create Pages: https://www.gatsbyjs.org/tutorial/part-seven/ Minify SVGs with SVGOMG: https://jakearchibald.github.io/svgomg/ Prism React Renderer: https://github.com/FormidableLabs/prism-react-renderer LekoArts: https://themes.lekoarts.de/ Codeblocks, MDX, and mdx-utils: https://www.christopherbiscardi.com/post/codeblocks-mdx-and-mdx-utils Language tabs for Gatsby’s code blocks: https://www.lekoarts.de/en/blog/language-tabs-for-gatsbys-code-blocks Netlify: https://www.netlify.com/ Figma: https://www.figma.com π FOLLOW US π Instagram: https://instagram.com/skillthrive/ #WebDev #WebDesign #WebDevelopment