Screenshot of Astro Netlify Edge Starter

Introduction

The Astro Netlify Edge Starter is a template project that demonstrates how to build a Server-Side Rendered (SSR) Astro application using Netlify Edge Functions. This starter template showcases the integration of Astro's powerful features with Netlify's edge computing capabilities, enabling developers to create high-performance, location-aware web applications.

Main Features

  • Server-Side Rendering (SSR) with Astro
  • Integration with Netlify Edge Functions
  • Geolocation detection for personalized content
  • Fast performance through edge computing
  • Easy deployment to Netlify
  • TypeScript support for enhanced development experience
  • Minimalistic project structure for easy customization

Installation Steps

  1. Clone the repository:

    git clone https://github.com/sarahetter/astro-netlify-edge-starter
    
  2. Navigate to the project directory:

    cd astro-netlify-edge-starter
    
  3. Install dependencies:

    npm install
    
  4. Start the development server:

    npm run dev
    
  5. Open your browser and visit the local development URL provided in the terminal.

Usage Instructions

  1. Modify or add Astro pages in the src/pages directory.

  2. Customize components in the src/components folder.

  3. Update styles and layouts as needed.

  4. Test your changes locally using npm run dev.

  5. Deploy to Netlify:

    • Install Netlify CLI globally: npm install netlify-cli -g
    • Run the deployment command: netlify deploy --build
    • Follow the prompts to complete the deployment process.
  6. Access your deployed site using the URL provided by Netlify.

  7. Verify that the geolocation feature works correctly on the deployed site.

  8. Continue developing and push changes to your repository for automatic deployments.

Important Notes

  1. The geolocation feature will not work in local development. It only functions when deployed to Netlify.

  2. This starter uses the @astrojs/netlify package to enable SSR on Netlify.

  3. The project is configured to use Netlify Edge Functions, which run on Netlify's global edge network.

  4. TypeScript is supported out of the box for type-safe development.

  5. The netlify.toml file contains configuration for Netlify, including the use of Edge Functions.

  6. The starter template is minimal, allowing for easy customization and expansion.

  7. Issues with the starter can be reported on the GitHub repository's issue tracker.

  8. For additional help, you can visit the Netlify Forums.

  9. The project is licensed under the MIT License, allowing for flexible use and modification.

  10. Regular updates to Astro or Netlify may require adjustments to the project configuration.

Astro Netlify Edge Starter

An Astro app with the Netlify adapter using Edge Functions

Theme Information:

Stars : github star17
Forks : github fork5
Updated : 12 Feb, 2024
Published : 09 May, 2022
Types :
Astro Icon
sarahetter
Created bysarahetter