diff --git a/apps/portal/src/app/contracts/build/stylus/assets/stylus-deploy-page.png b/apps/portal/src/app/contracts/build/stylus/assets/stylus-deploy-page.png new file mode 100644 index 00000000000..fd8bcac53a8 Binary files /dev/null and b/apps/portal/src/app/contracts/build/stylus/assets/stylus-deploy-page.png differ diff --git a/apps/portal/src/app/contracts/build/stylus/assets/stylus-publish-page.png b/apps/portal/src/app/contracts/build/stylus/assets/stylus-publish-page.png new file mode 100644 index 00000000000..95653496be0 Binary files /dev/null and b/apps/portal/src/app/contracts/build/stylus/assets/stylus-publish-page.png differ diff --git a/apps/portal/src/app/contracts/build/stylus/page.mdx b/apps/portal/src/app/contracts/build/stylus/page.mdx new file mode 100644 index 00000000000..e9d90e08c21 --- /dev/null +++ b/apps/portal/src/app/contracts/build/stylus/page.mdx @@ -0,0 +1,66 @@ +import { DocImage } from "@doc"; +import { Tabs, TabsList, TabsContent } from "@/components/ui/tabs"; +import stylusPublishPage from "./assets/stylus-publish-page.png"; +import stylusDeployPage from "./assets/stylus-deploy-page.png"; + +# Arbitrum Stylus + +Integrate thirdweb tools in Stylus contract (Rust) development workflow. + +Use thirdweb CLI to create, publish, and deploy contracts written with Stylus. The deployed contracts can be used via thirdweb dashboard or SDK. + +## Prerequisites +- Rust toolchain should be installed (https://www.rust-lang.org/tools/install) +- Solidity (solc) should be installed (https://docs.soliditylang.org/en/latest/installing-solidity.html) + +You can also use the Stylus quickstart guide for reference: https://docs.arbitrum.io/stylus/quickstart + +## Getting started + +To get started, setup a starter repo (can be skipped if you already have a Stylus project): + + + + ```bash + npx thirdweb create-stylus + ``` + + + +This will setup a project containing a template contract. + +## Publishing and Deploying + +Use one of these commands to publish or deploy your Stylus contract. + + + + ```bash + npx thirdweb publish-stylus -k + ``` + + + +OR + + + + ```bash + npx thirdweb deploy-stylus -k + ``` + + + +Publishing a contract saves the contract metadata to an onchain registry, and creates a contract page from where you can deploy a specific version of this contract multiple times. + +This is what you should see: + + + + + +After deployment, the contract will be available on thirdweb dashboard. You can interact with it via dashboard or integrate it in your app using the code snippets as shown below: + + + +More templates for Stylus Rust contracts and use-case specific installable modules are coming soon. diff --git a/apps/portal/src/app/contracts/sidebar.tsx b/apps/portal/src/app/contracts/sidebar.tsx index 17aef7a88ec..b78b37c55bb 100644 --- a/apps/portal/src/app/contracts/sidebar.tsx +++ b/apps/portal/src/app/contracts/sidebar.tsx @@ -799,6 +799,11 @@ export const sidebar: SideBar = { }, ], }, + // stylus + { + name: "Arbitrum Stylus", + href: `${buildSlug}/stylus`, + }, ], }, { separator: true },