Mainframe Progress Update 0
👋

Mainframe Progress Update 0

Published Date
April 17, 2024

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

image

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

image

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!

image

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

image

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