Contributing to the Layer0 Documentation

Layer0 is all about putting power in the hands of developers and our documentation is no different. The source code for the Layer0 developer docs (i.e. this site you’re reading now) is in an open repository on GitHub and we welcome feedback and pull requests. If you’ve found a typo or a better way to explain something, please submit a pull request or file an issue! Others will likely stumble over the same problem and benefit from your insight.

Running Locally#

To run the Layer0 docs on your machine, first clone the repository locally,

git clone git@github.com:layer0-docs/layer0-docs.git

Then install the dependencies:

cd layer0-docs
yarn install

Next, start the Next.js dev server locally,

yarn dev

Finally, visit the site in your browser at http://127.0.0.1:3000.

Architecture#

Layer0 docs is a simple Next.js application running on Layer0 (yes we dogfood). The content is stored as pages called “guides”. Each guide is a Markdown file located in the guides folder

How to Contribute#

If you need to modify an existing guide, you can use the SidebarMenuItems file to locate the corresponding Markdown file to edit. If your contribution needs its own guide, you’ll need to create a new Markdown file in the guides folder and add a reference to it in SidebarMenuItems.

We recommend the following process for submitting a change:

1. Fork the Layer0 Docs repository on GitHub via the web interface.
2. Clone the repo and make sure you can run the docs locally.
3. Make your amazing edit — even a typo fix is an amazing edit!
4. Commit and push your change back to your fork on GitHub.
5. Submit a pull request back to the Layer0 Docs repository (to the main branch) via GitHub web interface.

Custom Components#

Use the custom components below to enhance the look and feel of your guides.

Callout#

Call attention to specific part of the guide with callouts.

// use this in a markdown file... with type: 'info' | 'warning' | 'danger';

<Callout type="info">
    This is an info...
</Callout>

<Callout type="warning">
    This is an info...
</Callout>

<Callout type="danger">
    This is an info...
</Callout>

The code-snippet aboves renders:

Codeblock#

Provide a language-module for syntax highlighting or non if you still need to use a codeblock.

// This codeblock has the 'js' language module (with JS comment)
console.log(new Date())

<!-- This codeblock has the 'html' language module (with HTML comment) -->
<button type="button" class="btn btn-primary">Primary</button>

# This codeblock has the 'bash' language module (with Bash comment)
echo "Hello World"

// This codeblock has no language module, hence "unknown"
upload.build.layer0.co
app.layer0.co

Video#

<Video src="video src url"/>

Button Link#

/*
interface IButtonLinkProps {
 variant: 'fill' | 'stroke';
 type: 'default' | 'code' | 'deploy';
 children: React.ReactNode;
 href: string | UrlObject;
 withIcon: boolean;
}
*/


<ButtonLink variant="fill" type="default" href="...">
 Try the Next.js SSR Example Site
</ButtonLink>
<ButtonLink variant="stroke" type="code" withIcon={true} href="...">
 View the Code
</ButtonLink>
<ButtonLink variant="stroke" type="deploy" withIcon={true} href="...">
  Deploy to Layer0
</ButtonLink>

Renders:

Button Links Group#

<ButtonLinksGroup>
 <ButtonLink variant="fill" type="default" href="...">
  Try the Next.js SSR Example Site
 </ButtonLink>
 <ButtonLink variant="stroke" type="code" withIcon={true} href="...">
  View the Code
 </ButtonLink>
 <ButtonLink variant="stroke" type="deploy" withIcon={true} href="...">
   Deploy to Layer0
 </ButtonLink>
</ButtonLinksGroup>

Renders: