12 files changed, 303 insertions, 0 deletions
diff --git a/examples/starter/.gitignore b/examples/starter/.gitignore
new file mode 100644
index 000000000..d436c6dad
--- /dev/null
+++ b/examples/starter/.gitignore
@@ -0,0 +1,18 @@
+# build output
+dist
+
+# dependencies
+node_modules/
+.snowpack/
+
+# logs
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# environment variables
+.env
+.env.production
+
+# macOS-specific files
+.DS_Store
diff --git a/examples/starter/README.md b/examples/starter/README.md
new file mode 100644
index 000000000..8565cdbb3
--- /dev/null
+++ b/examples/starter/README.md
@@ -0,0 +1,40 @@
+# Welcome to [Astro](https://astro.build)
+
+> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
+
+## 🚀 Project Structure
+
+Inside of your Astro project, you'll see the following folders and files:
+
+```
+/
+├── public/
+│   ├── robots.txt
+│   └── favicon.ico
+├── src/
+│   ├── components/
+│   │   └── Tour.astro
+│   └── pages/
+│       └── index.astro
+└── package.json
+```
+
+Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
+
+There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
+
+Any static assets, like images, can be placed in the `public/` directory.
+
+## 🧞 Commands
+
+All commands are run from the root of the project, from a terminal:
+
+| Command         | Action                                      |
+|:----------------|:--------------------------------------------|
+| `npm install`   | Installs dependencies                       |
+| `npm run start` | Starts local dev server at `localhost:3000` |
+| `npm run build` | Build your production site to `./dist/`     |
+
+## 👀 Want to learn more?
+
+Feel free to check [our documentation](https://github.com/snowpackjs/astro) or jump into our [Discord server](https://discord.gg/EsGdSGen).
diff --git a/examples/starter/astro.config.mjs b/examples/starter/astro.config.mjs
new file mode 100644
index 000000000..e16ed1327
--- /dev/null
+++ b/examples/starter/astro.config.mjs
@@ -0,0 +1,14 @@
+export default {
+  // projectRoot: '.',     // Where to resolve all URLs relative to. Useful if you have a monorepo project.
+  // pages: './src/pages',   // Path to Astro components, pages, and data
+  // dist: './dist',       // When running `astro build`, path to final static output
+  // public: './public',   // A folder of static files Astro will copy to the root. Useful for favicons, images, and other files that don’t need processing.
+  buildOptions: {
+    // site: 'http://example.com',           // Your public domain, e.g.: https://my-site.dev/. Used to generate sitemaps and canonical URLs.
+    // sitemap: true,      // Generate sitemap (set to "false" to disable)
+  },
+  devOptions: {
+    // port: 3000,         // The port to run the dev server on.
+    // tailwindConfig: '', // Path to tailwind.config.js if used, e.g. './tailwind.config.js'
+  },
+};
diff --git a/examples/starter/meta.json b/examples/starter/meta.json
new file mode 100644
index 000000000..e9f3778c7
--- /dev/null
+++ b/examples/starter/meta.json
@@ -0,0 +1,5 @@
+{
+  "title": "Getting Started",
+  "description": "a friendly starting point for new astronauts",
+  "rank": 999
+}
diff --git a/examples/starter/package.json b/examples/starter/package.json
new file mode 100644
index 000000000..00dfc15e6
--- /dev/null
+++ b/examples/starter/package.json
@@ -0,0 +1,12 @@
+{
+  "name": "@astrojs/starter-kit",
+  "version": "0.0.1",
+  "private": true,
+  "scripts": {
+    "start": "astro dev",
+    "build": "astro build"
+  },
+  "devDependencies": {
+    "astro": "^0.12.9"
+  }
+}
diff --git a/examples/starter/public/assets/logo.svg b/examples/starter/public/assets/logo.svg
new file mode 100644
index 000000000..d751556b2
--- /dev/null
+++ b/examples/starter/public/assets/logo.svg
@@ -0,0 +1,12 @@
+<svg width="193" height="256" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <style>
+        #flame { fill: #FF5D01; }
+        #a { fill: #000014; }
+        @media (prefers-color-scheme: dark) {
+            #a { fill: #fff; }
+        }
+    </style>
+    
+    <path id="a" fill-rule="evenodd" clip-rule="evenodd" d="M131.496 18.929c1.943 2.413 2.935 5.67 4.917 12.181l43.309 142.27a180.277 180.277 0 00-51.778-17.53L99.746 60.56a3.67 3.67 0 00-7.042.01l-27.857 95.232a180.224 180.224 0 00-52.01 17.557l43.52-142.281c1.989-6.502 2.983-9.752 4.927-12.16a15.999 15.999 0 016.484-4.798c2.872-1.154 6.271-1.154 13.07-1.154h31.085c6.807 0 10.211 0 13.085 1.157a16 16 0 016.488 4.806z" fill="url(#paint0_linear)"/>
+    <path id="flame" fill-rule="evenodd" clip-rule="evenodd" d="M136.678 180.151c-7.14 6.105-21.39 10.268-37.804 10.268-20.147 0-37.033-6.272-41.513-14.707-1.602 4.835-1.962 10.367-1.962 13.902 0 0-1.055 17.355 11.016 29.426 0-6.268 5.081-11.349 11.349-11.349 10.743 0 10.731 9.373 10.721 16.977v.679c0 11.542 7.054 21.436 17.086 25.606a23.27 23.27 0 01-2.339-10.2c0-11.008 6.463-15.107 13.973-19.87 5.977-3.79 12.616-8.001 17.192-16.449a31.013 31.013 0 003.744-14.82c0-3.299-.513-6.479-1.463-9.463z" />
+</svg>
diff --git a/examples/starter/public/favicon.svg b/examples/starter/public/favicon.svg
new file mode 100644
index 000000000..542f90aec
--- /dev/null
+++ b/examples/starter/public/favicon.svg
@@ -0,0 +1,11 @@
+<svg width="256" height="256" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <style>
+        #flame { fill: #FF5D01; }
+        #a { fill: #000014; }
+        @media (prefers-color-scheme: dark) {
+            #a { fill: #fff; }
+        }
+    </style>
+    <path id="a" fill-rule="evenodd" clip-rule="evenodd" d="M163.008 18.929c1.944 2.413 2.935 5.67 4.917 12.181l43.309 142.27a180.277 180.277 0 00-51.778-17.53l-28.198-95.29a3.67 3.67 0 00-7.042.01l-27.857 95.232a180.225 180.225 0 00-52.01 17.557l43.52-142.281c1.99-6.502 2.983-9.752 4.927-12.16a15.999 15.999 0 016.484-4.798c2.872-1.154 6.271-1.154 13.07-1.154h31.085c6.807 0 10.211 0 13.086 1.157a16.004 16.004 0 016.487 4.806z" />
+    <path id="flame" fill-rule="evenodd" clip-rule="evenodd" d="M168.19 180.151c-7.139 6.105-21.39 10.268-37.804 10.268-20.147 0-37.033-6.272-41.513-14.707-1.602 4.835-1.961 10.367-1.961 13.902 0 0-1.056 17.355 11.015 29.426 0-6.268 5.081-11.349 11.349-11.349 10.743 0 10.731 9.373 10.721 16.977v.679c0 11.542 7.054 21.436 17.086 25.606a23.27 23.27 0 01-2.339-10.2c0-11.008 6.463-15.107 13.974-19.87 5.976-3.79 12.616-8.001 17.192-16.449a31.024 31.024 0 003.743-14.82c0-3.299-.513-6.479-1.463-9.463z" />
+</svg>
diff --git a/examples/starter/public/robots.txt b/examples/starter/public/robots.txt
new file mode 100644
index 000000000..1f53798bb
--- /dev/null
+++ b/examples/starter/public/robots.txt
@@ -0,0 +1,2 @@
+User-agent: *
+Disallow: /
diff --git a/examples/starter/public/style/global.css b/examples/starter/public/style/global.css
new file mode 100644
index 000000000..0ce3b249a
--- /dev/null
+++ b/examples/starter/public/style/global.css
@@ -0,0 +1,28 @@
+* {
+  box-sizing: border-box;
+  margin: 0;
+}
+
+:root {
+  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji;
+  font-size: 1rem;
+  --user-font-scale: 1rem - 16px;
+  font-size: clamp(0.875rem, 0.4626rem + 1.0309vw + var(--user-font-scale), 1.125rem);
+}
+
+body {
+  padding: 4rem 2rem;
+  width: 100vw;
+  min-height: 100vh;
+  display: grid;
+  justify-content: center;
+  background: #f9fafb;
+  color: #111827;
+}
+
+@media (prefers-color-scheme: dark) {
+  body {
+    background: #111827;
+    color: #fff;
+  }
+}
diff --git a/examples/starter/public/style/home.css b/examples/starter/public/style/home.css
new file mode 100644
index 000000000..c4271a845
--- /dev/null
+++ b/examples/starter/public/style/home.css
@@ -0,0 +1,38 @@
+:root {
+    --font-mono: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
+    --color-light: #F3F4F6;
+}
+
+@media (prefers-color-scheme: dark) {
+    :root {
+        --color-light: #1F2937;
+    }
+}
+
+a {
+    color: inherit;
+}
+
+header > div {
+    font-size: clamp(2rem, -0.4742rem + 6.1856vw, 2.75rem);
+}
+
+header > div {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+header h1 {
+    font-size: 1em;
+    font-weight: 500;
+}
+header img {
+    width: 2em;
+    height: 2.667em;
+}
+
+h2 {
+    font-weight: 500;
+    font-size: clamp(1.5rem, 1rem + 1.25vw, 2rem);
+}
diff --git a/examples/starter/src/components/Tour.astro b/examples/starter/src/components/Tour.astro
new file mode 100644
index 000000000..5c822fe75
--- /dev/null
+++ b/examples/starter/src/components/Tour.astro
@@ -0,0 +1,85 @@
+---
+import { Markdown } from 'astro/components';
+---
+<article>
+    <div class="banner">
+        <p><strong>🧑‍🚀 Seasoned astronaut?</strong> Delete this file. Have fun!</p>
+    </div>
+
+    <section>
+        <Markdown>
+            ## 🚀 Project Structure
+
+            Inside of your Astro project, you'll see the following folders and files:
+
+            ```
+            /
+            ├── public/
+            │   ├── robots.txt
+            │   └── favicon.ico
+            ├── src/
+            │   ├── components/
+            │   │   └── Tour.astro
+            │   └── pages/
+            │       └── index.astro
+            └── package.json
+            ```
+
+            Astro looks for `.astro` or `.md` files in the `src/pages/` directory.
+            Each page is exposed as a route based on its file name.
+
+            There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
+
+            Any static assets, like images, can be placed in the `public/` directory.
+        </Markdown>
+    </section>
+
+     <section>
+        <h2>👀 Want to learn more?</h2>
+        <p>Feel free to check <a href="https://github.com/snowpackjs/astro">our documentation</a> or jump into our <a href="https://discord.gg/EsGdSGen">Discord server</a>.</p>
+    </section>
+    
+</article>
+
+<style>
+    article {
+        padding-top: 2em;
+        line-height: 1.5;
+    }
+    section {
+        margin-top: 2em;
+        display: flex;
+        flex-direction: column;
+        gap: 1em;
+        max-width: 70ch;
+    }
+
+    .banner {
+        text-align: center;
+        font-size: 1.2rem;
+        background: var(--color-light);
+        padding: 1em 1.5em;
+        padding-left: 0.75em;
+        border-radius: 4px;
+    }
+
+    pre,
+    code {
+        font-family: var(--font-mono);
+        background: var(--color-light);
+        border-radius: 4px;
+    }
+
+    pre {
+        padding: 1em 1.5em;
+    }
+
+    .tree {
+        line-height: 1.2;
+    }
+
+    code:not(.tree) {
+        padding: 0.125em;
+        margin: 0 -0.125em;
+    }
+</style>
diff --git a/examples/starter/src/pages/index.astro b/examples/starter/src/pages/index.astro
new file mode 100644
index 000000000..de052e9c4
--- /dev/null
+++ b/examples/starter/src/pages/index.astro
@@ -0,0 +1,38 @@
+---
+import Tour from '../components/Tour.astro';
+---
+
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Astro</title>
+
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg">
+
+    <link rel="stylesheet" href="/style/global.css">
+    <link rel="stylesheet" href="/style/home.css">
+
+    <style>
+        header {
+            display: flex;
+            flex-direction: column;
+            gap: 1em;
+            max-width: min(100%, 68ch);
+        }
+    </style>
+</head>
+<body>
+    <main>
+        <header>
+            <div>
+                <img width="60" height="80" src="/assets/logo.svg" alt="Astro logo">
+                <h1>Welcome to <a href="https://astro.build/">Astro</a></h1>
+            </div>
+        </header>
+
+        <Tour />
+    </main>
+</body>
+</html>