How to build a custom app with Notion and Softr (includes restricted user access)
You can build client portals and other apps using Notion and Softr. Notion serves as the data source—the backend of the app where you manage all users and data. Softr acts as the front end, where you create the user-facing app, manage access, and apply your design and style.
The video above demonstrates how to utilize Notion as a data source for Softr apps. This essay serves as a written companion to the video. By the end of this piece, you'll grasp how to harness Notion and Softr to create your web and mobile applications.
Notion's databases make it an attractive data source, allowing you to build complex systems quickly and easily. These databases are particularly powerful for non-software engineers who may not be familiar with traditional database systems.
Choosing Notion as the data source for your no-code app is ideal when creating a minimum-viable product or developing a small-scale custom application.
How to create a Softr app with Notion as a data source
To create a new app in Softr, you can select Notion as the data source. Other options are available too, such as Airtable and Smartsheet. I created a Softr app for personal trainers using Airtable as the data source.
After selecting Notion as the data source, you'll be prompted to connect your Notion workspace and grant access to the necessary page(s) or database(s) for your app. It's best to keep all the databases for your app on a single page. This approach prevents the need to update your sync settings when adding new databases in the future.
User management
Once access is established, you can sync your app users from Notion to Softr. In Notion, you need a database containing your app users—for instance, a "Clients" database if you're creating a Personal Training app or agency client portal. This database must include an "Email" property, which Softr uses to sync users and match their email addresses during login.
Once users are synced, your Notion database and Softr users are synchronized. Adding a new user (page) to the Notion database will automatically add them as a user in Softr, and vice versa—though you can disable this two-way sync if preferred.
This setup gives you complete control over your app users. You can also make your app public and allow anyone to sign up. You'll use a dedicated sign-up page on the app, and when someone creates an account, they'll automatically be added as a user in both Softr and Notion.
Filtered blocks
After syncing users, you can create the application, which is similar to building a website. In Softr's left sidebar, you can create and edit pages. Each page consists of blocks, which you can add from the right sidebar. Blocks come in two types: static and dynamic. Static blocks (like images, text, and headlines) aren't linked to any data source, while dynamic blocks pull data from a connected source.
For example, if you use Notion as the sole data source for your client portal, you can add a block that displays all projects for the logged-in user. To achieve this, you'll need a "Projects" database in Notion, linked to the "Clients" database. In Softr, you can use a "List" block to fetch data from the "Projects" database and filter it using "Client" "contains" "logged-in user." This dynamic filter allows your app users to view (and edit, if you choose) only their projects. Meanwhile, as the app admin, you can see all projects in one place within a single centralized Notion database.
At present, Softr can only sync databases from Notion, not page content. This limitation means you must use Text properties for descriptions and other data that needs to be visible to app users.
By following this guide, you can build dynamic apps that fit different needs, like client portals or project management tools. You can sync users, filter data based on who's logged in, and manage everything through Notion's easy-to-use interface. This setup is great for small businesses, freelancers, and teams who want to quickly create MVPs or custom tools without too much investment.
Featured products
Similar Articles
Affiliate Links
Do you work at a startup? Get 3 months of Notion Plus for free, plus unlimited AI. Visit https://www.notion.so/startups, select Simone Smerilli as an affiliate partner in the drop-down list, and enter the unique code SimoneSmerilliXNotion at the end of the form.
Get one free month on the pro plan in Make (automation software)