CINXE.COM
Userbase: Docs
<!doctype html> <html lang="en"> <head> <title>Userbase: Docs</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content="Userbase is the easiest way to add user accounts and data persistence to your static site. No backend necessary."> <meta property="og:url" content="https://userbase.com" /> <meta property="og:type" content="website" /> <meta property="og:title" content="Userbase: Docs" /> <meta property="og:image" content="https://userbase.com/2c9de7d2c6f17990e56fc36e8a9da903.png" /> <meta property="og:description" content="Create secure and private web apps using only static JavaScript, HTML, and CSS." /> <meta property="og:site_name" content="Userbase" /> <meta property="og:locale" content="en_US" /> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:site" content="@UserbaseHQ" /> <meta name="twitter:creator" content="@UserbaseHQ" /> <meta name="twitter:url" content="https://userbase.com" /> <meta name="twitter:title" content="Userbase: Docs" /> <meta name="twitter:description" content="Create secure and private web apps using only static JavaScript, HTML, and CSS." /> <meta name="twitter:image" content="https://userbase.com/2c9de7d2c6f17990e56fc36e8a9da903.png" /> <link rel="shortcut icon" href="/assets/favicon.ico"> <link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon-16x16.png"> <link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon-32x32.png"> <link rel="manifest" href="/assets/manifest.json"> <meta name="mobile-web-app-capable" content="yes"> <meta name="theme-color" content="#fff"> <meta name="application-name" content="homepage"> <link rel="apple-touch-icon" sizes="57x57" href="/assets/apple-touch-icon-57x57.png"> <link rel="apple-touch-icon" sizes="60x60" href="/assets/apple-touch-icon-60x60.png"> <link rel="apple-touch-icon" sizes="72x72" href="/assets/apple-touch-icon-72x72.png"> <link rel="apple-touch-icon" sizes="76x76" href="/assets/apple-touch-icon-76x76.png"> <link rel="apple-touch-icon" sizes="114x114" href="/assets/apple-touch-icon-114x114.png"> <link rel="apple-touch-icon" sizes="120x120" href="/assets/apple-touch-icon-120x120.png"> <link rel="apple-touch-icon" sizes="144x144" href="/assets/apple-touch-icon-144x144.png"> <link rel="apple-touch-icon" sizes="152x152" href="/assets/apple-touch-icon-152x152.png"> <link rel="apple-touch-icon" sizes="167x167" href="/assets/apple-touch-icon-167x167.png"> <link rel="apple-touch-icon" sizes="180x180" href="/assets/apple-touch-icon-180x180.png"> <link rel="apple-touch-icon" sizes="1024x1024" href="/assets/apple-touch-icon-1024x1024.png"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> <meta name="apple-mobile-web-app-title" content="homepage"> <link rel="apple-touch-startup-image" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 1)" href="/assets/apple-touch-startup-image-320x460.png"> <link rel="apple-touch-startup-image" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2)" href="/assets/apple-touch-startup-image-640x920.png"> <link rel="apple-touch-startup-image" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" href="/assets/apple-touch-startup-image-640x1096.png"> <link rel="apple-touch-startup-image" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2)" href="/assets/apple-touch-startup-image-750x1294.png"> <link rel="apple-touch-startup-image" media="(device-width: 414px) and (device-height: 736px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3)" href="/assets/apple-touch-startup-image-1182x2208.png"> <link rel="apple-touch-startup-image" media="(device-width: 414px) and (device-height: 736px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 3)" href="/assets/apple-touch-startup-image-1242x2148.png"> <link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 1)" href="/assets/apple-touch-startup-image-748x1024.png"> <link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 1)" href="/assets/apple-touch-startup-image-768x1004.png"> <link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2)" href="/assets/apple-touch-startup-image-1496x2048.png"> <link rel="apple-touch-startup-image" media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)" href="/assets/apple-touch-startup-image-1536x2008.png"> <link rel="icon" type="image/png" sizes="228x228" href="/assets/coast-228x228.png"> <meta name="msapplication-TileColor" content="#fff"> <meta name="msapplication-TileImage" content="/assets/mstile-144x144.png"> <meta name="msapplication-config" content="/assets/browserconfig.xml"> <link rel="yandex-tableau-widget" href="/assets/yandex-browser-manifest.json"> <link href="/style.css" rel="stylesheet"> </head> <body> <header class="sm:sticky top-0 bg-white z-50 shadow-none sm:shadow-md mb-0 sm:mb-8"> <div class="sm:flex sm:justify-between sm:items-center py-2 px-4"> <div class="flex items-center justify-between h-10"> <div class="flex-shrink-0"> <div> <a href="/"><img alt="Userbase" class="h-8" src="/70ddd55fe9c2df5cc8c20f0047db6558.png"></a> </div> </div> <div class="sm:hidden"> <button onclick="toggleMenu()" type="button" class="block text-blackish hover:text-orange-700 focus:text-orange-700 focus:outline-none"> <svg class="h-6 w-6 fill-current" viewBox="0 0 24 24"> <path class="hidden menu-close" fill-rule="evenodd" d="M18.278 16.864a1 1 0 0 1-1.414 1.414l-4.829-4.828-4.828 4.828a1 1 0 0 1-1.414-1.414l4.828-4.829-4.828-4.828a1 1 0 0 1 1.414-1.414l4.829 4.828 4.828-4.828a1 1 0 1 1 1.414 1.414l-4.828 4.829 4.828 4.828z" /> <path class="menu-open" fill-rule="evenodd" d="M4 5h16a1 1 0 0 1 0 2H4a1 1 0 1 1 0-2zm0 6h16a1 1 0 0 1 0 2H4a1 1 0 0 1 0-2zm0 6h16a1 1 0 0 1 0 2H4a1 1 0 0 1 0-2z" /> </svg> </button> </div> </div> <nav class="pt-0 pb-8 hidden sm:flex sm:p-0 text-lg text-center menu"> <a href="/pricing/" class="menu-item">Pricing</a> <a href="/docs/" class="menu-item">Docs</a> <a href="/contact/" class="menu-item">Contact</a> <a href="https://v1.userbase.com/#sign-in" class="menu-item text-red-700 hover:text-blue">Log in</a> <a href="https://v1.userbase.com/#create-admin" class="rounded-lg px-6 py-2 no-underline bg-yellowish font-black cursor-pointer text-gray-900 inline-block leading-none hover:text-orange-700 mt-2 ml-0 sm:ml-2 sm:mt-0">Try it FREE</a> </nav> </div> </header> <div class="container mx-auto max-w-4xl px-4"> <!-- Docs --> <div class="section"> <h2>Docs</h2> <ul class="text-2xl no-bullets"> <li><a href="/docs/installation/">Installation</a></li> <li><a href="/docs/quickstart">Quickstart</a></li> <li><a href="/docs/sdk/">JavaScript SDK</a></li> <li><a href="/docs/api/">Admin API</a></li> <li><a href="/docs/faq/">FAQ</a></li> </ul> <h3 class="text-center mt-4">Tutorials</h3> <ul class="text-2xl no-bullets"> <li><a href="https://github.com/smallbets/userbase/tree/master/src/cordova-plugin-userbase" target="_blank">Create a mobile app</a> (Cordova)</li> <li><a href="https://github.com/smallbets/userbase-samples/tree/master/ugliest-todo-electron" target="_blank">Create a desktop app</a> (Electron)</li> </ul> <h3 class="text-center mt-4">Advanced</h3> <ul class="text-2xl no-bullets"> <li><a href="https://www.npmjs.com/package/userbase-js-node" target="_blank">userbase-js-node</a></li> <li><a href="https://github.com/smallbets/userbase/blob/master/docs/userbase_architecture.md" target="_blank">Architecture spec</a></li> <li><a href="https://github.com/smallbets/userbase/tree/master/src/userbase-sql.js" target="_blank">Userbase + SQL</a> (experimental)</li> </ul> </div> <hr> <footer class="text-center py-4 tracking-tight text-sm"> <div> <nav class="pt-2 pb-4 text-center menu"> <a href="/about/" class="py-2 leading-none px-2">About</a> <a href="/pricing/" class="py-2 leading-none px-2">Pricing</a> <a href="/policies/" class="py-2 leading-none px-2">Policies</a> <a href="http://github.com/encrypted-dev/userbase" class="py-2 leading-none px-2">GitHub</a> <a href="https://twitter.com/UserbaseHQ" class="py-2 leading-none px-2">Twitter</a> <a href="/announcements/" class="py-2 leading-none px-2">Announcements</a> </nav> </div> <div class="text-gray-500 text-xs"> This site is <a href="https://github.com/encrypted-dev/userbase-homepage" target="_blank">open source</a>. </div> </footer> </div> <script type="text/javascript" src="/main.js"></script> </body> </html>