Skip to content

[Docs] Update README with comprehensive SDK package information #7738

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
174 changes: 144 additions & 30 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,37 +15,150 @@

<p align="center"><strong>All-in-one web3 SDK for Browser, Node and Mobile apps</strong></p>

## Features

- Support for React & React-Native
- First party support for [Embedded Wallets](https://portal.thirdweb.com/wallets) (social/email login)
- First party support for [Account Abstraction](https://portal.thirdweb.com/wallets/sponsor-gas)
- Instant connection to any chain with RPC Edge integration
- Integrated IPFS upload/download
- UI Components for connection, transactions, nft rendering
- High level contract extensions for interacting with common standards
## Core Package

#### [`thirdweb`](./packages/thirdweb/README.md)

The main SDK package providing all-in-one web3 functionality for Browser, Node, and Mobile applications.

```bash
Comment on lines +18 to +24
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Fix heading-level jumps to satisfy Markdown linting and improve document hierarchy

markdownlint (MD001) flags these sections because they jump directly from an h2 (##) to an h4 (####) without an intermediate h3.
Use ### for the package names (or demote the parent headings) so levels increment by one.

-## Core Package
-#### [`thirdweb`](./packages/thirdweb/README.md)
+## Core Package
+### [`thirdweb`](./packages/thirdweb/README.md)

-## Adapters
-#### [`@thirdweb-dev/react-native-adapter`](./packages/react-native-adapter/README.md)
+## Adapters
+### [`@thirdweb-dev/react-native-adapter`](./packages/react-native-adapter/README.md)

-## Type safe API wrappers
-#### [`@thirdweb-dev/api`](./packages/api/README.md)
+## Type safe API wrappers
+### [`@thirdweb-dev/api`](./packages/api/README.md)

Apply the same change to every sub-heading under these sections.
This will silence the linter and make the outline easier to scan.

Also applies to: 103-119, 121-161

🧰 Tools
🪛 markdownlint-cli2 (0.17.2)

20-20: Heading levels should only increment by one level at a time
Expected: h3; Actual: h4

(MD001, heading-increment)

🤖 Prompt for AI Agents
In README.md around lines 18 to 24, the heading levels jump from h2 (##)
directly to h4 (####), which violates markdownlint rule MD001. Change the h4
headings for package names to h3 (###) to ensure proper incremental heading
levels. Apply the same adjustment to all sub-headings under these sections,
including lines 103-119 and 121-161, to fix the linter warnings and improve
document structure.

npm install thirdweb
```

**Features:**

- Type-safe contract and transaction APIs
- In-app wallets with social/email login
- Account abstraction (ERC4337/EIP7702) support
- 500+ external wallets supported
- Built in infra (RPC, bundler, paymaster, indexer)
- React hooks and UI components
- Automatic ABI resolution
- IPFS upload/download
- Cross-platform support (Web, React Native)

### Documentation

Visit the [developer portal](https://portal.thirdweb.com) for full documentation.

### 🚀 Quick Start

#### For React Applications

```bash
npm install thirdweb
```

```typescript
import { createThirdwebClient } from "thirdweb";
import { ConnectButton, useActiveAccount } from "thirdweb/react";

const client = createThirdwebClient({
clientId: "YOUR_CLIENT_ID",
});

function App() {
const account = useActiveAccount();
console.log("Connected as", account?.address);

return <ConnectButton client={client} />;
}
```

For React Native Applications, you'll also need to install the `@thirdweb-dev/react-native-adapter` package and import it at app startup for polyfills.

#### For Backend Applications

```bash
npm install thirdweb
```

```typescript
import { createThirdwebClient, Engine } from "thirdweb";

const client = createThirdwebClient({
secretKey: "YOUR_SECRET_KEY",
});

const wallet = Engine.serverWallet({
client,
address: "0x...",
});

const transaction = transfer({
contract: getContract({
client,
address: "0x...", // token contract
chain: defineChain(1),
}),
to: "0x...", // recipient
amount: "0.01", // amount in tokens
});

await wallet.enqueueTransaction({
transaction,
});
```
Comment on lines +76 to +101
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Backend quick-start snippet omits required imports and may confuse readers

transfer, getContract, and defineChain are used but never imported, so the example will not compile if copy-pasted.

-import { createThirdwebClient, Engine } from "thirdweb";
+import {
+  createThirdwebClient,
+  Engine,
+  transfer,
+  getContract,
+  defineChain,
+} from "thirdweb";

Consider adding a short note that these helpers come from the same package to prevent friction for newcomers.

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
```typescript
import { createThirdwebClient, Engine } from "thirdweb";
const client = createThirdwebClient({
secretKey: "YOUR_SECRET_KEY",
});
const wallet = Engine.serverWallet({
client,
address: "0x...",
});
const transaction = transfer({
contract: getContract({
client,
address: "0x...", // token contract
chain: defineChain(1),
}),
to: "0x...", // recipient
amount: "0.01", // amount in tokens
});
await wallet.enqueueTransaction({
transaction,
});
```
import {
createThirdwebClient,
Engine,
transfer,
getContract,
defineChain,
} from "thirdweb";
const client = createThirdwebClient({
secretKey: "YOUR_SECRET_KEY",
});
const wallet = Engine.serverWallet({
client,
address: "0x...",
});
const transaction = transfer({
contract: getContract({
client,
address: "0x...", // token contract
chain: defineChain(1),
}),
to: "0x...", // recipient
amount: "0.01", // amount in tokens
});
await wallet.enqueueTransaction({
transaction,
});
🤖 Prompt for AI Agents
In README.md between lines 76 and 101, the example code uses transfer,
getContract, and defineChain without importing them, which will cause
compilation errors. Add import statements for these functions from the
"thirdweb" package at the top of the snippet. Also, include a brief note
clarifying that these helpers come from the same package to help new users
understand where they originate.


## Adapters

#### [`@thirdweb-dev/react-native-adapter`](./packages/react-native-adapter/README.md)

Required polyfills and configuration for running the thirdweb SDK in React Native applications.

```bash
npm install @thirdweb-dev/react-native-adapter
```

#### [`@thirdweb-dev/wagmi-adapter`](./packages/wagmi-adapter/README.md)

Integration layer for using thirdweb's in-app wallets with wagmi.

```bash
npm install @thirdweb-dev/wagmi-adapter
```

## Type safe API wrappers

#### [`@thirdweb-dev/api`](./packages/api/README.md)

TypeScript SDK for thirdweb's API, combining all of thirdweb products.

```bash
npm install @thirdweb-dev/api
```

#### [`@thirdweb-dev/engine`](./packages/engine/README.md)

TypeScript SDK for Engine, thirdweb's backend onchain executor service.

```bash
npm install @thirdweb-dev/engine
```

#### [`@thirdweb-dev/insight`](./packages/insight/README.md)

TypeScript SDK for Insight, thirdweb's multichain indexer service.

```bash
npm install @thirdweb-dev/insight
```

#### [`@thirdweb-dev/vault-sdk`](./packages/vault-sdk/README.md)

SDK for interacting with Vault, thirdweb's secure key management service.

```bash
npm install @thirdweb-dev/vault-sdk
```

#### [`@thirdweb-dev/nebula`](./packages/nebula/README.md)

TypeScript SDK for Nebula, thirdweb's AI agent service.

## Library Comparison

| | thirdweb | Wagmi + Viem | Ethers@6 |
| ----------------------------------------- | -------- | ------------------ | -------- |
| Type safe contract API | ✅ | ✅ | ✅ |
| Type safe wallet API | ✅ | ✅ | ✅ |
| EVM utils | ✅ | ✅ | ✅ |
| RPC for any EVM | ✅  | ⚠️ public RPC only | ❌ |
| Automatic ABI Resolution | ✅ | ❌ | ❌ |
| IPFS Upload/Download | ✅ | ❌ | ❌ |
| Embedded wallet (email/ social login) | ✅ | ⚠️ via 3rd party | ❌ |
| Account abstraction (ERC4337) support | ✅ | ⚠️ via 3rd party | ❌ |
| Web3 wallet connectors | ✅ | ✅ | ❌ |
| Local wallet creation | ✅ | ✅ | ✅ |
| Auth (SIWE) | ✅ | ✅ | ❌ |
| Extensions functions for common standards | ✅ | ✅ | ❌ |
| React Hooks | ✅ | ✅ | ❌ |
| React UI components | ✅ | ❌ | ❌ |
| React Native Hooks | ✅ | ✅ | ❌ |
| React Native UI Components | ✅ | ❌ | ❌ |
```bash
npm install @thirdweb-dev/nebula
```

## Contributing

Expand All @@ -55,7 +168,8 @@ See our [open source page](https://thirdweb.com/open-source) for more informatio

## Additional Resources

- [Documentation](https://portal.thirdweb.com/typescript/v5)
- [Dashboard](https://thirdweb.com/login)
- [Documentation](https://portal.thirdweb.com/)
- [Templates](https://thirdweb.com/templates)
- [YouTube](https://www.youtube.com/c/thirdweb)

Expand Down
Loading