Docs Menu

Atlas Device SDK for the Web

The Atlas Device SDK for the Web lets browser-based applications access data stored in Atlas and interact with App Services services like Functions and authentication. The Web SDK supports both JavaScript and TypeScript.

Web apps built with the SDK can query Atlas using the following methods:

  • The standard MongoDB query API with the MongoDB client

  • Atlas Device Sync

Unlike the other SDKs, the Web SDK only supports creating an in-memory database, not one persisted to disk.

Learning Paths
Functions Icon

Quick Start

Minimal-explanation code examples of how to work with the Web SDK.

See Code Examples

Atlas Device SDK Mobile Icon

Working Example App

Learn by example through dissecting a working React app that uses the Web SDK and Atlas GraphQL API.

Explore an Example App

What You Can Do

Use the Web SDK with Atlas App Services to query MongoDB directly, query a GraphQL API, invoke serverless functions, manage user authentication, and more.

1

You can use the Web SDK to query MongoDB Atlas data directly from the browser. Perform CRUD, aggregation, and listen for database changes.

First, you must create an App Services App, set up database rules, and enable user authentication.

2

To access your App Services App from the browser, initialize the App client.

3

To authenticate a user, usee one of the App Services authentication providers. App Services includes custom JWT, Facebook, Google, Apple, anonymous, and built-in email/password authentication providers.

4

Query MongoDB directly from the browser using your authenticated user. The user can only access data that they're authorized to.

For more information, refer to Query MongoDB.

Query MongoDB Illustration
1

The Atlas GraphQL API automatically generates a hosted endpoint with GraphQL queries and mutations based on JSON schemas for the documents in your database.

Configure App Services Authentication with data access rules to control which users have access to what data. Configure the GraphQL API in Atlas App Services.

2

To access your App Services App from the browser, initialize the App client.

3

To authenticate a user, usee one of the App Services authentication providers. App Services includes custom JWT, Facebook, Google, Apple, anonymous, and built-in email/password authentication providers.

4

Query the GraphQL API using a GraphQL client from the browser. Authenticate requests with user credentials.

Learn how to query the GraphQL API with the Apollo Client.

API Integration Image

You can call serverless Functions from your client application that run in an App Services backend.

Authenticate users with built-in and third-party authentication providers. Use the authenticated user to access App Services.

App Services Illustration
Essential Documentation
Reference Icon

JavaScript API Reference

Explore reference docs for the JavaScript SDKs.

JavaScript API Reference

React Logo Icon

Quick Start with React

Learn how to add the Web SDK to your React application.

Add Realm to React project

Next.js Logo Icon

Next.js Integration Guide

Learn all the ways that you can use the Web SDK with your Next.js application.

Integrate with Next.js

Explore engineering and expert-provided example projects to learn best practices and common development patterns using the Web SDK. Check out the Example Projects page for more sample apps.

Users Icon

User's Online State

Detect connectivity and activity of users and devices.

Example project