Change tagline to: Create secure and GDPR-compliant web apps
This commit is contained in:
Daniel Vassallo
3
.vscode/settings.json
vendored
Normal file
3
.vscode/settings.json
vendored
Normal file
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"html.format.wrapLineLength": 0
|
||||
}
|
||||
759
package-lock.json
generated
759
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -5,7 +5,7 @@
|
||||
"version": "1.0.0",
|
||||
"scripts": {
|
||||
"clean": "rm -Rf dist",
|
||||
"build": "npm run clean && webpack --mode production --config webpack.config.js",
|
||||
"build": "npm run clean && cross-env NODE_ENV=production webpack --mode production --config webpack.config.js",
|
||||
"start": "webpack-dev-server --mode development --config webpack.config.js"
|
||||
},
|
||||
"author": "Daniel Vassallo",
|
||||
@@ -16,9 +16,11 @@
|
||||
"@babel/plugin-transform-runtime": "^7.4.4",
|
||||
"@babel/preset-env": "^7.4.5",
|
||||
"@babel/runtime": "^7.4.5",
|
||||
"@fullhuman/postcss-purgecss": "^1.3.0",
|
||||
"autoprefixer": "^9.6.0",
|
||||
"babel-loader": "^8.0.6",
|
||||
"babel-polyfill": "^6.26.0",
|
||||
"cross-env": "^6.0.3",
|
||||
"css-loader": "^2.1.1",
|
||||
"favicons-webpack-plugin": "^1.0.2",
|
||||
"file-loader": "^3.0.1",
|
||||
@@ -31,7 +33,6 @@
|
||||
"opn-browser-webpack-plugin": "0.0.7",
|
||||
"optimize-css-assets-webpack-plugin": "^5.0.1",
|
||||
"postcss-loader": "^3.0.0",
|
||||
"purgecss-webpack-plugin": "^1.6.0",
|
||||
"source-map-loader": "^0.2.4",
|
||||
"tailwindcss": "^1.0.4",
|
||||
"terser-webpack-plugin": "^1.3.0",
|
||||
|
||||
@@ -1,6 +1,13 @@
|
||||
module.exports = {
|
||||
plugins: [
|
||||
require('tailwindcss'),
|
||||
require('autoprefixer')
|
||||
require('autoprefixer'),
|
||||
process.env.NODE_ENV === 'production' && require('@fullhuman/postcss-purgecss')({
|
||||
content: [
|
||||
'./src/**/*.html',
|
||||
'./src/**/*.css',
|
||||
],
|
||||
defaultExtractor: content => content.match(/[A-Za-z0-9-_:/]+/g) || []
|
||||
})
|
||||
]
|
||||
}
|
||||
BIN
src/img/logo.png
BIN
src/img/logo.png
Binary file not shown.
|
Before Width: | Height: | Size: 19 KiB After Width: | Height: | Size: 15 KiB |
22
src/index.js
22
src/index.js
@@ -19,7 +19,7 @@ window.displayMailChimpStatus = function (data) {
|
||||
return;
|
||||
}
|
||||
|
||||
mcStatus.classList.remove('mc-error');
|
||||
mcStatus.classList.remove('mc-error')
|
||||
mcStatus.classList.add('mc-success')
|
||||
}
|
||||
|
||||
@@ -64,3 +64,23 @@ document.addEventListener('submit', function (event) {
|
||||
submitMailChimpForm(event.target)
|
||||
|
||||
}, false)
|
||||
|
||||
window.toggleMenu = function () {
|
||||
const menu = document.querySelector('.menu')
|
||||
const menuOpen = document.querySelector('.menu-open')
|
||||
const menuClose = document.querySelector('.menu-close')
|
||||
|
||||
if (!menu || !menuOpen || !menuClose) return
|
||||
|
||||
const isOpen = !menu.classList.contains('hidden')
|
||||
|
||||
if (isOpen) {
|
||||
menu.classList.add('hidden')
|
||||
menuOpen.classList.remove('hidden')
|
||||
menuClose.classList.add('hidden')
|
||||
} else {
|
||||
menu.classList.remove('hidden')
|
||||
menuOpen.classList.add('hidden')
|
||||
menuClose.classList.remove('hidden')
|
||||
}
|
||||
}
|
||||
@@ -1,14 +1,9 @@
|
||||
<div class="section">
|
||||
<h3 id="about">Who's behind this?</h3>
|
||||
<h2 id="about">Who's behind this?</h2>
|
||||
|
||||
<p>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>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>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>
|
||||
<p>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>
|
||||
|
||||
<hr>
|
||||
@@ -1,35 +1,30 @@
|
||||
<div class="section">
|
||||
<p>Userbase allows you to create database-backed web apps using only static JavaScript, HTML, and CSS. No backend code
|
||||
necessary.</p>
|
||||
<h1>Create <span class="highlight">secure</span> and <span class="highlight">GDPR-compliant</span> web apps using only static JavaScript, HTML, and CSS.</h1>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<div class="section">
|
||||
<h3 id="why-not-a-database">What does it do?</h3>
|
||||
<h2 id="what-is-userbase">What is Userbase?</h2>
|
||||
|
||||
<p>Userbase is a database and backend service, purpose-built for web apps. It is accessible directly from the
|
||||
browser through a very simple JavaScript SDK.</p>
|
||||
<h4 id="zero-management">Zero management</h4>
|
||||
<p>Unlike a regular database, all Userbase queries run in the browser, with the server-side acting as
|
||||
a dumb data store. There's no database to manage or worry about.
|
||||
</p>
|
||||
<h4 id="user-management">Built-in user management</h4>
|
||||
<p>Userbase takes care of your user accounts. It comes with built-in APIs for user signups, logins, password
|
||||
resets, and access control.</p>
|
||||
<h4 id="e2ee">End-to-end encryption</h4>
|
||||
<p>Userbase won't show you what your users store in your web app. Yes, that's a feature, not a bug. 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>
|
||||
<p>Userbase is a database and backend service, purpose-built for web apps. It is accessible directly from the browser through a very simple JavaScript SDK.</p>
|
||||
|
||||
<h3 id="zero-management-database">Zero-management database</h3>
|
||||
<p>Unlike a regular database, all Userbase queries run in the browser. The server-side is just a dumb data store, and there's no database to manage or worry about.</p>
|
||||
|
||||
<h3 id="user-accounts">Built-in user accounts</h3>
|
||||
<p>Userbase takes care of your user accounts. It comes with built-in APIs for user signups, logins, password resets, and access control.</p>
|
||||
|
||||
<h3 id="e2ee">End-to-end encryption</h3>
|
||||
<p>Userbase won't show you what your users store in your web app. It 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>
|
||||
|
||||
<hr>
|
||||
|
||||
<div class="section">
|
||||
<h3 id="what-would-i-use-it">When would I use it?</h3>
|
||||
<h2 id="what-would-i-use-it">When would I use it?</h2>
|
||||
|
||||
<p>If you're building a web app, you will likely need a database and a backend. Userbase can replace both of those
|
||||
things... </p>
|
||||
<p>If you're building a web app, you will likely need a database and a backend. Userbase can replace both of those things... </p>
|
||||
<ul>
|
||||
<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>
|
||||
@@ -42,22 +37,14 @@
|
||||
<hr>
|
||||
|
||||
<div class="section">
|
||||
<h3 id="how-do-i-start">How do I start?</h3>
|
||||
<h2 id="how-do-i-start">How do I start?</h2>
|
||||
|
||||
<p>Userbase will be available around mid-December 2019. Enter your email to receive important updates in your inbox.
|
||||
</p>
|
||||
<p>Userbase will be available around mid-December 2019. Enter your email to receive important updates in your inbox.</p>
|
||||
|
||||
<form method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" target="_blank"
|
||||
class="validate text-center"
|
||||
action="https://danielvassallo.us20.list-manage.com/subscribe/post?u=e3b0fd293a0e6d7ea0080fafe&id=d0aae9dd3e">
|
||||
<form method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" target="_blank" class="validate text-center" action="https://danielvassallo.us20.list-manage.com/subscribe/post?u=e3b0fd293a0e6d7ea0080fafe&id=d0aae9dd3e">
|
||||
<input type="email" value="" name="EMAIL" id="mce-EMAIL" required autocorrect="off" spellcheck="false" placeholder="Email address" class="font-light text-sm h-10 p-2 border border-gray-500 outline-none w-64 rounded my-4 inline-block">
|
||||
|
||||
<input type="email" value="" name="EMAIL" id="mce-EMAIL" required autocorrect="off" spellcheck="false"
|
||||
placeholder="Email address"
|
||||
class="font-light text-sm h-10 p-2 border border-gray-500 outline-none w-64 rounded 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 text-lg"
|
||||
style="top: 1px;">
|
||||
<input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button">
|
||||
|
||||
<div class="mc-status" class="hidden"></div>
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true">
|
||||
@@ -69,13 +56,11 @@
|
||||
<hr>
|
||||
|
||||
<div class="section">
|
||||
<h3 id="pricing">How much will it cost?</h3>
|
||||
<h4 id="oss">Open source</h4>
|
||||
<p>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>
|
||||
<h2 id="pricing">How much will it cost?</h2>
|
||||
<h3 id="oss">Open source</h3>
|
||||
<p>Userbase 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 id="saas">As a service</h4>
|
||||
<h3 id="saas">As a service</h3>
|
||||
<p>Or for just $39/month you can go fully serverless, backendless, databaseless, and AWSless!</p>
|
||||
<ul>
|
||||
<li>Unlimited web apps.</li>
|
||||
@@ -90,16 +75,11 @@
|
||||
<hr>
|
||||
|
||||
<div class="section">
|
||||
<h3 id="about">Who's behind this?</h3>
|
||||
<h2 id="about">Who's behind this?</h2>
|
||||
|
||||
<p>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>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>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>
|
||||
<p>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>
|
||||
|
||||
<hr>
|
||||
@@ -2,17 +2,11 @@
|
||||
|
||||
<p>Enter your email to receive important updates in your inbox.</p>
|
||||
|
||||
<form method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" target="_blank"
|
||||
class="validate text-center"
|
||||
action="https://danielvassallo.us20.list-manage.com/subscribe/post?u=e3b0fd293a0e6d7ea0080fafe&id=d0aae9dd3e">
|
||||
<form method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" target="_blank" class="validate text-center" action="https://danielvassallo.us20.list-manage.com/subscribe/post?u=e3b0fd293a0e6d7ea0080fafe&id=d0aae9dd3e">
|
||||
|
||||
<input type="email" value="" name="EMAIL" id="mce-EMAIL" required autocorrect="off" spellcheck="false"
|
||||
placeholder="Email address"
|
||||
class="font-light text-sm h-10 p-2 border border-gray-500 outline-none w-64 rounded my-4 inline-block">
|
||||
<input type="email" value="" name="EMAIL" id="mce-EMAIL" required autocorrect="off" spellcheck="false" placeholder="Email address" class="font-light text-sm h-10 p-2 border border-gray-500 outline-none w-64 rounded 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 text-lg"
|
||||
style="top: 1px;">
|
||||
<input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button">
|
||||
|
||||
<div class="mc-status" class="hidden"></div>
|
||||
<div style="position: absolute; left: -5000px;" aria-hidden="true">
|
||||
|
||||
@@ -1,6 +1,19 @@
|
||||
<div class="section">
|
||||
<div class="flex justify-center mb-2">
|
||||
<a href="/"><img alt="Userbase" id="logo" src="../img/logo.png"></a>
|
||||
<header class="sm:flex sm:justify-between sm:items-center p-4">
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="flex-shrink-0">
|
||||
<a href="/"><img alt="Userbase" class="h-8 sm:h-12" src="../img/logo.png"></a>
|
||||
</div>
|
||||
<h2>A backend for frontend developers</h2>
|
||||
</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-2 pb-4 hidden sm:flex sm:p-0 text-lg text-right menu">
|
||||
<a href="/mailing-list.html" class="block font-extrabold py-2 leading-none sm:px-4">Mailing list</a>
|
||||
<a href="mailto:daniel@encrypted.dev" class="block font-extrabold py-2 leading-none sm:px-4">Contact</a>
|
||||
</nav>
|
||||
</header>
|
||||
@@ -3,13 +3,13 @@
|
||||
@tailwind components;
|
||||
|
||||
body {
|
||||
@apply pb-10 text-center text-xl;
|
||||
@apply pb-10 text-center text-xl text-blackish;
|
||||
}
|
||||
|
||||
@screen sm {
|
||||
body {
|
||||
@apply text-2xl;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
@@ -25,45 +25,29 @@ p {
|
||||
}
|
||||
|
||||
h1 {
|
||||
@apply text-center font-black text-6xl leading-none tracking-tight;
|
||||
@apply text-center text-2xl font-black leading-tight tracking-tight;
|
||||
}
|
||||
|
||||
h2 {
|
||||
@apply text-center text-2xl leading-tight mt-1 tracking-tight;
|
||||
@apply text-center text-2xl font-black leading-tight tracking-tight mb-4;
|
||||
}
|
||||
|
||||
h3 {
|
||||
@apply text-center font-black text-3xl tracking-tight;
|
||||
}
|
||||
|
||||
h4 {
|
||||
@apply font-bold text-2xl tracking-tight;
|
||||
}
|
||||
|
||||
#logo {
|
||||
@apply w-64
|
||||
@apply font-bold text-xl tracking-tight;
|
||||
}
|
||||
|
||||
@screen sm {
|
||||
h1 {
|
||||
@apply text-6xl;
|
||||
}
|
||||
|
||||
h2 {
|
||||
@apply text-4xl;
|
||||
}
|
||||
|
||||
h3 {
|
||||
h2 {
|
||||
@apply text-5xl;
|
||||
}
|
||||
|
||||
h4 {
|
||||
h3 {
|
||||
@apply text-3xl;
|
||||
}
|
||||
|
||||
#logo {
|
||||
@apply w-96
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
@@ -86,4 +70,14 @@ ul {
|
||||
@apply text-red-600;
|
||||
}
|
||||
|
||||
.button {
|
||||
@apply rounded-lg w-40 h-10 bg-yellowish font-bold cursor-pointer text-gray-900 inline-block relative text-lg;
|
||||
top: 1px;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
@apply px-2 rounded-tl-lg rounded-bl-sm rounded-tr-lg rounded-br-lg;
|
||||
background-image: linear-gradient(119deg, rgb(255, 255, 255), rgb(255, 246, 151) 10.5%, #fdf59d 85.29%, #ffffff);
|
||||
}
|
||||
|
||||
@tailwind utilities;
|
||||
|
||||
@@ -8,8 +8,8 @@
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container mx-auto max-w-4xl px-4 text-blackish">
|
||||
<%= require('html-loader!./partials/' + header + '.html') %>
|
||||
<div class="container mx-auto max-w-4xl px-4">
|
||||
<%= require('html-loader!./pages/' + page + '.html') %>
|
||||
<%= require('html-loader!./partials/' + footer + '.html') %>
|
||||
</div>
|
||||
|
||||
@@ -5,7 +5,6 @@ const webpack = require('webpack')
|
||||
const TerserPlugin = require('terser-webpack-plugin')
|
||||
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')
|
||||
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
|
||||
const PurgecssPlugin = require('purgecss-webpack-plugin')
|
||||
const HtmlWebPackPlugin = require('html-webpack-plugin')
|
||||
const HtmlBeautifyPlugin = require('html-beautify-webpack-plugin')
|
||||
const FaviconsWebpackPlugin = require('favicons-webpack-plugin')
|
||||
@@ -23,10 +22,6 @@ module.exports = (env, argv) => {
|
||||
}))
|
||||
})
|
||||
|
||||
const paths = {
|
||||
src: path.join(__dirname, 'src')
|
||||
}
|
||||
|
||||
const config = {
|
||||
entry: {
|
||||
main: './src/index.js'
|
||||
@@ -75,9 +70,6 @@ module.exports = (env, argv) => {
|
||||
chunkFilename: 'style.css',
|
||||
ignoreOrder: false
|
||||
}),
|
||||
new PurgecssPlugin({
|
||||
paths: glob.sync(`${paths.src}/**/*`, { nodir: true }),
|
||||
}),
|
||||
...pages,
|
||||
new FaviconsWebpackPlugin('./src/img/icon.png'),
|
||||
new HtmlBeautifyPlugin({
|
||||
|
||||
Reference in New Issue
Block a user