Skip to content
Merged
Show file tree
Hide file tree
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
86 changes: 83 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
# Appwrite Web SDK

![License](https://img.shields.io/github/license/appwrite/sdk-for-web.svg?style=flat-square)
![Version](https://img.shields.io/badge/api%20version-1.7.4-blue.svg?style=flat-square)
![Version](https://img.shields.io/badge/api%20version-1.8.0-blue.svg?style=flat-square)
[![Build Status](https://img.shields.io/travis/com/appwrite/sdk-generator?style=flat-square)](https://travis-ci.com/appwrite/sdk-generator)
[![Twitter Account](https://img.shields.io/twitter/follow/appwrite?color=00acee&label=twitter&style=flat-square)](https://twitter.com/appwrite)
[![Discord](https://img.shields.io/discord/564160730845151244?label=discord&style=flat-square)](https://appwrite.io/discord)

**This SDK is compatible with Appwrite server version 1.7.x. For older versions, please check [previous releases](https://github.com/appwrite/sdk-for-web/releases).**
**This SDK is compatible with Appwrite server version 1.8.x. For older versions, please check [previous releases](https://github.com/appwrite/sdk-for-web/releases).**

Appwrite is an open-source backend as a service server that abstract and simplify complex and repetitive development tasks behind a very simple to use REST API. Appwrite aims to help you develop your apps faster and in a more secure way. Use the Web SDK to integrate your app with the Appwrite server to easily start interacting with all of Appwrite backend APIs and tools. For full API documentation and tutorials go to [https://appwrite.io/docs](https://appwrite.io/docs)

Expand All @@ -33,18 +33,20 @@ import { Client, Account } from "appwrite";
To install with a CDN (content delivery network) add the following scripts to the bottom of your <body> tag, but before you use any Appwrite services:

```html
<script src="https://cdn.jsdelivr.net/npm/appwrite@18.2.0"></script>
<script src="https://cdn.jsdelivr.net/npm/appwrite@19.0.0"></script>
```


## Getting Started

### Add your Web Platform

For you to init your SDK and interact with Appwrite services you need to add a web platform to your project. To add a new platform, go to your Appwrite console, choose the project you created in the step before and click the 'Add Platform' button.

From the options, choose to add a **Web** platform and add your client app hostname. By adding your hostname to your project platform you are allowing cross-domain communication between your project and the Appwrite API.

### Init your SDK

Initialize your SDK with your Appwrite server API endpoint and project ID which can be found in your project settings page.

```js
Expand All @@ -58,6 +60,7 @@ client
```

### Make Your First Request

Once your SDK object is set, access any of the Appwrite services and choose any request to send. Full documentation for any service method you would like to use can be found in your SDK documentation or in the [API References](https://appwrite.io/docs) section.

```js
Expand All @@ -74,6 +77,7 @@ account.create(ID.unique(), "email@example.com", "password", "Walter O'Brien")
```

### Full Example

```js
// Init your Web SDK
const client = new Client();
Expand All @@ -94,7 +98,83 @@ account.create(ID.unique(), "email@example.com", "password", "Walter O'Brien")
});
```

### Type Safety with Models

The Appwrite Web SDK provides type safety when working with database documents through generic methods. Methods like `listDocuments`, `getDocument`, and others accept a generic type parameter that allows you to specify your custom model type for full type safety.

**TypeScript:**
```typescript
interface Book {
name: string;
author: string;
releaseYear?: string;
category?: string;
genre?: string[];
isCheckedOut: boolean;
}

const databases = new Databases(client);

try {
const documents = await databases.listDocuments<Book>(
'your-database-id',
'your-collection-id'
);

documents.documents.forEach(book => {
console.log(`Book: ${book.name} by ${book.author}`); // Now you have full type safety
});
} catch (error) {
console.error('Appwrite error:', error);
}
```

**JavaScript (with JSDoc for type hints):**
```javascript
/**
* @typedef {Object} Book
* @property {string} name
* @property {string} author
* @property {string} [releaseYear]
* @property {string} [category]
* @property {string[]} [genre]
* @property {boolean} isCheckedOut
*/

const databases = new Databases(client);

try {
/** @type {Models.DocumentList<Book>} */
const documents = await databases.listDocuments(
'your-database-id',
'your-collection-id'
);

documents.documents.forEach(book => {
console.log(`Book: ${book.name} by ${book.author}`); // Type hints available in IDE
});
} catch (error) {
console.error('Appwrite error:', error);
}
```

**Tip**: You can use the `appwrite types` command to automatically generate TypeScript interfaces based on your Appwrite database schema. Learn more about [type generation](https://appwrite.io/docs/products/databases/type-generation).

### Error Handling

The Appwrite Web SDK raises an `AppwriteException` object with `message`, `code` and `response` properties. You can handle any errors by catching the exception and present the `message` to the user or handle it yourself based on the provided error information. Below is an example.

```javascript
try {
const user = await account.create(ID.unique(), "email@example.com", "password", "Walter O'Brien");
console.log('User created:', user);
} catch (error) {
console.error('Appwrite error:', error.message);
}
```

### Learn more

You can use the following resources to learn more and get help
- 🚀 [Getting Started Tutorial](https://appwrite.io/docs/getting-started-for-web)
- 📜 [Appwrite Docs](https://appwrite.io/docs)
Expand Down
8 changes: 4 additions & 4 deletions docs/examples/account/create-email-password-session.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,9 @@ const client = new Client()

const account = new Account(client);

const result = await account.createEmailPasswordSession(
'email@example.com', // email
'password' // password
);
const result = await account.createEmailPasswordSession({
email: 'email@example.com',
password: 'password'
});

console.log(result);
10 changes: 5 additions & 5 deletions docs/examples/account/create-email-token.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@ const client = new Client()

const account = new Account(client);

const result = await account.createEmailToken(
'<USER_ID>', // userId
'email@example.com', // email
false // phrase (optional)
);
const result = await account.createEmailToken({
userId: '<USER_ID>',
email: 'email@example.com',
phrase: false // optional
});

console.log(result);
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,11 @@ const client = new Client()

const account = new Account(client);

const result = await account.createMagicURLToken(
'<USER_ID>', // userId
'email@example.com', // email
'https://example.com', // url (optional)
false // phrase (optional)
);
const result = await account.createMagicURLToken({
userId: '<USER_ID>',
email: 'email@example.com',
url: 'https://example.com', // optional
phrase: false // optional
});

console.log(result);
6 changes: 3 additions & 3 deletions docs/examples/account/create-mfa-authenticator.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@ const client = new Client()

const account = new Account(client);

const result = await account.createMfaAuthenticator(
AuthenticatorType.Totp // type
);
const result = await account.createMFAAuthenticator({
type: AuthenticatorType.Totp
});

console.log(result);
6 changes: 3 additions & 3 deletions docs/examples/account/create-mfa-challenge.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@ const client = new Client()

const account = new Account(client);

const result = await account.createMfaChallenge(
AuthenticationFactor.Email // factor
);
const result = await account.createMFAChallenge({
factor: AuthenticationFactor.Email
});

console.log(result);
2 changes: 1 addition & 1 deletion docs/examples/account/create-mfa-recovery-codes.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,6 @@ const client = new Client()

const account = new Account(client);

const result = await account.createMfaRecoveryCodes();
const result = await account.createMFARecoveryCodes();

console.log(result);
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@ const client = new Client()

const account = new Account(client);

account.createOAuth2Token(
OAuthProvider.Amazon, // provider
'https://example.com', // success (optional)
'https://example.com', // failure (optional)
[] // scopes (optional)
);
account.createOAuth2Session({
provider: OAuthProvider.Amazon,
success: 'https://example.com', // optional
failure: 'https://example.com', // optional
scopes: [] // optional
});

Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@ const client = new Client()

const account = new Account(client);

account.createOAuth2Session(
OAuthProvider.Amazon, // provider
'https://example.com', // success (optional)
'https://example.com', // failure (optional)
[] // scopes (optional)
);
account.createOAuth2Token({
provider: OAuthProvider.Amazon,
success: 'https://example.com', // optional
failure: 'https://example.com', // optional
scopes: [] // optional
});

8 changes: 4 additions & 4 deletions docs/examples/account/create-phone-token.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,9 @@ const client = new Client()

const account = new Account(client);

const result = await account.createPhoneToken(
'<USER_ID>', // userId
'+12065550100' // phone
);
const result = await account.createPhoneToken({
userId: '<USER_ID>',
phone: '+12065550100'
});

console.log(result);
10 changes: 5 additions & 5 deletions docs/examples/account/create-push-target.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@ const client = new Client()

const account = new Account(client);

const result = await account.createPushTarget(
'<TARGET_ID>', // targetId
'<IDENTIFIER>', // identifier
'<PROVIDER_ID>' // providerId (optional)
);
const result = await account.createPushTarget({
targetId: '<TARGET_ID>',
identifier: '<IDENTIFIER>',
providerId: '<PROVIDER_ID>' // optional
});

console.log(result);
8 changes: 4 additions & 4 deletions docs/examples/account/create-recovery.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,9 @@ const client = new Client()

const account = new Account(client);

const result = await account.createRecovery(
'email@example.com', // email
'https://example.com' // url
);
const result = await account.createRecovery({
email: 'email@example.com',
url: 'https://example.com'
});

console.log(result);
8 changes: 4 additions & 4 deletions docs/examples/account/create-session.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,9 @@ const client = new Client()

const account = new Account(client);

const result = await account.createSession(
'<USER_ID>', // userId
'<SECRET>' // secret
);
const result = await account.createSession({
userId: '<USER_ID>',
secret: '<SECRET>'
});

console.log(result);
6 changes: 3 additions & 3 deletions docs/examples/account/create-verification.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@ const client = new Client()

const account = new Account(client);

const result = await account.createVerification(
'https://example.com' // url
);
const result = await account.createVerification({
url: 'https://example.com'
});

console.log(result);
12 changes: 6 additions & 6 deletions docs/examples/account/create.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,11 @@ const client = new Client()

const account = new Account(client);

const result = await account.create(
'<USER_ID>', // userId
'email@example.com', // email
'', // password
'<NAME>' // name (optional)
);
const result = await account.create({
userId: '<USER_ID>',
email: 'email@example.com',
password: '',
name: '<NAME>' // optional
});

console.log(result);
6 changes: 3 additions & 3 deletions docs/examples/account/delete-identity.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@ const client = new Client()

const account = new Account(client);

const result = await account.deleteIdentity(
'<IDENTITY_ID>' // identityId
);
const result = await account.deleteIdentity({
identityId: '<IDENTITY_ID>'
});

console.log(result);
6 changes: 3 additions & 3 deletions docs/examples/account/delete-mfa-authenticator.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@ const client = new Client()

const account = new Account(client);

const result = await account.deleteMfaAuthenticator(
AuthenticatorType.Totp // type
);
const result = await account.deleteMFAAuthenticator({
type: AuthenticatorType.Totp
});

console.log(result);
6 changes: 3 additions & 3 deletions docs/examples/account/delete-push-target.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@ const client = new Client()

const account = new Account(client);

const result = await account.deletePushTarget(
'<TARGET_ID>' // targetId
);
const result = await account.deletePushTarget({
targetId: '<TARGET_ID>'
});

console.log(result);
6 changes: 3 additions & 3 deletions docs/examples/account/delete-session.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@ const client = new Client()

const account = new Account(client);

const result = await account.deleteSession(
'<SESSION_ID>' // sessionId
);
const result = await account.deleteSession({
sessionId: '<SESSION_ID>'
});

console.log(result);
2 changes: 1 addition & 1 deletion docs/examples/account/get-mfa-recovery-codes.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,6 @@ const client = new Client()

const account = new Account(client);

const result = await account.getMfaRecoveryCodes();
const result = await account.getMFARecoveryCodes();

console.log(result);
Loading