Completed
- Connecting Wix Studio's headless CMS to our Astro project
Class Central Classrooms beta
YouTube videos curated by Class Central.
Classroom Contents
Creating a Blog with Astro and Wix Studio Headless CMS - Full Course
Automatically move to the next video in the Classroom when playback concludes
- 1 - Introduction
- 2 - Getting the assets and a quick look at the design
- 3 - Getting started with Astro
- 4 - Exploring what Astro starts us with and adding the assets
- 5 - Creating a template layout
- 6 - Creating and importing our CSS file
- 7 - Thinking about how we'll organize our page
- 8 - General styling with CSS
- 9 - Creating the header
- 10 - Scroped styling in Astro
- 11 - The visually-hidden class
- 12 - Styling the navigation more on this later
- 13 - The featured article
- 14 - Heading levels and their impact
- 15 - Read more buttons are bad
- 16 - Using grid instead of a .container or .wrapper
- 17 - Improving the styling of the featured article
- 18 - Styling the button
- 19 - Adding spacing
- 20 - Creating the three columns
- 21 - Passing a class into a component
- 22 - Improving the breakpoints
- 23 - Adding the three articles on the bottom
- 24 - Using a counter for the numbers
- 25 - Spacing things out
- 26 - Styling the inverted section
- 27 - Styling heading links
- 28 - Skip to main
- 29 - Creating the mobile version of the navigation
- 30 - Getting started with Wix Studio for the headless CMS
- 31 - Adding a content collection to the CMS
- 32 - Connecting Wix Studio's headless CMS to our Astro project
- 33 - Getting our articles from Wix Studio
- 34 - What we get from our fetchArticles function
- 35 - Adding an option for how many articles to fetch
- 36 - Adding a featured article filter
- 37 - Pulling the featured article into our site
- 38 - Generating pages for each article
- 39 - Creating a list of articles
- 40 - Limiting the amount of lines of text with CSS
- 41 - Bringing in content for the bottom articles
