> ## Documentation Index
> Fetch the complete documentation index at: https://docs.orbitroblox.xyz/llms.txt
> Use this file to discover all available pages before exploring further.

# Example

An example of a simple page that shows "Hello world!".

Start with the structure, since all we need is a window that shows hello world we need a client-side script to create it and a frame that has the content.

<Frame>
  <img src="https://mintcdn.com/orbitroblox/w8b48y-axVx12VhW/images/helloWorld_1.png?fit=max&auto=format&n=w8b48y-axVx12VhW&q=85&s=354465190c6653cddaabe1c78810a2a7" alt="Image" width="384" height="424" data-path="images/helloWorld_1.png" />

  *<sup>The class is decorative</sup>*
</Frame>

Now for the code, we need to make sure the API has permission:

```luau theme={null}
return function(api, ext)
	if not api.navkit then
		warn("Unable to access Navkit, aborting.")
		return
	end
end
```

Now apply a permission too since this will just error every time:

<Frame>
  <img src="https://mintcdn.com/orbitroblox/w8b48y-axVx12VhW/images/helloWorld_2.png?fit=max&auto=format&n=w8b48y-axVx12VhW&q=85&s=3ab1ef64a5abfa0ea02cc8fd6d7f7581" alt="Image" width="390" height="269" data-path="images/helloWorld_2.png" />
</Frame>

Good! Now to actually create the window we need a category first. In this example we'll just reference a category made by Orbit, `orbit.main`.

```luau theme={null}
return function(api, ext)
	if not api.navkit then
		warn("Unable to access Navkit, aborting.")
		return
	end
	local window = ext.window
	api.navkit.newButton(
		"helloWorldButton", -- id
		{
			category = "orbit.main",
			name = "Hello World", -- what is displayed on the button
			icon = nil, -- optional, nil cus im lazy
			layoutorder = 99, -- optional, put it as last
			clone = false, -- optional, we don't want to clone our window
		},
		window
	)
end
```

And done! That's it.

<Frame>
  <img src="https://mintcdn.com/orbitroblox/jqpH21SoVGBX6TDB/images/helloWorld_3.png?fit=max&auto=format&n=jqpH21SoVGBX6TDB&q=85&s=ed7685b7bb3bb428d513e744b45a04c1" alt="Image" width="861" height="507" data-path="images/helloWorld_3.png" />
</Frame>

<br />Have fun creating extensions!<br />Please follow [our guidelines](/extensions/rules) when doing so.
