- Fork this repo.
yarn && yarn dev
- http://localhost:3000/ should open automatically.
We welcome contributions to the documentation site! Please verify your changes locally followed by a PR against our main
branch. After your PR is reviewed and all tests pass, it will be merged and the branch will be deleted.
main
- at parity with our production site https://docs.amplify.aws/gh-pages
- used to handle redirects from v1 of the documentation site. This should not be deleted.
Below is a full description of how to author pages. For now though, trigger the dev
script (yarn dev
).
Docs are generated using Next.js, please refer to their docs on how to create pages as a primer.
The root-level src
folder is the only directory you need touch in order to CRUD pages.
Within this folder exists a pages/index.tsx
file. This will be rendered as a page at the route /
. Within the src/pages/lib/q/platform/
folder is a [platform].mdx
file, which will be rendered as a page at the route /lib
.
In order to have the page render properly and display in the sidebar, please place your page and it's route in src/directory/directory.js
IMPORTANT: every page has to have a title
and description
meta field.
The markdown body is parsed as MDX and can include any valid HTML or JSX.
To inline fragments, and have them conditionally render based off selected platform, we add the condition to the Fragments
tag:
import js from "/src/fragments/lib/datastore/js/conflict.mdx";
<Fragments fragments={{js: js}} />;
This fragment would exist in: pages/src/fragments/lib/datastore/js/conflict.mdx
BlockSwitcher
allows you to organize blocks of content into tabs. This is useful for presenting a reader different instructions based upon framework (e.g. Vue.js vs. React) or language (e.g. Java vs. Kotlin). Here's an example of its usage:
<BlockSwitcher>
<Block name="JavaScript">
```js
const a = "a";
```
</Block>
<Block name="TypeScript">
```ts
const a: "a" = "a";
```
</Block>
<Block name="Rust">
```rust
let mut a = String::from("a");
```
</Block>
</BlockSwitcher>