Template Apps
You can get up and running with an Atlas App Services App using one of our premade template apps. Template apps bring together many of the building blocks available in Atlas App Services and start you off with a prebuilt app that you can customize.
Create a Template App
You can create a template app using the UI on the Atlas App Services site, the App Services CLI, or the Admin API. Choose the tab for whichever option is most convenient for you.
You can create a template App using the same command as you would use to create a blank App. To learn how to create an App Services App, see Create an App and follow the instructions for a template App.
After you create a template app, the UI includes a
Get the Front-End Code for your Template section that
offers client code that you can download as a .zip
file, view on
GitHub, or get through the App Services CLI.
You can create a template App using the same command as you would use to create a blank App. To learn how to create an App Services App, see Create an App and follow the instructions for a template App.
The command must include the --template
flag with a valid
template App ID value:
appservices apps create \ --name "<App Name>" \ --template "<Template App ID>"
You can create a template App using the same endpoint as you would use to create a blank App. To learn how to create an App Services App, see Create an App and follow the instructions for a template App.
Your Admin API request must include a valid template_id
value
in the request body.
curl -X POST \ https://services.cloud.mongodb.com/api/admin/v3.0/groups/{groupId}/apps \ -H 'Authorization: Bearer <access_token>' \ -d '{ "name": "<App Name>", "template_id": "<Template App ID>", "data_source": { "name": "mongodb-atlas", "type": "mongodb-atlas", "config": { "clusterName": "<Atlas Cluster Name>" } } }'
Get a Template App Client
Some of the template apps come with working clients to explore and build on when creating your applications. You can access these clients through the Atlas App Services UI, Realm CLI, or GitHub.
When you download client code through the App Services UI, the client
code is not pre-populated with your App Services App ID. To use
one of these clients, you must find your App ID
to use in the client. Follow the Configuration and
Download the Client as a Zip File instructions in the client
README.md
to learn where to insert your App ID.
Download the client when you create the template app
When you create a template app using the App Services UI, the UI provides you with three options to get the client code immediately after creating the template:
Download your preferred client as a
.zip
file.Use the App Services CLI to pull your preferred client to a local directory.
View and clone the client code from GitHub.
After selecting your preferred method, follow the on-screen instructions or clone the repository to get the client code.
Download the client at some point after creating the template app
If you don't download the client code when you first create the app, you can download it later. Your App Services App displays a "Welcome to Your Application" pane on the main dashboard. This pane contains a button labeled </> Pull front-end code. When you click this button, you see the same dialogue as when you first create an app, which gives you the options to get the client.
Tip
The C++ Template App is not yet available to download in the App Services UI. Use the CLI or clone the repository from GitHub to get the client code.
When you download client code through App Services CLI, the client code is pre-populated with your App Services App ID.
Download the client when you create the template app
When you use App Services CLI to create the template app, it automatically
creates a directory wherever you run the create command that contains both the backend and client
code. Alternately, you can use the --local
option to specify a
directory where it should download the app code.
appservices apps create -n "<App Name>" --template "<Chosen Template App ID>"
The directory name is the name of your app. Inside this directory,
you'll see a backend
directory that contains the App Services code,
and a frontend
directory that contains the client application code.
Download the client at some point after creating the template app
At any point after creating a template app, you can use the App Services CLI
to download the client code. Use the App Services CLI pull command with the --template
option to specify which
client template you want to download.
appservices pull --remote "<App Name>" --template "<Chosen Template App ID>"
Use the ID of an available template below that offers a client application.
The Device Sync template app clients are available in GitHub. If you want just the client code without the backend code, explore the relevant GitHub repository for your preferred framework or language:
If you clone one of these repositories, the client code is not
pre-populated with your App Services App ID. To use one of these
clients, you must create a template app
and find your App ID to use in the client.
Follow the Configuration and Cloning from GitHub
instructions in the client README.md
to learn where to insert
your App ID.
Template Apps Available
The following templates are available. The App Services CLI accepts the following IDs
to the --template
flag of the appservices apps create and
appservices pull commands.
ID | Name | Description | Client |
---|---|---|---|
flex-sync-guides.add-collaborators | Flexible Sync Permissions Guide: 'Add Collaborators' Demo | Demo with Node.js client and App Services App that implements the
Dynamic Collaboration permissions strategy
for Device Sync using Flexible Sync. | None |
flex-sync-guides.restricted-feed | Flexible Sync Permissions Guide: 'Restricted Feed' Demo | Demo with Node.js client and App Services App that implements the
Restricted News Feed permissions strategy
for Device Sync using Flexible Sync. | None |
flex-sync-guides.tiered | Flexible Sync Permissions Guide: 'Tiered' Demo | Demo with Node.js client and App Services App that implements the
Tiered Privileges permissions strategy
for Device Sync using Flexible Sync. | None |
cpp.todo.flex | C++ SDK + Atlas Device Sync Starter | Terminal GUI to-do list app written in C++ using the C++ SDK
and FTXUI. Syncs local
data to MongoDB Atlas using Device Sync with
Flexible Sync. | C++ |
flutter.todo.flex | Flutter SDK + Atlas Device Sync Starter | Cross-platform to-do list app for Android, iOS, Windows, MacOS, and
Linux written in Dart using the Flutter SDK.
Syncs local data to MongoDB Atlas using Device Sync with
Flexible Sync. | Flutter |
kotlin.todo.flex | Kotlin SDK + Atlas Device Sync Starter | Android to-do list app written in Kotlin using the
Kotlin SDK. Syncs local data to MongoDB Atlas
using Device Sync with Flexible Sync. | Kotlin |
maui.todo.flex | MAUI + Atlas Device Sync Starter | Cross-platform to-do list mobile app using the
C# SDK. Syncs local data to MongoDB Atlas using
Device Sync with Flexible Sync. | MAUI |
react-native.todo.flex | React Native + Atlas Device Sync Starter | Cross-platform to-do list mobile app using the
JS SDK and the
@realm/react library. Syncs local data to
MongoDB Atlas using Device Sync with Flexible Sync. | Realm React |
swiftui.todo.flex | SwiftUI + Atlas Device Sync Starter | iOS to-do list app using SwiftUI and the Swift SDK.
Syncs local data to MongoDB Atlas using Device Sync with
Flexible Sync. | SwiftUI |
sync.todo | Flexible Sync Todo App Backend | Backend-only App that contains the configuration used by the <Language or Framework>.todo.flex template apps. | None |
triggers | Manage Database Views | Event-driven Database Trigger template to update a view in a separate collection. | None |
web.mql.todo | Web SDK + React Starter | Hosted to-do list web app using the Web SDK. | React/ MQL |
web.data-api.todo | Atlas Data API + React Starter | Hosted to-do list app using the Data API. | React/ HTTPS |