Skip to content

Commit 774e50e

Browse files
authored
add docs on extension templates (#425)
1 parent 36bff45 commit 774e50e

File tree

1 file changed

+48
-0
lines changed

1 file changed

+48
-0
lines changed

src/content/docs/aws/tooling/extensions/developing-extensions.mdx

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -175,6 +175,15 @@ Commands:
175175
First, create a new extension from a template.
176176
To use `localstack extensions dev new`, you will also need to install [cookiecutter](https://github.com/cookiecutter/cookiecutter) via `pip install cookiecutter`.
177177

178+
LocalStack provides two extension templates to help you get started:
179+
180+
- **Basic template** (default): A minimal extension template with Python backend code
181+
- **React template**: An extension template that includes a React-based UI component
182+
183+
#### Using the basic template
184+
185+
To create an extension using the basic template, run:
186+
178187
```bash showLineNumbers
179188
localstack extensions dev new
180189
project_name [My LocalStack Extension]:
@@ -202,6 +211,45 @@ This will create a new Python project with the following layout:
202211

203212
Then run `make install` in the newly created project to make a distribution package.
204213

214+
215+
#### Using the React template
216+
217+
To create an extension with a React-based UI, use the `--template react` flag:
218+
219+
```bash showLineNumbers
220+
localstack extensions dev new --template react
221+
project_name [My LocalStack Extension]:
222+
project_short_description [All the boilerplate you need to create a LocalStack extension.]:
223+
project_slug [my-localstack-extension]:
224+
module_name [my_localstack_extension]:
225+
full_name [Jane Doe]:
226+
email [jane@example.com]:
227+
github_username [janedoe]:
228+
version [0.1.0]:
229+
```
230+
231+
The React template provides a small app with multiple pages to demonstrate how to use multiple pages in the same extension. When you start the LocalStack container with your React-based extension enabled, the extension UI will be automatically available through the LocalStack Web Application.
232+
233+
<FileTree>
234+
- my-localstack-extension
235+
- Makefile
236+
- README.md
237+
- backend
238+
- my_localstack_extension
239+
- backend.pth
240+
- frontend
241+
- \_\_init\_\_.py
242+
- package.json
243+
- public
244+
- src
245+
- tsconfig.json
246+
- pyproject.toml
247+
</FileTree>
248+
249+
The extension UI will be available at `http://localhost.localstack.cloud:4566/_extension/my-localstack-extension/#/dashboard` when LocalStack is running.
250+
251+
Then run `make install` in the newly created project to make a distribution package.
252+
205253
### Start LocalStack with the extension
206254

207255
To start LocalStack with the extension in dev mode, first enable it by running:

0 commit comments

Comments
 (0)