barishnamazov/madata

Make any cloud service with an API your backend! WIP

Madata

Make any cloud service with an API your backend! A spinoff from Mavo.

Here be dragons Madata has not yet been officially released, we are trying a “soft launch” first. It is currently in pre-alpha and very much a work in progress. Please try it out, and open issues as you find them!

Getting Started

Madata provides a unified API for authentication, reading & storing data, as well as file uploads (where supported), regardless of the storage service used. You don’t need to worry about differences between the different APIs, and swapping one storage service for another is as easy as changing a URL! Each supported backend documents what kinds of URLs it supports. Then Backend.create(url) automatically gets you an instance of the corresponding backend.

import Backend from "https://madata.dev/src/index.js";

let backend = Backend.create("https://github.com/leaverou/repo/data.json");
let json = await backend.load();

json.happy = true;

await backend.store();

console.log("Stored some data!");

Supported backends

Service	Auth?	Writes?	Uploads?
GitHub Files	✅	✅	✅
GitHub Gist	✅	✅
GitHub API	✅
Dropbox	✅	✅	✅
Google Drive	✅	✅	✅
Google Firebase	✅	✅	✅
Google Sheets	✅	✅
Google Calendar	✅
Local storage		✅
HTML Element		✅
Basic remote fetching

Authentication

Show auth status to the user:

backend.addEventListener("mv-login", evt => {
	header.classList.add("logged-in");

	let user = backend.user;
	my_username.textContent = user.username;
	my_avatar.src = user.avatar;
});

backend.addEventListener("mv-logout", evt => {
	header.classList.remove("logged-in");
});

To have buttons for login/logout:

loginButton.addEventListener("click", evt => backend.login());
logoutButton.addEventListener("click", evt => backend.logout());

Read more about authentication

Storage

Save:

let fileInfo = await backend.store(json);

Uploads

For backends that support uploads, this is how simple it could be to create an image uploader:

<input type=file id=uploader>

uploadForm.addEventListener("submit", evt => {
	evt.preventDefault();

	let file = uploader.files[0];

	if (file && file.type.startsWith("image/")) {
		backend.upload(file, `images/${file.name}`);
	}
});

You can check if backend.upload is defined to see if the backend supports image uploads.