September 2024 blog post

src/content/blog/whats-new-september-2024.mdx

@@ -0,0 +1,173 @@
+---
+title: "What's new in Astro - September 2024"
+description: "September 2024 - Beta 5.0, Astro Storefront, $100,000 Ecosystem Fund update, and more!"
+publishDate: "September 30, 2024"
+authors:
+  - sarah
+coverImage: "/src/content/blog/_images/whats-new-shared.webp"
+socialImage: "/src/content/blog/_images/whats-new-september/og.webp"
+lang: "en"
+startDate: "2024-09-01"
+endDate: "2024-10-01"
+---
+import MonthlyShowcaseGrid from './_whats-new-components/MonthlyShowcaseGrid.astro';
+import ShowcaseGridById from './_whats-new-components/ShowcaseGridById.astro';
+import ThemeGrid from './_whats-new-components/ThemeGrid.astro';
+import YouTubeGrid from './_whats-new-components/YouTubeGrid.astro';
+
+Some exciting news from around the Astro ecosystem this month. Let's dive in!
+
+## Updates from Mission Control
+
+- 🤿 [Content Layer API deep dive](/blog/content-layer-deep-dive/)
+- 🛍 [Astro Storefront](https://github.com/withastro/storefront/)
+- 🌟 [Swagger docs now built with Astro & Starlight](https://swagger.io/docs/)
+
+## Releases
+
+- Astro [5.0 beta](https://astro.build/blog/astro-5-beta/)
+- Starlight [0.27](https://github.com/withastro/starlight/releases/tag/%40astrojs%2Fstarlight%400.27.0), [0.28](https://github.com/withastro/starlight/releases/tag/%40astrojs%2Fstarlight%400.28.0), and [highlights of the last few major releases](https://astro.build/blog/starlight-028/)
+
+## Community
+
+Astro wouldn’t be what it is without its community. From Discord support, to documentation improvements, to translations, to code contributions, Astro welcomes it all.
+
+{/* ### Astro Team News
+
+We are pleased to welcome our newest Astro maintainer @LorenzoLewis! Thank you for your contributions and camaraderie, and welcome aboard, astronaut! 🫡 */}
+
+### Community Awards August
+
+These are some of the people who went above and beyond last month to make all our lives just a little (or a lot!) better:
+
+- 🌟 $500 to @Fryuni for amazing contributions to all corners of the Astro ecosystem.
+- 🚀 $250 to @ph1p for valuable contributions to Astro's core packages.
+- 🎈 $250 to @dragomano for fantastic contributions to Starlight translations.
+- 🎊 $250 to @ArmandPhilippot for outstanding contributions to docs.
+- 🧁 $250 to @Nin3lee for exceptional effort translating docs.
+
+Check them out and learn more about the Astro Community Awards on [our community website](https://community.astro.build).
+
+### $100,000 Astro Ecosystem Fund Fall Update
+
+Congratulations to the latest recipients of Astro's ecosystem grants! Check out these projects that have made a huge impact on the Astro Ecosystem:
+
+- 🖌 @hippotastic ($10,000) for work on the [Expressive Code](https://expressive-code.com/) advanced syntax highlighter that powers many Astro websites, and is built-in to Starlight by default!
+- 👜 @martrapp ($5,000) for work on [VTBOT (View Transitions Bag of Tricks)](https://events-3bg.pages.dev/) exploring the bleeding edge of view transitions in Astro and the larger web platform, with pre-built components you can use, examples, demos and more!
+
+Read the full [Ecosystem Fund fall upate](https://astro.build/blog/astro-ecosystem-fund-update/) for more details.
+
+## Showcase
+
+### Content
+
+
+Here's what caught our attention this month: 
+
+- 📶 A growing list of [content collections loaders](https://github.com/search?q=%22astro-loader%22&type=repositories&s=updated&o=desc&p=1) on GitHub for you to try!
+- ⚡ We had some SSRious fun with [Docs on Demand](https://starlight-ssr.netlify.app/), a demo site of server-rendered Starlight docs showcasing auth, personalized content, and more! (Which Houston did you pick??)
+- ⏱ [Shattering Headless WordPress Build Times with Astro's Content Layer API](https://andrewkepson.com/blog/headless-wordpress/build-time-astro-content-layer-api/)
+- 👅 Bytes.dev covered the Beta 5 release and [Astro's Hybrid Theory](https://bytes.dev/archives/324).
+- 🌇 Find out how the community project [StudioCMS is Thriving Beyond Astro Studio](https://studiocms.xyz/blog/goodbye-astro-studio).
+- 📚 See [how Cloudflare manages their new Starlight docs](https://www.youtube.com/watch?v=CSmeOy_0VMY) and read a retrospective on using [Astro for documentation sites: insights after 6 months](https://maciekpalmowski.dev/blog/astro-for-documentation-sites-insights-after-6-months/).
+
+Because you can never get tired of Astro, here's even more community content!
+
+- [How to create an Astro tabs component](https://elazizi.com/posts/how-to-create-an-astro-tabs-component/)
+- [Create an Automated Portfolio Using GitHub and Astro](https://casraf.dev/2024/08/create-an-automated-portfolio-using-github-and-astro/)
+- [From Gatsby gridlock to Astro bliss: my personal site redesign](https://jwn.gr/posts/migrating-from-gatsby-to-astro/)
+- [Built with Astro, Crystallize, and Stripe (Nerd Streetwear Online Store)](https://dev.to/cookieduster_n/built-with-astro-crystallize-and-stripe-nerd-streetwear-online-store-part-i-15a)
+- [Using the LaunchDarkly CLI Local Development Server: Testing Client-Side and Server-Side Flags in an Astro Application](https://launchdarkly.com/blog/test-feature-flags-astro-launchdarkly-cli-local-dev/)
+- [SSG Astro with Headless Craft CMS Content Fetched At Build Time Or Cached In Advance](https://www.olets.dev/posts/ssg-astro-with-headless-craft-cms-content-fetched-at-build-time-or-cached-in-advance/)
+- [Using Astro server islands and Cloudflare geo headers for dynamic region-based content](https://www.blackspike.com/blog/astro-server-islands-cloudflare-geolocation/)
+- [Deploying Astro Actions on Cloudflare](https://alexweberk.com/blog/astro-actions-on-cloudflare)
+- [Streaming a file in Astro](https://astropatterns.dev/p/gems/server-endpoints-file-streaming)
+- [Building a GitHub Discussions Powered Blog](https://mattbrailsford.dev/building-a-github-discussions-powered-blog)
+
+<YouTubeGrid
+  videos={[
+    { id: 'https://www.youtube.com/watch?v=Q9jCtN0_2Xw', title: 'First look at Astro 5 beta' },
+    { id: 'https://www.youtube.com/watch?v=RoKiTpqt3rk', title: 'Efficient Content Loading in Astro w/ Bryan Robinson, Matthew Phillips and Matt Kane' },
+    { id: 'https://www.youtube.com/watch?v=gpUID_rsdqU', title: 'Astro Content Layer and Zod make swapping data a breeze'},
+    { id: 'https://www.youtube.com/watch?v=zFKq2_ZnMo0', title: 'Build Custom Astro Loader for Strapi 5 with TS - Exploring the Astro Content Layer API' },
+    { id: 'https://www.youtube.com/watch?v=mHTe4t0xc4M', title: 'Astro, Stripe, Sanity, Clerk — and career/life chat' },
+    { id: 'https://www.youtube.com/watch?v=Z05ZYpcjL3o', title: 'Simple Table of Contents with Astro' },
+    { id: 'https://www.youtube.com/watch?v=qw0VkYy-66g', title: 'Cassidy Williams: Career, Productivity, Community, and more' },
+    { id: 'https://www.youtube.com/watch?v=8ByQH6vwxMM', title: 'User-generated content with Astro Actions and Hygraph' },
+    { id: 'https://www.youtube.com/watch?v=ogXeY5l_rCA', title: 'Complete User Management Platform with clerk (and Astro)' },
+    { id: 'https://www.youtube.com/watch?v=EwJCJWz9SXQ', title: 'Crea una navbar per mobile.. semplice! AstroJS, AlpineJS e TailwindCSS [ITA]' },
+    { id: 'https://www.youtube.com/watch?v=DNiqBXCnz78', title: 'Te muestro cómo publicar tu sitio Astro en Github Pages' },
+    { id: 'https://www.youtube.com/watch?v=fHYEGDueJ7w', title: 'Choose Your Own Adventure with Astro' },
+    { id: 'https://www.youtube.com/watch?v=Thudicbgqtg', title: 'Create a blog with a headless CMS // Full 3-hour course // Astro + Wix Studio' },
+    { id: 'https://www.youtube.com/watch?v=sn4cDCq52h8', title: 'You deserve to know about Astro as JS framework' },
+    { id: 'https://www.youtube.com/watch?v=WHqZAXHZN_w', title: 'Curso ASTRO 5: Server Islands, View Transitions + Aplicación DESDE CERO' },
+    { id: 'https://www.youtube.com/watch?v=46iKEYmRB50', title: 'Astro sends content to SurrealDB - automatically 🔴 SurrealDB v2.0 Live' },
+    { id: 'https://www.youtube.com/watch?v=8PeEKbqE3E0', title: 'Build an Epic Dark-Mode Blockchain SaaS Site with Astro.js, TailwindCSS, & Framer Motion | Part 1' },
+    { id: 'https://www.youtube.com/watch?v=L3PrOUH4SuU', title: 'FREE Zed AI Coder: Build Astro SSR Website in Minutes' },
+    { id: 'https://www.youtube.com/watch?v=J2lK_ov-Ufk', title: 'Cropping Images with AI in Astro' },
+    { id: 'https://www.youtube.com/watch?v=juR1H4EauzM', title: 'Building a React banner carousel with Astro and Hygraph' },
+    { id: 'https://www.youtube.com/watch?v=kAoXYkSwhzU', title: 'Preview Kelas Membangun Situs Statis Super Cepat dengan AstroJs' },
+    { id: 'https://www.youtube.com/watch?v=4FZ6IGkbxHw', title: 'Light & Dark Mode Theme Aware Images' },
+    { id: 'https://www.youtube.com/watch?v=-gsOISVBAPo', title: 'Astro (Día 2): Creamos la web de la librería mtmi' },
+    { id: 'https://www.youtube.com/watch?v=iS3bHR0bVOI', title: 'Image Gallery with Astro Collections & Cloudinary - Dev Hints' },
+    { id: 'https://www.youtube.com/watch?v=2gMCJJGUGdc', title: 'JaxNode Astro Sept 2024'},
+    { id: 'https://www.youtube.com/watch?v=H_JGLDXFbOQ', title: 'Migrando mi portafolio de React a Astro.js - Parte 1' },
+    { id: 'https://www.youtube.com/watch?v=3wfYNG-K1-M', title: 'como crear rutas en el astro framework fácilmente' },
+    { id: 'https://www.youtube.com/watch?v=8kQNPJhkDXc', title: '🔴 Live Coding: Build Your Portfolio Website with HTML CSS JS - ASTRO JS - 1' },
+    { id: 'https://www.youtube.com/watch?v=hb3yNgbRZXQ', title: 'ASTRO 🚀 | Create a New Blog' },
+    { id: 'https://www.youtube.com/watch?v=5Env0LgDGQE', title: '🔴 Proyecto en Directo Con ASTRO JS - Animaciones Despliegue y MÁS'},
+    { id: 'https://www.youtube.com/watch?v=eGxyzIQZhGo', title: 'Firebase+Astro+Stripe project'},
+  ]}
+/> 
+
+### Tips & Tools
+
+The latest community-built utilities and integrations to help you build with Astro.
+
+- [Full dev UI](https://ui.full.dev/) - The Astro UI library to build content sites with prebuilt components and blocks.
+- [Bag of Tricks: `<ElementCrossing />`](https://events-3bg.pages.dev/library/ElementCrossing/) - For smoother and smarter  cross-document view transitions.
+- [Astro dts builder](https://www.npmjs.com/package/@matthiesenxyz/astrodtsbuilder) - For generating TypeScript declaration files for Astro Integrations.
+- [`astro-minify-html`](https://www.npmjs.com/package/@jcayzac/astro-minify-html) - Minifies Astro's generated HTML, including inline scripts & styles.
+- [`zastro-service-worker`](https://www.npmjs.com/package/zastro-service-worker) - An Astro integration that adds service worker functionality to your Astro project, powered by Workbox.
+- [`astro-turnstile`](https://www.npmjs.com/package/astro-turnstile) - An Astro integration that allows you to add a turnstile to your Astro site.
+- [GitHub repo loader](https://gist.github.com/kevinzunigacuellar/78c7e7a226beedc09d00d9bc6a8bba77) - A content collections loader for GitHub repos.
+- [Bag of Tricks: `<TurnSignal />`](https://events-3bg.pages.dev/library/TurnSignal/) - Create distinct animations for forward and backward navigation.
+- [Tooling for testing your own Astro Integrations and libraries](https://inox-tools.fryuni.dev/astro-tests)
+- [Cut-Short: A simple tool for ending requests early with a custom response](https://inox-tools.fryuni.dev/cut-short)
+
+### Themes & Templates
+
+Several new Astro themes were added to the [Astro theme directory](https://astro.build/themes/) this month. Try them out!
+
+<ThemeGrid date={frontmatter.startDate} />
+
+### Websites
+
+{/* 
+Sites of the month:
+
+- https://web-about-satellites.vercel.app/
+- See live, updating trends and stats about GitHub repositories at [gitcharts](https://gitcharts.com/). GitHub, visualized.
+- Make your next destination Astro's own [Server Islands Demo](https://server-islands.com) to learn more about this new, experimental feature.
+
+export const monthlySites = [
+  'music.manz.dev.md',
+  'gitcharts.com.md',
+  'server-islands.com.md'
+]; 
+
+<ShowcaseGridById ids={monthlySites} /> 
+
+<MonthlyShowcaseGrid startDate={frontmatter.startDate} endDate={frontmatter.endDate} exclude={monthlySites} /> */}
+
+Looking for some inspiration? See all the community member websites submitted to our Discord `#showcase` channel and featured on community calls this month.
+
+<MonthlyShowcaseGrid startDate={frontmatter.startDate} endDate={frontmatter.endDate} />
+
+### Starlight in the wild
+
+It's always exciting to stumble across more docs built with Starlight. Here's what our community noticed this month:
+
+<MonthlyShowcaseGrid starlight startDate={frontmatter.startDate} endDate={frontmatter.endDate} />
+
+*Want to be on this list next month? Post your Astro websites, projects, apps, tools, blog posts, demos, and videos in our `#showcase` channel in [our Discord](https://astro.build/chat)!*