#08: Build a Blog – With Astro!

Welcome to Week 2, Day 1 of #30DaysOfSWA!!

In Week 1 we lined core ideas for Azure Static Internet Apps – from improvement to API-enablement, safety, configuraton and deployment.

Right this moment, we kick off Week 2 with a deal with seeing SWA in motion – utilizing fashionable internet improvement frameworks and static web site mills to construct and deploy totally different sorts of purposes. We kick issues off with a take a look at Astro – a contemporary static web site generator with a BYOF (“Carry your individual framework”) strategy.

What We’ll Cowl

  • What’s a static web site generator?
  • What’s Astro?
  • Construct & Deploy a Private Weblog with Astro
  • Train: Attempt the tutorial to deploy your private weblog!

Static Web site Turbines

The time period “static web site mills” (SSG) refers to instruments that routinely construct static webpages for you, populating a selected template together with your customized content material or information. The code technology is clear to you, making it doable for even non-developers to setup customized static web sites rapidly.

Static web site technology is a rising development for quick, versatile web site creation. However it requires an exterior service to deal with internet hosting and construct/deploy workflows. That is the place Azure Static Internet Apps is available in! Take a look at the SWA documentation for tutorials that includes fashionable SSGs like Hugo, Jekyll and Gatsby. We’ll discover another examples later this week.

Whats up, Astro!

Right this moment’s put up will nevertheless deal with Astro, one of many rising stars of JavaScript within the Static Websites class. Astro is a static web site builder that works like an SSG however with some novel features that set it aside.

  • Carry your individual framework (React, Vue, Svelte, internet elements)
  • Compose your web site utilizing that framework’s UI elements
  • Astro now renders a fully-static (all HTML, no JavaScript) web site

Astro emphasizes quick efficiency with much less JavaScript – and takes a partial hydration strategy that enables it to load the minimal required quantity of JavaScript, if and when completely obligatory. Here is a fast overview of Astro.

Astro + SWA

In in the present day’s tutorial, we stroll via the steps required to:

The tip outcome will appear like this.

Listed here are the important thing hyperlinks to know:

Then verify again tomorrow for a brand new utilization instance and tutorial – this time, with a deal with React – as we proceed to discover Azure Static Internet Apps in motion!


Listed here are a few choices to attempt, to get extra hands-on expertise:

  • Clone the template project and comply with the tutorial to construct and deploy your private weblog.
  • Go to the Astro Themes web page and check out utilizing a special starter mission, then deploying it to Azure Static Internet Apps.


Take a look at these different tutorials utilizing extra conventional static web site mills:

Add a Comment

Your email address will not be published. Required fields are marked *