diff options
Diffstat (limited to 'examples/remote-markdown')
-rw-r--r-- | examples/remote-markdown/astro.config.mjs | 5 | ||||
-rw-r--r-- | examples/remote-markdown/docs/dev.md | 48 | ||||
-rw-r--r-- | examples/remote-markdown/package.json | 17 | ||||
-rw-r--r-- | examples/remote-markdown/src/components/Yell.jsx | 5 | ||||
-rw-r--r-- | examples/remote-markdown/src/layouts/main.astro | 14 | ||||
-rw-r--r-- | examples/remote-markdown/src/pages/index.astro | 72 |
6 files changed, 161 insertions, 0 deletions
diff --git a/examples/remote-markdown/astro.config.mjs b/examples/remote-markdown/astro.config.mjs new file mode 100644 index 000000000..c7bfe91b0 --- /dev/null +++ b/examples/remote-markdown/astro.config.mjs @@ -0,0 +1,5 @@ +export default { + extensions: { + '.jsx': 'preact' + } +} diff --git a/examples/remote-markdown/docs/dev.md b/examples/remote-markdown/docs/dev.md new file mode 100644 index 000000000..d9223cbbd --- /dev/null +++ b/examples/remote-markdown/docs/dev.md @@ -0,0 +1,48 @@ +# Development Server + +The development server comes as part of the Astro CLI. Start the server with: + +```shell +astro dev +``` + +In your project root. You can specify an alternative + +## Special routes + +The dev server will serve the following special routes: + +### /400 + +This is a custom **400** status code page. You can add this route by adding a page component to your `src/pages` folder: + +``` +├── src/ +│ ├── components/ +│ └── pages/ +│ └── 400.astro +``` + +For any URL you visit that doesn't have a corresponding page, the `400.astro` file will be used. + +### /500 + +This is a custom **500** status code page. You can add this route by adding a page component to your `src/pages` folder: + +```astro +├── src/ │ ├── components/ │ └── pages/ │ └── 500.astro +``` + +This page is used any time an error occurs in the dev server. + +The 500 page will receive an `error` query parameter which you can access with: + +``` +--- +const error = Astro.request.url.searchParams.get('error'); +--- + +<strong>{error}</strong> +``` + +A default error page is included with Astro so you will get pretty error messages even without adding a custom 500 page. diff --git a/examples/remote-markdown/package.json b/examples/remote-markdown/package.json new file mode 100644 index 000000000..dc20a1a66 --- /dev/null +++ b/examples/remote-markdown/package.json @@ -0,0 +1,17 @@ +{ + "name": "@example/remote-markdown", + "version": "0.0.1", + "private": true, + "scripts": { + "start": "astro dev", + "build": "astro build", + "astro-dev": "nodemon --delay 0.5 -w ../../packages/astro/dist -x '../../packages/astro/astro.mjs dev'" + }, + "devDependencies": { + "astro": "0.0.13", + "nodemon": "^2.0.7" + }, + "snowpack": { + "workspaceRoot": "../.." + } +} diff --git a/examples/remote-markdown/src/components/Yell.jsx b/examples/remote-markdown/src/components/Yell.jsx new file mode 100644 index 000000000..ae7d0d959 --- /dev/null +++ b/examples/remote-markdown/src/components/Yell.jsx @@ -0,0 +1,5 @@ +import { h, Fragment } from 'preact'; + +export default function Yell({ children }) { + return children.filter(v => typeof v === 'string').join('').toUpperCase() + '!' +} diff --git a/examples/remote-markdown/src/layouts/main.astro b/examples/remote-markdown/src/layouts/main.astro new file mode 100644 index 000000000..37fcc0ee7 --- /dev/null +++ b/examples/remote-markdown/src/layouts/main.astro @@ -0,0 +1,14 @@ +--- +export let content; +--- + +<html> + <head> + <title>{content.title}</title> + </head> + + <body> + <slot /> + <pre>{JSON.stringify(content)}</pre> + </body> +</html> diff --git a/examples/remote-markdown/src/pages/index.astro b/examples/remote-markdown/src/pages/index.astro new file mode 100644 index 000000000..402780065 --- /dev/null +++ b/examples/remote-markdown/src/pages/index.astro @@ -0,0 +1,72 @@ +--- +import Markdown from 'astro/components/Markdown.astro'; +import Yell from '../components/Yell.jsx'; +const title = 'INTERPOLATED'; +const quietTest = 'interpolated'; +const content = await fetch('https://raw.githubusercontent.com/snowpackjs/snowpack/main/README.md').then(res => res.text()); +--- + +<!-- Basic --> +<Markdown> +# Hello world! +</Markdown> + + <!-- Indented --> + <Markdown> + # Hello indent! + </Markdown> + +<!-- Interpolation --> +<Markdown> +# Hello {title}! +</Markdown> + + + <!-- Can I break this? --> + <Markdown> + # I cannot! + + <div> + # ahhhh + </div> + + <Yell>{quietTest}</Yell> + + <strong>Dope</strong> + + `nice` + + ``` + plain fence + ``` + + ```html + don't <div>me</div> bro + ``` + + ```js + Astro.fetchContent() + ``` + + ### cool stuff? + ```astro + {'can\'t interpolate'} + {} + {title} + + Do I break? <Markdown> </Markdown> + ``` + </Markdown> + +<!-- external content --> +<Markdown>{content}</Markdown> + +<!-- external with newlines --> +<Markdown> + {content} +</Markdown> + + <!-- external with indentation --> + <Markdown> + {content} + </Markdown> |