Scribd Logo
Upload

Welcome to Scribd!

  • 71 views

    Astro Getting Started

    Uploaded by

    Cristina Raluca Glăvan
    Astro is an all-in-one web framework for building fast, content-focused websites. It provides features like component islands for faster sites, server-first API design to move hydration off users' devices, and works without JavaScript by default. The document then explains how to try Astro in the browser, create a new project locally, learn key concepts, extend Astro with themes and plugins, and get involved in the community.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd

    Astro Getting Started

    Uploaded by

    Cristina Raluca Glăvan
    71 views3 pages
    Astro is an all-in-one web framework for building fast, content-focused websites. It provides features like component islands for faster sites, server-first API design to move hydration off users' devices, and works without JavaScript by default. The document then explains how to try Astro in the browser, create a new project locally, learn key concepts, extend Astro with themes and plugins, and get involved in the community.

    Original Title

    astro getting started

    Copyright

    © © All Rights Reserved

    Available Formats

    TXT, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Astro is an all-in-one web framework for building fast, content-focused websites. It provides features like component islands for faster sites, server-first API design to move hydration off users' devices, and works without JavaScript by default. The document then explains how to try Astro in the browser, create a new project locally, learn key concepts, extend Astro with themes and plugins, and get involved in the community.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Download as txt, pdf, or txt
    71 views3 pages

    Astro Getting Started

    Uploaded by

    Cristina Raluca Glăvan
    Astro is an all-in-one web framework for building fast, content-focused websites. It provides features like component islands for faster sites, server-first API design to move hydration off users' devices, and works without JavaScript by default. The document then explains how to try Astro in the browser, create a new project locally, learn key concepts, extend Astro with themes and plugins, and get involved in the community.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Download as txt, pdf, or txt
    You are on page 1of 3

    ---

    title: Getting Started


    description: A basic intro to Astro.
    i18nReady: true
    ---
    import Button from '~/components/Button.astro'
    import TranslatorList from '~/components/TranslatorList.astro'
    import ContributorList from '~/components/ContributorList.astro'
    import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'

    :::tip[Astro version 3 is here!]


    **What’s new in Astro v3?** [Find out in the announcement blog
    post](https://astro.build/blog/astro-3/).
    **Ready to upgrade?** [Follow our upgrade guide](/en/guides/upgrade-to/v3/).
    :::

    <h2>What is Astro?</h2>

    Astro is an **all-in-one** **web framework** for building **fast,** **content-


    focused** websites.

    ## Key Features

    - **Component Islands:** A new web architecture for building faster websites.


    - **Server-first API design:** Move expensive hydration off of your users' devices.
    - **Zero JS, by default:** No JavaScript runtime overhead to slow you down.
    - **Edge-ready:** Deploy anywhere, even a global edge runtime like Deno or
    Cloudflare.
    - **Customizable:** Tailwind, MDX, and 100+ other integrations to choose from.
    - **UI-agnostic:** Supports React, Preact, Svelte, Vue, Solid, Lit and more.

    Check out our detailed [Why Astro](/en/concepts/why-astro/) breakdown to learn more


    about what makes Astro special. ✨

    ## Try Astro in your browser

    Visit [astro.new](https://astro.new/) and choose from a variety of templates to get


    started. Play around with a full, working version of Astro right in your browser!

    <div style="display: flex; flex-wrap: wrap; gap: 0.5rem;">


    <Button href="https://astro.new/basics?on=stackblitz">Launch basic
    template</Button>
    <Button variant="outline" href="https://astro.new/">View all templates →</Button>
    </div>

    ## Start your first project

    Get a new Astro project up and running locally with our helpful `create astro` CLI
    wizard!

    <PackageManagerTabs>
    <Fragment slot="npm">
    ```shell
    # create a new project with npm
    npm create astro@latest
    ```
    </Fragment>
    <Fragment slot="pnpm">
    ```shell
    # create a new project with pnpm
    pnpm create astro@latest
    ```
    </Fragment>
    <Fragment slot="yarn">
    ```shell
    # create a new project with yarn
    yarn create astro
    ```
    </Fragment>
    </PackageManagerTabs>

    Our [Installation Guide](/en/install/auto/) has full, step-by-step instructions for


    installing Astro using our CLI wizard, creating a new project from an existing
    Astro GitHub repository, and for installing Astro manually.

    ## Learn Astro

    See examples of some of the key concepts and patterns of an Astro site!

    📚 [Add your first page](/en/core-concepts/astro-pages/) to your site.

    📚 Read more about Astro’s [project structure](/en/core-concepts/project-


    structure/).

    📚 Learn about Astro's [file-based routing](/en/core-concepts/routing/).

    *... find our full API documentation under the **Reference** tab.*

    ## Extend Astro

    🧰 Start your next project with a [prebuilt theme](https://astro.build/themes/)

    🧰 Customize your site with official and community [plugins and components]
    (https://astro.build/integrations/).

    🧰 Get inspired by visiting our [site showcase](https://astro.build/showcase/).

    *... see our [guide to using integrations](/en/guides/integrations-guide/)*.

    ## Join our Community

    Join us in the [Astro Discord](https://astro.build/chat) to share with and get help


    from an active, friendly community!

    💬 Say hi in our `#general` channel!

    💬 Ask our Support Squad a question in our `#support` channel!

    💬 Share what you've been working on in our `#showcase` channel!

    ## What's New?
    [Astro Blog](https://astro.build/blog/)

    [Astro changelog](https://github.com/withastro/astro/blob/main/packages/astro/
    CHANGELOG.md)

    <TranslatorList githubRepo="withastro/docs">
    {/* Turn this HTML heading into a Markdown h2 — ## — when translating this page.
    */}
    <h2>Translate</h2>

    These docs translations are brought to you by all these amazing people. [Help us
    with translations!](https://github.com/withastro/docs/blob/main/contributor-
    guides/translating-astro-docs.md)
    </TranslatorList>

    ## Contribute

    These docs are brought to you by all these helpful people. [Join us on GitHub!]
    (https://github.com/withastro/docs)

    <ContributorList githubRepo="withastro/docs" />

    You might also like