This is the first progress update on Mainframe. Welcome in!
If you missed the YouTube video, Mainframe centralizes data from other services and helps you build software with that data. Itās a data warehouse and a set of libraries that handle data syncing, freeing developers to focus on the functionalities they need.
Mainframe has been a nights and weekends research project. And my friend Michel DeBauge was eager to help out with design! Overall, a lot happened over the last few months:
- āļøĀ Mainframe Cloud
- šĀ Notion OAuth
- šĀ HTTP request playground
- āļøĀ React library
- ā¶ļøĀ Code playground
- š¬Ā New landing page
āļøĀ Mainframe Cloud
This is what Iām most excited about! Any time Iād demo Mainframe to a friend, theyād need to follow a bunch of steps to install it locally. Now, users interested in Mainframe can navigate to https://mainframe.so and signup to start using it directly from their browser!
In the process I learned that itās not trivial to maintain an open-source repo alongside a cloud offering. I can write a blog post about it if you ask nicely on Discord or Twitter. Mainframe Cloud is powered by HellÅ and Supabase for user authentication and Turso to store synced data.
The cloud offering doesnāt replace the local version. Giving users control of their own data is the initial motivation for Mainframe and a core value of the project. The plan is for both local and cloud instances to communicate with each other, letting users decide how their data is stored and synced.
šĀ Notion OAuth
This is one of the biggest problems Mainframe is trying to solve: authenticating with third-party apps. Before now, you had to follow the steps in our docs to get keys for every integration. Weāre adding support for OAuth integrations, starting with Notion. This lets users sync their data with a few clicks when following the on-screen prompts, instead of going back and forth between documentation, dashboard and a third-party developer portal. Shout out to Nango for making it easier to integrate Notion accounts!
šĀ HTTP request playground
After you connect with a source and sync it, itās now possible to see how to send a request, and try it out from the dashboard itself!
āļøĀ React library
I published a helper library to access Mainframe data.
Install it:
npm i @mainframe-so/react
And use it:
import { useMainframeObject } from "@mainframe-so/react";
export default function Component() {
const { data } = useMainframeObject({
datasetId: "b5411dfedf39060b94e9a12d54c527bb",
objectType: "currentEntry",
apiKey: env.API_KEY
});
return <div>...</div>;
}
Itās still very experimental. Thereās no documentation and a ton of space to improve the API. But this was super useful for the code playgroundā¦
ā¶ļøĀ Code playground
Mainframeās goals is to make building software easier. So instead of requiring users to go setup a new React project and copy/paste a bunch of things to it, Iām adding a code editor straight into Mainframe!
The editor is no VSCode or Val Town, but it lets users quickly experiment before moving to another coding environment. Sandpack has been super helpful to quickly spin up this playground.
š¬Ā New landing page
Mainframe has a new landing page. The previous one was mostly a placeholder. Fortunately, Michel jumped in and has been making great progress making the it look a lot more legit. Animations included! Check it out at https://mainframe.so
Thatās it for this update!
If you want to learn more or share your ideas, please reach out on Discord or Twitter!
Happy building,
AndrƩ Terron