Initial commit
5
.gitignore
vendored
Normal file
@@ -0,0 +1,5 @@
|
|||||||
|
node_modules/
|
||||||
|
dist/
|
||||||
|
|
||||||
|
.DS_Store
|
||||||
|
public/style.css
|
||||||
3994
package-lock.json
generated
Normal file
17
package.json
Normal file
@@ -0,0 +1,17 @@
|
|||||||
|
{
|
||||||
|
"name": "homepage",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"scripts": {
|
||||||
|
"clean": "rm -Rf ./dist && rm -f ./public/style.css",
|
||||||
|
"build": "npm run clean && postcss ./tailwind.style.css -o ./dist/style.css && cp -R ./public/* ./dist/ && cp ./dist/style.css ./public/style.css"
|
||||||
|
},
|
||||||
|
"author": "Daniel Vassallo",
|
||||||
|
"license": "MIT",
|
||||||
|
"devDependencies": {
|
||||||
|
"@fullhuman/postcss-purgecss": "^1.3.0",
|
||||||
|
"autoprefixer": "^9.6.1",
|
||||||
|
"postcss-cli": "^6.1.3",
|
||||||
|
"tailwind": "^4.0.0",
|
||||||
|
"tailwindcss": "^1.1.2"
|
||||||
|
}
|
||||||
|
}
|
||||||
14
postcss.config.js
Normal file
@@ -0,0 +1,14 @@
|
|||||||
|
const purgecss = require('@fullhuman/postcss-purgecss')({
|
||||||
|
content: [
|
||||||
|
'./public/**/*.html'
|
||||||
|
],
|
||||||
|
defaultExtractor: content => content.match(/[\w-/:]+(?<!:)/g) || []
|
||||||
|
})
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
plugins: [
|
||||||
|
require('tailwindcss'),
|
||||||
|
require('autoprefixer'),
|
||||||
|
purgecss
|
||||||
|
]
|
||||||
|
}
|
||||||
BIN
public/img/android-chrome-192x192.png
Executable file
|
After Width: | Height: | Size: 21 KiB |
BIN
public/img/android-chrome-512x512.png
Executable file
|
After Width: | Height: | Size: 94 KiB |
BIN
public/img/apple-touch-icon.png
Executable file
|
After Width: | Height: | Size: 19 KiB |
BIN
public/img/favicon-16x16.png
Executable file
|
After Width: | Height: | Size: 674 B |
BIN
public/img/favicon-32x32.png
Executable file
|
After Width: | Height: | Size: 1.5 KiB |
BIN
public/img/favicon.ico
Executable file
|
After Width: | Height: | Size: 15 KiB |
BIN
public/img/icon.png
Normal file
|
After Width: | Height: | Size: 17 KiB |
1
public/img/site.webmanifest
Executable file
@@ -0,0 +1 @@
|
|||||||
|
{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
|
||||||
169
public/index.html
Normal file
@@ -0,0 +1,169 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
|
||||||
|
<title>Userbase</title>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
|
||||||
|
<link rel="apple-touch-icon" sizes="180x180" href="img/apple-touch-icon.png">
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon-32x32.png">
|
||||||
|
<link rel="icon" type="image/png" sizes="16x16" href="img/favicon-16x16.png">
|
||||||
|
<link rel="manifest" href="img/site.webmanifest">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body class="pb-10">
|
||||||
|
<div class="container mx-auto text-center max-w-2xl px-4 text-blackish" style="font-size: 16px">
|
||||||
|
<div class="my-10">
|
||||||
|
<div class="flex justify-center">
|
||||||
|
<img class="w-32 h-32" src="./img/icon.png">
|
||||||
|
</div>
|
||||||
|
<h1 class="font-black text-6xl leading-none tracking-tight font-logo">Userbase</h1>
|
||||||
|
<h2 class="text-2xl leading-tight mt-1 tracking-tight">You won't believe it's not a
|
||||||
|
database!</h2>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<div class="my-10">
|
||||||
|
<h3 class="font-black text-3xl tracking-tight">What is Userbase?</h3>
|
||||||
|
<div class="text-left font-sans tracking-tight">
|
||||||
|
<p class="mb-4">Userbase is like a database, but purpose-built for web app user data. It's accessible
|
||||||
|
directly from the browser through a very simple JavaScript SDK.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<div class="my-10">
|
||||||
|
<h3 class="font-black text-3xl tracking-tight">Why isn't it a database?</h3>
|
||||||
|
<div class="text-left font-sans tracking-tight">
|
||||||
|
<p class="mb-4">With Userbase you can durably store, update, delete, and query user data. But that's where
|
||||||
|
the similarities with traditional databases end.</p>
|
||||||
|
<h4 class="font-bold text-xl tracking-tight">Zero management</h4>
|
||||||
|
<p class="mb-4">Unlike a real database, all Userbase
|
||||||
|
queries run in the browser, with the server-side acting as a dumb data store. There's no database to manage
|
||||||
|
and worry about.
|
||||||
|
</p>
|
||||||
|
<h4 class="font-bold text-xl tracking-tight">Built-in user management</h4>
|
||||||
|
<p class="mb-4">Unlike a real database, Userbase takes care of your user accounts. It comes with built-in
|
||||||
|
APIs for user signups, logins, and access control.</p>
|
||||||
|
<h4 class="font-bold text-xl tracking-tight">End-to-end encrypted</h4>
|
||||||
|
<p class="mb-4">Unlike a real database, Userbase won't show you what your users store in your web
|
||||||
|
app.</p>
|
||||||
|
<p class="mb-4"></p>Wait, what!? — Yes, that's a feature — maybe the most important feature. Userbase spares you
|
||||||
|
from
|
||||||
|
the liability of handling user data by encrypting everything in the browser, using keys that always stay
|
||||||
|
with the user.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<div class="my-10">
|
||||||
|
<h3 class="font-black text-3xl tracking-tight">When would I use it?</h3>
|
||||||
|
<div class="text-left font-sans tracking-tight">
|
||||||
|
<p class="mb-4">If you're building a web app, you will likely need a database. Userbase can substitute your
|
||||||
|
database... </p>
|
||||||
|
<ul class="list-disc mb-4 ml-8">
|
||||||
|
<li>If you want to build a web app without writing any backend code.</li>
|
||||||
|
<li>If you never want to see your users' data.</li>
|
||||||
|
<li>If you're tired of dealing with databases.</li>
|
||||||
|
<li>If you want to radically simplify your GDPR compliance.</li>
|
||||||
|
<li>And if you want to keep things really simple.</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<div class="my-10">
|
||||||
|
<h3 class="font-black text-3xl tracking-tight">How do I start?</h3>
|
||||||
|
<div class="text-left font-sans tracking-tight">
|
||||||
|
<p class="mb-4">Userbase will be available around mid-December 2019.</p>
|
||||||
|
|
||||||
|
<h4 class="font-bold text-xl tracking-tight">Open source</h4>
|
||||||
|
<p class="mb-4">Userbase is being developed in the open, and is <a
|
||||||
|
href="https://github.com/encrypted-dev/userbase" target="_blank" rel="noopener noreferrer">100%
|
||||||
|
open-source</a>, MIT licensed. You can modify
|
||||||
|
and extend the backend to your liking, and run it yourself in your AWS account, always under your control.</p>
|
||||||
|
|
||||||
|
<h4 class="font-bold text-xl tracking-tight">As a service</h4>
|
||||||
|
<p class="mb-4">Or for just $39/month you can go fully serverless, backendless, databaseless, and AWSless!</p>
|
||||||
|
<ul class="list-disc mb-4 ml-8">
|
||||||
|
<li>Unlimited web apps.</li>
|
||||||
|
<li>Unlimited users.</li>
|
||||||
|
<li>1 GB storage included.</li>
|
||||||
|
<li>Unlimited extra storage at $1/month per GB.</li>
|
||||||
|
<li>All features included.</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<h4 class="font-bold text-xl tracking-tight">Join the waiting list</h4>
|
||||||
|
<p class="mb-4">Enter your email to receive occasional updates about Userbase. No spam ever.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="mc_embed_signup">
|
||||||
|
<form
|
||||||
|
action="https://danielvassallo.us20.list-manage.com/subscribe/post?u=e3b0fd293a0e6d7ea0080fafe&id=d0aae9dd3e"
|
||||||
|
method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate"
|
||||||
|
target="_blank" novalidate>
|
||||||
|
<div id="mc_embed_signup_scroll">
|
||||||
|
<div class="mc-field-group">
|
||||||
|
<input type="email" value="" name="EMAIL" id="mce-EMAIL" placeholder="Email address"
|
||||||
|
class="font-light text-sm h-10 p-2 border border-gray-500 outline-none w-64 rounded font-mono my-4 inline-block">
|
||||||
|
<input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe"
|
||||||
|
class="rounded-lg w-40 h-10 bg-yellowish font-bold cursor-pointer text-gray-900 inline-block relative"
|
||||||
|
style="top: 1px;">
|
||||||
|
</div>
|
||||||
|
<div id="mce-responses" class="clear">
|
||||||
|
<div class="response" id="mce-error-response" style="display:none"></div>
|
||||||
|
<div class="response" id="mce-success-response" style="display:none"></div>
|
||||||
|
</div>
|
||||||
|
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text"
|
||||||
|
name="b_e3b0fd293a0e6d7ea0080fafe_d0aae9dd3e" tabindex="-1" value=""></div>
|
||||||
|
<div class="clear"></div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!--End mc_embed_signup-->
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<div class="my-10">
|
||||||
|
<h3 class="font-black text-3xl tracking-tight">Who's behind this?</h3>
|
||||||
|
<div class="text-left font-sans tracking-tight">
|
||||||
|
<p class="mb-4">This product is the work of <a href="https://twitter.com/dvassallo" target="_blank"
|
||||||
|
rel="noopener noreferrer">Daniel Vassallo</a> and <a href="https://twitter.com/justinberman95"
|
||||||
|
target="_blank" rel="noopener noreferrer">Justin Berman</a>.
|
||||||
|
We're a small independent business, structured to be lean, profitable, and sustainable. We're here for the
|
||||||
|
long
|
||||||
|
haul.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p class="mb-4">If you have any questions, or there's anything we can do to help you with your web app, please
|
||||||
|
<a href="mailto:daniel@encrypted.dev">get in touch</a>. Thank you!</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<div class="font-sans tracking-tight my-10 text-xs">
|
||||||
|
Copyright © 2019 Encrypted Development LLC
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script>
|
||||||
|
<script type='text/javascript'>
|
||||||
|
(function ($) { window.fnames = new Array(); window.ftypes = new Array(); fnames[0] = 'EMAIL'; ftypes[0] = 'email'; fnames[1] = 'FNAME'; ftypes[1] = 'text'; fnames[2] = 'LNAME'; ftypes[2] = 'text'; fnames[3] = 'ADDRESS'; ftypes[3] = 'address'; fnames[4] = 'PHONE'; ftypes[4] = 'phone'; fnames[5] = 'BIRTHDAY'; ftypes[5] = 'birthday'; }(jQuery)); var $mcj = jQuery.noConflict(true);
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
15
tailwind.config.js
Normal file
@@ -0,0 +1,15 @@
|
|||||||
|
module.exports = {
|
||||||
|
theme: {
|
||||||
|
extend: {
|
||||||
|
colors: {
|
||||||
|
yellowish: '#ffe77a',
|
||||||
|
blackish: '#1a2a30'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fontFamily: {
|
||||||
|
'logo': 'Tahoma, Geneva, Verdana, sans-serif'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
variants: {},
|
||||||
|
plugins: []
|
||||||
|
}
|
||||||
13
tailwind.style.css
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
@tailwind base;
|
||||||
|
|
||||||
|
@tailwind components;
|
||||||
|
|
||||||
|
@tailwind utilities;
|
||||||
|
|
||||||
|
a {
|
||||||
|
@apply underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover {
|
||||||
|
@apply text-orange-700;
|
||||||
|
}
|
||||||