blob: bbef88a38aae6165fcf4ead7709d09b14512aae9 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
|
---
setup: |
import Button from '../../components/Button.astro'
layout: ~/layouts/MainLayout.astro
title: Getting Started
description: A basic intro to Astro.
---
Static Site Generator 🚀 Bring your own Framework 🚀 Ship Less JavaScript
## Try Astro
We've made it as easy as possible to get started with Astro either in your browser, or on your machine!
### Online Playgrounds
Visit [astro.new](https://astro.new) for the easiest way to "try before you buy." Choose from a variety of starter templates and start building a full, working version of Astro right in your browser!
Or, **instantly launch our basic starter project** with just one click of a button:
<div style="display: flex; flex-wrap: wrap; gap: 0.5rem;">
<Button href="https://astro.new/starter?on=codesandbox">Open in CodeSandbox</Button>
<Button href="https://astro.new/starter?on=stackblitz">Open in StackBlitz</Button>
</div>
### Install Astro Locally
Ready to install?
Get a new project up and running locally in no time with our easy `create-astro` CLI wizard!
```bash
# run this command in a new directory to get started!
npm init astro
```
⚙️ Our [Installation Guide](/en/installation) has full, step-by-step instructions for installing Astro with your favourite package manager.
⚙️ See instructions for [manual setup](/en/guides/manual-setup) instead.
## Start building with Astro
Jump right in and add some content and features to your site!
🏗️ Add new [Astro (.astro) pages](/en/core-concepts/astro-pages) and/or [Markdown (.md) pages](/en/guides/markdown-content) to your site.
🏗️ Create your first [Layout](/en/core-concepts/layouts).
🏗️ Add additional [CSS and styling](/en/guides/styling) to your site.
*... and even more Guides under **Learn***
## Learn Astro
See examples of some of the key concepts and patterns of an Astro site!
📚 Read more about Astro’s [project structure.](/en/core-concepts/project-structure)
📚 Learn more about Astro’s [built-in components.](/en/reference/builtin-components)
📚 Explore Astro’s [API.](/en/reference/api-reference)
*... and even more reference material under **API***
## Integrate with Astro
Explore different integrations that our users have combined with Astro!
🧰 Use a CMS with your Astro project.
🧰 Set up eCommerce.
🧰 Connect a database to your site.
*... see our [third-party integrations](/en/integrations/integrations)*
## 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 `#introduce-yourself` channel!
💬 Ask our Support Squad a question in our `#support` channel!
💬 Share what you've been working on in our `#showcase` channel!
## Learn More
[Astro Blog](https://astro.build/blog/)
[Astro changelog](https://github.com/withastro/astro/blob/main/packages/astro/CHANGELOG.md)
[Astro Migration Guide](/en/migrate) (for upgrading to v0.21+)
|
