diff --git a/www/.gitignore b/www/.gitignore new file mode 100644 index 00000000000..f59532259d2 --- /dev/null +++ b/www/.gitignore @@ -0,0 +1,35 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js +yarn.lock + +# testing +/coverage + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem + +# debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# local env files +.env.local +.env.development.local +.env.test.local +.env.production.local + +# vercel +.vercel \ No newline at end of file diff --git a/www/@types/environment.d.ts b/www/@types/environment.d.ts new file mode 100644 index 00000000000..1a22007f9fc --- /dev/null +++ b/www/@types/environment.d.ts @@ -0,0 +1,11 @@ +declare global { + namespace NodeJS { + interface ProcessEnv { + GA_PROPERTY_ID: string + } + } +} + +// If this file has no import/export statements (i.e. is a script) +// convert it into a module by adding an empty export statement. +export {} diff --git a/www/@types/remark-html.d.ts b/www/@types/remark-html.d.ts new file mode 100644 index 00000000000..e1b76b54f7e --- /dev/null +++ b/www/@types/remark-html.d.ts @@ -0,0 +1 @@ +declare module 'remark-html' diff --git a/www/@types/typings.d.ts b/www/@types/typings.d.ts new file mode 100644 index 00000000000..6568666452a --- /dev/null +++ b/www/@types/typings.d.ts @@ -0,0 +1,4 @@ +declare module '*.json' { + const value: any + export default value +} diff --git a/www/README.md b/www/README.md new file mode 100644 index 00000000000..010dd00a97e --- /dev/null +++ b/www/README.md @@ -0,0 +1,31 @@ +# Supabase Docs + +## Overview + +This is a single repository for two different websites. Our documents were created with docusaurus and are stored in the web folder. Our beta website can be found in the www folder. This is a standard Next.js website. + +Install the [Vercel CLI](https://vercel.com/cli). + +You will need to run the marketing website and docs website separately. To learn how to run both websites, see the [Development Guide](../DEVELOPERS.md) for more information. + +```sh +# step 1 +cd supabase + +# step 2 +cd www + +# step 3 +npm install +npm run dev + +# visit website +http://localhost:3000 +``` + +In production, this setup is deployed as two different vercel websites (`docs` and `www`) + +## Known issues + +- Referencing resources in nested folders may not work for `web` (eg `/web/static/folder/nestedfolder/asset`) may not work. +- Possibly need to prepend all images/assets in docs site with baseUrl. diff --git a/www/_blog/2020-05-01-supabase-alpha-april-2020.mdx b/www/_blog/2020-05-01-supabase-alpha-april-2020.mdx new file mode 100644 index 00000000000..1410cf9d5fa --- /dev/null +++ b/www/_blog/2020-05-01-supabase-alpha-april-2020.mdx @@ -0,0 +1,63 @@ +--- +title: Supabase Alpha April 2020 +description: Two months of building +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://avatars2.githubusercontent.com/u/10214025?s=400&u=c6775be2ae667e2acae3ccd347fed62bb3f5b3e7&v=4 +authorURL: https://github.com/kiwicopple +tags: + - supabase +date: '06-01-2020' +--- + +Now in [Supabase](https://app.supabase.io): + +- Set up Postgres in less than 2 minutes +- Auto-generated APIs! (they are a bit flaky, go easy) +- Query your database directly from the dashboard +- Analyze your queries and make them faster :rocket: + + + +## Important Notes + +1/ Supabase is NOT production ready. Have a play around and let us know what you think. We don't track ANYTHING (although we do store your github name and email). We'd like to keep it that way, so we rely on your direct feedback to steer our product roadmap. + +2/ We are free to use while we're in alpha thanks to the generosity of Digital Ocean's startup program. But the funds aren't unlimited - please shut down the database when you're done :pray:. + +3/ The database takes about 2 minutes to build. It's worth it, we promise. If you've ever wanted use Postgres, we're the easiest in the market. + +## Coming soon + +At Supabase, we're building some amazing tools that make Postgres as easy to use as Firebase. Some of the things we're working on: + +#### Simple interface + +Why are database interfaces so hard to use? The Supabase team has built products for 70-year-olds, so we're confident we can make something easier for developers: +![Supabase table view](https://dev-to-uploads.s3.amazonaws.com/i/b4o39am95zcl5vl54j75.png) + +#### Connectors + +Send realtime database changes to other systems, like queues or webhooks (Slack notifications!): +![Supabase connectors](https://dev-to-uploads.s3.amazonaws.com/i/aom5r917s792cc081bbz.png) + +#### And more + +- ⚡ Realtime listeners! Subscribe to your database just like you would with Firebase. +- 🤖 Instant RESTful APIs that update when you update your schema. Supabase introspects your schema and updates your API and documentation. +- 📓 Auto-documentation for your APIs and Postgres schema. What's better than documentation? Documentation that you don't have to manually keep up to date. + +## Follow us + +Start using Supabase today: [app.supabase.io](https://app.supabase.io) + +Make sure to star us on github! [github.com/supabase/supabase](https://github.com/supabase/supabase) diff --git a/www/_blog/2020-06-01-supabase-alpha-may-2020.mdx b/www/_blog/2020-06-01-supabase-alpha-may-2020.mdx new file mode 100644 index 00000000000..bb008b72215 --- /dev/null +++ b/www/_blog/2020-06-01-supabase-alpha-may-2020.mdx @@ -0,0 +1,62 @@ +--- +title: Supabase Alpha May 2020 +description: Three months of building +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://avatars2.githubusercontent.com/u/10214025?s=400&u=c6775be2ae667e2acae3ccd347fed62bb3f5b3e7&v=4 +authorURL: https://github.com/kiwicopple +tags: + - supabase +date: '06-01-2020' +--- + +It has been a monster month at [Supabase](/) and we're back with a video update. It's a longer video this month because we have a couple of housekeeping items. + + + + + +## Housekeeping + +We got into Y Combinator :tada:. The cohort has just started and it's fully remote so it will be a unique experience, even by normal YC standards. + +Normally we wouldn't mention this until our official YC launch in September but the cat's out of the bag since @vira28 [posted about us on Hacker News](https://news.ycombinator.com/item?id=23319901). + +We've seen a huge response from the tech community. We're still 'very alpha' so the attention may have been better in September but everyone has been patient with the bugs and instability. It just goes to show: ship early and often because nobody knows when you might get picked up. + +## Updates + +OK now for the important part - as promised, we will continue to release our updates here in the DEV community first. Skip to 1m18s in the video if you just want to see what we've been up to. + +### Fresh UI + +We've revamped the UI to fit in some more features that we're building. + +![Fresh UI](https://dev-to-uploads.s3.amazonaws.com/i/jzzm7u56ns6ega9uyc4j.png) + +### Table View + +This one is still very unstable, but we wanted to ship it anyway. It's a little hidden away so you'll have to hunt for it :). Give us a couple of months and we promise this will be as good as (better than?) Airtable. + +![Table view](https://dev-to-uploads.s3.amazonaws.com/i/jalcaoz4lsp2b6wegah5.png) + +#### And more + +- ⚡ Realtime listeners! Subscribe to your database just like you would with Firebase. +- 🤖 Instant RESTful APIs that update when you update your schema. Supabase introspects your schema and updates your API and documentation. +- 📓 Auto-documentation for your APIs and Postgres schema. What's better than documentation? Documentation that you don't have to manually keep up to date. + +## Follow us + +Start using Supabase today: [app.supabase.io](https://app.supabase.io) + +Make sure to star us on github! [github.com/supabase/supabase](https://github.com/supabase/supabase) diff --git a/www/_blog/2020-06-15-supabase-steve-chavez.mdx b/www/_blog/2020-06-15-supabase-steve-chavez.mdx new file mode 100644 index 00000000000..99188683c3f --- /dev/null +++ b/www/_blog/2020-06-15-supabase-steve-chavez.mdx @@ -0,0 +1,21 @@ +--- +title: Steve Chavez has joined Supabase +description: Steve joins Supabase to help build Auth. +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://avatars2.githubusercontent.com/u/10214025?s=400&u=c6775be2ae667e2acae3ccd347fed62bb3f5b3e7&v=4 +authorURL: https://github.com/kiwicopple +tags: + - supabase + - hiring +date: '06-15-2020' +--- + +This month we welcome [Steve Chavez](https://github.com/steve-chavez) to the team. Steve is a maintainer of PostgREST, one of the core tools which makes Supabase possible. + + + +Steve and I have been in contact since he [added one of my old blog posts](https://github.com/PostgREST/postgrest-docs/commit/3dde972d31519d3afc319015bce1dc0f73adeb8e#commitcomment-35312841) to the PostgREST docs. He has a rich history in open source and we're excited to have him in our team. + +Steve is helping us build one of our most demanded features - our Auth system. We will support him to build some exciting features which he has planned for PostgREST, including enhanced PostGIS support. diff --git a/www/_blog/2020-07-01-supabase-alpha-june-2020.mdx b/www/_blog/2020-07-01-supabase-alpha-june-2020.mdx new file mode 100644 index 00000000000..3020f6e07ef --- /dev/null +++ b/www/_blog/2020-07-01-supabase-alpha-june-2020.mdx @@ -0,0 +1,101 @@ +--- +title: Supabase Alpha June 2020 +description: Four months of building +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://avatars2.githubusercontent.com/u/10214025?s=400&u=c6775be2ae667e2acae3ccd347fed62bb3f5b3e7&v=4 +authorURL: https://github.com/kiwicopple +tags: + - supabase +date: '07-01-2020' +--- + +We're now 4 months into building [Supabase](/), which means another major update. Here's a few things we think you'll love in this release. + + + +### 4 minute demo + +Watch a full demo: + + + +### View relational data + +We're sometimes asked how we will make Postgres as simple as Firebase, since Postgres is a relational database. This month we're making our first steps to prove that relational databases can be even easier to use than document stores. We're releasing an excel-like editing interface which can drill down into your relational data. + + + +### Manage JSON data + +Postgres is an amazing database, giving the flexibility of a document store with the power of a RDBMS. If you use `JSON` data in Postgres, then we want to make that easy too. Supabase detects when your column is `JSON` or `JSONB`, and provides an easy way to edit and view your data. More improvements coming soon for this feature! + + + +### Choose your region + +If you noticed a bit of latency on Supabase, it's because your projects were previously set up in Singapore. It was always our intention that you'd be able to choose your database region, and this month we've delivered it. In the next releases we'll even allow you to go multi-region, instantly replicating your database close to your customers. + + + +### Backups + +A guiding principle at Supabase is zero lock-in. So this month we are exposing your daily database backups on the dashboard, giving you a simple way to migrate off Supabase. We have a lot more to build in this space (`WAL-G!`), so watch this space. + + + +### Kaizen + +We have a number of small improvements: + +- Improved SQL editor - with better syntax highlighting +- Improved API docs - with more code snippets +- UX improvements - with a simplified and consistent UX + +### Hiring + +- This month we [welcome Steve Chavez to the team](/blog/2020/06/15/supabase-steve-chavez). Steve is a maintainer of PostgREST, one of the core tools which makes Supabase possible. +- We're hiring a part-time designer or UX expert. See more [here](https://news.ycombinator.com/item?id=23708351). + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2020-07-09-postgresql-templates.mdx b/www/_blog/2020-07-09-postgresql-templates.mdx new file mode 100644 index 00000000000..5c9b89db869 --- /dev/null +++ b/www/_blog/2020-07-09-postgresql-templates.mdx @@ -0,0 +1,89 @@ +--- +title: What are PostgreSQL Templates? +description: What are PostgreSQL templates and what are they used for? +author: angelico_de_los_reyes +author_title: Supabase +author_url: https://github.com/dragarcia +author_image_url: https://avatars0.githubusercontent.com/u/26374889?s=400&u=f5e35e9b47a50fa2b4d8c4bb96babd921071bcf1&v=4 +authorURL: https://github.com/dragarcia +tags: + - postgres +date: '07-09-2020' +--- + +Whenever you create a new database in Postgres, you are actually [basing it off an already present database](https://www.postgresql.org/docs/current/manage-ag-templatedbs.html) in your cluster. + + + +This database, `template1`, and another, called `template0`, are standard system databases that exist in every newly created database cluster. Don't believe me? Why not quickly [spin up a database](/docs/postgres/server/about) and see it for yourself with this query: + +```sql +SELECT * FROM pg_database; +``` + +In this post, we'll explore these template databases and see how we can make full use of their potential. We'll even look into creating a template database of our own. + +## template1 + +By default, running: + +```sql +CREATE DATABASE new_db_name; +``` + +simply copies everything from the database `template1`. We can modify this template database in any way: add a table, insert some data, create new extensions, or install procedural languages. Any of these actions would be propagated to subsequently created databases. + +This, however, is **not** advisable. Removing any one of these modifications would need you to manually uninstall or drop these changes from `template1`. You do have the option to drop and recreate the entire `template1` database altogether. This unfortunately comes at the risk of committing a mistake along the way, effectively breaking `CREATE DATABASE`. It would be better to leave `template1` alone and create a template database of your own. + +## Custom Template Databases + +To set an existing database as a template database: + +```sql +ALTER DATABASE template_db_name WITH is_template TRUE; +``` + +Doing this allows any user or role with the `CREATEDB` privilege to utilize it as a template. If not, only superusers or owners of the database would be allowed to do so. + +To create a new database with this template: + +```sql +CREATE DATABASE new_db_name TEMPLATE template_db_name; +``` + +### Advantages + +- With this, you can now have customized templates without the need to worry about polluting `template1`. +- You can safely drop the entire custom template database without the risk of breaking `CREATE DATABASE`. +- If you wish, you can create multiple template databases for various use cases. + +### Limitations + +- To properly create a database from a custom template database, there should be no other connections present. `CREATE DATABASE` immediately fails if any connections exist at the start of the query. +- As such, if you are looking to replicate a database while maintaining your connections (eg. a production database), it would be more ideal to use the Postgres utility [pg_dump](https://www.postgresql.org/docs/12/app-pgdump.html). + +## template0 + +`template0` contains the same data as `template1`. We could think of this template database as a fallback if anything irreversible happens to `template1`. As such, this template database should never be modified in any way as soon as the database cluster has been initialized. To create a database with `template0` as the template database: + +```sql +CREATE DATABASE new_db_name TEMPLATE template0; +``` + +### Applications + +- If anything goes wrong with `template1`, It can be dropped and recreated with `template0` as the template database. +- We can also create a clean database that does not contain any modifications present in `template1`. This would be useful when restoring from pg_dump. Any conflicts brought about by modifications not present in the dump are eliminated. +- `template0` can be used to specify new encodings. As pointed out in this [article](https://hashrocket.com/blog/posts/exploring-the-default-postgres-template-databases#:~:text=we%20can't%20edit%20the%20locale%20or%20encoding%20of%20a%20database%20copied%20from%20template1), creating a new database with `template1` and new encodings would result in an error. + +```sql +-- Will succeed +CREATE DATABASE new_db_name TEMPLATE template0 ENCODING 'SQL_ASCII'; + +-- Will return an error +CREATE DATABASE new_db_name ENCODING 'SQL_ASCII'; +``` + +## Conclusion + +To quickly sum things up, we found out that new databases are, by default, created from a template database called `template1`. `template1` can be modified in any way we please and the changes would be present in any database created afterward. We can also create custom template databases and base new databases from them instead. If things go awry, `template0` is always there to help. diff --git a/www/_blog/2020-07-10-alpha-launch-postmortem.mdx b/www/_blog/2020-07-10-alpha-launch-postmortem.mdx new file mode 100644 index 00000000000..357b923b3a7 --- /dev/null +++ b/www/_blog/2020-07-10-alpha-launch-postmortem.mdx @@ -0,0 +1,104 @@ +--- +title: Alpha Launch Postmortem +description: Everything that went wrong with Supabase's launch +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://avatars2.githubusercontent.com/u/10214025?s=400&u=c6775be2ae667e2acae3ccd347fed62bb3f5b3e7&v=4 +authorURL: https://github.com/kiwicopple +tags: + - supabase +date: '07-10-2020' +--- + +On May 27 Supabase hit the [top of Hacker News](https://news.ycombinator.com/item?id=23319901) and stayed on the front page for more than 24 hours. + + + +Since then, Supabase has been featured on the [Stack Overflow podcast](https://stackoverflow.blog/2020/06/05/podcast-241-new-tools-for-new-times/), hit the [trending page](https://twitter.com/supabase/status/1268062559023685633) on GitHub, and scaled to over 1000 databases. + +Here is everything that went wrong along the way. + +## Quick stats - launch week + +Before we get into the details, here are some high-level numbers for the week following the launch. + +We had 30,000 new website visitors to [supabase.io](/): + +![This graph shows the traffic to our website, that peaks at 15,000 the first day and tails off throughout the week. We had a total of 30,000 visitors to our site. That's according to Google Analytics though, and everyone on HN blocks GA so who knows what the real number is.](/images/blog/supabase-traffic-may.png) + +
+ +We had over 1400 signups in 7 days: +![This graph shows our signups. Before the launch we had around 100 signups. After the launch it sky-rocketed to 600 in the first day, 900 by the second, and 1000 by the third day. By the end of the week we had over 1400 signups.](/images/blog/hn-launch.png) + +GitHub stars rocketed for our two main repos, [supabase](https://github.com/supabase/supabase) and [realtime](https://github.com/supabase/realtime). +![This graph shows our github stars. It's basically a vertical line. Our main repo went from 300 stars to 1300 overnight.](/images/blog/supabase-github-stars-june.png) + +## The good + +Here are the things that survived well. + +### Middleware: docker-compose up + +This was the most surprising survivor. Our middleware was served from a single Ubuntu server with 4 CPUs and 8GB of RAM. This server was running our middleware using `docker-compose up`: + +![This image shows in middleware architecture. We used docker-compose to pull up 5 open source tools: Kong, Realtime, PostgREST, PG-API, and PG-BOSS.](/images/blog/supabase-middleware-docker.png) + +In case you're wondering why any sane company would use that in production, it's because we weren't planning to launch - the HackerNews post was created by an early GitHub follower, while we were alpha testing, and it was too scary to migrate the middleware while it was servicing the thundering herd. All Supabase projects use the same middleware stack (sans docker-compose), so I guess this counts as as a successful load test. + +We have since migrated our middleware to multiple ECS clusters, globally load-balanced using AWS's [Global Accelerator](https://aws.amazon.com/global-accelerator/). + +### Frontend: Netlify, Vercel, Auth0 + +We serve our marketing site ([supabase.io](/)) from Netlify. It's a static-build [Docusaurus (v2)](https://v2.docusaurus.io/) site, so it had no problems (apart from one developer in Russia who couldn't access the site - it looks like some of Netlify's IP addresses are blocked there). + +We serve our app ([app.supabase.io](http://app.supabase.io)) using Vercel, and the login system uses Auth0. These were both rock-solid. Before the launch we noticed that Vercel was extremely slow on their free plan, and once we upgraded to their Pro Plan for multi-region deploys it solved performance issues. It looks like they are changing their plans again so buyer beware. + +## The Bad + +### Digital Ocean cloud limits + +In May we were using Digital Ocean to serve all of our customer databases. We hit the first server limit (400 servers) in the space of a few hours. They bumped our limit up to 1000 and we hit that again a few hours later. + +Digital Ocean were very responsive when we asked for increases, each time responding in 30 minutes or less. + +### Cloudflare cloud limits + +Each Supabase project gets a unique URL for their API and database. This is set up using Cloudflare's API. This was a seamless process until we hit the 1000-subdomain limit, at 4am in the morning. My cofounder was awake, managed to identify the problem early, and reached out to the support to increase the limit. + +Cloudflare support advised him to upgrade the account to increase the limit, but the upgrade could only be done by the owner (me). Unfortunately my phone was on silent, so for 3 hours our systems were down. Ideally any one of our team could have upgraded our account, but I imagine that Cloudflare have their reasons for this restriction. + +## The Ugly - migrating 1800 servers + +Let me start by saying that Digital Ocean have been great for getting up and running. The experience was simple to start with, but ended painfully. + +### Digital Ocean production errors + +The first sign of problems were the frequent production errors. This is a screenshot of emails from Digital ocean for the month of June. + +![This image shows all the emails I was receiving from Digital Ocean. I was receiving an email every other day about servers which needed to be migrated.](/images/blog/digital-ocean-emails-errors.png) + +Each of these emails represents one or more servers that has a critical issue: + +> We have identified an issue on the physical machine hosting one or more of your Droplets. In the event that we are not able to perform a live migration of a Droplet, we will perform an offline migration during which the Droplet will be powered off and migrated offline during the window. + +Luckily we are in alpha, and our community has been extremely patient. + +### Credit limits + +Most of our frustration was due to their internal policy around credits program. We were generously granted $10,000 Digital Ocean credits in February through Stripe Atlas, and so they became our primary cloud provider. + +Digital Ocean have another (more generous) credits package for YC companies. Unfortunately when we applied for this we were told we weren't eligible because it was a "Partner switch" from Stripe to YC. This was frustrating because a "Partner switch" is completely arbitrary to us as a customer. + +Also we had conveniently just run out of credits. We don’t expect cloud providers to fund our inefficiencies, but we needed time to optimize our infrastructure after our surprise launch. We had assumed that the more generous credits package was guaranteed - an assumption which cost us several thousand dollars. After swift deliberation, we decided to migrate away from Digital Ocean. + +## Going Forward: AWS t3a + +In the past 3 weeks we have migrated 1800 servers over to AWS. + +We are on the AWS "Activate" program, which grants us $100,000 credits. Since Firebase has a very generous free-tier, and we want to be able to offer Supabase developers a similar experience, this is ultimately a huge benefit to our community. + +The AWS team were helpful, suggesting their new `t3a` instances. We're already seeing improvements, with database startup times almost halved from ~90s to ~50s. From our research, this is the fastest Postgres setup in the market. + +We will release a detailed write-up on these instances in the next few weeks. Sign up to our newsletter if you want to be notified when we release the post. diff --git a/www/_blog/2020-07-17-postgresql-physical-logical-backups.mdx b/www/_blog/2020-07-17-postgresql-physical-logical-backups.mdx new file mode 100644 index 00000000000..fd1e42c2191 --- /dev/null +++ b/www/_blog/2020-07-17-postgresql-physical-logical-backups.mdx @@ -0,0 +1,76 @@ +--- +title: Physical vs Logical Backups in PostgreSQL +description: What are physical and logical backups in Postgres? +author: angelico_de_los_reyes +author_title: Supabase +author_url: https://github.com/dragarcia +author_image_url: https://avatars0.githubusercontent.com/u/26374889?s=400&u=f5e35e9b47a50fa2b4d8c4bb96babd921071bcf1&v=4 +authorURL: https://github.com/dragarcia +tags: + - postgres +date: '07-07-2020' +--- + +PostgreSQL backups can be categorized into two types: _logical_ and _physical_. This post briefly covers each type and discusses the situations where you would use either one. + +We'll cover some of the many tools you can use for Postgres backups in future posts. + + + +## Logical Backups + +This form of backup is typically achieved by [translating all the data into a set of SQL commands and writing it into a single file](https://www.postgresql.org/docs/current/backup-dump.html). This can then be fed to any database cluster to recreate everything. In your CLI, performing logical backups can be as easy as: + +```shell +pg_dump db_name > file_name.sql +``` + +for a single database, and: + +```shell +pg_dumpall > file_name.sql +``` + +for an entire database cluster. Both the [pg_dump](https://www.postgresql.org/docs/current/app-pgdump.html) and [pg_dumpall](https://www.postgresql.org/docs/current/app-pg-dumpall.html) utilities have their respective additional options for you to choose from and set up your desired logical backup setting. Recovering from them is comparably as simple: + +```shell +psql -d db_name -f file_name.sql +``` + +### What is it good for? + +#### Simpler and quicker way of performing backups + +As shown above, a single command is enough to perform a logical backup and another to recover from it. As a novice with databases, this would be an ideal and non-intimidating ensure that your database is backed up at all times. + +#### Migration between different major versions of Postgres + +If you are planning to migrate to a different major version of Postgres (for example, from Postgres 11 to Postgres 12), logical backups via `pg_dumpall` would surely be your [tool of choice](https://www.postgresql.org/docs/current/upgrading.html). This is mainly because internal data storage formats may differ between major versions. This is the basis of physical backups, eliminating it as an option when upgrading. We'll go deeper into migrations and how to perform them in another post. + +#### Backing up a single specific database + +With `pg_dump`, you can constantly back up a single, targeted database. + +## Physical Backups + +Physical backups pertain to the actual set of files or file systems where your database data is stored. One option for physical backups involves [taking a snapshot](https://www.postgresql.org/docs/current/backup-file.html) of your data files by making a copy of them. + +### What is it good for? + +#### More ideal for larger databases + +As your database grows to the size of a few gigabytes, backing it up through physical backups is more ideal than through logical backups. As explained [here](https://devcenter.heroku.com/articles/heroku-postgres-data-safety-and-continuous-protection#the-performance-impact-of-logical-backups), over time, performing logical backups in large databases could lead to degraded performance for other queries. Given the long run time as well to successfully perform a logical backup on a large database, errors have a higher chance of occurring, making the eventual backup unusable. + +#### Achieving Point in Time Recovery + +Postgres also generates [Write Ahead Log](https://www.postgresql.org/docs/current/wal-intro.html) (WAL) files, which can be used together with a backed-up file system to [recover a database up to any chosen point in time](https://www.postgresql.org/docs/current/continuous-archiving.html). When disaster strikes, this is one of the best options for recreating your database up to the point right before the unfortunate happens. This greatly minimizes [Recovery Point Objective (RPO)](https://www.ibm.com/services/business-continuity/rpo) along the way. Even better, tools such as [WAL-G](https://github.com/wal-g/wal-g) are readily available to simplify the steps involved in setting this up. + +## Conclusion + +All in all, logical and physical backups are generated differently from one another. Neither has an advantage over the other. Depending on your needs, each brings unique uses to the table: + +| Logical | Physical | +| :---------------------------------------------------------------- | :----------------------------------------------------------- | +| Simpler way of getting started with backups. | Better way of handling backups for larger database clusters. | +| Using it to migrate between different major versions of Postgres. | Using it for Point in Time Recovery. | +| Having the option to back up a single database. | | diff --git a/www/_blog/2020-08-02-continuous-postgresql-backup-walg.mdx b/www/_blog/2020-08-02-continuous-postgresql-backup-walg.mdx new file mode 100644 index 00000000000..78be2e20eaa --- /dev/null +++ b/www/_blog/2020-08-02-continuous-postgresql-backup-walg.mdx @@ -0,0 +1,187 @@ +--- +title: Continuous PostgreSQL Backups using WAL-G +description: Have you ever wanted to restore your database's state to a particular moment in time? This post explains how, using WAL-G. +author: angelico_de_los_reyes +author_title: Supabase +author_url: https://github.com/dragarcia +author_image_url: https://avatars0.githubusercontent.com/u/26374889?s=400&u=f5e35e9b47a50fa2b4d8c4bb96babd921071bcf1&v=4 +authorURL: https://github.com/dragarcia +tags: + - postgres +date: '08-02-2020' +--- + +Have you ever wanted to restore your database's state to a particular moment in time? This post explains how, using WAL-G. + + + +## Introduction + +[WAL-G](https://github.com/wal-g/wal-g) is an [open-source continuous archiving tool](https://www.citusdata.com/blog/2017/08/18/introducing-wal-g-faster-restores-for-postgres/) used to easily set up and recover from [physical backups](/blog/2020/07/17/postgresql-physical-logical-backups) in Postgres. It mainly handles the storage and retrieval of physical backups and WAL archives to and from a chosen cloud storage provider. In this post, we will walk you through on how to effortlessly set up WAL-G for your database as well as guide you on what to do if and when disaster strikes. + +## Prerequisites + +For this tutorial, we will be using two instances running Postgres databases on [Ubuntu 18.04](https://releases.ubuntu.com/18.04/). One instance will act as your main database, the other is your recovery database. If you’re using another operating system some file paths may vary. + +### Installations + +Make sure the below packages are installed in your instances. Alternatively, you can spin up the [latest version](https://github.com/supabase/postgres/releases/tag/v0.13.0) of [Supabase Postgres](https://github.com/supabase/postgres) which would already have everything configured and installed, along with other [goodies](https://github.com/supabase/postgres#features). It is readily available in either the [AWS](https://aws.amazon.com/marketplace/pp/B08915TCJ2?qid=1595854723755&sr=0-1&ref_=srh_res_product_title) or [Digital Ocean](https://marketplace.digitalocean.com/apps/supabase-postgres) marketplaces and only takes [a few minutes](/docs/postgres/postgres-intro) to get running. + +#### Postgres 12 + +A quick installation guide can be found [here](https://www.postgresql.org/download/linux/ubuntu/). + +#### envdir + +[envdir](http://manpages.ubuntu.com/manpages/bionic/man8/envdir.8.html) allows us to run other programs with a modified environment based on the files in the provided directory. This can be installed through the [daemontools](https://cr.yp.to/daemontools.html) package: + +```shell +$ sudo apt-get install -y daemontools +``` + +#### WAL-G + +```shell +$ wget https://github.com/wal-g/wal-g/releases/download/v0.2.15/wal-g.linux-amd64.tar.gz +$ tar -zxvf wal-g.linux-amd64.tar.gz +$ mv wal-g /usr/local/bin/ +``` + +### AWS credentials and resources + +When storing backups, WAL-G has numerous [cloud storage provider options](https://github.com/wal-g/wal-g#configuration) for us to choose from. For this tutorial, we will be using AWS. Have the following prepared: + +- AWS Access & Secret keys. +- An S3 bucket. + +## Setting it up + +### 1. Configure environment variables + +The directory `/etc/wal-g.d/env` is created and contains files that stores environment variables. It would later be used in WAL-G commands via envdir. + +```shell +$ umask u=rwx,g=rx,o= +$ mkdir -p /etc/wal-g.d/env +$ echo 'secret-key-content' > /etc/wal-g.d/env/AWS_SECRET_ACCESS_KEY +$ echo 'access-key' > /etc/wal-g.d/env/AWS_ACCESS_KEY_ID +$ echo 's3://backup-bucket/project-directory' > /etc/wal-g.d/env/WALG_S3_PREFIX +$ echo 'db password' > /etc/wal-g.d/env/PGPASSWORD +$ chown -R root:postgres /etc/wal-g.d +``` + +### 2. Enable WAL archiving + +Here, we enable [WAL archiving](https://www.postgresql.org/docs/12/continuous-archiving.html) and instruct Postgres to store the archives in the specified S3 bucket via WAL-G. + +```shell +$ echo "archive_mode = yes" >> /etc/postgresql/12/main/postgresql.conf +$ echo "archive_command = 'envdir /etc/wal-g.d/env /usr/local/bin/wal-g wal-push %p'" >> /etc/postgresql/12/main/postgresql.conf +$ echo "archive_timeout = 60" >> /etc/postgresql/12/main/postgresql.conf +``` + +### 3. Restart the database + +The database is restarted to let the changes in the configuration to take effect. + +```shell +$ sudo /etc/init.d/postgresql restart +``` + +### 4. Create your first physical backup + +```shell +$ sudo -su postgres envdir /etc/wal-g.d/env /usr/local/bin/wal-g backup-push /var/lib/postgresql/12/main +``` + +At this point, if you were to check the S3 path that you provided, the following two newly created and populated directories would be observed: + +![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/lai1mxg62kffyd2khmtm.png) + +From then on, subsequent physical backups would be found in the directory `basebackups_005` and any WAL archives would be sent to the directory `wal_005`. + +### 5. [Optional] Schedule regular physical backups + +A CRON job can then be set to schedule physical backups to be performed everyday: + +```shell +$ echo "0 0 * * * postgres /usr/bin/envdir /etc/wal-g.d/env /usr/local/bin/wal-g backup-push /var/lib/postgresql/12/main" > /etc/cron.d/pg_backup +``` + +Here, the instance has been instructed to back up the database at the start of each day at midnight. By physically backing up your instance regularly, overall recovery time could be faster. Restoring from a physical backup from yesterday would lead to fewer WAL archive files to be replayed as compared to restoring from one from a month ago. + +--- + +## Disaster strikes + +Something goes wrong with the database or instance. We will now use what available physical backups we have in the S3 bucket to recover and restore all of our data on to a new instance. + +### 1. Configure environment variables + +The configuration should be the **same** as the original instance. For recovery and restoration, we would not need the variable `PGPASSWORD`. + +```shell +$ umask u=rwx,g=rx,o= +$ mkdir -p /etc/wal-g.d/env +$ echo 'secret-key-content' > /etc/wal-g.d/env/AWS_SECRET_ACCESS_KEY +$ echo 'access-key' > /etc/wal-g.d/env/AWS_ACCESS_KEY_ID +$ echo 's3://backup-bucket/project-directory' > /etc/wal-g.d/env/WALG_S3_PREFIX +$ chown -R root:postgres /etc/wal-g.d +``` + +### 2. Stop the database + +```shell +$ sudo /etc/init.d/postgresql stop +``` + +### 3. Switch to the user `postgres` + +```shell +$ sudo -su postgres +``` + +### 4. Prepare the database for recovery + +#### Set restore_command + +Through [restore_command](https://www.postgresql.org/docs/12/continuous-archiving.html#:~:text=must%20specify%20is%20the%20restore_command,%20which%20tells%20PostgreSQL%20how%20to%20retrieve%20archived%20WAL%20file%20segments), we instruct Postgres to pull all WAL archives from our S3 bucket to use during recovery. + +```shell +$ echo "restore_command = '/usr/bin/envdir /etc/wal-g.d/env /usr/local/bin/wal-g wal-fetch \"%f\" \"%p\" >> /tmp/wal.log 2>&1'" >> /etc/postgresql/12/main/postgresql.conf +``` + +#### [Optional] Achieve Point in Time Recovery (PITR) + +If we want to restore the database only up to a certain point in time (eg. right before the disaster), we can do so by setting both [recovery_target_time]() and [recovery_target_action](). Do note that the timezone would need to match that of the original instance. This is usually at the UTC (+00) timezone. + +```shell +$ echo "recovery_target_time = '2020-07-27 01:23:00.000000+00'" >> /etc/postgresql/12/main/postgresql.conf +$ echo "recovery_target_action = 'promote'" >> /etc/postgresql/12/main/postgresql.conf +``` + +### 5. Restore from physical backup + +The current data directory is deleted and is replaced with the latest version of the physical backup from the S3 bucket. + +```shell +$ rm -rf /var/lib/postgresql/12/main +$ envdir /etc/wal-g.d/env /usr/local/bin/wal-g backup-fetch /var/lib/postgresql/12/main LATEST +``` + +### 6. Create a `recovery.signal` file + +This file [instructs]() Postgres that the database should undergo recovery mode upon start. + +```shell +$ touch /var/lib/postgresql/12/main/recovery.signal +``` + +### 7. Log out of `postgres` and start the database + +```shell +$ exit +$ sudo /etc/init.d/postgresql start +``` + +Once Postgres finishes starting up and completes recovery mode, all data or data up to the specified point in time would have been successfully restored on to the new instance. Disaster averted. diff --git a/www/_blog/2020-08-02-supabase-alpha-july-2020.mdx b/www/_blog/2020-08-02-supabase-alpha-july-2020.mdx new file mode 100644 index 00000000000..7bf68e11254 --- /dev/null +++ b/www/_blog/2020-08-02-supabase-alpha-july-2020.mdx @@ -0,0 +1,81 @@ +--- +title: Supabase Alpha July 2020 +description: Five months of building +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://avatars2.githubusercontent.com/u/10214025?s=400&u=c6775be2ae667e2acae3ccd347fed62bb3f5b3e7&v=4 +authorURL: https://github.com/kiwicopple +tags: + - supabase +date: '08-02-2020' +--- + +After 5 months of building, we're releasing one of our most anticipated features: Supabase Auth. + + + +### Quick Demo + +Watch a full demo: + + + +### Auth + +This month, we're ecstatic to announce a feature we think you'll love: Supabase Auth. It's too big to fit into a monthly update so look out for a full update in the next few days. + +We want to make it easy to get started adding Auth to your app, so we've released a [simple example and a video tutorial](https://dev.to/supabase/create-a-slack-clone-with-next-js-and-supabase-3lhd) which shows you how to implement a basic auth system using PostgreSQL's Row Level Security. + +### Table Editor + +We've made some massive improvements to our Table Editor that we're excited to share. + +#### Relationship drill down + +Last month we made it easy to drill into your table relationships. This month, we make it possible to drill multiple levels deep. + + + +#### Add, delete, and download rows + +We're making it easier to manipulate your data. Next month, you'll be able to add and remove columns directly from the Table view. + + + +### New Postgres Extensions + +If you launch a new Supabase project, you'll have access to several new Postgres extensions: + +- [pgsql-http](https://github.com/pramsey/pgsql-http): HTTP client for PostgreSQL, retrieve a web page from inside the database. +- [pgjwt](https://github.com/michelp/pgjwt): PostgreSQL implementation of JSON Web Tokens +- [plpgsql_check](https://github.com/okbob/plpgsql_check): a linter tool for language PL/pgSQL +- [pljava](https://github.com/tada/pljava): write Java in your stored procedures, triggers, and functions + +### Kaizen + +We have a number of small improvements: + +- Added Auth documentation to the auto-generated docs in each project +- Added a new `or` filter [to the client library](/docs/library/get#or) +- Table View now remembers which tabs you had open. +- We have [released](https://github.com/supabase/postgres-meta/releases) a lot of new functionality to [postgres-meta](https://github.com/supabase/postgres-meta), a server for for managing Postgres internals via a REST interface. +- Performance: the "flash of black" which was appearing on page transition is now gone + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2020-08-05-supabase-auth.mdx b/www/_blog/2020-08-05-supabase-auth.mdx new file mode 100644 index 00000000000..c38e1cab120 --- /dev/null +++ b/www/_blog/2020-08-05-supabase-auth.mdx @@ -0,0 +1,93 @@ +--- +title: Supabase Auth +description: Authenticate and authorize your users with Supabase Auth +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://avatars2.githubusercontent.com/u/10214025?s=400&u=c6775be2ae667e2acae3ccd347fed62bb3f5b3e7&v=4 +authorURL: https://github.com/kiwicopple +image: /docs/img/supabase-auth-cover.png +tags: + - supabase +date: '08-05-2020' +--- + +Supabase is an open source Firebase alternative. We are building the features of Firebase using scalable, open source products. + +Two months ago a developer discovered Supabase and (unexpectedly) [launched us on Hacker News](https://news.ycombinator.com/item?id=23319901). Although we had completed only 3 months of development the community support was both incredible and humbling. + + + +![This image shows all of the top dev tool launches on Hacker news. The most popular is Stripe, with 1249 upvotes, the next popular is Supabase with 1120 upvotes, and third is Fly.io with 626 upvotes.](/images/blog/supabase-hn-launch.png) + +Developers were obviously excited about the prospect of an open source Firebase alternative, but the comments were dominated by one emphatic feature request: Auth. + +> " _Just FYI, making a good auth solution in Supabase will instantly make me a customer._ "
@pdimitar + +> " _For me the MVP, before I could use it for my commercial projects, would be: DB+auth. At that point, I could switch - and probably would._ "
@julianeon + +> " _This looks great, however at first peek it doesn't mention anything about auth. Do you have any plans for that? For me this is the topic I most want to just delegate to the service._ "
@2mol + +So we got to work, and today we're ecstatic to launch Supabase Auth. Let's dig into some of the features of the Auth system. + +## Supabase Auth + +Supabase Auth provides all the backend services you need to authenticate and authorize your users. + +### User management + +Supabase makes it simple to onboard your users with our new `supabase.auth.signUp()` and `supabase.auth.signIn()` [functions](/docs/guides/auth). + + + +### Row Level Security + +Authentication only gets you so far. When you need granular authorization rules, nothing beats PostgreSQL's [Row Level Security](https://www.postgresql.org/docs/current/ddl-rowsecurity.html). Supabase makes it simple to turn RLS on and off. + + + +### Policies + +[Policies](https://www.postgresql.org/docs/current/sql-createpolicy.html) are PostgreSQL's rule engine. They are incredibly powerful and flexible, allowing you to write complex SQL rules which fit your unique business needs. + + + +With policies, your database becomes the rules engine. Instead of repetitively filtering your queries, like this ... + +```js +const loggedInUserId = 'd0714948' +let user = await supabase.from('users').select('user_id, name').eq('user_id', loggedInUserId)\n +// Returns { id: 'd0714948', name: 'Jane' +``` + +... you can simply define a rule on your database table, `auth.uid() = user_id`, and your request will return the rows which pass the rule, even when you remove the filter from your middleware: + +```js +let user = await supabase.from('users').select('user_id, name')\n +// Still returns { id: 'd0714948', name: 'Jane' } +``` + +### Open source + +Building an open source Firebase alternative is difficult task, made possible by an amazing suite of OSS tools that have forged the way for Supabase. We spent many weeks building Auth POC's with existing OSS tools. Notable mentions go to RedHat's [KeyCloak](https://www.keycloak.org/), and Ory's [Kratos](https://github.com/ory/kratos). + +Ultimately we landed on a system which utilises three amazing open source products: + +- Authorization: [PostgreSQL](https://www.postgresql.org/) and [PostgREST](http://postgrest.org/en/v7.0.0/auth.html). +- Authentication: Netlify's [GoTrue](https://github.com/netlify/gotrue) server, which we forked and will continue to contribute to. + +### Next steps + +Supabase has a culture of shipping early and often. Our Auth release is another example of this, and we still have a lot of work to do. Next month we have more Auth features planned, including custom email templates and 3rd-party OAuth providers. We also plan to simplify the Policy interface, enabling non-technical users to get started with one of PostgreSQL's best features. + +### Get started + +Supabase Auth is ready for you to start using today, free of charge: [app.supabase.io](https://app.supabase.io) + +To see the full power of our auth system, watch [this demo](https://youtu.be/2oqIZW5S-lQ) where I deploy a secure, real-time slack clone to Vercel in less than 3 minutes. diff --git a/www/_blog/2020-09-03-supabase-alpha-august-2020.mdx b/www/_blog/2020-09-03-supabase-alpha-august-2020.mdx new file mode 100644 index 00000000000..ae862f956fb --- /dev/null +++ b/www/_blog/2020-09-03-supabase-alpha-august-2020.mdx @@ -0,0 +1,90 @@ +--- +title: Supabase Alpha August 2020 +description: Six months of building +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://avatars2.githubusercontent.com/u/10214025?s=400&u=c6775be2ae667e2acae3ccd347fed62bb3f5b3e7&v=4 +authorURL: https://github.com/kiwicopple +tags: + - supabase +date: '09-03-2020' +--- + +We're 6 months into building our hosted database platform and we've made some major improvements to our auth system and table view. + + + +### Quick Demo + +Watch a full demo: + + + +### Easily create tables + +Set up tables and columns directly from the table view. + + + +### Invite your team + +You can now invite team members to your organisation. + + + +### Auth: Email Confirmations + +You can now enable Email Confirmations for new users. This can be toggled on or off and the template for this email can be edited via the dashboard. + + + +### TypeScript support + +The biggest communty contribution to date, [@thorwebdev](https://twitter.com/thorwebdev) added TypeScript support to Supabase. He even [live streamed the process](https://twitter.com/thorwebdev/status/1292722189788016641). + +![This git shows how TypeScript makes it even easier to use Supabase, through VSCode's intellisense.](/images/blog/typescript-support.gif) + +### Kaizen + +We have a number of small improvements: + +- supabase-js now has [UMD support](https://github.com/supabase/supabase/pull/156) +- We significantly [improved our docs](/docs). Try out the new search! +- All of our awesome sponsors are now listed [on our OSS page](/docs/oss). + +### From the community + +The release of Auth last month accelerated our community growth, based on [Orbit Levels.](https://github.com/orbit-love/orbit-model) + +![This image shows our community growth. In August we had about 250 active members across GitHub and Twitter.](/images/blog/community-august.png) + +- We received our first enterprise sponsor. Thanks to [@briannekimmel](https://twitter.com/briannekimmel) from [@WorkLifeVC](https://twitter.com/WorkLifeVC) for becoming an [Enterprise Sponsor](https://github.com/sponsors/supabase). +- [@amorriscode](https://github.com/amorriscode) added Redwood support! [[Pull Request](https://github.com/redwoodjs/redwood/pull/1033)] +- [@swyx](https://twitter.com/swyx) trying out Supabase with Color Search Engine with Supabase [[Live Stream](https://twitter.com/swyx/status/1300538001508896768)] +- Python Support: [@lqmanh](https://github.com/lqmanh) has agreed to lead the python support. He's already deployed [postgrest-py](https://github.com/supabase/postgrest-py) which is the first step towards a functioning supabase-py client lib. +- [@phamhieu](https://github.com/phamhieu) built a [Live Map Tracker](https://github.com/phamhieu/supabase-realtime-map-v2) App using Supabase + Leafletjs + +### Coming next + +Our focus now is to move from Alpha to Beta. This involves stabilising our Auth API, improving dashboard performance, and benchmarking all of our systems. This could take more than one month, as we have a number of company-related activities to wrap up ([we just finished YC](https://techcrunch.com/2020/08/25/here-are-the-94-companies-from-y-combinators-summer-2020-demo-day-2/)!). + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2020-09-11-supabase-hacktoberfest-2020.mdx b/www/_blog/2020-09-11-supabase-hacktoberfest-2020.mdx new file mode 100644 index 00000000000..134608f899f --- /dev/null +++ b/www/_blog/2020-09-11-supabase-hacktoberfest-2020.mdx @@ -0,0 +1,74 @@ +--- +title: Supabase Hacktoberfest 2020 +description: Join us for a celebration of open source software and learn how to contribute to Supabase. +author: thor_schaeff +author_title: Supabase community contributor +author_url: https://github.com/thorwebdev +author_image_url: https://github.com/thorwebdev.png +image: hacktoberfest.png +tags: + - supabase + - hacktoberfest +date: '09-11-2020' +--- + +October is looming, and for open source communities and contributors this means one thing: [Hacktoberfest](https://hacktoberfest.digitalocean.com/). + + + +## What is Hacktoberfest? + +Hacktoberfest is a time to contribute to open source, improve your skills, and build greater technology in the process. Last year during Hacktoberfest 483,127 pull requests were opened and 61,871 people completed the challenge. + +To do our part, Supabase has planned a couple of events and activities throughout Hacktober, and we'd love for you to join us! + +## How do I get started? + +It's simple, just start contributing to **any** open source project. If you've never contributed to open source, don't worry! Here are some resources to get you started: + +- [How to write your first pull request](https://pages.news.digitalocean.com/n/Y0VKC0qX000hY0236IE0qDn) +- [How to create a good commit message](https://pages.news.digitalocean.com/n/wIYDXKVE600000nr20h3r0C) +- [Beginner resources for first-timers](https://pages.news.digitalocean.com/n/kE2b60X00B003IVhYn0cK0D) +- [Hacktoberfest’s quality standards](https://hacktoberfest.digitalocean.com/details/#quality) + +## Supabase events + +Tune in to our online events. + +### GitHub Open Source Friday live stream + +- What: [@kiwicopple](https://github.com/kiwicopple) chats with the GitHub team about open source. +- When: Fri, Sep 25, 11:00 AM (Thu, Sep 24, 8:00 PM PT) +- Where: [GitHub Twitch channel](https://www.twitch.tv/github) + +### Supabase Hacktoberfest Online Meetup + +- What: Join us to learn more about Supabase and how to contribute during Hacktoberfest. +- When: Fri, Oct 2, 9:00 AM SG time (Thu, Oct 1, 6:00 PM PT) +- Where: [YouTube](https://youtu.be/3_xRLTjvEiE) | [Please RSVP here](https://organize.mlh.io/participants/events/4291-hacktoberfest-supabase-meetup) + +## Contribute to Supabase and win a Hacktoberfest T-Shirt + +We've created a [GitHub project board](https://github.com/orgs/supabase/projects/5) to keep track of what's happening and can enjoy collaborating and hacking together 🥳 + +You can contribute to one of the existing `hacktoberfest` issue, or you can grab one of the ideas from the notes in the project board and [open a new issue](https://github.com/supabase/supabase/issues/choose) for it. Make sure to tag the newly created issue with the `hacktoberfest` label. This will be important for you to have a chance at getting the limited edition Hacktoberfest T-Shirt. See the [participation rules](https://hacktoberfest.digitalocean.com/details/#rules) for more details. + +### I'm a Developer + +Awesome, we've got a selection of small and larger [engineering tasks](https://github.com/orgs/supabase/projects/5#column-10773067). From creating examples for Blitz.js and Redwood.js to Postgres templates for various use cases. + +### I'm a Designer + +Nice, we would love [your help](https://github.com/orgs/supabase/projects/5#column-10773073) with UX improvements, illustrations, loading pages, or [lottie animations](https://lottiefiles.com/). + +### I'm a Writer + +Yay, we'd love your help with [improving and adding docs](https://github.com/orgs/supabase/projects/5#column-10773075)! + +## Happy hacking + +We'd love to see you at one of our events and have you contribute to Supabase throughout Hacktoberfest! See you on the interweb 🙂 + +## Questions / ideas / feedback? + +We'd love to hear it, just [tweet at us](https://twitter.com/supabase), or [open an issue](https://github.com/supabase/supabase/issues/choose). diff --git a/www/_blog/2020-10-03-supabase-alpha-september-2020.mdx b/www/_blog/2020-10-03-supabase-alpha-september-2020.mdx new file mode 100644 index 00000000000..c55f044613e --- /dev/null +++ b/www/_blog/2020-10-03-supabase-alpha-september-2020.mdx @@ -0,0 +1,98 @@ +--- +title: Supabase Alpha September 2020 +description: Seven months of building. +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://avatars2.githubusercontent.com/u/10214025?s=400&u=c6775be2ae667e2acae3ccd347fed62bb3f5b3e7&v=4 +authorURL: https://github.com/kiwicopple +image: supabase-september-2020.png +tags: + - supabase +date: '10-03-2020' +--- + +We're now 7 months into building Supabase. This update is a big one! + + + +### Quick demo + +Watch a full demo: + + + +### Third-party logins + +We've released OAuth logins! You can now enable third-party logins on your app for Bitbucket, GitHub, GitLab, or Google. + +![This is a picture of the supabase dashboard with OAuth logins](/images/blog/supabase-oauth-logins.png) + +### Clone tables + +You can duplicate your tables, just like you would inside a spreadsheet. + + + +### Enable and disable extensions + +Extensions are easier to use. You can enable Postgres extensions with the click of a button. + + + +### Save your favorite queries + +The SQL editor now stores your query history in your browser. You can also save your favorite queries to run later! + + + +### GitHub Discussions + +Supabase was given access to [GitHub Discussions](https://github.com/supabase/supabase/discussions)! This is the place for you to ask questions or show off what you've built with Supabase. + +![This is a screenshot of our GitHub Discussions, a new feature by GitHub.](/images/blog/supabase-github-discussions.png) + +### Kaizen + +- Our dashboard now uses [Next.js automatic static optimization](https://nextjs.org/docs/advanced-features/automatic-static-optimization) - so it should be noticeably more responsive. +- We created an Isomorphic [`gotrue-js`](https://github.com/supabase/gotrue-js/) TypeScript library for interacting with Netlify's [GoTrue server](https://github.com/netlify/gotrue). This will soon be bundled into `supabase-js` +- We migrated our [`postgrest-js`](https://github.com/supabase/postgrest-js/) library to TypeScript, and it will soon be bundled into `supabase-js` + +### From the community + +- @kiwicopple [appeared on GitHub's Twitch channel](https://www.twitch.tv/github/video/751281550) for Open Source Friday with @MishManners +- @kiwicopple [discussed pricing for Open Source](https://www.youtube.com/watch?v=PLhI6cccBQA) with GitLab CEO Sid Sijbrandij +- @Thorwebdev [presented Supabase Auth at the SingaporeJS](https://www.youtube.com/watch?v=LUMxJ4w-MUU) meetup +- [realtime-py](https://github.com/lionellloh/realtime-py) is underway thanks to [@lionellloh](https://github.com/lionellloh) & [@j0](https://github.com/j0) +- [postgrest-dart](https://github.com/supabase/postgrest-dart) was shipped by [@phamhieu](https://github.com/phamhieu) +- [postgrest-csharp](https://github.com/supabase/postgrest-csharp) is being implemented by [@acupofjose](https://github.com/acupofjose) + +### Hacktoberfest + +There's been [plenty of drama](https://hacktoberfest.digitalocean.com/hacktoberfest-update) during Hacktoberfest, but Supabase is committed to helping new contributors get started with open source. We've already seen a lot of issues closed by new members to our community and first-time contributors. If you're looking for ways to get involved, read our Hacktoberfest [blog post](/blog/2020/09/11/supabase-hacktoberfest-2020), check our [live stream](https://www.youtube.com/watch?v=3_xRLTjvEiE&t=60s), and then dive into our [project board](https://github.com/orgs/supabase/projects/5). + +![This is an image of our hacktoberfest project board on GitHub.](/images/blog/supabase-hacktoberfest-board.png) + +### Coming next + +Our focus now is to move from Alpha to Beta and we'll be improving stability, reliability, and performance. We've created a [Benchmarks](https://github.com/supabase/benchmarks/) repository, where we'll be measuring the performance of all the open source tools we use. + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io/) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2020-10-30-improved-dx.mdx b/www/_blog/2020-10-30-improved-dx.mdx new file mode 100644 index 00000000000..11e80d9fd31 --- /dev/null +++ b/www/_blog/2020-10-30-improved-dx.mdx @@ -0,0 +1,119 @@ +--- +title: Supabase.js 1.0 +description: We're releasing a new version of our Supabase client with some awesome new improvements. +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://avatars2.githubusercontent.com/u/10214025?s=400&u=c6775be2ae667e2acae3ccd347fed62bb3f5b3e7&v=4 +authorURL: https://github.com/kiwicopple +image: supabase-js-1-0.png +tags: + - supabase +date: '10-30-2020' +--- + +Today we're releasing [supabase-js](https://github.com/supabase/supabase-js) version 1.0, and it comes with some major Developer Experience improvements. + + + +### New Docs + +Before digging into the improvements, we're excited to point out our new [developer docs](/docs/reference/javascript/supabase-client). While they're still a work in progress, here are some things we think you'll like: + +- The [Reference Docs](/docs/reference/javascript/supabase-client) are auto-generated from our TypeScript definitions and then enriched with examples. This forces us to document our code and makes it easier to keep everything in sync. +- We added placeholders for the other languages that the community is developing. They have already started with Python, C#, Dart, Rust, and Swift. Expect to see the docs filling up soon! +- We've added sections for all of the open source tools we use, including [Postgres](/docs/postgres/server/about), [PostgREST](/docs/postgrest/server/about), [GoTrue](/docs/gotrue/server/about), and [Realtime](/docs/realtime/server/about). We'll be filling these with lots of valuable information including self-hosting, benchmarks, and simple guides. + +### Errors are returned, not thrown + +We attribute this improvement to community feedback. This has significantly improved the developer experience. + +Previously we would throw errors: + +```js +try { + const { body } = supabase.from('todos').select('*') +} catch (error) { + console.log(error) +} +``` + +And now we simply return them: + +```js +const { data, error } = supabase.from('todos').select('*') +if (error) console.log(error)\n +// else, carry on .. +``` + +After testing this for a while we're very happy with this pattern. Errors are handled next to the offending function. Of course you can always rethrow the error if that's your preference. + +### We created `gotrue-js` + +Our goal for `supabase-js` is to tie together many sub-libraries. Each sub-library is a standalone implementation for a single external system. This is one of the ways we support existing open source tools. + +To maintain this philosophy, we created [`gotrue-js`](https://github.com/supabase/gotrue-js), a library for Netlify's GoTrue auth server. This libary includes a number of new additions, including third-party logins. + +Previously: + +```js +const { + body: { user }, +} = await supabase.auth.signup('someone@email.com', 'password') +``` + +Now: + +```js +const { user, error } = await supabase.auth.signUp({ + email: 'someone@email.com', + password: 'password', +}) +``` + +### Enhancements and fixes + +- Native TypeScript. All of our libraries are now natively built with TypeScript: [`supabase-js`](https://github.com/supabase/supabase-js), [`postgrest-js`](https://github.com/supabase/postgrest-js), [`gotrue-js`](https://github.com/supabase/gotrue-js), and [`realtime-js`](https://github.com/supabase/realtime-js). +- Better realtime scalability: we only generate one socket connection per Supabase client. Previously we would create a connection for every subscription. +- We've added support for OAuth providers. +- 60% of minor bugs outstanding for `supabase-js` have been [solved](https://github.com/supabase/supabase-js/pull/50). +- You can use `select()` instead of `select(*)` + +### Breaking changes + +We've bumped the major version because there are a number of breaking changes. We've detailed these in the [release notes](https://github.com/supabase/supabase-js/releases/tag/v1.0.1), but here are a few to be aware of: + +- `signup()` is now `signUp()` and `email` / `password` is passed as an object +- `logout()` is now `signOut()` +- `login()` is now `signIn()` +- `ova()` and `ovr()` are now just `ov()` +- `body` is now `data` + +Previously: + +```js +const { body } = supabase.from('todos').select('*') +``` + +Now: + +```js +const { data } = supabase.from('todos').select() +``` + +### Upgrading + +We have documented all of the changes in the [release notes](https://github.com/supabase/supabase-js/releases/tag/v1.0.1). + +To summarise the steps: + +1. Install the new version: `npm install @supabase/supabase-js@latest` +2. Update all your `body` constants to `data` +3. Update all your `supabase.auth` functions with the new [Auth interface](/docs/reference/javascript/auth-signup) + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io/) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2020-11-02-supabase-alpha-october-2020.mdx b/www/_blog/2020-11-02-supabase-alpha-october-2020.mdx new file mode 100644 index 00000000000..7539b23302e --- /dev/null +++ b/www/_blog/2020-11-02-supabase-alpha-october-2020.mdx @@ -0,0 +1,86 @@ +--- +title: Supabase Alpha October 2020 +description: Eight months of building. +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://avatars2.githubusercontent.com/u/10214025?s=400&u=c6775be2ae667e2acae3ccd347fed62bb3f5b3e7&v=4 +authorURL: https://github.com/kiwicopple +image: supabase-october-2020.png +tags: + - supabase +date: '11-02-2020' +--- + +We're now 8 months into building Supabase. We're focused on performance, stability, and reliability but that hasn't prevented us from shipping some great features. + + + +### Quick demo + +Watch a full demo: + + + +### Supabase.js 1.0 + +In the lead-up to our Beta launch, we've [released](/blog/2020/10/30/improved-dx) `supabase-js` version 1.0 and it comes with some major Developer Experience improvements. We received a lot of feedback from the community and we've incorporated it into our client libraries for our 1.0 release. + +Check out the [blog post](/blog/2020/10/30/improved-dx) to learn more. + +### More powerful SQL Editor + +Although it was only intended to be a temporary feature, the SQL Editor has become one of the most useful features of Supabase. This month we decided to make give it some attention, adding Tabs and making it full-screen. This is the first of many updates, we've got some exciting things planned for the SQL Editor. + +![This image shows a SQL Editor with tabs. Originally our SQL editor was very basic, but we're moving towards something very powerful.](/images/blog/sql-editor.png) + +### Key commands for Power Users + +For the heavy table editor users, we've gone ahead and added a bunch of key commands and keyboard shortcuts so you can zip around and manipulate your tables faster than ever. + +![This image shows some of the keyboard shortcuts we introduced on the table editor.](/images/blog/keyboard-shortcuts.png) + +### Magic Links + +One of the most requested Auth features was the ability to send magic links that your users can use to log in. You can use this with new or existing users, and alongside passwords or stand alone. + +![This image shows a template where developers can edit the magic links email which is sent to their users on sign up.](/images/blog/magic-links.png) + +### Kaizen + +- We have new and improved [docs](/docs/reference/javascript/supabase-client). +- We converted [realtime-js](https://github.com/supabase/realtime-js/) to TypeScript. +- Dashboard Performance: we heavily optimised our dashboard routes. +- With the help of the community, we [closed a lot of issues](https://github.com/orgs/supabase/projects/5) during Hacktoberfest. +- We have started [benchmarking](https://github.com/supabase/benchmarks) all the open source tools we use. We'll publish the results this month. + +### Community + +We had a crazy month during Hacktoberfest. In case you missed it, here are some of the highlights: + +- [@kiwicopple](https://twitter.com/kiwicopple) chatted to Jeff on the [Software Engineering Daily podcast](https://softwareengineeringdaily.com/2020/10/15/supabase-open-source-firebase-with-paul-copplestone/). +- [Tezos](https://twitter.com/TezosBakingBad/status/1318212875035512835) started using our PostgREST libraries for their blockchain API: [https://pro.tzkt.io/](https://pro.tzkt.io/) +- Supabase hosted a [Hacktoberfest meetup](https://www.youtube.com/watch?v=3_xRLTjvEiE). +- [@kiwicopple](https://twitter.com/kiwicopple) appeared on the [Open Sauced channel](https://www.youtube.com/watch?v=PHmiWXDx9-w) with [@bdougieYO](https://twitter.com/bdougieYO) +- [@thorwebdev](https://twitter.com/thorwebdev) shows the [Engineers.sg](http://engineers.sg) group how to [build a realtime Slack clone](https://engineers.sg/video/building-a-slack-clone-with-authentication-and-realtime-data-syncing-using-supabase-io-singaporejs--4119) with Supabase + +If you want to keep up to date, make sure you [subscribe to our YouTube channel](https://www.youtube.com/c/supabase) or [follow us on Twitter](https://twitter.com/supabase). + +### Coming next + +Our focus is still moving from Alpha to Beta and we'll be improving stability, reliability, and performance. Our Supabase.js 1.0 launch was part of that, and we've created a [Benchmarks](https://github.com/supabase/benchmarks/) repository where we'll be measuring the performance of all the open source tools we use. + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io/) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2020-11-18-postgresql-views.mdx b/www/_blog/2020-11-18-postgresql-views.mdx new file mode 100644 index 00000000000..af57c6e40bb --- /dev/null +++ b/www/_blog/2020-11-18-postgresql-views.mdx @@ -0,0 +1,184 @@ +--- +title: Postgres Views +description: Creating and using a view in PostgreSQL. +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/dragarcia +author_image_url: https://avatars0.githubusercontent.com/u/26374889?s=400&u=f5e35e9b47a50fa2b4d8c4bb96babd921071bcf1&v=4 +authorURL: https://github.com/dragarcia +image: postgres-views.png +tags: + - postgres +date: '11-18-2020' +--- + +A quick summary of Postgres views, materialized views, and why you should use them. + + + +### What is a View? + +A [view](https://www.postgresql.org/docs/12/sql-createview.html) is a convenient shortcut to a query. Creating a view does not involve new tables or data. When run, an underlying query is executed, returning its results to the user. + +#### Basic Example + +Say we have the following tables from a database of a university: + +**students** + +| id | name | type | +| --- | ---- | ------------- | +| 1 | Arun | undergraduate | +| 2 | Zack | graduate | +| 3 | Joy | graduate | + +**courses** + +| id | title | code | +| --- | ------------------------ | ------- | +| 1 | Introduction to Postgres | PG101 | +| 2 | Authentication Theories | AUTH205 | +| 3 | Fundamentals of Supabase | SUP412 | + +**grades** + +| id | student_id | course_id | result | +| --- | ---------- | --------- | ------ | +| 1 | 1 | 1 | B+ | +| 2 | 1 | 3 | A+ | +| 3 | 2 | 2 | A | +| 4 | 3 | 1 | A- | +| 5 | 3 | 2 | A | +| 6 | 3 | 3 | B- | + +Creating a view consisting of all the three tables will look like this: + +```sql +create view transcripts as + select + students.name, + students.type, + courses.title, + courses.code, + grades.result + from grades + left join students on grades.student_id = students.id + left join courses on grades.course_id = courses.id; +``` + +Once done, we can now access the underlying query with: + +```sql +select * from transcripts; +``` + +For additional parameters or options, refer [here](https://www.postgresql.org/docs/12/sql-createview.html#:~:text=parameters). + +### Why should we use Views? + +Views provide the several benefits: + +- Simplicity +- Consistency +- Logical Organization +- Security + +#### Simplicity + +As a query becomes complex it becomes a hassle to call it. Especially when we run it at regularly. In the example above, instead of repeatedly running: + +```sql +select + students.name, + students.type, + courses.title, + courses.code, + grades.result +from grades +left join students on grades.student_id = students.id +left join courses on grades.course_id = courses.id; +``` + +We can run this instead: + +```sql +select * from transcripts; +``` + +Additionally, a view behaves like a typical table. We can safely use it in table `JOIN`s or even create new views using existing views. + +#### Consistency + +Views ensure that the likelihood of mistakes decreases when repeatedly executing a query. In our example above, we may decide that we want to exclude the course _Introduction to Postgres_. The query would become: + +```sql +select + students.name, + students.type, + courses.title, + courses.code, + grades.result +from grades + left join students on grades.student_id = students.id + left join courses on grades.course_id = courses.id +where courses.code != 'PG101'; +``` + +Without a view, we would need to go into every dependent query to add the new rule. This would increase in the likelihood of errors and inconsistencies, as well as introducing a lot of effort for a developer. With views, we can alter just the underlying query in the view **transcripts**. The change will be applied to all applications using this view. + +#### Logical Organization + +With views, we can give our query a name. This is extremely useful for teams working with the same database. Instead of guessing what a query is supposed to do, a well-named view can easily explain it. For example, by looking at the name of the view **transcripts**, we can infer that the underlying query might involve the **students**, **courses**, and **grades** tables. + +#### Security + +Views can restrict the amount and type of data presented to a user. Instead of allowing a user direct access to a set of tables, we provide them a view instead. We can prevent them from reading sensitive columns by excluding them from the underlying query. + +### What is a Materialized View? + +A [materialized view](https://www.postgresql.org/docs/12/rules-materializedviews.html) is a form of view but with the added feature of physically storing the results. In subsequent reads of a materialized view, the time taken to return its results would be much faster than a conventional view. This is because the data is readily available for a materialized view while the conventional view executes the underlying query each time it is called. + +#### Basic Example + +Using our example above, a materialized view can be created like this: + +```sql +create materialized view transcripts as + select + students.name, + students.type, + courses.title, + courses.code, + grades.result + from grades + left join students on grades.student_id = students.id + left join courses on grades.course_id = courses.id; +``` + +Reading from the materialized view is the same as a conventional view: + +```sql +select * from transcripts; +``` + +For additional parameters or options, refer [here](https://www.postgresql.org/docs/12/sql-creatematerializedview.html#:~:text=parameters). + +#### Refreshing + +Unfortunately, there is a trade-off - data in materialized views are not always up to date. We need to refresh it regularly to prevent the data from becoming too stale. To do so: + +```sql +refresh materialized view transcripts; +``` + +It's up to you how regularly refresh your materialized views, and it's probably different for each view depending on its use-case. + +### Materialized views vs Conventional views + +Materialized views are useful when execution times for queries or views become unbearable or exceed the service level agreements of a business. These could likely occur in views or queries involving multiple tables and millions of rows. When using such a view, however, there should be tolerance towards data being outdated. Some use-cases for materialized views are internal dashboards and analytics. + +Creating a materialized view is not a solution to inefficient queries. You should always seek to optimize a slow running query even if you are implementing a materialized view. + +### Conclusion + +Postgres views and materialized views are a great way to organize and view results from commonly used queries. Although similar to one another, each has its purpose. Views simplify the process of running queries. Materialized views are usually faster at returning results, with the trade-off of having stale data. diff --git a/www/_blog/2020-12-01-supabase-alpha-november-2020.mdx b/www/_blog/2020-12-01-supabase-alpha-november-2020.mdx new file mode 100644 index 00000000000..8dc38f276b5 --- /dev/null +++ b/www/_blog/2020-12-01-supabase-alpha-november-2020.mdx @@ -0,0 +1,83 @@ +--- +title: Supabase Alpha November 2020 +description: Nine months of building. +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://avatars2.githubusercontent.com/u/10214025?s=400&u=c6775be2ae667e2acae3ccd347fed62bb3f5b3e7&v=4 +authorURL: https://github.com/kiwicopple +image: supabase-november-2020.png +tags: + - supabase +date: '12-01-2020' +--- + +We've been building for 9 months now, and we're getting even closer to Beta. + + + +### Quick demo + +Watch a full demo: + + + +### Add users + +You can now add users manually from your dashboard. + +![This image shows how to invite a new user directly from the dashboard.](/images/blog/invite-users.gif) + +### User admin + +You can also perform admin functions on existing users - send password reset emails, magic links, and delete users. + +![This image shows how to delete a user directly from the dashboard.](/images/blog/delete-users.gif) + +### Even more powerful SQL Editor + +Last month we [announced](/blog/2020/11/02/supabase-alpha-october-2020#more-powerful-sql-editor) an improved SQL Editor, and this month we've taken it even further. The SQL Editor is now a full Monaco editor, like you'd find in VS Code. Build your database directly from the browser. + +![This image shows our improved SQL Editor.](/images/blog/supabase-monaco-editor.png) + +### Status page + +We added a [Status Page](https://status.supabase.com/) which tracks the uptime and latency of the Supabase platform. + +![This image shows our new status page.](/images/blog/status-page.png) + +### Kaizen + +- We completed a security audit by DigitalXRAID. +- Email confirmations now enabled by default for signups. +- Updated [Benchmarking Suite](https://github.com/supabase/benchmarks/) to include more realistic workloads, on various different servers (results published soon). +- You can now set/edit/remove Foreign Keys via the table editor. + +### Community + +We had a crazy month during Hacktoberfest. In case you missed it, here are some of the highlights: + +- We have an exciting Vercel x Stripe x Supabase [collaboration underway](https://twitter.com/rauchg/status/1331021818681978881). +- [@elrhomariyounes](https://github.com/elrhomariyounes) started helping [@acupofjose](https://github.com/acupofjose) with the [postgrest-csharp](https://github.com/supabase/postgrest-csharp) extension +- [@duncanhealy](https://github.com/duncanhealy) is [updating the Redwood example](https://github.com/redwoodjs/redwood/pull/1474) to work with Supabase.js v1.0 + +If you want to keep up to date, make sure you [subscribe to our YouTube channel](https://www.youtube.com/c/supabase) or [follow us on Twitter](https://twitter.com/supabase). + +### Coming next + +Look out for a big announcement on December 3rd. We'll also be presenting in the [Open Core Summit](https://2020.opencoresummit.com/) on the 16th of December. + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io/) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2020-12-02-case-study-monitoro.mdx b/www/_blog/2020-12-02-case-study-monitoro.mdx new file mode 100644 index 00000000000..4bcadb8563c --- /dev/null +++ b/www/_blog/2020-12-02-case-study-monitoro.mdx @@ -0,0 +1,58 @@ +--- +title: Monitoro Built a Web Crawler Handling Millions of API Requests +description: See how Monitoro built an automated scraping platform using Supabase. +author: rory_wilding +author_title: Supabase +author_url: https://github.com/roryw10 +author_image_url: https://github.com/roryw10.png +authorURL: https://github.com/roryw10 +image: /images/blog/supabase-monitoro.png +tags: + - case-study + - no-code +date: '12-02-2020' +--- + +Omar Kamali is the founder of [Monitoro](https://www.monitoro.xyz/), a service for scraping countless websites 24/7 to notify customers when these websites change. To create this product, Monitoro's team needed to handle massive data throughput whilst ensuring the product was reliable and resilient to satisfy a rapidly growing user base. + +Learn how Monitoro was able to build fast, ensure reliability, and keep scaling by building with Supabase and Svelte. + + + +### From Zero to One Million + +In one month, Monitoro scaled from nothing to nearly one million API requests per day. + +![This image Monitoro's API requests every day for a month. They went from zero to 800 thousand daily requests.](/images/blog/monitoro-requests.png) + +### Customer discovery to development + +Monitoro spent time on customer discovery and building out a version 1. After getting some initial feedback and spending time learning from their customers, they realised to build out the functionality they wanted, Monitoro would need real-time functionality. + +From experience, the team understood from day one that using a technology such as Firebase would have been unthinkable. Monitoro also wanted to avoid vendor lock-in as well as leverage PostgreSQL's large ecosystem of tools in other parts of their processes. They didn't want to spend time setting up MongoDB, and whilst Hasura seemed like a possibility, it was over-engineered for Monitoro's use case. + +### Supabase turbo-charges Monitoro + +Omar saw Supabase mentioned on Hacker News and realised immediately it had the potential to solve Monitoro's problems. Using Supabase would help them launch version 2 of Monitoro with the real-time functionality their users would value, without sacrificing moving fast. + +Within a couple of days, the team had a version ready they could deploy. Monitoro's team developed and deployed a custom web service to handle the massive throughput required then used Supabase as their backend to power the web application their users interact with. This means Monitoro's users can view the extracted data and integrate the data with other tools without code. + +Fast forward to today, and Monitoro's user base has been ramping up, as they use Monitoro to monitor changes to websites all over the world. Despite how fast their user base has grown, the Monitoro team have peace of mind as they scale because they used Supabase, knowing it will just work without worrying about DevOps. + +![Quote from Omar - Supabase was exactly the solution I needed so when I saw it on Hacker News I was instantly excited. Supabase allowed us to go further, faster, with our product functionality. We had a fast-growing user base which would have been challenging to support without being able to depend on Supabase.](/images/blog/omar-monitoro.png) + +### Prototype fast, and keep going + +Thanks to Supabase, Monitoro could deliver the features required needed faster than they anticipated. This meant the team could spend more time focusing on speaking to customers and marketing. As a result, their user base has grown massively in a short space of time. There was no need to worry about how to create a database which had real-time functionality which could be set up quickly and scale. Monitoro could focus on launching fast. + +Learn more about Monitoro: + + diff --git a/www/_blog/2020-12-02-case-study-tayfa.mdx b/www/_blog/2020-12-02-case-study-tayfa.mdx new file mode 100644 index 00000000000..39d12470baa --- /dev/null +++ b/www/_blog/2020-12-02-case-study-tayfa.mdx @@ -0,0 +1,52 @@ +--- +title: TAYFA Built a No-Code Website Builder in Seven Days +description: See how Tayfa went from idea to paying customer in less than 30 days. +author: rory_wilding +author_title: Supabase +author_url: https://github.com/roryw10 +author_image_url: https://github.com/roryw10.png +authorURL: https://github.com/roryw10 +image: /images/blog/supabase-tayfa.png +tags: + - case-study + - no-code +date: '12-02-2020' +--- + +[**TAYFA**](https://usetayfa.com) is the fastest no-code approach to create and iterate on bespoke frontends. Learn how its solo founder, [Sarup Banskota](https://twitter.com/sarupbanskota?lang=en), was able to launch quickly with [Supabase](/), Next.js, and Vercel. + + + +### Meet the founder + +Sarup's background is in open-source, web frontends, and devtools. In the summer of 2020, he was rapidly building MVPs as he explored different problem spaces. Sarup found that reusing his frontend work across projects, wasn't as simple as he'd have liked. + +![This image shows a quote from Sarup - Frontends should be as simple as: Sign-up, drag & drop, publish.](/images/blog/sarup-tayfa.png) + +- Zero to MVP: **7 Days** +- Idea to 1st Payment: **30 Days** +- Creating Scalable Backend APIs: **30 mins** + +### The Maker Journey + +When Sarup found an interested customer, TAYFA was still a fuzzy idea in his head. As a workflow tool, the best way to demonstrate the concept was to build an MVP. His customer needed the product yesterday — there was no time to waste. + +He started out with a first iteration using Next.js and Vercel for the frontend — technologies he loved, and Firebase because he was familiar with it. However, he soon realised that for his enterprise customers, self-hosting capabilities would be a deal-breaker. Moreover, he'd require sensible RESTful APIs for developing the subsequent iterations of TAYFA. + +One option was to do it the "old-school" way: Postgres on a custom server, or MongoDB. But that would mean losing momentum by getting bogged down setting up a backend. + +### Supabase helped shortcut development time + +Luckily, Sarup discovered Supabase through the Vercel community. Open-source and built on top of Postgres, it was perfect for his future self-hosting needs and also offered him an API out of the box. The current version of TAYFA is the third iteration, and also takes advantage of Supabase Auth, an out of the box auth layer. + +![This image shows a quote from his customers - The speed at which TAYFA is evolving is crazy. I've seen ideas translate into live features 10 minutes after speaking on the phone.](/images/blog/tanmai-tayfa.png) + +> _"If my product helps customers move fast, then I need to move fast._ +> +> _Luckily with Supabase, I haven't had to worry about the health of my backend systems, and can focus on what I enjoy most: shipping frontend."_ +> +> Sarup Banskota, founder of TAYFA + +### Prototype fast, and keep going + +Thanks to Supabase, Sarup can focus on what he does best and get his final product in front of his customer. There was no need to worry about choosing and setting up back-ends, Sarup could focus on launching fast. diff --git a/www/_blog/2020-12-02-case-study-xendit.mdx b/www/_blog/2020-12-02-case-study-xendit.mdx new file mode 100644 index 00000000000..d95679850a3 --- /dev/null +++ b/www/_blog/2020-12-02-case-study-xendit.mdx @@ -0,0 +1,41 @@ +--- +title: Xendit Built a Counter-Fraud Watchlist for the Fintech Industry +description: See how Xendit use Supabase to build a full-text search engine. +author: rory_wilding +author_title: Supabase +author_url: https://github.com/roryw10 +author_image_url: https://github.com/roryw10.png +authorURL: https://github.com/roryw10 +image: supabase-xendit.png +thumb: supabase-xendit-thumb.jpg +tags: + - case-study + - fintech +date: '12-02-2020' +--- + +[Xendit](https://www.xendit.co/) is one of South East Asia's largest payment processors. They use Supabase to run automated checks against international sanctions lists. + + + +### About Xendit + +Xendit is a leading payment gateway for Indonesia and Southeast Asia. They enable businesses to accept payments in Indonesia with a single integration for credit and debit cards, e-wallets, and bank transfer. + +### Counter-fraud + +As a payment processor, Xendit are responsible for verifying that all transactions are legal. Any transactions which are suspicions must be verified against a strict set of criteria, and the parties involved need to be checked against international sanctions lists. This is a critical anti-money-laundering operation and needs to be performed in realtime to prevent any delays on legitimate payments. + +### Why they chose Supabase + +Xendit needed something fast. Something that was cheaper than using the global players like Worldcheck or Refinitiv. Xendit already uses Postgres for a lot of their critical infrastructure, and so Xendit team are familiar with the technology and comfortable in it's ability to scale. + +### What they built + +Xendit parses international sanctions lists from the UN and the Indonesian government and loads them into Supabase. Since Supabase provides a full Postgres server, they can then use the [Trigram](https://www.postgresql.org/docs/current/pgtrgm.html) extension to perform full-text search on the lists, with a relevance score on every search. + +Supabase was perfect for their use case, as they needed something built fast. The full solution was built and in production in less than one week. + +> The full solution was built and in production in less than one week. + +Xendit created a database function for searching, which they are able to call directly using their Python clients. They have plans to iterate on the current implementation using more advanced techniques, like machine learning, but for now the Supabase system has been in Production for 9 months without a problem. diff --git a/www/_blog/2020-12-02-supabase-striveschool.mdx b/www/_blog/2020-12-02-supabase-striveschool.mdx new file mode 100644 index 00000000000..dc01b94ecf8 --- /dev/null +++ b/www/_blog/2020-12-02-supabase-striveschool.mdx @@ -0,0 +1,58 @@ +--- +title: Supabase Partners With Strive School To Help Teach Open Source +description: Supabase Partners With Strive School To Help Teach Open Source To The Next Generation Of Developers +author: rory_wilding +author_title: Supabase +author_url: https://github.com/roryw10 +author_image_url: https://github.com/roryw10.png +authorURL: https://github.com/roryw10 +image: supabase-strive-school.png +thumb: supabase-strive-school.png +tags: + - supabase + - striveschool +date: '12-02-2020' +--- + + + +### Supabase and Strive School - YC Summer 20 batchmates + +We are proud to announce we are teaming up with fellow YC Summer 20 Alumni [Strive School](https://strive.school/), to help teach the next generation of software developers about open source software development. + +![Supabase and Strive are partnering up to teach OSS.](/images/blog/strive-supabase.png) + +Strive School is on a mission to train the next generation of Computer Engineers, starting from Europe. + +They've designed a new type of program which they brand a "Master-camp" - combining the depth of a masters degree with the pacing of a coding Bootcamp, they train engineers over a time span of eight months, and their students pay only once they get hired. + +Tobia and Diego, the founders, launched Strive School to help individuals gain the skills employers need and expect from a solid early career developer, which are often not taught during traditional computer science degrees and almost impossible to learn fully by yourself. + +Their business model means the better students, who want it the most, have a shot at making it - regardless of their socio-economic background. + + + +### Working together to help students learn open source + +Strive School has an initial focus on full-stack Web Engineering and AI Engineering. They deeply care about open-source and help their students understand the importance of open-source software in the modern workforce. Almost all technology companies use open-source software, so Strive School sees it as essential that their students leave the course with an understanding of open source development. + +At Supabase, we live and breathe open source. Our focus is on building the open-source Firebase alternative. Wherever possible, we integrate and support the best-in-class existing open-source tools and communities. If those tools don't exist, we build and open-source them ourselves. + +We are huge Postgres fans and believe that Supabase will make learning and implementing relational databases a better experience for code school students. + +We will be working closely with Strive School in the coming months to produce exclusive content for their code school students. We are also happy to announce we will be taking on a Strive school graduate as an intern at Supabase. This isn't a role we were actively hiring for, but we have been so impressed with the standard of their graduates that we didn't want to miss out of the chance to work with talent from Strive School. + + + +### Launching the Supabase Student Developer Pack with Strive School + +As part of this process, we have put together a Student Developer Pack. Strive School are the perfect partner to launch our Student Developer Pack with as we both feel passionate about the importance of open-source software to empower developers. We are looking forward to working closely together in the coming months to help their students embrace the world of open-source. + +The Supabase Student Development pack includes: + +- Credits for students to use Supabase free for 2-years +- Access to our Slack Community channel, full of high profile developer advocates and open-source contributors +- Founder office hours with students +- Access to limited edition Supabase Swag + +If you running a code school or university and want to learn more about the Supabase Student Developer Pack, then reach out to rory@supabase.io diff --git a/www/_blog/2020-12-13-supabase-dashboard-performance.mdx b/www/_blog/2020-12-13-supabase-dashboard-performance.mdx new file mode 100644 index 00000000000..9d34977702d --- /dev/null +++ b/www/_blog/2020-12-13-supabase-dashboard-performance.mdx @@ -0,0 +1,134 @@ +--- +title: Making the Supabase Dashboard Supa-fast +description: Improving the performance of the Supabase dashboard +author: inian +author_title: Supabase +author_url: https://github.com/inian +author_image_url: https://github.com/inian.png +authorURL: https://github.com/inian +tags: + - supabase +date: '12-13-2020' +--- + + + +The Supabase dashboard has become more feature-rich in the last month. We have a powerful SQL editor backed by [Monaco](https://microsoft.github.io/monaco-editor/). We built an Airtable-like view of your database, making editing a breeze. + +> Features, performance, DX - choose three + +Performance can quickly regress when adding new features, especially in a Single Page Application. Here are the steps we took to guarantee a good baseline performance within our application, without compromising on the developer experience (DX). + +## Establishing a baseline and setting targets + +> You can't fix what you can't measure + +There was some low-hanging fruit to improve performance, but we had one important thing to do before that - establish a baseline. + +Our dashboard is JavaScript heavy, so we started by setting up analytics to track our bundle sizes. [Next-bundle-analyzer](https://www.npmjs.com/package/@next/bundle-analyzer) (or [webpack-bundle-analyzer](https://www.npmjs.com/package/webpack-bundle-analyzer)) provides an interactive treemap of your generated JavaScript bundles. This is our treemap when we started. It gave us a clear indication what changes we needed to achieve the most impact. + +![Nextjs tree analyzer](/images/blog/blog/nextjs-tree-analyzer.png) + +There are some great tools when it comes to Real User Monitoring (RUM). We chose the newly-launched [Sentry performance monitoring](https://sentry.io/for/performance/) product since we already use Sentry for error tracking and we wanted to minimize new tools in our stack. It also supports reporting [Core Web Vitals](https://web.dev/vitals/), the performance metrics created by Google to track initial loading performance, responsiveness and visual stability. Core Web Vitals come with recommended target values, giving us clear goals to hit. + +![Core Web Vitals](/images/blog/blog/core-web-vitals.png) + +## Improving our JavaScript bundle size + +> How to not load the entire npm registry into our user's browsers + +### Choosing smaller modules + +We used [Bundlephobia](https://bundlephobia.com/) on our largest modules. This is a great website to have in your JS-performance arsenal. It gives the size of npm modules across different versions and recommends alternate modules with similar functionality which are smaller. + +`Moment.js` is notorious for its large bundle size and we don't need complex date processing for our dashboard. It was straightforward to switch to [day-js](https://day.js.org/) which is largely API-compatible with `Moment.js`. This change reduced our gzipped bundle size by 68 KB. + +We migrated from `Joi` to `ajv` for our schema validation which was 32% smaller. `ajv` was already bundled as a transitive dependency of other modules, making it a no-brainer. + +![NPM dependencies](/images/blog/blog/npm-dependencies.png) + +We reverted our [crypto-js](https://github.com/brix/crypto-js) module from version 4.0 to 3.3.0. Version 4.0 [injects more than 400kb code](https://github.com/brix/crypto-js/issues/276) when used in a browser context. The newer version replaces `Math.random` with node's implementation, injecting the entire node crypto module into the browser context. We use `crypto-js` for decrypting user's API keys and so we're not reliant on the randomness of the PRNG. We might move to a dedicated module like [aes-js](https://www.npmjs.com/package/aes-js) in the future since it has a much smaller surface area than `crypto-js` (in terms of security and performance). + +### Using partial imports + +By selectively importing functions from modules like `lodash`, we cut the gzipped size by another 40kb across all our bundles. + +```js +// before +import _ from 'lodash'\n +// maunally cherry picking modules +import find from 'lodash/find' +import debounce from 'lodash/debounce'\n +// using babel-plugin-lodash +import { find, debounce } from 'lodash' +``` + +In the above example, we added [babel-plugin-lodash](https://github.com/lodash/babel-plugin-lodash) to our babel configuration which cherry picks the exact `lodash` functions we import. This makes it easier to import from `lodash` without cluttering the code with selective import statements. + +### Moving complex logic to the server + +Thanks to some skilled haxors (well, weak passwords mainly) we had crypto miners running on some of our customer's databases. To prevent this, we enforce password strength with the [zxcvbn](https://github.com/dropbox/zxcvbn) module. Though it improved our overall security, the module is [pretty big](https://bundlephobia.com/result?p=zxcvbn@4.4.2), weighing in at 388kb gzipped. To get around this, we moved the password-strength checking logic to an API. Now, the frontend queries a server with a user-supplied password and the server computes its strength. This eliminates the module from the frontend. + +### Lazy loading code + +[xlsx](https://github.com/SheetJS/sheetjs) is another complex and large module, which is used to import spreadsheets into tables. We contemplated moving this logic to the backend, but we found another solution: lazy loading it. + +The spreadsheet import is triggered when the user is creating a new table. However the code was previously loaded every time the page was visited - even when a new table was not being created. This made it a good candidate for lazy loading. Using [Next.js dynamic imports](https://nextjs.org/docs/advanced-features/dynamic-import) we are able to load this component (313 kb brotlied) dynamically, whenever the user clicks the "Add content" button. + + + +We use the same technique to lazy load some Lottie animations which are relatively large. + +### Using native browser APIs + +We decided against supporting IE11, opening up more avenues for optimization. Using native browser APIs enabled us to drop even more dependencies. For example, since the [fetch API is available](https://caniuse.com/fetch) in all the browsers we care about, we removed [axios](https://github.com/axios/axios) and built a simple wrapper using the native fetch API. + +## Improving Vercel's default caching + +> The fastest request is the request not made + +We noticed that Vercel was sending a `Cache-Control` header of `public, max-age=0, must-revalidate` , preventing some of our SVG, CSS and font files from being cached in the browser. + +We updated our `next.config.js` , adding a long `max-age` to the caching header that Vercel sends. Our assets are versioned properly, so we were able to safely do this. + +## Enabling Next.js Automatic Static Optimization + +Next.js is able to automatically pre-render a page to HTML, whenever a page meets some pre-conditions. This mode is called [Automatic Static Optimization](https://nextjs.org/docs/advanced-features/automatic-static-optimization). Pre-rendered pages can be cached on a CDN for extremely fast page loads. We removed calls to `getServerSideProps` and `getInitialProps` to take advantage of this mode. + +## Developing a performance culture + +> Always in sight, always in mind + +Our performance optimization journey will never be complete. It requires constant vigilance to maintain a baseline across our users. To instill this within our team, we took a few actions. + +We developed a Slack bot which sends our Sentry performance dashboard every week, containing our slowest transactions and our Core Web Vitals summary. This shows which pages need improvement and where our [users are the most miserable](https://docs.sentry.io/product/performance/metrics/#user-misery). + +During our transition from Alpha to Beta, performance was one of the important features, along with stability and security. We considered performance implications while choosing libraries and tools. Having a "seat at the table" in these discussions ensures that performance is not considered as an after-thought. + +## Results + +With these changes, we have a respectable Core Web Vitals score. This is a snapshot from Sentry with RUM data from the last week. We are within the recommended threshold for all the 3 Web Vitals. + +![Sentry results](/images/blog/blog/sentry-results.png) + +Our Next.js build output also shows that users download < 200 kb of JavaScript between any two page transitions. We're still improving too - even though we provide a lot of functionality in our dashboard, we will continue to reduce our bundle sizes. + +## Things that did not work + +> You win some, you lose some + +We tried a VSCode plugin called [Import cost](https://marketplace.visualstudio.com/items?itemName=wix.vscode-import-cost) which shows the size of JavaScript modules when you import it in your editor. However, the plugin did not work on our codebase since it doesn't support some JavaScript features, like optional chaining. + +We also passed on using [lodash-webpack-plugin](https://www.npmjs.com/package/lodash-webpack-plugin) even though it had the potential to reduce our JavaScript sizes, because it could potentially break our code if not used carefully. This plugin would require our frontend team to understand the Webpack configuration, updating it whenever they use a new lodash feature set. + +## The road ahead + +Our broad goal is to implement best practices for frontend performance, and make it exciting to all of our team. These are some ideas we have on our roadmap - + +- Set up [Lighthouse](https://developers.google.com/web/tools/lighthouse) in a GitHub Action to catch performance regression earlier in the development life cycle. +- Continue reducing our initial JavaScript payload size, to improve our LCP time +- Explore `cloud-mode` in [Segment](https://segment.com/docs/connections/destinations/) which makes API calls from the server instead of loading third-party library on the browser. + +Reach out to us on [Twitter](https://twitter.com/supabase) if you have more ideas to speed up our website ⚡ diff --git a/www/_blog/2021-01-02-supabase-beta-december-2020.mdx b/www/_blog/2021-01-02-supabase-beta-december-2020.mdx new file mode 100644 index 00000000000..bbfbfb4c277 --- /dev/null +++ b/www/_blog/2021-01-02-supabase-beta-december-2020.mdx @@ -0,0 +1,98 @@ +--- +title: Supabase Beta December 2020 +description: Ten months of building. +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: supabase-december-2020.png +thumb: supabase-december-2020.png +tags: + - supabase +date: '01-02-2021' +--- + +After 10 hectic months of building, Supabase is now in Beta. + +### Quick demo + +Watch a full demo: + + + +### Supabase is now in Beta + +We spent months working on Performance, Security, and Reliability. Read more on our [Beta Page](/beta). + +![This image shows our Beta Page.](/images/blog/blog/dec-beta.png) + +### Improve your docs inline + +Add comments and descriptions to your Tables directly from our auto-generated docs. Descriptions are stored as PostgreSQL comments (https://postgresql.org/docs/current/sql-comment.html), and are exposed over your OpenAPI spec. + + + +### Table View now has realtime changes + +Any updates that happen to your database are reflected in the Table View immediately. + + + +### Table Pagination + +Our table view now has pagination - better for working with large data sets. + + + +### Supabase raised a Seed Round + +We raised $6M from Y Combinator, Mozilla, and Coatue. You can read more on [TechCrunch](https://techcrunch.com/2020/12/15/supabase-raises-6m-for-its-open-source-firebase-alternative). + +### Kaizen + +- Supabase is now 26% faster in regions which support Graviton (1460 reqs/s up from 1167 reqs/s) +- We launched a new region in Sao Paulo. +- Postgres Array Support. You can now edit Native Postgres array items in the grid editor or the side panel. +- We added better support for your custom Database Types. +- Fixed some buggy keyboard commands. We're continuously improving key commands in the Table editor. + +### Community + +- We were featured on the GitHub release radar. [Link](https://github.blog/2020-12-07-release-radar-dec-2020/) +- [@kiwicopple](https://twitter.com/kiwicopple) appeared on [Open Core Summit](https://2020.opencoresummit.com/) +- [@aaronksaunders](https://twitter.com/aaronksaunders) created a video series on Supabase + Vue. [Link](https://twitter.com/aaronksaunders/status/1339981480202743811). +- [@CodeByCorey](https://twitter.com/CodeByCorey) tracks realtime page views using Supabase. [Link](https://twitter.com/CodeByCorey/status/1344650699645325312). +- [@ffbass](https://github.com/ffabss) started working on gotrue-java. [Link](https://github.com/supabase/gotrue-java). +- We've grown more than 50% (GitHub star count) since moving into Beta. [Link](https://twitter.com/supabase/status/1345410714836594693) + +![This image shows GitHub star growth.](/images/blog/blog/dec-starcount.png) + +If you want to keep up to date, make sure you [subscribe to our YouTube channel](https://www.youtube.com/c/supabase) or [follow us on Twitter](https://twitter.com/supabase). + +### Coming next + +We've go a lot of exciting things planned for Q1 2021. We're already planning out Supabase Storage and a Supabase CLI for better local development. Let us know if there's something you want us to release as a priority! + +We also have something exciting planned with Vercel and Stripe ... [stay tuned](https://twitter.com/rauchg/status/1331021818681978881). + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io/) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2021-02-02-supabase-beta-january-2021.mdx b/www/_blog/2021-02-02-supabase-beta-january-2021.mdx new file mode 100644 index 00000000000..07fd57cde86 --- /dev/null +++ b/www/_blog/2021-02-02-supabase-beta-january-2021.mdx @@ -0,0 +1,131 @@ +--- +title: Supabase Beta January 2021 +description: Eleven months of building. +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: supabase-january-2021.png +thumb: supabase-january-2021.png +tags: + - supabase +date: '02-02-2021' +--- + +New year, new features. We've been busy at Supabase during January and our community has been even busier. Here's a few things you'll find interesting. + + + +### Quick demo + +Watch a full demo: + + + +### Count functionality + +Anyone who has worked with Firebase long enough has become frustrated over the [lack](https://stackoverflow.com/questions/49979714/how-to-get-count-of-documents-in-a-collection) of `count` functionality. This isn't a problem with PostgreSQL! Our libraries now have support for PostgREST's [exact](https://postgrest.org/en/v7.0.0/api.html?highlight=count#exact-count), [planned](https://postgrest.org/en/v7.0.0/api.html?highlight=count#planned-count), and [estimated](https://postgrest.org/en/v7.0.0/api.html?highlight=count#estimated-count) counts. A massive thanks to [@dshukertjr](https://github.com/supabase/postgrest-js/issues/94#event-4210564301) for this adding support to our client library. + +![Supabase now supports count functionality](/images/blog/blog/postgres-count.png) + +### New Auth Providers + +We enabled 2 new Auth providers - Facebook and Azure. Thanks to [@Levet](https://github.com/supabase/gotrue/pull/54) for the Azure plugin, and once again to [Netlify's amazing work](https://github.com/netlify/gotrue/issues/107) with GoTrue to implement Facebook. + +![Supabase now supports Azure and Facebook Oauth providers](/images/blog/blog/auth-azure-and-facebook.png) + +### Auth Audit Trail + +We have exposed the audit trail directly in the dashboard, as well as the GoTrue logs. Great for security and debugging. + +![Supabase exposes the Auth Audit trail on the dashboard](/images/blog/blog/auth-audit.png) + +### Auth UI widget + +In case our Auth endpoints aren't easy enough already, we've built a React [Auth Widget](http://ui.supabase.com/?path=/story/auth-auth--default) for you to drop into your app and to get up-and-running in minutes. + +![Supabase has released a React Auth widget](/images/blog/blog/auth-widget.png) + +### New `auth.email()` function + +We added a helper function for extracting the logged in user's email address. + +![Supabase added an email function for using with Policies](/images/blog/blog/policies-email.png) + +### New Regions + +Launch your database in London or Sydney! + +![Launch your database in London or Sydney](/images/blog/blog/regions-london-sydney.png) + +### Copy rows as Markdown + +You can now copy SQL results as Markdown - super useful for adding to blogs and issues. + +![Copy query results as markdown](/images/blog/blog/countries.gif) + +### React server components + +If you're excited by React Server components then check out the Supabase + Server Components experimental repo. [https://github.com/supabase/next-server-components](https://github.com/supabase/next-server-components) + +![Use supabase with React Server components](/images/blog/blog/react-server-components-supabase.png) + +### Learn + +We know that Auth can be a bit daunting when you're just starting out, so we have created some intro videos to get you up to speed in no time: + +- [Supabase Auth Deep Dive Part 1: JWTs](https://youtu.be/v3Exg5YpJvE) +- [Supabase Auth Deep Dive Part 2: Restrict Table Access](https://youtu.be/qY_iQ10IUhs) +- [Supabase Auth Deep Dive Part 3: User Based Access Policies](https://youtu.be/0LvCOlELs5U) + +![We released a Auth Video Series](/images/blog/blog/supabase-auth-series.png) + +### Kaizen + +- Performance: We migrated all of our subdomains to Route53, implementing custom Let's Encrypt certs for your APIs. As a result, our read benchmarks are measuring up 12% faster. +- Performance: We upgrade your databases to the new [GP3](https://aws.amazon.com/about-aws/whats-new/2020/12/introducing-new-amazon-ebs-general-purpose-volumes-gp3/) storage for faster and more consistent throughput. + +### Community + +- @kiwicopple chats to @bdougie on HeavyBit's Jamstack Radio: [Link](https://www.heavybit.com/library/podcasts/jamstack-radio/ep-71-open-source-firebase-alternative-with-paul-copplestone-of-supabase) +- Watch @leerob from Vercel deploy a full Next.js app with Supabase in just 2 minutes: + [Link](https://twitter.com/leeerob/status/1351576575888797696) +- Redwood now supports Supabase: + [Link](https://twitter.com/redwoodjs/status/1347311574415863811) +- Deploy a full analytics solution using Umami: + [Link](https://twitter.com/mkalvas/status/1353880637506260994) +- Check out this open source Trello Clone: + [Link](https://twitter.com/joshnuss/status/1352094804335857664) +- Get started with Expo + Supabase using this starter template from Kiki: + [Link](https://twitter.com/kikiding/status/1352086899242856449) +- Use Supabase Auth with NestJS: + [Link](https://twitter.com/atsuhio/status/1348516650144780288?s=21) +- The community has made some serious advances on the [Dart](https://github.com/supabase?q=dart&type=&language=), [C#](https://github.com/supabase?q=csharp&type=&language=), [Python](https://github.com/supabase?q=python&type=&language=), and [Kotlin](https://github.com/supabase?q=kotlin&type=&language=) libraries. +- We were one of the fastest growing open source startups in Q4 last year: [Link](https://twitter.com/RunaCapital/status/1351122231791910916) + +![This image shows the Supabase GitHub star growth.](/images/blog/blog/jan-21-starcount.png) + + + Source: repository.surf/supabase + + +### Coming next + +We're ramping up to "Launch week" at the end of Q1, where we will be giving you some very exciting new features (including Storage!). + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io/) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Subscribe to our [YouTube channel](https://www.youtube.com/c/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2021-02-09-case-study-roboflow.mdx b/www/_blog/2021-02-09-case-study-roboflow.mdx new file mode 100644 index 00000000000..49e1814ed41 --- /dev/null +++ b/www/_blog/2021-02-09-case-study-roboflow.mdx @@ -0,0 +1,59 @@ +--- +title: Roboflow.com choose Supabase to power Paint.wtf leaderboard +description: Learn how Roboflow.com used Supabase to build their Paint.wtf leaderboard +author: rory_wilding +author_title: Supabase +author_url: https://github.com/roryw10 +author_image_url: https://github.com/roryw10.png +authorURL: https://github.com/roryw10 +image: roboflow-og.png +thumb: roboflow-website.png +tags: + - case-study + - AI +date: '02-09-2021' +--- + +Brad Dwyer is the founder of [Roboflow](https://roboflow.com/?ref=supabase), a startup helping developers build computer vision into their applications. Their solution allows developers, with zero computer vision experience, to go from images to a trained computer vision model in minutes. + +Learn how Brad and Roboflow used Supabase to launch [Paint.wtf](https://paint.wtf), a product which survived traffic generated from the front page of Hacker News, Reddit, and Product Hunt. + +![Supabase and Strive are partnering up to teach OSS.](/images/blog/roboflow-website.png) + +## From idea to a launch in a weekend + +Brad and a friend ([Erik Dunteman](https://twitter.com/erikdoingthings)) wanted to experiment with OpenAI's new [CLIP](https://openai.com/blog/clip/) model through a side project they could build in a weekend. CLIP classifies a wide range of images by flipping image classification into a text similarity task. Current image classifiers are limited because they are trained on a fixed number of categories. In contrast, CLIP learns from the raw text describing the images meaning the classifier isn't limited by labels and supervised learning. The team recognised that CLIP opens up a vast range of use cases that have been difficult previously due to the time required to collect images and train the model. + +Roboflow settled on a straightforward concept: they prompt users to draw an image which is then fed into CLIP. The AI then judges how close the drawing is to the given prompt and assigns it a score. Users' performance is tracked on a leaderboard for each prompt and users can see how well they performed against their peers according to the model. + +## Leaderboards that Count + +Brad and the team needed a leaderboard to make this idea work. While their first intuition was to use Firebase, it lacks the built-in functionality for counting the number of documents in a collection - a critical function for implementing their leaderboard design. + +![Supabase and Strive are partnering up to teach OSS.](/images/blog/roboflow-stat.png) + +You might export data to BigQuery, or implement an increment function on collection change, however PostgreSQL has great built in support for counting and Brad felt like this would be the perfect opportunity to test out Supabase and get the functionality he needed for the leaderboards to work reliably and without implementing add-ons. + +## One weekend to break the internet + +Brad and the team built the product overnight and launched it on Hacker News. Paint.wtf went on to make it to Hacker News and Reddit's first page, and getting traction on Product Hunt. As a result, they had to handle serious user volumes; at its peak, users were submitting over 2 new drawings every second. + +Over 100K users submitted drawings in a 24 hour span. At this point, Brad knew he had picked the right setup for his leaderboard as even with this massive spike in usage it continued to perform reliably so his users could get accurate and up to date rankings for their submissions. + +![Supabase and Strive are partnering up to teach OSS.](/images/blog/roboflow-gallery.png) + +Paint.Wtf has continued to get sustained coverage in the media and has continued to pick up new and unexpected use cases. For example, remote teams are using Paint.wtf as part of their daily ice breaker activities during COVID to keep up team social cohesion. + + + +![Supabase and Strive are partnering up to teach OSS.](/images/blog/roboflow-quote.png) + +## Ship fast, and carry on scaling + +Thanks to Supabase, Roboflow could launch quickly and keep scaling despite the huge user volumes their innovative project generated overnight. diff --git a/www/_blog/2021-02-27-cracking-postgres-interview.mdx b/www/_blog/2021-02-27-cracking-postgres-interview.mdx new file mode 100644 index 00000000000..12eb0ecc461 --- /dev/null +++ b/www/_blog/2021-02-27-cracking-postgres-interview.mdx @@ -0,0 +1,158 @@ +--- +title: Cracking PostgreSQL Interview Questions +description: Understand the top PostgreSQL Interview Questions +author: ant_wilson +author_title: Supabase +author_url: https://github.com/awalias +author_image_url: https://github.com/awalias.png +authorURL: https://github.com/awalias +image: elephants.png +thumb: elephants.png +tags: + - sql + - postgres +date: '02-27-2021' +--- + +There are plenty of resources out there for preparing for PostgreSQL interview questions. Most posts are for technical interviews with a focus on PostgreSQL, however many just cover the basics and the advanced resources often conflate transactional SQL with analytical SQL (WINDOW/RANK functions, aggregates etc.). + +Here, we're going to focus on PostgreSQL interview questions that are aimed to understand the transactional side of PostgreSQL, and offer some areas that you may want to go a little deeper on in order to really impress your interviewer (and more importantly, become a kick-ass software engineer). + +## 1. Modeling + +### Know how to model 1-M, M-M, 1-1 relationships. And know how to use foreign keys. + +A review of [database normalization](https://ocw.mit.edu/courses/civil-and-environmental-engineering/1-264j-database-internet-and-systems-integration-technologies-fall-2013/lecture-notes-exercises/MIT1_264JF13_lect_10.pdf) is a great place to start when thinking about how to correctly model relationships. However if you don't have the time to read through lecture notes, head over to [DBDesigner](https://app.dbdesigner.net/designer/schema/guest_template) and inspect their example schema. The table StudentCourses is a great example of how to model a Many-to-Many relationship, by using a join table. (side note: you can export these visual schemas to SQL using Ctrl+E). Modelling your data correctly is arguably the most important part of any software project, writing applications becomes a breeze if you can get the data layer right. + +### Know how to use pg rich type system: [arrays](https://www.postgresql.org/docs/current/arrays.html), [domains](https://www.postgresql.org/docs/current/domains.html), [JSONB](https://www.postgresql.org/docs/13/datatype-json.html), [timestamptz](https://www.postgresql.org/docs/current/functions-datetime.html), [enums](https://www.postgresql.org/docs/13/datatype-enum.html) + +Postgres has tons of useful types beyond the basics, knowing how to use them will show you can leverage the true power of Postgres. JSONB for example can be incredibly useful for storing non-structured data, which you can query using syntax like: + +```sql +-- grades = {'geography': 'A', 'history': 'B', 'postgres': 'A++'} +SELECT * FROM students WHERE grades->>'geography' = 'A'; +``` + +### Know about namespacing with SCHEMAs + +In Supabase for example we keep system schemas such as `extensions` and `auth` in separate schemas so that we don't pollute the default `public` schema. + +## 2. INDEXes + +### Know how speed up queries with indexes. + +The art of indexing in Postgres could fill an entire book. In some circumstances it can happen that a bad index is worse for performance than no index, so it's worth spending a little time to learn some of the common strategies. + +An index can be simple, for example, if your students table is most frequently queried on surname alone, you create an index: + +```sql +CREATE INDEX idx_students_surname +ON students(surname); +``` + +The default index type used here is `btree` (you could have specified this as `USING btree`), but there are other types of indexes, such as `BRIN`, `GiST`, `GIN`, `hash`, and more. Readers wanting to go deeper may also want to explore [Partial](https://www.postgresql.org/docs/current/indexes-partial.html) or [Multicolumn](https://www.postgresql.org/docs/13/indexes-multicolumn.html) Indexes. + +### Know how to analyze with EXPLAIN ANALYZE + +Running + +```sql +EXPLAIN (ANALYZE) SELECT * +FROM students +WHERE surname = 'Krobb'; +``` + +Before and after adding your index will show you the difference in approach the query planner took to finding your data. Note that using EXPLAIN alone will give us estimated plan costs. When used together with ANALYZE like: `EXPLAIN (ANALYZE)` you will receive both estimated and actual costs. + +## 3. VIEWs + +### Know how to create different representations of data with [VIEWs](/blog/2020/11/18/postgresql-views). + +We might create a VIEW `transcripts` which pulls out data from `students`, `courses`, and `grades`. It's useful for security, and logical abstractions. Check out our longer post on VIEWs here: [/blog/2020/11/18/postgresql-views](/blog/2020/11/18/postgresql-views). Some purists may argue that you should always query VIEWs and never TABLEs. + +### Know about Autoupdatable views. + +If a VIEW is named as the target relation in an INSERT, UPDATE, or DELETE and only SELECTs from a single base relation, then the underlying subquery is automatically rewritten to update the underlying base relation instead. + +### Limitations on VIEWs + +One example of a limitation is when a VIEW is not Autoupdatable. This happens when the VIEW does not SELECT from a single base relation. If the user does not specify an INSTEAD OF trigger that upgrades the underlying query, then an error will be thrown, since the executor cannot update a view as such. + +## 4. ROLEs + +### Know how to secure their database. Permissions at the table, column, row level. + +All databases have different user types, your client for example doesn't usually need the ability to create and drop schemas, but your DB admin does. You should play around with [creating roles](https://www.postgresql.org/docs/current/database-roles.html), and [granting](https://www.postgresql.org/docs/current/role-membership.html) various permissions. + +### Know about [ROLEs](https://www.postgresql.org/docs/13/sql-createrole.html), application ROLEs, the PUBLIC role, and [GRANTs](https://www.postgresql.org/docs/current/sql-grant.html) + +In Postgres, the special “role” name PUBLIC can be used to grant a privilege to every role on the system. For example, if you want to grant insert access to all users on table students: + +```sql +GRANT INSERT ON students TO PUBLIC; +``` + +### Know how to do RLS - Policies + +We use Row Level Security in Supabase as a way to grant/restrict access on a row level basis. For example if you're writing a Discord clone, perhaps only a given user should be able to write their own messages: + +```sql +CREATE POLICY "Individuals can only write their own messages." ON messages FOR + INSERT WITH CHECK (auth.uid() = user_id); + +-- auth.uid() is a function provided by Supabase which plucks the uid out +-- of the JWT sent along with an API request more on this here: +-- https://www.youtube.com/watch?v=0LvCOlELs5U +``` + +## 5. FUNCTIONs + +### Know how to do business logic on SQL/[PLPGSQL](https://www.postgresql.org/docs/current/plpgsql-overview.html#PLPGSQL-ADVANTAGES) + +PL/pgSQL is a procedural programming language that can be used to write functions inside of your database. It can be useful for making [remote procedure calls](/docs/reference/javascript/rpc) from an API. You can go as deep as you want here, since it's an entire programming language, but understanding the basics will really go a long way, and give you super powers when working with your data. + +You can use FUNCTIONs in combination with TRIGGERs to do cool stuff like have auto-updating `updated_at` columns on your data: + +```sql +-- a function that sets the updated_at value to now() +CREATE FUNCTION set_updated_at() +RETURNS TRIGGER AS $$ +BEGIN + new.updated_at = now(); + RETURN NEW; +END; +$$ LANGUAGE plpgsql; + +-- a trigger that fires when students table is updated +CREATE TRIGGER handle_updated_at + BEFORE UPDATE ON students + FOR EACH ROW + EXECUTE PROCEDURE set_updated_at(); +``` + +### Thinks in SETs when doing logic + +Whilst PL/pgSQL does have [loops](https://www.postgresql.org/docs/current/plpgsql-control-structures.html#PLPGSQL-CONTROL-STRUCTURES-LOOPS) and [cursors](https://www.postgresql.org/docs/current/plpgsql-cursors.html), there is usually a faster and more legible pure SQL based solution available using JOIN/UNION etc. So it's important to become well acquainted with thinking in these terms. + +### Know how to use [CTEs](https://www.postgresqltutorial.com/postgresql-cte/) + +Common table expressions are temporary or intermediate result sets. They can make your queries more readable and even enable recursion. The typical form is: + +```sql +WITH ten_strumpers AS ( + SELECT id, first_name + FROM students + WHERE surname = 'Strumper' + ORDER BY first_name + LIMIT 10 +) +SELECT id +FROM ten_strumpers +WHERE first_name LIKE "S%"; +``` + +If you can reason about most of the topics in this post then you'll be in a very strong position to impress with your answers to PostgreSQL interview questions. As with all programming topics however, the real learning starts when you put these things into practice. At Supabase we offer a very very fast (the fastest?) way to spin up a PostgreSQL database and start querying it, and our browser based SQL editor is getting more powerful every day. + +[Get started on Supabase for free here](https://app.supabase.io) + +Thanks Steve Chavez for providing all the good bits of this post :) diff --git a/www/_blog/2021-03-02-supabase-beta-february-2021.mdx b/www/_blog/2021-03-02-supabase-beta-february-2021.mdx new file mode 100644 index 00000000000..3114e75a55a --- /dev/null +++ b/www/_blog/2021-03-02-supabase-beta-february-2021.mdx @@ -0,0 +1,111 @@ +--- +title: Supabase Beta February 2021 +description: One year of building. +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: /images/blog/release-feb-2021.jpg +tags: + - release-notes +date: '03-02-2021' +--- + +Supabase is an open source Firebase alternative. We've now been building for one year. Here's what we released last month. + + + +### Quick demo + +Watch a full demo: + + + +### Dashboard Sidebars + +We've improved the UX of our Dashboard with sidebars in every section, including the Table view, the Auth section, and the SQL Editor. + +![Our dashboard has sidebars](/images/blog/feb/sidebar-tables.png) + +### SQL Autocomplete + +Writing SQL just got 10x easier. We added autocomplete to the SQL editor, including table & column suggestions. + + + +### Auth Redirects + +Redirect your users to specific route within your site on [`signIn()`](/docs/reference/javascript/auth-signin#sign-in-with-redirect) and [`signUp()`](/docs/reference/javascript/auth-signup#sign-up-with-redirect). + +![Redirect your users after sign up](/images/blog/feb/auth-redirect.png) + +### Replication management + +We added a page to the Database section for managing Postgres Replication. It's still basic, but you can use it to manage your realtime API - choosing which tables are enabled, and which events to send. + +![Replication management](/images/blog/feb/manage-replication.png) + +### Learning Resources + +We've released a new [Resources](/docs/resources) section in our docs, as well as two new Auth modules: [GoTrue Overview](/docs/learn/auth-deep-dive/auth-gotrue) and [Google OAuth](/docs/learn/auth-deep-dive/auth-google-oauth). + +![Our dashboard has sidebars](/images/blog/feb/docs-resources.png) + +### New Region + +Launch your database in South Africa. + +![Launch your database in South Africa](/images/blog/feb/new-region-south-africa.png) + +### Kaizen + +- We filled up our [Examples](/docs/guides/examples) page with a lot of new content. +- We released a [Docker Compose](https://github.com/supabase/supabase/blob/master/docker/docker-compose.yml) file for running Supabase locally. This will be used in our upcoming CLI. +- We have a couple of pending RFCs which you may want to participate in: + - [Planning our CLI and Local Development](https://github.com/supabase/cli/pull/2) + - [Connection Pooling on Supabase](https://github.com/supabase/postgres/blob/rfc/connection_pooling/rfcs/0001-connection-pooling.md) + +### Community + +One of the community, [@ftonato](https://github.com/ftonato), has built an amazing [example](https://github.com/supabase/supabase/tree/master/examples/with-stencil) that shows how to use Supabase with [Stencil](https://stenciljs.com/) (a Web Component compiler built by they [Ionic](https://ionicframework.com/) team.) + +[Check it out!](https://github.com/supabase/supabase/tree/master/examples/with-stencil) + +![Supabase with Stencil](/images/blog/feb/supabase-stencil.png) + +- @kiwicopple on the LogRocket Podcast. [Link](https://podrocket.logrocket.com/9) +- @bdougie Livestream: More Fullstack React w RedwoodJS + Supabase. [Link](https://www.twitch.tv/videos/907698954) +- @gbibeaul created `useSupabase`: Supabase React Hooks. [GitHub](https://www.npmjs.com/package/use-supabase) + +We hit 6000 GitHub stars on [GitHub](https://github.com/supabase/supabase) + +![This image shows the Supabase GitHub star growth.](/images/blog/feb/github-stars-feb-2021.png) + + + Source: repository.surf/supabase + + +### Coming next + +Waiting for Supabase Storage? Here's a sneak peek for the upcoming Launch Week at the end of March. + +![Supabase Storage coming soon](/images/blog/feb/supabase-storage.png) + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io/) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Subscribe to our [YouTube channel](https://www.youtube.com/c/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2021-03-05-postgres-as-a-cron-server.mdx b/www/_blog/2021-03-05-postgres-as-a-cron-server.mdx new file mode 100644 index 00000000000..03a24fd5a8d --- /dev/null +++ b/www/_blog/2021-03-05-postgres-as-a-cron-server.mdx @@ -0,0 +1,214 @@ +--- +title: Postgres as a CRON Server +description: Running repetitive tasks with your Postgres database. +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: supabase-postgres-cron.png +thumb: supabase-postgres-cron.png +tags: + - postgres +date: '03-05-2021' +--- + +A Supabase user asked recently if they can trigger a webhook periodically. We haven't yet released Functions yet, so we checked whether it's possible with Postgres. + +It is. Here's how. + + + +### What's cron? + +A "cron job" is a script[^1] that runs periodically at fixed times, dates, or intervals. Traditionally you'd set it up on a Linux server. An example might be an hourly script that downloads emails to your computer. + +[^1]: Not necessarily a script. The cron is really a scheduler which triggers a job (of some sort, usually a bash script). + +These days, cron jobs are set up on a remote servers and in the cloud to run internet-related tasks. Like checking an endpoint every hour, or scraping a website every day. + +### Postgres + cron + +Postgres has "extensions" which allow you to, well, extend the database with "non-core" features. Extensions essentially turn Postgres into an application server. + +The team at [Citus](https://github.com/citusdata) created [`pg_cron`](https://github.com/citusdata/pg_cron) to run periodic jobs within your Postgres database. + +#### Enabling the extension + +If you're using a cloud-hosted Postgres database, make sure that `pg_cron` is installed first. The easiest way to do this is to run this command: + +```sql +select name, comment, default_version, installed_version +from pg_available_extensions +where name = 'pg_cron'; +``` + +If it returns a result then the extension is supported and you can turn it on by running: + +```sql +create extension if not exists pg_cron; +``` + +If you're using Supabase you can also enable it in the Dashboard. + +![This image shows that pg_cron is enabled in the Supabase Dashboard](/images/blog/supabase-extensions.png) + +#### Granting access to the extension + +If you're planning to use a `non-superuser` role to schedule jobs, ensure that they are granted access to the `cron` schema and its underlying objects beforehand. + +```sql +grant usage on schema cron to {{DB user}}; +grant all privileges on all tables in schema cron to {{DB user}}; +``` + +Failure to do so would result in jobs by these roles to not run at all. + +### Postgres + webhooks + +The Supabase customer wanted to call external endpoints every day. How would we do this? Another extension of course. This time we're going to use [pgsql-http](https://github.com/pramsey/pgsql-http) by [@pramsey](https://github.com/pramsey). Using the same technique, we can enable the extension (if it exists in your cloud provider). + +```sql +create extension if not exists http; +``` + +This extension can now be used for [sending](https://github.com/pramsey/pgsql-http#functions) `GET`, `POST`, `PATCH`, and `DELETE` requests. + +For example, this function would get all the people in Star Wars (using the [Star Wars API](https://swapi.dev)): + +```sql +select content::json->'results' +from http_get('https://swapi.dev/api/people'); +``` + +### Postgres + cron + webhooks + +Now the fun stuff. For this example we're going to call [webhook.site](https://webhook.site) every minute with the payload `{ "hello": "world" }`. + +Here's the code (with comments `--like this`). + +```sql +select + cron.schedule( + 'webhook-every-minute', -- name of the cron job + '* * * * *', -- every minute + $$ + select status + from + http_post( + 'https://webhook.site/223c8a43-725b-4cbd-b1fe-d0da73353a6b', -- webhook URL, replace the ID(223c8..) with your own + '{"hello": "world"}', -- payload + 'application/json' + ) + $$ + ); +``` + +Now when we see that the payload is sent every minute, exactly on the minute. + +![This image shows the website that receives our webhook every minute.](/images/blog/website-hook.jpeg) + +And that's it! We've built a cron webhook. Breaking down the code example above we have 2 key parts: + +#### POSTing data + +This is the part that sends the data to the website: + +```sql +select status +from + http_post( + 'https://webhook.site/223c8a43-725b-4cbd-b1fe-d0da73353a6b', -- webhook URL + '{"hello": "world"}', -- payload + 'application/json' + ) +``` + +#### Scheduling the job + +The HTTP function is wrapped with the CRON scheduler: + +```sql +select + cron.schedule( + 'cron-name', -- name of the cron job + '* * * * *', -- every minute + $$ + -- Put your code between two dollar signs so that you can create full statements. + -- Alternatively, you can write you code in a Postgres Function and call it here. + $$ + ); +``` + +The second parameter uses cron syntax: + +```sh + ┌───────────── min (0 - 59) + │ ┌────────────── hour (0 - 23) + │ │ ┌─────────────── day of month (1 - 31) + │ │ │ ┌──────────────── month (1 - 12) + │ │ │ │ ┌───────────────── day of week (0 - 6) (0 to 6 are Sunday to + │ │ │ │ │ Saturday, or use names; 7 is also Sunday) + * * * * * +``` + +If you're unfamiliar with the cron syntax, useful shortcuts can be found on [crontab.guru](https://crontab.guru/) + +```sh +* * * * * # every minute +*/5 * * * * # every 5th minute +0 * * * * # every hour +0 0 * * * # every day +``` + +#### Managing your cron jobs + +To see a list of all your cron jobs, run: + +```sql +select * from cron.job; +``` + +And if you need to see the results of each cron iterations, you can find them in `cron.job_run_details`: + +```sql +select * from cron.job_run_details; +``` + +To stop a running cron job, you can run: + +```sql +select cron.unschedule('webhook-every-minute'); -- pass the name of the cron job +``` + +### What can I do with this? + +There are plenty use-cases for this. For example: + +- **Sending welcome emails.** If you use an email provider with an HTTP API, then you batch emails to that service. Write a function that `selects` all your signups yesterday, then sends them to your favorite transactional email service. Schedule it every day to run at midnight. +- **Aggregating data.** If you're providing analytical data, you might want to aggregate it into time periods for faster querying (which serves a similar purpose as a [Materialized View](/blog/2020/11/18/postgresql-views#materialized-views-vs-conventional-views)). +- **Deleting old data.** Need to free up space? Run a scheduled job to delete data you no longer need. + +See a detailed list in the [`pg_cron` README](https://github.com/citusdata/pg_cron#example-use-cases). + +## Addendum + +### Postgres background workers + +You might have noticed [this](https://github.com/pramsey/pgsql-http#why-this-is-a-bad-idea) notice the warning at the bottom of the `http` readme: + +> "What happens if the web page takes a long time to return?" Your SQL call will just wait there until it does. Make sure your web service fails fast. + +Luckily pg_cron implements [Background Workers](https://paquier.xyz/postgresql-2/postgres-9-3-feature-highlight-custom-background-workers/): + +> Care is taken that these extra processes do not interfere with other postmaster tasks: only one such process is started on each ServerLoop iteration. This means a large number of them could be waiting to be started up and postmaster is still able to quickly service external connection requests. + +This means that even if your endpoint takes a long time to return, it's not going to be blocking your core Postgres functions. Either way, you should probably only call endpoints that will return a response quickly, or set the http extension to fail fast (`http.timeout_msec = 300`). + +If you're familiar with `C`, you could also help `@pramsey` to implement async functions: https://github.com/pramsey/pgsql-http/issues/105 + +### Should I use Postgres as a cron server? + +There are plenty of ways to run cron jobs these days. You can trigger them from your local machine. You can install them on a VPS. You can schedule Serverless functions. You can use a paid service. You can use GitHub Actions. + +Is Postgres the best place to put your cron jobs? `¯\_(ツ)_/¯`. Postgres databases are free on Supabase and since it takes only one minute to [get started](https://app.supabase.io/), why not make your next cron server a Postgres database? diff --git a/www/_blog/2021-03-08-toad-a-link-shortener-with-simple-apis-for-low-coders.mdx b/www/_blog/2021-03-08-toad-a-link-shortener-with-simple-apis-for-low-coders.mdx new file mode 100644 index 00000000000..a87778aaeb0 --- /dev/null +++ b/www/_blog/2021-03-08-toad-a-link-shortener-with-simple-apis-for-low-coders.mdx @@ -0,0 +1,42 @@ +--- +title: Toad, a link shortener with simple APIs for low-coders +description: An easy-to-use link shortening tool with simple APIs +author: rory_wilding +author_title: Supabase +author_url: https://github.com/roryw10 +author_image_url: https://github.com/roryw10.png +authorURL: https://github.com/roryw10 +image: toadli-og.jpg +thumb: toadli-website.jpg +tags: + - supabase + - case-study +date: '03-08-2021' +--- + +Zach Waterfield is an engineer, investor, and founder of Kopa - a short term furnished rental marketplace with operations in over 400 cities in the USA. Zach's latest project, [Toad](https://toadli.co/), is an easy-to-use link shortening tool with simple APIs, aimed to empower low-coders. Toad provides a simple dashboard, analytics, and API designed with low-coders in mind. + +Learn why Zach used Supabase as part of his serverless SAAS setup. + +### Toad APIs for low Coders + +Zach loves link shorteners. However, for low-coders, link shorteners tend to have cumbersome APIs limiting their utility. He wanted to build a link shortening tool with simple APIs that are simple for no-coders to use. + +## The power of a serverless Supa-stack + +Zach started this project with a low-management overhead in mind. He needed a robust and scalable stack that doesn't need refactoring when his service user volume grows. Zach knew that a back-end as-a-service abstracts away many of the dev-ops tasks, such as provisioning server instances and setting up databases. From experience, he knew that Firebase would be too cumbersome. + +Zach decided that combining Supabase, Lambda functions, Next.js, TailwindCSS, and Vercel would be the perfect Supa-stack to achieve his goal of low-management overhead. This setup removes significant dev-ops headaches with no need to think about continuous integration - when he wants to make a change, it is good to go. As a bonus, this setup is virtually free until he reaches significant user volumes. + +### Build it once, use it forever + +Zach was surprised how rapidly he was able to build and deploy Toadli. He now has a template project that he plans to customise for future SaaS services. Zach has a stack that is scalable, reusable, and low-management. Toad has early paying customers, and traffic volumes are increasing as low-coders become aware of how easy Toad APIs are to use. + + + Full Serverless is an amazing developer experience. You can get high-quality results fast, + especially when Supabase abstracts away all the back-end headaches + + +## Spend more time creating and less time managing back ends + +Thanks to Supabase, Zach is able to focus on the creative process and launch services like [Toad](https://toadli.co/) with all the functionality he wants to offer. He has peace of mind that his stack is low-management and will scale as his project continues to gain traction. diff --git a/www/_blog/2021-03-11-using-supabase-replit.mdx b/www/_blog/2021-03-11-using-supabase-replit.mdx new file mode 100644 index 00000000000..01ddfb71f7d --- /dev/null +++ b/www/_blog/2021-03-11-using-supabase-replit.mdx @@ -0,0 +1,135 @@ +--- +title: Using Supabase in Replit +description: Free hosted relational database from within your node.js repl +author: ant_wilson +author_title: Supabase +author_url: https://github.com/awalias +author_image_url: https://github.com/awalias.png +authorURL: https://github.com/awalias +image: replit-og.jpg +thumb: replit-og.jpg +tags: + - replit + - node-js + - postgres +date: '03-11-2021' +--- + +[Replit.com](http://replit.com) is an awesome new browser based IDE where you can code alone or collaboratively with friends using their awesome multiplayer features! It's particularly useful for education, and sharing code examples with others. + +They support a ton of different languages and execution environments and even recently introduced a simple key value store you can use to persist data. + +As a Replit user, if you want to access larger amounts of data direct from your repl, or if you fancy accessing some super-powerful query tools, at some point you may want to start interacting with a relational database. Supabase is a good fit here; just like Replit, you don't need to worry about servers, and hosting, you can just click a few buttons and get a fully featured relational database which you can start communicating with directly from javacript, using supabase-js. + + + +Here's how to start a Supabase + Node.js repl: + +Sign up for [replit.com](http://replit.com) and hit new repl in the top left + +![Untitled-2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u3dljulzsyqu58i75epn.png) + +Select node.js, give it a name, and click Create repl + +![Untitled-1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7rcfbb12sfabevto571j.png) + +Import supabase's createClient method and hit run to install the required libs: + +```jsx +const { createClient } = require('@supabase/supabase-js') +``` + +Setup a new Supabase project and grab the URL and anon key from Settings > API. Create the client in javascript using: + +```jsx +const supabase = createClient( + 'https://ajsstlnzcmdmzbtcgbbd.supabase.co', + 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...' +) +``` + +![Untitled-3](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5j5aqyjdh74qm83slmli.png) + +Now that supabase is connected you'll want to add some data to your db, you can grab any SQL dataset on the web, or make your own, but the fasted way to test is to open the SQL tab in the Supabase dashboard and click the Countries sample database and click Run. + +![Untitled-4](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/54yykm6h9hqpric87zad.png) + +From within your repl you can now query your countries table like: + +```jsx +// .then() syntax +supabase. + .from('countries') + .select('*') + .limit(5) + .then(console.log) + .catch(console.error) + +// or... +// async/await syntax +const main = async() => { + let { data, error } = supabase + .from('countries') + .select('*') + .limit(5) + + if (error) { + console.log(error) + return + } + + console.log(data) +} +main() +``` + +Once this is working, if you want to learn more about the [query interface](/docs/reference/javascript/filter) you might want to try some of these challenges: + +```jsx +// 1. List all the countries in Antarctica +// 2. Fetch the iso3 code of the country with ID 3 +// 3. List the countries with 'Island' in the name +// 4. Count the number of countries that start with 'Z' or 'Q' +// 5. Fetch all the Countries where continents is null +``` + +There are full solutions provided in the video version of this blog, but some examples you may find useful are: + +```jsx +// or +const { data, error } = await supabase + .from('cities') + .select('name, country_id') + .or('id.eq.20,id.eq.30') + +// is +const { data, error } = await supabase.from('cities').select('name, country_id').is('name', null) + +// in +const { data, error } = await supabase + .from('cities') + .select('name, country_id') + .in('name', ['Rio de Janeiro', 'San Francisco']) + +// neq (not equal to) +const { data, error } = await supabase + .from('cities') + .select('name, country_id') + .neq('name', 'The shire') + +// full docs here: /docs/reference/javascript/filter +``` + +We look forward to showing off some more Supabase + Replit examples. + +You can find my example repl here: [https://repl.it/@awalias/supabase-test#index.js](https://repl.it/@awalias/supabase-test#index.js) + +Supabase has a free tier, head over to [https://app.supabase.io](https://app.supabase.io) to get started. diff --git a/www/_blog/2021-03-22-In-The-Loop.mdx b/www/_blog/2021-03-22-In-The-Loop.mdx new file mode 100644 index 00000000000..7312d6ba0d5 --- /dev/null +++ b/www/_blog/2021-03-22-In-The-Loop.mdx @@ -0,0 +1,42 @@ +--- +title: Developers stay up to date with intheloop.dev +description: Learn why Kevin is building intheloop.dev with Supabase +author: rory_wilding +image: intheloop-supabase.jpg +thumb: intheloop-supabase.jpg +tags: + - supabase + - postgres + - open-source +date: '03-22-2021' +--- + +Kevin Grüneberg is a freelance engineer who has been programming since he was 12 years old. His latest project, intheloop.dev, provides a single gateway for developers to stay up to date. + +## At the leading edge of Developer updates + +As a developer, Kevin loves to stay up to date with the latest technology. Within his network, he also finds himself the go-to person to help his colleagues stay up to speed by searching through Twitter, staying active in forums, and searching out different tech communities. He knows this insight will help others stay up to date at scale, so created intheloop.dev. + +Intheloop.dev is a single point of entry for developers to stay up to date on the topics they care about by aggregating feeds from various sources. It serves as an on-ramp to finding the communities you care about, monitor releases and change logs, critical tweets, and blogs of interest. + +Kevin is launching with coverage on three packages - React, Kotlin and Vite. He is also part of the [#buildinpublic](https://twitter.com/search?q=%23buildinpublic&src=typed_query) movement, In The Loop is open-source - you can [check it out on GitHub](https://github.com/kevcodez/intheloop). Kevin also developed open-source [Gotrue](https://github.com/supabase/gotrue-kt) and [PostgREST](https://github.com/supabase/postgrest-kt) Kotlin clients for Supabase. + +![intheloop.dev screenshot](/images/blog/intheloop-screenshot.jpg) + +## Sometimes Firebase just isn't enough + +With over seven years of experience working with relational databases, Kevin knows how powerful Postgres is. Kevin is a Firebase user and knows first hand that he can build fast with Firebase. However, straightforward tasks in Postgres like count functionality, foreign key relations and database normalisation are either insanely difficult or impossible to achieve using Firebase. With Supabase, he gets the benefits of Postgres with the development pace of Firebase. Because he uses Supabase as the backend, it will be easy to add more features in future, like user accounts, when he is ready. + +## Supabase gives Developers Postgres Supapowers + +Kevin loves building with Supabase because of SQL and other Postgres features like constraints, views, and materialised views. Using all these features quickly and efficiently is amazing for Kevin when he knows Supabase is just as easy to integrate as Firebase. + + + Supabase building on top of Postgres is a true superpower for developers. Postgres is already + insanely powerful, and having much more functionality out of the box means I can build quickly and + continue to scale + + +## Launch fast and have confidence in adding more functionality with Supabase + +With Supabase, Kevin can focus on his idea's core rather than worrying about his tech stack. Intheloop is just getting started with additional features coming like notifications, following topics, and developers to build a personal digest which is where the real time-saver begins. With Postgres under the hood, Kevin can add functionality to delight his users without worrying about his data model. You can sign up to stay in the loop [here](https://intheloop.dev/). diff --git a/www/_blog/2021-03-25-angels-of-supabase.mdx b/www/_blog/2021-03-25-angels-of-supabase.mdx new file mode 100644 index 00000000000..11a1c0e6dd1 --- /dev/null +++ b/www/_blog/2021-03-25-angels-of-supabase.mdx @@ -0,0 +1,352 @@ +--- +title: Angels of Supabase +description: Meet the investors of Supabase. +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: angels-of-supabase.png +thumb: angels-of-supabase.png +tags: + - fundraising +date: '2021-03-25' +--- + +Supabase is an open source Firebase alternative. We're on a mission to build an incredible developer experience around +the world's best open source tools. + +To build an amazing developer experience, we need developers to guide us. So after finishing Y Combinator, we took a +deliberate approach to fundraising. We loaded our Seed round with developers, technical founders, and developer advocates: +CTOs who have seen scale, community managers, and hackers. We amassed over 20 angel investors - almost all technical. + +The Supabase Team is at full capacity preparing for [Launch Week](/blog/2021/03/25/launch-week) and since we're all short on time we decided - +why not ask our Angels to write a fundraising post with us? + +So here is our unconventional fundraising announcement, written with a few of the Angels of Supabase. + +## Mike Krieger (Instagram) + +Mike Krieger Supabase + +Cofounder & CTO of Instagram. [@mikeyk](https://twitter.com/mikeyk) + +#### How many hours per week do you spend coding? + +~30 these days + +#### Why did you invest in Supabase? + +Supabase is building tools that are foundational to almost any interactive, modern app, and doing so in a way that's +really aligned with how I think of building tech stacks. For example, choosing Postgres (and deeply understanding +Postgres' features) as the underlying datastore. + +#### Do you write SQL in uppercase or lowercase? + +Uppercase but I'm coming around to lowercase! + +#### What was the first program you wrote and what was it written with? + +A website that I built so I could skip out on writing a school paper instead — HTML and Image ``s for interactivity. + +#### What's the worst programming error you've ever made? + +On launch day for Instagram, the site was down for a good chunk of time because we hadn't set a favicon.ico _and_ +we had Django set up to email us on all errors. Cue storm of email sends every time someone loaded our homepage…and a very unhappy web server. + +#### If you could only use one programming language for the rest of your life, what would it be? + +Python — though I am very intrigued by Rust. + +#### If someone wanted to do what you do, what's a piece of advice you'd give them? + +Stay curious and don't feel like everything you build has to be "the next big thing"; so many times I've worked on a +fun side project or exploration and ended up learning something I applied to more "serious" work. + +## Cassidy Williams (Netlify) + +Cassidy Williams Supabase + +Principal Developer Experience Engineer at Netlify. Outside of that, makes memes, classes, talks, and content for +developers. [@cassidoo](https://twitter.com/cassidoo) + +#### How many hours per week do you spend coding? + +Probably around 20, depending on the week. Sometimes more! + +#### Why did you invest in Supabase? + +It's a good tech stack and a tool that I think fills a need for a lot of folks. + +#### Do you write SQL in uppercase or lowercase? + +Uppercase! + +#### What was the first program you wrote and what was it written with? + +I started making websites as a teenager, and programmed my graphing calculator with good ol' BASIC! + +#### When was the first time you used a computer and what did you do with it? + +Oh I was a kid, and definitely used it only for CD-ROM games in those dial-up days. + +#### Would you rather fight 100 duck-sized horses or 1 horse-sized duck? + +100 duck-sized horses, because I'm a weakling and could probably do better with the smaller things as long as +they aren't too organized. + +#### If you could only use one programming language for the rest of your life, what would it be? + +Probably JavaScript. It's gotten to that level of power that I could apply it to almost anything. + +#### If someone wanted to do what you do, what's a piece of advice you'd give them? + +Get a calendar you'll actually use and stick to your to-do lists! + +## Thorsten Schaeff (Stripe) + +Thorsten Schaeff Supabase + +Helps developers grow the GDP of the Internet as a Developer Advocate at Stripe. [@thorwebdev](https://twitter.com/thorwebdev) + +#### How many hours per week do you spend coding? + +Really depends on the projects I'm working on. Sometimes I spend a good amount of time making videos. + +#### Why did you invest in Supabase? + +The team | The Culture | The DX + +#### Do you write SQL in uppercase or lowercase? + +lowercase - I prefer not to scream at my DB. + +#### What was the first program you wrote and what was it written with? + +My first proper project was probably at uni, building an app to alert wind surfers of great wind conditions. +Was built with Python on a Raspberry Pi, jQuery and PhoneGap + +#### When was the first time you used a computer and what did you do with it? + +When I was 9 years old my dad signed me up for an HTML summer camp. That's how it all started :D + +#### Would you rather fight 100 duck-sized horses or 1 horse-sized duck? + +I think there's a market for duck-sized horses. Would capture and sell them. Also duck's have some nasty claws, +wouldn't be a good idea to make them bigger! + +#### If you could only use one programming language for the rest of your life, what would it be? + +I'd do anything and everything in TypeScript if I could! + +#### If someone wanted to do what you do, what's a piece of advice you'd give them? + +Get involved with and start contributing to open-source. Start creating content about your open-source contributions, +and I'm certain that it will pay off! + +## Brian Douglas (GitHub) + +Brian Douglas Supabase + +Staff Developer Advocate at GitHub. [@bdougieyo](https://twitter.com/bdougieyo) + +#### How many hours per week do you spend coding? + +~10 hours a week. + +#### Why did you invest in Supabase? + +Supabase is scratching an itch for me as a developer. I see the value of having a manageable database based on SQL, +but I don't only have limited time to code during the week and I don't want that to get sucked into the maintenance +and management of that data. I also was a big Firebase fan, and love the developer ergonomics if offered to me as an early user. + +#### Do you write SQL in uppercase or lowercase? + +Always uppercase, but don't ask me what the acronym stands for. + +#### What was the first program you wrote and what was it written with? + +The first function programming was an Android app in Java that was just a picture of a cat. When you pet the cat it purred, +it was part of an Android tutorial when I thought I wanted to be an Android dev. I later got an iPhone and decided to never +write Java again when I found Ruby on Rails. I built a Yelp clone for churches, but bailed on that when I took a full time dev role. + +#### When was the first time you used a computer and what did you do with it? + +My first time using a computer was in second grade and it was to play wolfenstein. We had a computer that we could use in +the office of the apartment complex I grew up in. One of the older kids installed the game and showed the other kids how +to run in from powershell. Probably not the best game to introduce to a 7 year old, but here we are. + +#### If someone wanted to do what you do, what's a piece of advice you'd give them? + +I would tell them to start with creating short form content every day. It easier to make content on things you just +learned, so do that. It is also easier to get hired when you already have content. + +## Justin Gage (Retool) + +Justin Gage Supabase + +Growth at Retool. Writes [a newsletter](https://technically.dev/) that helps people understand software engineering and tech. +[@itunpredictable](https://twitter.com/itunpredictable) + +#### How many hours per week do you spend coding? + +It depends – some weeks I’m mostly writing and coordinating, other weeks I’m writing a lot of code. Lets say 20 hours on a good week :) + +#### Why did you invest in Supabase? + +I had been working on the Firebase integration at Retool for a bit, and kept wondering why it was (a) closed source +and (b) NoSQL only. Over the span of a week, something like 5 or 6 of my developer friends asked me what I thought +about Supabase, so I checked it out – after using the product for a side project, investing was an easy decision. + +#### Do you write SQL in uppercase or lowercase? + +Lowercase, obviously. I wrote thousands of queries when I worked at DigitalOcean, and we didn’t have time to capitalize things. + +#### If you could only use one programming language for the rest of your life, what would it be? + +SQL (particularly standard Postgres syntax) is the best language on the planet. Fight me. + +#### If someone wanted to do what you do, what's a piece of advice you'd give them? + +Eh, I can’t really give advice, I haven’t figured anything out myself yet! + +## Iheanyi Ekechukwu (PlanetScale) + +Iheanyi Ekechukwu Supabase + +Senior Software Engineer at PlanetScale. [@kwuchu](https://twitter.com/kwuchu) + +#### How do you pronounce your name? + + + +#### How many hours per week do you spend coding? + +Pretty much, the majority of my week is spent coding. I'd say realistically, around 30-ish hours a week or so. + +#### Why did you invest in Supabase? + +The tagline about Supabase being an "open-source Firebase alternative" had me intrigued. As I looked more deeply into +the product, I was impressed by the well-thought out design and also how easy it is to use the product as well. + +#### Do you write SQL in uppercase or lowercase? + +Uppercase. + +#### When was the first time you used a computer and what did you do with it? + +During summers as a child, my dad would take me to work with him at the community college he taught at. I'd be sitting +in his office while he was in lectures and actually just use his computer to play that 3D Space Pinball game. I think +I was 5 or 6 years old at the time. + +#### If you could only use one programming language for the rest of your life, what would it be? + +Honestly, I would probably choose Go. It's a pretty dope language for building out systems. + +#### If someone wanted to do what you do, what's a piece of advice you'd give them? + +Always be learning. There's so many things to learn as an engineer and the job is constantly about learning new things. +Never settle, never get comfortable, learn as much as you can consistently. + +## Zach Waterfield (On Deck) + +Zach Waterfield Supabase + +Engineer at OnDeck, Network Leader at Village Global, Founder of Kopa (W19). [@zlwaterfield](https://twitter.com/zlwaterfield) + +#### How many hours per week do you spend coding? + +Anywhere from 10 to 50 depending on the week + +#### Why did you invest in Supabase? + +I have many ideas, and spinning up a backend, db, etc., is so daunting, so I started using Firebase, but it was very +frustrating. When I saw Supabase I instantly knew that was the solution. The ability to use Postgres directly from the +client with authentication built-in was a game-changer. I think it could become the go-to that early-stage companies +build on to simplify their MVPs. + +#### Do you write SQL in uppercase or lowercase? + +UPPERCASE + +#### When was the first time you used a computer and what did you do with it? + +Weirdly enough, I didn't own a computer until I was in grade 12 and didn't learn to code until I was in University. +I was the only one in a class of 400+ freshman engineers that had never coded before. + +#### If someone wanted to do what you do, what's a piece of advice you'd give them? + +Network, network, network. Everything I do and all my successes are based on my network. Whether that be from YC, my +university peers, OnDeck, Twitter, etc. Focus on building your network, and good opportunities will start to pop up. + +## Shawn Wang (Temporal) + +Shawn Wang Supabase + +Head of Developer Experience at Temporal. [@swyx](https://twitter.com/swyx) + +#### How many hours per week do you spend coding? + +10 + +#### Why did you invest in Supabase? + +I was extremely impressed by the founders and love the idea of offering a beautiful, integrated developer experience atop +of proven, scalable, open source foundations. + +#### Do you write SQL in uppercase or lowercase? + +Uppercase if formal, lowercase if lazy! + +#### What was the first program you wrote and what was it written with? + +We had a computer class in middle school and we were assigned to write a pancake stacking program in BASIC. I was really +obsessed by it and was the only person to submit this assignment complete with a graphical user interface (in BASIC!). +Sadly I didn't see myself as a programmer until 20 years later. + +#### If someone wanted to do what you do, what's a piece of advice you'd give them? + +[Learn in Public](https://www.swyx.io/LIP) :) + +## By the way + +We [raised](https://techcrunch.com/2020/12/15/supabase-raises-6m-for-its-open-source-firebase-alternative/) a $6M seed +round led by Coatue, Mozilla, and YC. + +Next week is [Launch Week](/blog/2021/03/25/launch-week) and we'll be launching one new thing every day for a week. + +[Check it out](/blog/2021/03/25/launch-week)! diff --git a/www/_blog/2021-03-25-launch-week.mdx b/www/_blog/2021-03-25-launch-week.mdx new file mode 100644 index 00000000000..68b397a2f61 --- /dev/null +++ b/www/_blog/2021-03-25-launch-week.mdx @@ -0,0 +1,128 @@ +--- +title: Launch week +description: Five days of Supabase. +author: ant_wilson +author_title: Supabase +author_url: https://github.com/awalias +author_image_url: https://github.com/awalias.png +authorURL: https://github.com/awalias +image: supabase-launch-week.png +thumb: supabase-launch-week.png +tags: + - storage + - pricing + - developers +date: '2021-03-25' +--- + +When we joined Y Combinator last summer, we spent the entire 3-month program building one (major) feature: Auth. + +Demo Day gave our team something to rally around. The looming deadline forced us to deliver a lot of complex functionality in a short amount of time. + +After we finished YC, we recreated Demo Day conditions internally: we gave ourselves a 3-month timeline to move from Alpha to Beta. + +It worked wonders. We made [giant leaps forward](/beta) in the performance, security, and +stability of the platform. + +The day after our Beta announcement (still high on the adrenaline of the launch) we asked ourselves: +what's the most ambitious thing we can hope to launch 3 months from now? + +We decided not to settle for just one major feature. We wanted to fill an entire week with launches and announcements. + +Looking at the list of features we planned, and with the relatively small team we have, this felt like a hugely ambitious idea. +But after another 3 months of building, we're happy to announce that... + +Starting on Monday 29th March, we'll be commencing our Launch Week! + +## What to expect + +We don't want to spoil the surprise, so for now we'll give you a teaser of what to expect. Come back here each day to see what we launch, +or follow us on twitter to keep up to date: [@supabase](https://twitter.com/supabase) and follow the hashtag [#supalaunchweek](https://twitter.com/hashtag/supalaunchweek). + +## Monday: Pricing + +- 29 March 2021 + +We're announcing pricing today. If you don’t care for the details, [here is the pricing](/pricing). + +The [blog post here](/blog/2021/03/29/pricing) goes into depth around our decision-making process. + +The key takeaway is that we will stick with (what we feel is) a generous free tier. This was critical for many of our users who are still in the “build” phase of their project/business. + +Another key takeaway is predictability. We’ve talked to too many devs who have been caught out by Firebase’s usage billing. + +Usually this is due to rogue API requests, which have a habit of spiking without any good debugging tools. To circumvent this, our usage pricing is centered on more “predictable” mechanisms (like storage), avoiding usage-billing on items like API requests. + +Even on our free tier you’re able to make millions of requests per day (we have developers doing this already!). In the future we will introduce “usage caps” on our top tier, which will allow you to specify maximum spends. Finally, we’re starting with soft-tiers, so nobody will be “unexpectedly” upgraded. + +We’re a startup ourselves, so we want to build a sustainable business. Even though we are offering a free tier, we’re confident in our ability to support it long-term with the enterprise features we are building (SSO, multi-cloud). + +If you aren’t confident in our business model though, we’re open source. You can [host it yourself](https://github.com/supabase/supabase/tree/master/docker). Even better, everything we build is centered around Postgres, so you can pretty much `pgdump` your database and take it to your favorite Postgres platform. + +![Supabase Pricing](/images/blog/launch-week/bernie-1.png) + +## Tuesday: Storage + +- 30 March 2021 + +Checkout the launch post here: [Supabase Storage](/blog/2021/03/30/supabase-storage) + +As with anything that we build in Supabase, Storage is fast, secure and scalable. It's integrated well with the rest of the Supabase ecosystem. + +**Security** 🔒 + +The authentication is handled by Kong and the authorization policies are implemented via Row Level Security policies in Postgres. This way we didn't have to implement a new language for implementing authorization policies. Check out our blog post for more details on how this works. + +**Performance** ⚡️ + +Our storage API is a thin layer built with Fastify, a [blazing fast](https://www.fastify.io/benchmarks/) Node.js framework. The security policies are directly evaluated in Postgres. The object explorer in dashboard makes navigation easy even when you have deeply nested folders or millions of objects in your buckets. + +**Scalability** 📈 + +You can use storage for your terabytes of ML training data, e-commerce product gallery, or just your growing collection of JPEGS featuring cat's playing synths in space. You can truly build in a weekend and scale to millions. + +![Supabase Storage](/images/blog/launch-week/bernie-2.png) + +## Wednesday: CLI + +- 31 March 2021 + +Today is Day 3 of [Launch Week](/blog/2021/03/25/launch-week), and as promised - we're releasing our CLI. + +Today we launched the Supabase CLI which includes: + +- Running Supabase locally +- Managing database migrations +- Self hosting with Docker! + +Check out the announcement post here: [/blog/2021/03/31/supabase-cli](/blog/2021/03/31/supabase-cli) + +![Supabase CLI](/images/blog/launch-week/bernie-3.png) + +## Thursday: UI (not an April Fool's joke, we promise) + +- 1 April 2021 + +We've spent a lot of time over the last 12 months making sure we have a lightning fast and delightful user dashboard that keeps pace with everything we do on the backend. + +We are constantly iterating on our own UI, and having multiple devs working on different areas simultaniously has led to us requiring a standardized UI component library. + +And now we're doing what we do best at Supabase and making it open source, so that the community can benefit from the UI work done at Supabase, and vice versa. The open source community is an invaluable asset to the work we do every day, and it's genuinely the main driver which enables our relatively small team to work fast and ship often. + +Check out the demo and documentation website directly here: [ui.supabase.com](https://ui.supabase.com/) + +![Supabase UI](/images/blog/launch-week/bernie-4.png) + +## Friday: One more thing + +- 2 April 2021 + +It's the season finale of Supabase Launchweek! And we have THREE more things to share: + +1. [Connection Pooling with PgBouncer](/blog/2021/04/02/supabase-pgbouncer) - now you can connect directly to your Postgres instance without needing to worry that you'll cap out on connections. Perfect for use with Prisma. + +2. [Workflow Engine](/blog/2021/04/02/supabase-workflows) - Our WIP states language will eventually enable a drag and drop workflow builder like Zapier inside the dashboard. Built with Elixir for scale! + +3. supabase.io is now supabase.com - check out our origin story here: [/blog/2021/04/02/supabase-dot-com](/blog/2021/04/02/supabase-dot-com) + +![moar](/images/blog/launch-week/bernie-5.png) diff --git a/www/_blog/2021-03-29-pricing.mdx b/www/_blog/2021-03-29-pricing.mdx new file mode 100644 index 00000000000..a291cdcfa60 --- /dev/null +++ b/www/_blog/2021-03-29-pricing.mdx @@ -0,0 +1,84 @@ +--- +title: Supabase Beta Pricing +description: Supabase launches Beta pricing structure +author: rory_wilding +image: pricing-og.jpg +thumb: launch-week-pricing.jpg +tags: + - supabase +date: '03-29-2021' +--- + +## Pricing is hard + +Many developers have been waiting for [pricing](/pricing) before building on Supabase. It has taken this long to announce pricing for one simple reason: pricing is hard. We've spent countless hours discussing and testing different models. We consulted users, OSS veterans, and SaaS Gurus. We explored and ruled out a number of options including: no free tier, pure usage based, pay-per-seat, pay-per-row, and "bolt-on" feature based pricing. + +Supabase is a suite of integrated products - should we compare our Postgres databases with Amazon RDS? Do we benchmark our Auth pricing against Auth0 or Okta? + +So we decided to do what we always do: ship it, share it, and then listen to our users' feedback. + +## TLDR + +We are launching [pricing](/pricing) with three tiers: + +1. Free - for up to four hobby-level projects +2. Pro - $25 per project per month, for more serious projects +3. Usage based - for those who need more resource than what's on the Pro tier + +## Goals for our pricing structure + +Our goals for pricing are simple: + +- Continue offering free Supabase projects for Students, Hobbyists, and Early Adopters +- Price based on predictable metrics (no shock bills at the end of the month) +- Enable and grow with our most successful users, providing a pricing model that supports their growth + +We came up with a 3-tier model to offer predictability, and then iterated through numerous user interviews to answer the questions: "how much do we charge in each tier, and what features go in each tier?". To answer these questions we considered: + +1. How much value does Supabase create compared to alternatives including Firebase, authentication providers like Okta and Auth0, API, and storage providers? +2. How much time does Supabase save developers? +3. How can we make Supabase as accessible as possible? +4. As developers ourselves, how do we feel about our proposed pricing? +5. The underlying cost of development and maintenance of Supabase. + +As a result, we've arrived at a pricing model that brings predictability, is sustainable, and enables us to continue to offer a free tier. + +Our model allows anybody to come in and experience the full power of the Supabase stack without first needing to put down a credit card. + +## Launching with a free tier + +Many of our early users are building or migrating their passion projects to Supabase. Offering a free tier enables this. We also support a large number of students learning SQL for the first time, and fledgling startups which haven't started earning any revenue yet. + +Developers need time to build their side projects, and they don't want to pay for a database while they do it. At the same time, hosting Postgres databases is expensive. So we decided to take the same strategy that we always have: ship, share it, and iterate. + +No company gets the pricing right first time. It would be arrogant to believe that we will. What we can promise you is this: as we learn and grow we plan to offer more value for less, not the other way around. + +Our success depends on the success of developers using Supabase. In short, if our users' projects succeed then Supabase adoption will continue. That is exactly what we want. + +We will issue credits for those who signed up during alpha, beta, and those who sign up through to the end of Launch Week[^1]. If you are not on board yet, [you can sign up here.](http://www.supabase.io) Projects on select incubators will also get credits, as founders we know the importance of credits when getting something new off the ground. We will continue to support code schools and their students. If you need Supabase credits to support your project, reach out to us here and we will do our best to help you. + +## Making pricing predictable + +We know that Firebase pricing can be [problematic](https://medium.com/madhash/how-not-to-get-a-30k-bill-from-firebase-37a6cb3abaca). + +That's why we made our pricing as predictable as possible. You can quickly understand which pricing tier you fit into, without having to forecast how many API requests you're going to make this quarter. + +What does this mean for you as a developer? + +- You can make as many API calls as you need to (within the constraints of your database). We already have users making millions of requests per day. +- We have been deliberately generous with authentication and storage on the free tier so that you get as much of the Supabase experience as possible. +- We're starting with soft-limits for usage billing to prevent unexpected charges. +- We'll reach out to you before changing your billing plan to see if it makes sense for your project. +- On our "Pay as you go" tier we will work with you to forecast billing before making a commitment. + +## Next steps + +In the next few days, you will see your usage appear in the dashboard with an upgrade button. + +Check back throughout the week to see what else we're launching [here](/blog/2021/03/25/launch-week). + +Sign up for the Supabase Beta [here](https://app.supabase.io). + +And check out the full pricing details [here](/pricing). And we'd love to hear your opnions on our Pricing! You can let us know via support@supabase.io. + +[^1]: Updated on Aug 17 2021 for clarity: the referenced Launch Week ended on the 4th of April 2021. Users that signed up prior to that date can request credits. diff --git a/www/_blog/2021-03-30-supabase-storage.mdx b/www/_blog/2021-03-30-supabase-storage.mdx new file mode 100644 index 00000000000..ad626f706aa --- /dev/null +++ b/www/_blog/2021-03-30-supabase-storage.mdx @@ -0,0 +1,163 @@ +--- +title: Storage is now available in Supabase +description: Launching Supabase Storage and how you can use it in your apps +author: inian +image: storage/ph-1.png +thumb: storage/ph-1.png +tags: + - supabase + - storage +date: '03-30-2021' +--- + +Today, we are launching one of most requested features - Storage! When you sign up for Supabase, you get a Postgres database with realtime subscriptions, user management, auto-generated APIs and now a scalable object store. These services integrate very well with each other and you don't need to sign up for yet another service just for your storage requirements. + +As with anything that we build in Supabase, Storage is fast, secure and scalable. You can use it to store terabytes of Machine Learning training data, your e-commerce product gallery or just your growing collection of JPEGs featuring cats playing synths in space. + +This post outlines our design decisions while building Storage, and we'll show you how to use it in your own applications. + +## Architecture + +There are three key components to Supabase Storage: + +- Backend (where the objects are actually stored). +- Middleware (access and permissions). This consists of an API Server and Postgres. +- Frontend (a nice UI). + +![Storage Infrastructure](/images/blog/storage/infra.png) + +The Storage API server sits behind Kong, an API Gateway. It talks to different storage backends like S3, Backblaze, etc to retrieve and store objects. + +Object metadata and security rules are stored in your Postgres database. + +We have built a powerful file explorer right into the dashboard, and using our Client libraries you can integrate Storage into your applications. + +## Frontend + +We set out to build the most usable front-end for storing content. Using Lists to display file hierarchies is a poor experience for exploring files - the most common use-case of a shared File system. + +As avid Mac users, we've defaulted to using the column-based explorer in Finder as it allow us to quickly drill into nested folders and provides a clear birds eye view of file hierarchies at the same time. + +We put in a lot of effort to make sure that the dashboard is fast and easy to navigate with our miller-based column view, allowing you to get to deeply nested folders quickly. If you're a fan of List Views though, don't worry! We have that option available too. The choice is yours. + +![Frontend views](/images/blog/storage/ph-5.png) + +Our File Browser also has a rich preview for a wide set of file types including images, audio, and videos. + +![Frontend preview](/images/blog/storage/ph-2.png) + +And if you already know the location of a file but want to save a few clicks, you can paste the path into the location bar and navigate to it directly. + +![Frontend navigation](/images/blog/storage/ph-4.png) + +## Designing the storage middleware + +We focused on performance, security and interoperability with the rest of the Supabase ecosystem. + +### **Integration with the Supabase ecosystem** + +Supabase is a [collection of open source tools](/docs#how-it-works) which integrate very well with each other. We evaluated open source object storage servers like [Ceph](https://ceph.io/), [Swift](https://www.openstack.org/software/releases/ocata/components/swift), [Minio](https://min.io/) and [Zenko](https://github.com/scality/Zenko) but none of these tools were a good fit for our existing ecosystem. + +**Postgres Compatibility** + +Each of these open source tools are amazing, but they all had a major drawback - we couldn't use Postgres as the server's datastore. If you haven't noticed yet, our team likes Postgres a lot 😉. + +For example, Minio [uses etcd](https://docs.min.io/docs/minio-multi-user-quickstart-guide.html) (when used in multi-user gateway mode) and Zenko [requires mongodb and Kafka.](https://zenko.readthedocs.io/en/latest/operation/Architecture/index.html) Every project on Supabase is a dedicated Postgres database, so leveraging it for object and user metadata is more efficient, reducing the number of dependencies for anyone using the Supabase ecosystem of tools. + +**Smaller footprint** + +We are using managed services like [S3](https://aws.amazon.com/s3/), [Wasabi](https://wasabi.com/) and [Backblaze](https://www.backblaze.com/) for our storage backend. We won't be managing our own hard disks and storage capacity, and so we don't require a lot of features offered by existing tools. For example, a large part of Minio's codebase is to offer erasure encoding and bitrot protection, automatically making use of new disks attached to the cluster. + +**Integration with Supabase Auth** + +Existing tools do not play well with our authentication system. For example, Minio is bundled with its own [auth system](https://docs.min.io/docs/minio-admin-complete-guide.html#user) and there is no easy way to map Minio users to [Supabase users](/docs/guides/auth). + +In the end, we opted to build our own [Storage API server](https://github.com/supabase/storage-api). + +## Security + +### Authentication + +Our storage service sits behind [Kong](https://github.com/kong/kong) along with other services like [PostgREST](https://github.com/PostgREST/postgrest) and [Realtime](https://github.com/supabase/realtime). This allows us to reuse our existing Authentication system - any requests with a valid API key are authenticated and passed to the storage API. + +### Authorization + +For Authorization, we wanted to avoid creating a new DSL like Firebase. Instead, we created one where you can write policies in the One True Language - SQL! + +![One True Language](/images/blog/storage/true-language.png) + +To do this, we leverage Postgres' Row Level Security. We create a table for `buckets` and `objects` inside each Supabase project. These tables are namespaced in a separate schema called `storage`. + +The idea is simple - if a user is able to `select` from the `objects` table, they can retrieve the object too. Using Postgres' Row Level Security, you can define fine-grained Policies to determine access levels for different users. + +When a user makes a request for a file, the API detects the user in the `Authorization` header and tries to `select` from the `objects` table. If a valid row is returned, the Storage API pipes the object back from S3. Similarly if the user is able to delete the row from the objects table, they can delete the object from the storage backend too. + +For example, if you want to give "read" access to a bucket called `avatars` you would use this policy: + +```sql +create policy "Read access for avatars." +on storage.objects for select using ( + bucket_id = 'avatars' +); +``` + +Extending this example, if you want to give access to a subfolder only (in this case called `public`): + +```sql +create policy "Read access for public avatars." +on storage.objects for select using ( + bucket_id = 'avatars' + and (storage.foldername(name))[1] = 'public' +); +``` + +We have created helper functions like `foldername()`, `filename()` and `extension()` in the storage schema to make Policies even simpler. + +This system integrates with our [User Management system](/docs/guides/auth). Here is an example policy which gives access to a particular file to a Supabase user: + +```sql +create policy crud_uid_file +on storage.objects for all using ( + bucket_id = 'avatars' + and name = 'folder/only_uid.jpg' + and auth.uid() = 'd8c7bce9-cfeb-497b-bd61-e66ce2cbdaa2' +); +``` + +Using the power of Postgres' Row Level Security, you can create pretty much any policy imaginable. + +### Performance + +The storage server is built with [Fastify](https://www.fastify.io/) and Typescript. Fastify is one of the [fastest](https://www.fastify.io/benchmarks/) Node frameworks and our initial benchmark results look very promising. + +We use Node streams everywhere. Objects are uploaded directly to S3 with minimal in-memory buffering. This minimizes RAM consumption even while uploading huge objects. The code does become a bit more complicated when using streams. For example, you can't figure out the size of the object being uploaded before streaming it to S3. But we believe this tradeoff is worth it. + +Postgres is another hidden gem for our storage performance. For example, what if you had a bucket with thousands of objects, and you needed to find all objects which a user has access to? Without Postgres, you would retrieve all objects from that folder, evaluate each policy in the storage middleware and only return the objects which the user has access to. But we can avoid this completely with Postgres! We use Postgres to evaluate all the polices, and the storage middleware just returns the objects which the user has access to. + +Supabase Storage has some opinionated defaults with respect to caching. Objects retrieved from S3 typically do not have a `Cache-Control` header. This isn't optimal for a Storage system since browsers don't cache objects completely without this header. Objects retrieved from Supabase Storage by default have a Cache-Control header of 1 hour. Of course, you can override this behaviour by specifying a different cache time when creating the object. + +## Storage Backend + +File objects are stored in an S3 bucket within the same region as your Supabase project. S3 has a high durability of 99.999999999% and is scalable as an object store. + +While we started with S3, other storage backends like Wasabi, Backblaze and Openstack Swift expose an S3 compatible API. It will be simple to add more S3 compatible storage options in the future. + +We have intentionally kept the API surface for the storage backend very small, in case the community also wants to add storage options which don't support the S3 API. + +### Client libraries + +You may be itching to get started tinkering around with our new Supabase storage - we have an example app prepared for you right [here](https://github.com/supabase/supabase-js/tree/master/example/next-storage) which simulates a simple context of setting an avatar image for a user. This will help you to get a high level overview of how to use your project's storage with our client library. For greater detail, refer to our storage API documentation [here](/docs/reference/javascript/storage-createbucket). + +![Example app 1](/images/blog/storage/ph-7.png) + +![Example app 2](/images/blog/storage/ph-6.png) + +## What's next + +- We currently support S3 and will be adding more storage backends. Vote for the storage backends you would like to see us implement [here](https://github.com/supabase/supabase/discussions/982). +- We will integrate our storage service with a Content Delivery Network. With a CDN, objects are cached on a global network. This leads to faster access times for your users around the world. +- We are working on transformations like resizing of images and automatic optimization of different media types. This makes it easy to embed Supabase objects directly in your websites and mobile applications without additional processing. +- A better editor to make authoring policies easier and less error prone. +- Reach out to us if you would like to help out with adding storage support in one of the [community maintained client libraries](/docs/reference/javascript/supabase-client). + +Take it for a spin on our [dashboard](http://app.supabase.io/) and let us know what you think! diff --git a/www/_blog/2021-03-31-supabase-cli.mdx b/www/_blog/2021-03-31-supabase-cli.mdx new file mode 100644 index 00000000000..b899d83558b --- /dev/null +++ b/www/_blog/2021-03-31-supabase-cli.mdx @@ -0,0 +1,227 @@ +--- +title: Supabase CLI +description: Local development, database migrations, and self-hosting. +author: soedirgo +image: cli/cli-og.jpg +thumb: cli/cli-og.jpg +tags: + - supabase + - storage +date: '03-31-2021' +--- + +**UPDATE:** The Node.js CLI is now obsolete. Follow the latest instructions [here](/docs/guides/local-development). + +Today is Day 3 of [Launch Week](/blog/2021/03/25/launch-week), and as promised - we're releasing our CLI. + +This is the first step in a long journey of features we plan to deliver: + +- Running Supabase locally +- Managing database migrations +- Generating types directly from your database schema +- Generating API and validation schemas from your database +- Managing your Supabase projects +- Pushing your local changes to production + +Here are some of the items we have completed so far. + +## Running Supabase Locally + +You can now run Supabase on your local machine, using Docker Compose. This Docker setup is 100% compatible with every project on Supabase - the tools used for local development are exactly the same as production. + +We have released a full set of documentation [here](/docs/guides/local-development). In this post we thought it would be useful to highlight how easy it is to get started. + +A lot of Supabase developers are familiar with React, so here are the steps you would use to create a new React project which uses Supabase as a backend. + +Install the CLI: + +```bash +npm install -g supabase +``` + +Set up your React app: + +```bash +# create a fresh React app +npx create-react-app react-demo --use-npm + +# move into the new folder +cd react-demo + +# Save the install supabase-js library +npm install --save @supabase/supabase-js +``` + +Set up Supabase: + +```bash +supabase init + +# ✔ Port for Supabase URL: · 8000 +# ✔ Port for PostgreSQL database: · 5432 +# ✔ Project initialized. +# Supabase URL: http://localhost:8000 +# Supabase Key (anon, public): eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJzdXBhYmFzZSIsImlhdCI6MTYwMzk2ODgzNCwiZXhwIjoyNTUwNjUzNjM0LCJyb2xlIjoiYW5vbiJ9.36fUebxgx1mcBo4s19v0SzqmzunP--hm_hep0uLX0ew +# Supabase Key (service_role, private): eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJzdXBhYmFzZSIsImlhdCI6MTYwMzk2ODgzNCwiZXhwIjoyNTUwNjUzNjM0LCJyb2xlIjoiYW5vbiJ9.36fUebxgx1mcBo4s19v0SzqmzunP--hm_hep0uLX0ew +# Database URL: postgres://postgres:postgres@localhost:5432/postgres +``` + +Now that your application is now prepared, you can use Supabase anywhere in your application (for example, `App.js`): + +```jsx +import { createClient } from '@supabase/supabase-js' +const SUPABASE_URL = 'http://localhost:8000' +const SUPABASE_ANON_KEY = + 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJzdXBhYmFzZSIsImlhdCI6MTYwMzk2ODgzNCwiZXhwIjoyNTUwNjUzNjM0LCJyb2xlIjoiYW5vbiJ9.36fUebxgx1mcBo4s19v0SzqmzunP--hm_hep0uLX0ew' +const supabase = createClient(SUPABASE_URL, SUPABASE_ANON_KEY) +``` + +Then start the backend and the frontend: + +```bash +supabase start # Start Supabase +npm start # Start the React app +``` + +If everything is working you should have a React app running on `http://localhost:3000` and Supabase services running on `http://localhost:8000`! + +### Next steps: + +Soon we will give you the ability to push your changes from your local machine to your Production project. How will we do that? Migrations! + +## Migrations + +Database Migrations are a process to "change" your database schema. In a NoSQL database you don't need migrations, because you can insert any JSON data without validation. However with Relational databases you define your schema upfront, and the database will reject data which doesn't "fit" the schema. This is one of the reasons Relational databases are so scalable - schemas ensure data integrity. + +Just like an application though, a database schema needs to be constantly updated. And that's where migrations fit! Migrations are simply a set of SQL scripts which change your database schema. + +There is one problem however: there is [no "right" way](https://news.ycombinator.com/item?id=21405501) to do migrations. + +### Diffs + +At Supabase, we do have one strong preference. We like schema "diffing" over "manual migrations". + +Manual migrations work like this: + +- A developer thinks about all the changes they want to make to their database +- They create a SQL script which will cause those changes +- They run that script on their database + +After a while though, these scripts pile up - the `migrations` folder can contain hundreds of migration scripts. This method is also "version control" on top of another version control system (i.e. git). + +A "diff" tool works like this: + +- a developer makes all the changes they desire to a local database +- they use a tool to compare their local database to the production database +- the tool then generates all the SQL scripts that are required, and runs them on the target database + +In this case, the tool does all the hard work. This is obviously an ideal state. Databases schemas are declarative, and when you check them into git, you can see their evolution over time. The hard part is finding a tool which can handle all the edge-cases of database diff'ing. + +### Choosing the best diff tool + +After evaluating these OSS tools: + +- [migra](https://github.com/djrobstep/migra) (Python) +- [dbdiff](https://github.com/gimenete/dbdiff) (JS) +- [pgdiff](https://github.com/joncrlsn/pgdiff) (Go) +- [apgdiff](https://github.com/fordfrog/apgdiff) (Java) +- [pgquarrel](https://github.com/eulerto/pgquarrel) (C) +- [pgAdmin Schema Diff](https://www.pgadmin.org/docs/pgadmin4/development/schema_diff.html) (Python) + +We found that the most complete one was the pgAdmin Schema Diff, migra came a close second. + +The deciding factor was if the tool could track an owner change for a VIEW. + +```sql +ALTER VIEW my_view OWNER TO authenticated; +``` + +This is critical for Row Level Security to work with views. For policies to kick in on views, the owner must not have `superuser` or `bypassrls` privileges. Currently migra doesn't track this change ([issue](https://github.com/djrobstep/migra/issues/160)), while the pgAdmin Schema Diff does. + +There was a problem in using the [pgAdmin Schema Diff](https://www.pgadmin.org/docs/pgadmin4/development/schema_diff.html) though, it's a GUI-only tool. + +![pgadmin diff](/images/blog/cli/pgadmin-diff.png) + +So we did what we always strive to do - improve existing open source software. We created a CLI mode for the Schema Diff on [our repo](https://github.com/supabase/pgadmin4/blob/cli/web/cli.py). We've also released a [docker image](https://hub.docker.com/r/supabase/pgadmin-schema-diff) for a quick start. + +The CLI offers the same functionality as the GUI version. You can diff two databases by specifying the connection strings like shown below. + +```bash +docker run supabase/pgadmin-schema-diff \ + 'postgres://user:pass@local:5432/diff_source' \ + 'postgres://user:pass@production:5432/diff_target' \ + > diff_demo.sql + +Starting schema diff... +Comparision started......0% +Comparing Event Triggers...2% +Comparing Extensions...4% +Comparing Languages...8% +Comparing Foreign Servers...14% +Comparing Foreign Tables of schema 'public'...28% +Comparing Tables of schema 'public'...50% +Comparing Domains of schema 'test_schema_diff'...66% +Comparing Foreign Tables of schema 'test_schema_diff'...68% +Comparing FTS Templates of schema 'test_schema_diff'...76% +Comparing Functions of schema 'test_schema_diff'...78% +Comparing Procedures of schema 'test_schema_diff'...80% +Comparing Tables of schema 'test_schema_diff'...90% +Comparing Types of schema 'test_schema_diff'...92% +Comparing Materialized Views of schema 'test_schema_diff'...96% +Done. + +## the diff is written to diff_demo.sql +``` + +A sample diff can be seen on this [gist](https://gist.github.com/steve-chavez/3f286a233806aeee0bcea4a47f97f0b5). This was generated by diffing these [two databases](https://github.com/supabase/pgadmin4/tree/cli/web/pgadmin/tools/schema_diff/tests/pg/10_plus). + +On these [lines](https://gist.github.com/steve-chavez/3f286a233806aeee0bcea4a47f97f0b5#file-diff_demo-sql-L1022-L1023), you can see how it tracks the view's owner change (note: the `ALTER TABLE` statement is interchangeable with `ALTER VIEW` in this case). Additionally, you can see that it handles [domains](https://gist.github.com/steve-chavez/3f286a233806aeee0bcea4a47f97f0b5#file-diff_demo-sql-L278-L287) just fine, this is an edge-case that other diff tools don't handle. + +Also, similarly to the pgAdmin GUI: + +- You can include and exclude database objects from the diff with `--include-objects` or `--exclude-objects` +- You can choose a single schema to diff with the `--schema` argument or you can pick different schemas to compare with the --source-schema and --target-schema arguments. We recommend you do this for Supabase databases. Diffing the whole database can take a while because of the `extensions` schema (especially if you enable PostGIS, which adds many functions). + +### Next steps + +Once we have added logins to the CLI, we will be able to use Migrations to create a seamless workflow between local development and your production database. + +Also, the pgAdmin team has showed [interest](https://www.postgresql.org/message-id/CA%2BOCxoyjZhV9stFMAQ-QhHuA0%2BdLQD5XD_YT%2BQo2vY0GhkBKFw%40mail.gmail.com) in including our Schema Diff CLI in the official pgAdmin. We'll be working with them to include this change upstream to benefit the whole community. + +## Self Hosting + +Finally, we are adding one critical command to our CLI for everybody who wants to self-host: + +```bash +supabase eject +``` + +This gives you everything you need to run the Supabase stack. + +After running the command inside the terminal, you will see three items: + +- `docker-compose.yml` (file) +- `kong` (directory) +- `postgres` (directory) + +If you have an existing Postgres database running elsewhere you can easily drop the Postgres directory but first make sure you do these three things: + +- run the .sql files from the Postgres directory on your existing database +- update all references to the DB URI in `docker-compose.yml` to your existing database +- run [these steps](https://github.com/supabase/realtime#server) to enable replication inside the database, so that the realtime engine can stream changes from your database + +You may also want to play with the environment variables for each application inside `docker-compose.yml`. [PostgREST](https://postgrest.org/en/v7.0.0/configuration.html) has many additional configuration options, as does [GoTrue](https://github.com/supabase/gotrue#configuration). In the hosted version of Supabase we connect our own SMTP service to GoTrue for sending auth emails, so you may also want to add these settings here in order to enable this. + +Also check `kong.yml` inside the `kong` directory where you'll see how all the services are routed to, and with what rules, down the bottom you'll find the JWTs capable of accessing services that require API Key access. + +Once you're all set, you can start the stack by running: + +```bash +docker-compose up +``` + +Head over to the [Self Hosting Docs](/docs/guides/self-hosting) for a more complete walk through, it also includes several [one-click deploys](/docs/guides/self-hosting#one-click-deploys), so you can easily deploy into your own cloud hosting provider. + +If you require any assistance feel free to reach out in our [github discussions](https://github.com/supabase/supabase/discussions) or at support@supabase.io. + +Check out what else we've [launched this week](/blog/2021/03/25/launch-week), contribute to the [CLI repo](https://github.com/supabase/cli), or go here for the [hosted version](https://app.supabase.io). diff --git a/www/_blog/2021-04-01-supabase-nft-marketplace.mdx b/www/_blog/2021-04-01-supabase-nft-marketplace.mdx new file mode 100644 index 00000000000..f3719b8c23f --- /dev/null +++ b/www/_blog/2021-04-01-supabase-nft-marketplace.mdx @@ -0,0 +1,39 @@ +--- +title: Supabase Launches NFT Marketplace +description: A fully encrypted NFT platform to protect and transact your digital assets +author: ant_wilson +author_title: Supabase +author_url: https://github.com/awalias +author_image_url: https://github.com/awalias.png +authorURL: https://github.com/awalias +image: nft/nft-3.png +thumb: nft/nft-3.png +tags: + - supabase + - nfts +date: '04-01-2021' +--- + +### Crypto at Supabase + +Most people don’t know this but the Supabase team has a long history of involvement in the NFT game. In 2018, Copple and Rory were minted as NFTs on Blockpunk.net, an Ethereum based Anime-NFT platform that four Supabase core team members helped build. We also helped in the building of the world’s first tokenised anime premiere - Vevara in Your Dream. + +The team were also founding members of the Guacchain Foundation, an economic experiment in a deflationary-based monetary system, inspired by the fact that Avacados ripen faster when stored together. + +NFTs are now capturing the imagination of speculators everywhere, but NFTs as they exist today have a major flaw. We call it the _Copy-Paste Problem_. The Copy-Paste problem is when a token contains a URL to an image hosted on the web, or even on IPFS; there is nothing stopping someone who does not own the token, from heading to that URL, and just downloading the image for themselves. + +As our latest foray into NFTs we’re announcing BuyMeth.com, (Meth = [M]isleading [E]ncrypted [Th]umbnails) an NFT marketplace that solves the copy-paste problem of NFTs today. + +![Supabase NFT marketplace BuyMeth.com](/images/blog/nft/nft-1.png) + +### How does it work? + +Each NFT stores a blurhash representation of a full image, but also a link to the full encrypted version of the image stored on IPFS. The full image is always encrypted with the key of the _current_ owner. + +When a sale is initiated i.e. the seller accepts a buyers offer, Metamask re-encrypts the image with the public key of the buyer, and uploads it to IPFS, the url in the NFT is updated and the buyer assigned as the new owner. After the sale, a 1 week challenge period is initiated where the proceeds of the sale are kept in an escrow contract. The buyer can then decrypt the contents of the image, and can run an automated verification function to verify that the image received (when hashed) does indeed produce the publically available blurhash (or thumbnail). If it does not, then the buyer can submit a claim to the sales contract, along with a proof of the invalid file, and claim back the proceeds. + +![Most popular NFTs](/images/blog/nft/nft-2.png) + +As a way to dis-incentivise previous owners of the image to not reveal the original image, we bake in a royalty mechanism, whereby previous owners receive a fraction of the sale price each time, the artwork changes hands. + +Despite the undeniable value of such a platform, this announcement is of course an April Fools joke. We are not launching a Supabase NFT platform; but we are [Launching a TON of other stuff this week](/blog/2021/03/25/launch-week). diff --git a/www/_blog/2021-04-02-supabase-dot-com.mdx b/www/_blog/2021-04-02-supabase-dot-com.mdx new file mode 100644 index 00000000000..0788731e8c5 --- /dev/null +++ b/www/_blog/2021-04-02-supabase-dot-com.mdx @@ -0,0 +1,77 @@ +--- +title: Supabase Dot Com +description: The Supabase Domain name is changing. +author: paul_copplestone +author_title: Supabase +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: supabase-dot-com-og.jpg +thumb: supabase-dot-com-og.jpg +tags: + - supabase +date: '2021-04-02' +--- + +_tl;dr_ During the next week, we'll be migrating from "supabase.io" to "supabase.com". + +There are no changes required on your end. Your API URLs will remain on "supabase.co", and only our website URLs will change. + +The rest of this post talks a bit about the origin of the name, but there's nothing important to know. + +## SupaWhat? + +At the end of 2019 we released a Postgres [Realtime](https://github.com/supabase/realtime) engine on GitHub. +We created this in my previous company after migrating from Firebase to Postgres. + +It started gaining traction (if you count "GitHub stars" as traction) and so I tapped my friend, [Ant](https://twitter.com/AntWilson), +on the shoulder to see if he wanted to build an open source company with me (he was building another start up at the time). + +The company we envisaged had Postgres at the core. We searched for every "dot com" we could think of with "base" in the name - hyperbase, +superbase, suprabase, uberbase. It turns out this is what every database start does. We couldn't find any good "dot coms". +And so we moved on to "dot io" domains. + +Anybody who knows Ant, knows that he [loves memes](/blog/2021/03/25/launch-week). While we were brainstorming +we found that "supabase.io" was available. + +To be honest, this name wasn't a strong contender, but it served a very important purpose - it was extremely "meme-able" because +it sounds similar to Nikki Minaj's [Super Bass](https://youtu.be/4JipHEz53sU). + +We chose it as a placeholder and found it was, indeed, very funny to send each other Nikki memes while we brainstormed the business. + +![Booom booom booom booom](/images/blog/nikki-supabase.jpg) + +Note to anyone starting a business, don't use a placeholder. You'll never change it. + +Luckily for us, the name [grew on us](https://news.ycombinator.com/item?id=23325430) and now we love it. + +## Supabase Dot Com + +When we joined Y Combinator, they gave this advice: + +> Except in unusual circumstances (like [Twitch.tv](http://twitch.tv/)), if you don't have the .com version of your name, +> you should probably change it. + +We decided to try purchasing [supabase.com](http://supabase.com) from the current owner. The YC forums were full of founders +recommending a particular Domain Specialist who would help us negotiate and purchase the domain. The only catch - he would take +a percentage of the purchase price. + +This struck us as odd. The incentives were more aligned to the domain seller than the purchaser. + +We're not afraid to roll up our sleeves at Supabase, so we decided we could handle it ourselves. + +We were in for a huge surprise. After searching on the (old) [supabase.com](http://supabase.com) website, we found a company address. +And it was literally 100m from my home. + +Of all the places in the world that the domain could be registered, the owner was within yelling-distance. But we didn't yell. We simply +asked, and after some negotiation, the owner agreed to sell it. + +We were always willing to walk away from the Supabase brand if we needed to, but the price was reasonable for both parties. There really +isn't much more to it than that. + +## What's next? + +Over the next few weeks, we'll update our domain name across most of the sites. If you're using a Supabase database and API, you're on +a ".co" domain so your apps won't be affected at all. + +You may also find some [easter eggs](https://twitter.com/AntWilson/status/1354343248098070530) appear ... diff --git a/www/_blog/2021-04-02-supabase-pgbouncer.mdx b/www/_blog/2021-04-02-supabase-pgbouncer.mdx new file mode 100644 index 00000000000..6e55887e072 --- /dev/null +++ b/www/_blog/2021-04-02-supabase-pgbouncer.mdx @@ -0,0 +1,99 @@ +--- +title: PgBouncer is now available in Supabase +description: Better support for Serverless and Postgres. +author: angelico_de_los_reyes +author_title: Supabase +author_url: https://github.com/dragarcia +author_image_url: https://github.com/dragarcia.png +authorURL: https://github.com/dragarcia +image: bouncer/pgbouncer-og.jpg +thumb: bouncer/pgbouncer-thumb.jpg +tags: + - database + - engineering +date: '2021-04-02' +--- + +Javascript Frameworks like [Next.js,](https://nextjs.org/) [Redwood](https://redwoodjs.com/), [Blitz](https://blitzjs.com/), and tools +like [Prisma](https://www.prisma.io/docs/guides/deployment/deployment#pgbouncer) are all moving in one direction. Serverless. + +Serverless functions work great for developers using the Supabase API because we manage a [PostgREST](https://postgrest.org/en/v7.0.0/) +server for every project. Supabase also provides direct access to the Postgres database, so that developers can connect any tool they want. +Unfortunately, Serverless function don't work well for direct Postgres connections (for reasons we'll discuss soon). + +Jamstack developers make up a large portion of the Supabase Community. While we'd love for developers to use PostgREST, we mostly want +developers to use Postgres. This means supporting the tools which they already love. + +So today we are adding [PgBouncer](https://www.pgbouncer.org/), an open source connection pooler for Postgres. + +## What is Connection Pooling? + +![Connection Pooling](/images/blog/bouncer/connection-pool.png) + +Typically when a client connects to a PostgreSQL database, they need to open and manage their own database connection. With a connection pool, +connections are already opened and available for use. When a client makes a request, they use a connection from the pool. When the transaction +or session is completed the underlying connection is simply returned to the pool and is once again free to be used by another user or application. + +### Handling connection surges + +In a traditional architecture, middleware servers (e.g. APIs) manage a small number of connection to a Postgres database. +Essentially, the middleware server is a connection pool. + +In a Serverless environment, there is no middleware server to maintain a connection, so they create a **new** connection for +each concurrent request. Since Serverless functions are typically used for bursty workloads, this can end up opening a lot of +connections to the database and overwhelm your Postgres server. + +Connection pools mitigate this. Connections are opened beforehand and recycled across users and applications. What's more, +[connection pools are specialized for this task](https://medium.com/@k.wahome/database-connections-less-is-more-86c406b6fad). +A small number of connections is sufficient to handle demand ten, twenty times its size, or even more. Whenever a new connection +is required it is taken from a pool of open and available connections instead of initializing an entirely new one. This eliminates +the need to spawn a new process. + +## Misconceptions + +It's a common misconception that PgBouncer increases the number of connections a Postgres instance can open. +This is not the case. If Postgres is configured for a maximum of 50 connections before connection pooling, it +will still only be able to open 50. Connection pooling simply keeps connections open and idle, ready to accept clients. Nevertheless, +as mentioned above, PgBouncer allows your database to be able to handle more than it can without a connection pool. + +## Connection "Queuing" + +PgBouncer is like a Queue. With regular Postgres, when you hit your connection limit, new connections are rejected. PgBouncer overcomes this +limitation. When all connections in the pool are in-use, it doesn't reject any incoming requests. Instead, +[PgBouncer queues them](https://www.percona.com/blog/2021/02/26/connection-queuing-in-pgbouncer-is-it-a-magical-remedy/) until a +connection is returned to the pool and made available. This doesn't mean connection pooling is a magic bullet. If your clients is +running expensive queries then the connections might take a long time before they are returned to the pool. The natural solution to +this is to increase your database resources so that it processes queries faster or PgBouncer can open more connections. + +## Using Connection Pooling in Supabase + +![Pooling UI](/images/blog/bouncer/pooler-supabase.png) + +From today, all new projects will include connection pooling. In the `Database` section of our dashboard, you will notice a new section for it. +Under the hood, we utilise PgBouncer which is installed in the same server as PostgreSQL. Through the dashboard, we provide you with the +necessary connection details to start using the connection pool as well as the ability to modify `Pool Mode`. Not sure which mode to use? +Below is a quick primer on each mode. + +## Pool modes + +`Pool Mode` determines how PgBouncer handles a connection. + +### Session + +When a new client connects, a connection is assigned to the client until it disconnects. Afterward, the connection is returned back to the pool. All PostgreSQL features can be used with this option. + +### Transaction + +This is the suggested option for serverless functions. With this, the connection is only assigned to the client for the duration of a transaction. Once done, the connection is returned to the pool. Two consecutive transactions from the same client could be done over two, different connections. Some session-based PostgreSQL features such as prepared statements are not available with this option. A more comprehensive list of incompatible features can be found [here](https://www.pgbouncer.org/features.html). + +### Statement + +This is the most granular option. Connections are returned to the pool after every statement. Transactions with multiple statements are not allowed. This is best used when `AUTOCOMMIT` is in use. + +## What's next? + +Try out connection pooling now with a new project in the [dashboard.](http://app.supabase.io) For now, we do not have any plans to port this over to older projects. + +Eventually, we will expose more PgBouncer settings to the UI such as `Pool Size`. At the moment it is set to `15`. + +We are still working towards getting the latest version of Supabase Postgres to both the AWS and Digital Ocean marketplaces. Follow us on [Twitter](https://www.notion.so/PgBouncer-is-now-available-in-Supabase-345a74d402464670923cf404b714a354) to be informed once it's released! diff --git a/www/_blog/2021-04-02-supabase-workflows.mdx b/www/_blog/2021-04-02-supabase-workflows.mdx new file mode 100644 index 00000000000..331fa7ad48b --- /dev/null +++ b/www/_blog/2021-04-02-supabase-workflows.mdx @@ -0,0 +1,234 @@ +--- +title: Workflows are coming to Supabase +description: Functions are great, but you know what's better? +author: fracek +author_title: Supabase +author_url: https://github.com/fracek +author_image_url: https://github.com/fracek.png +authorURL: https://github.com/fracek +image: workflows/workflows-og.jpg +thumb: workflows/workflows-thumb.jpg +tags: + - functions + - workflows +date: '2021-04-02' +--- + +This week we [launched Supabase Storage](/blog/2021/03/30/supabase-storage), which leaves one other huge piece of the +stack that everyone is asking for: Functions. + +## TLDR + +We're not releasing Functions today. Trust us, we know you want them. They are coming, just not today. + +But we are building something that we think you're going to like: Workflows. We haven't finished building it yet, but Workflows are +a "piece" of the Function story and arguably an even more exciting feature. + +![Everyone wants functions](/images/blog/workflows/functions.jpg) + +## Firebase Functions + +Firebase functions are relatively simple. If you use Serverless, AWS Lambda, Cloudflare Workers, Next.js API routes, or +Netlify Functions, then you know how they work. A Firebase function executes some code which you provide, without you managing a server. + +Specifically for Firebase, they have another key feature - they can be triggered by database events. For example, you can +trigger a function whenever a Firestore Document is updated. + +This is great, but it is still limited for a few real-world use cases. For example, what if you want to send an email to a user +one day after a user signs up. Or one year? There is no queuing functionality in Firebase. You'd have to manage a process like +this yourself, probably using a cron-job. + +## A better solution? + +We searched for some open source tools which we think are solving this problem well. We looked at +[NodeRed](/blog/2021/03/30/supabase-storage#designing-the-storage-middleware), [n8n](https://n8n.io/), +[Airflow](http://airflow.apache.org/blog/airflow-two-point-oh-is-here/), and about 10 other tools. They are amazing tools on their +own, but for the Supabase Stack they ultimately had the +[same shortcomings](/blog/2021/03/30/supabase-storage#integration-with-the-supabase-ecosystem) that we found +with Storage providers - most of them lacked deep Postgres integration. + +We went back to the drawing board and asked, "if we could wave a wand and get the perfect solution, what would it look like?". +The tool that came very close is [AWS Step Functions](https://aws.amazon.com/step-functions/). The only problem: it's not open source. +Luckily, their [state language](https://states-language.net/spec.html) is. + +Using this states language, we are [building an open source orchestration engine](https://github.com/supabase/workflows) for +managing very complex Workflows with queueing, etc. It will be built with Elixir. + +This engine won't execute code. Instead, it will coordinate and execute existing functions wherever they live: AWS, GCP, Azure, +OpenFaas, and of course Postgres. + +We plan to add "modules" which work natively: email services, notification services, and other platforms. + +The engine is deeply integrated with Postgres. `Jobs`, `queues`, and `logs` will be stored and accessible by SQL. We'd like to give a shoutout to the [Oban](https://getoban.pro) team here, their robust job processing was a big missing piece for the engine. And most importantly, it's backed by Postgres! + +Once ready, we will make this available in the Supabase Dashboard with a Zapier-like interface. + +## What are Workflows + +Workflows orchestrate and execute functions in response to a database event (insert, update, delete) or a HTTP call (direct invocation). + +You can use them to rapidly develop microservices (once we have functions) without worrying about servers. + +Workflows are stateless - the output of a state becomes the input of the next state. + +Workflows are defined using Amazon States Languages, so you can import your workflows from AWS (although we are still building handlers +for most AWS resources). + +Workflows can be _persistent_ (the default). This means they are tolerant to server restarts, but it also means they need to use +the database to store their state. + +Workers can be _transient._ These are fully in-memory if you don't want to store the execution state (for example, IoT +applications that trigger workflows very often). Transient workflows are not restarted if the server crashes or is restarted. + +## Example + +A typical use-case for workflows is sending emails. For example, you might want to send a user an email one day after they +sign up. In database terms we can say: "trigger an email workflow whenever there is an insert on the `users` table." + +Let's break this down into steps, then tie it all together at the end: + +### Sending an email + +```yaml +SendEmail: + Type: Task + Next: Complete + Resource: my-email-service + Parameters: + api_key: my-api-key + template_id: welcome-email + payload: + name.$: '$.record.name' + email.$: '$.record.email' +``` + +Here we have a "Task" which triggers a call to an email service (like Mailgun or Postmark). Specifically, it's telling +the service to send the `welcome-email` template, and it's providing it a `name` and an `email` as parameters. + +### Waiting a day + +Since we don't want to send the email immediately, we need to tell Workflows to wait one day + +```yaml +WaitOneDay: + Type: Wait + Next: SendEmail + Seconds: 86400 +``` + +Here "one day" is specified in seconds. + +### Trigger on insert + +We mentioned that you could trigger a workflow whenever there is an "insert" on the `users` table. But what if you insert +multiple users at once? Not a problem - we can loop through all the inserts with a `Map`: + +```yaml +EmailUsers: + Type: Map + End: true + InputPath: '$.changes' + Iterator: + StartAt: CheckInsert + States: + CheckInsert: + Type: Choice + Default: Complete + Choices: + - Variable: '$.type' + StringEquals: INSERT + Next: WaitOneDay +``` + +In this part, we have a task "EmailUsers", which iterates through all the database events (`$.changes`) and checks if they are INSERTs. + +### Tying it all together + +Let's see how it looks all together: + +```yaml +--- +Comment: Email users after one day +StartAt: EmailUsers +States: + EmailUsers: + Type: Map + End: true + InputPath: '$.changes' + Iterator: + StartAt: CheckInsert + States: + CheckInsert: + Type: Choice + Default: Complete + Choices: + - Variable: '$.type' + StringEquals: INSERT + Next: WaitOneDay + WaitOneDay: + Type: Wait + Next: SendEmail + Seconds: 86400 + SendEmail: + Type: Task + Next: Complete + Resource: send-templated-email + Parameters: + api_key: my-api-key + template_id: welcome-email + payload: + name.$: '$.record.name' + email.$: '$.record.email' + Complete: + Type: Succeed +``` + +The workflow receives the following JSON data from Supabase [Realtime](https://github.com/supabase/realtime): + +```json +{ + "changes": [ + { + "columns": [ + { + "flags": ["key"], + "name": "id", + "type": "int8", + "type_modifier": 4294967295 + }, + { + "flags": [], + "name": "name", + "type": "text", + "type_modifier": 4294967295 + }, + { + "flags": [], + "name": "email", + "type": "text", + "type_modifier": 4294967295 + } + ], + "commit_timestamp": "2021-03-17T14:00:26Z", + "record": { + "id": "101492", + "name": "Alfred", + "email": "alfred@example.org" + }, + "schema": "public", + "table": "users", + "type": "INSERT" + } + ], + "commit_timestamp": "2021-03-17T14:00:26Z" +} +``` + +## Next Steps + +We've already open sourced the Workflow interpreter [here](https://github.com/supabase/workflows). It's built with Elixir, +so you can find it on Hex [here](https://hexdocs.pm/workflows/Workflows.html). + +After we've ironed out a few bugs we will integrate it into the Supabase Stack. As with all Supabase features, we'll add a +[nice UI](https://ui.supabase.com/) to make prototyping extremely rapid. We'll integrate the UI with the code (via Git) to make +sure everything is version controlled. diff --git a/www/_blog/2021-04-06-supabase-beta-march-2021.mdx b/www/_blog/2021-04-06-supabase-beta-march-2021.mdx new file mode 100644 index 00000000000..49222e89cb1 --- /dev/null +++ b/www/_blog/2021-04-06-supabase-beta-march-2021.mdx @@ -0,0 +1,122 @@ +--- +title: Supabase Beta March 2021 +description: Launch week, Storage, Supabase CLI, Connection Pooling, Supabase UI, and Pricing. +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: march-2021/release-mar-2021.jpg +thumb: march-2021/release-mar-2021.jpg +tags: + - release-notes +date: '2021-04-06' +--- + +Launch week, Storage, Supabase CLI, Connection Pooling, Supabase UI, and Pricing. Here's what we released last month. + +### Quick demo + +Watch a full demo: + + + +## Supabase Storage + +Need to store images, audio, and video clips? Well now you can do it on [Supabase Storage](/blog/2021/03/30/supabase-storage). It's backed by S3 and our new [OSS storage API](https://github.com/supabase/storage-api) written in Fastify and Typescript. Read the [full blog post](/blog/2021/03/30/supabase-storage). + +![Supabase Storage](/images/blog/storage/ph-1.png) + +## Connection Pooling + +The Supabase API already handles Connection Pooling, but if you're connecting to your database directly (for example, with Prisma) we now [bundle PgBouncer](/blog/2021/04/02/supabase-pgbouncer). Read the [full blog post](/blog/2021/04/02/supabase-pgbouncer). + +![Connection Pooling](/images/blog/bouncer/pgbouncer-thumb.jpg) + +## React UI Component Library + +We open sourced our internal UI component library, so that anyone can use and contribute to the Supabase aesthetic. It lives at [ui.supabase.com](https://ui.supabase.com/) . It was also the #1 Product of the Day [on Product Hunt](https://www.producthunt.com/posts/supabase-ui). + +![React UI Library](/images/blog/march-2021/supabase-ui.png) + +## CLI + +Now you can run Supabase locally in the terminal with `supabase start`. We have done some preliminary work on [diff-based schema migrations](/blog/2021/03/31/supabase-cli#migrations), and added some new tooling for self-hosting Supabase with Docker. [Blog post here](/blog/2021/03/31/supabase-cli). + +![Supabase CLI](/images/blog/march-2021/supabase-cli.png) + +## Pricing + +Our most frequently asked question by far is "ok supabase is sweet, but how much is it going to cost?". TL;DR there's **Free Tier** up to 500mb + 10k auth users, a **Pro** **Tier** at $25/month for 8GB + 100k auth users, and anything additional is charged on a usage basis. + +See [Pricing Page](/pricing) for full details and also our blog on why [pricing is hard](/blog/2021/03/29/pricing). + +![Supabase Pricing](/images/blog/march-2021/supabase-pricing.jpg) + +## NFT Platform + +Well... not really, but it made for a great [April Fools joke](/blog/2021/04/01/supabase-nft-marketplace). + +![Supabase NFT marketplace BuyMeth.com](/images/blog/nft/nft-1.png) + +## Supabase Dot Com + +We are now dot com! We'll be porting across over the next few weeks. Read the origin story behind the name [here](/blog/2021/04/02/supabase-dot-com). + +![Supabase Dot Com](/images/blog/supabase-dot-com-og.jpg) + +## OAuth Scopes + +Thanks to a comunity contribution ([@\_mateomorris](https://twitter.com/_mateomorris) and [@Beamanator](https://twitter.com/Beamanator)), Supabase Auth now includes OAuth scopes. These allow you to request elevated access during login. For example, you may want to request access to a list of Repositories when users log in with GitHub. Check out the [Documentation](/docs/reference/javascript/auth-signup#sign-up-with-scopes). + +![Oauth Scope](/images/blog/march-2021/oauth-scopes.png) + +## Kaizen + +- You can now manage your PostgREST configuration inside the Dashboard. +- Our website has been redesigned. Check out our new [Homepage](/) and [Blog](/blog), and our new [Database](/database), [Auth](/auth), and [Storage](/storage) product pages. +- We refactored some of our Filter methods to make them even easier to use. Check out the [Full Text Search](/docs/reference/javascript/textsearch) refactor. +- We have added several new sections to our Docs including: [Local Dev](/docs/guides/local-development), [Self Hosting](/docs/guides/self-hosting), and [Postgres Reference](/docs/reference/postgres/getting-started) docs (all still under development). + +## Community + +- How to use Supabase inside Replit [[Video](https://www.youtube.com/watch?v=lQ5iIxaYduI)] +- [Connecting Draftbit to Supabase](https://docs.draftbit.com/docs/supabase) by [@amanhimself](https://twitter.com/amanhimself) +- [Creating Users in Next-js](https://t.co/IKcn3mgqW0?amp=1) by [@indigitalcolor](https://twitter.com/indigitalcolor) +- [A Backend for IndieHackers](https://drew.tech/supabase-a-backend-for-indiehackers) by [@dbredvick](https://twitter.com/DBredvick) +- The Firebase Alternative by [Simon Grimm](https://www.youtube.com/user/saimon1924) [[Video](https://www.youtube.com/watch?v=F6VyIXFQVtQ)] +- Ionic Integration by [Simon Grimm](https://www.youtube.com/user/saimon1924) [[Video](https://www.youtube.com/watch?v=pl9XfIWutKE)] +- Flutter Integration by [Aditya Thakur](https://www.youtube.com/channel/UChCAJNpMwoEUYCsE_eSyU4w) by [[Video](https://www.youtube.com/watch?v=fqfHEZvQPlY)] +- Svelte Integration by [Khaerunnisa Isnaeni](https://www.youtube.com/channel/UCqNDj6eQeTLHuEwgEHWOGjw) [[Video](https://www.youtube.com/watch?v=odPYzJJyEJI)] +- An [example app](https://github.com/supabase/supabase/tree/master/examples/nextjs-ts-user-management) for adding User Profiles to your Next.js app + +![Supabase Stars march 2021](/images/blog/march-2021/supabase-stars-march-2021.png) + + + Source: repository.surf/supabase + + +If you want to keep up to date, make sure you [subscribe to our YouTube channel](https://www.youtube.com/c/supabase) or [follow us on Twitter](https://twitter.com/supabase). + +## Coming Next + +Lets say for each new sign up, you want to trigger a slack alert, send them an email after 24 hours. + +For this we are working on our own [Workflow engine](/blog/2021/04/02/supabase-workflows), it will eventually have a Zapier-like interface inside the dashboard. For now it's a state-machine interpreter (fully compatible with Amazon States Language) written in Elixir, [open source](https://github.com/supabase/workflows), and ready for community contributions. + +![Workflows](/images/blog/workflows/workflows-thumb.jpg) + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io/) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Subscribe to our [YouTube channel](https://www.youtube.com/c/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2021-05-03-supabase-beta-april-2021.mdx b/www/_blog/2021-05-03-supabase-beta-april-2021.mdx new file mode 100644 index 00000000000..52d771b3461 --- /dev/null +++ b/www/_blog/2021-05-03-supabase-beta-april-2021.mdx @@ -0,0 +1,177 @@ +--- +title: Supabase Beta April 2021 +description: Supabase "gardening" - stability, security, and community support. +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: april-2021/release-apr-2021.jpg +thumb: april-2021/release-apr-2021.jpg +tags: + - release-notes +date: '2021-05-05' +--- + +This month was a "gardening" month for Supabase. The team focused on stability, security, and community support. +Check out what we were working on below, as well as some incredible Community contributions. + +### Quick demo + +Watch a full demo: + + + +## Light Mode + +We're a developer tool, which means that Dark Mode is [extremely popular](https://twitter.com/supabase/status/1388131942919376904). + +![This poll on twitter shows that 78.5% of our developer base use Dark Mode for the IDE](/images/blog/april-2021/twitter-darkmode.png) + +While Dark mode is great, for some people it's not an option. Dark Mode is difficult to use for developers with astigmatisms, +or even just working in brightly-lit environments. + +So today we're shipping Light Mode. Access it in the settings of your [Dashboard](https://app.supabase.io). + + + +## Translations + +With the help of the community, we [started internationalizing](https://github.com/supabase/supabase/issues/1341) our main repository: + +- [Arabic | العربية](https://github.com/supabase/supabase/blob/master/i18n/README.ar.md) +- [Chinese / 中文](https://github.com/supabase/supabase/blob/master/i18n/README.cn.md) +- [Dutch / Nederlands](https://github.com/supabase/supabase/blob/master/i18n/README.nl.md) +- [English](https://github.com/supabase/supabase) +- [French / Français](https://github.com/supabase/supabase/blob/master/i18n/README.fr.md) +- [German / Deutsch](https://github.com/supabase/supabase/blob/master/i18n/README.de.md) +- [Hindi / हिंदी](https://github.com/supabase/supabase/blob/master/i18n/README.hi.md) +- [Nepali / नेपाली](https://github.com/supabase/supabase/blob/master/i18n/README.ne.md) +- [Italiano / Italian](https://github.com/supabase/supabase/blob/master/i18n/README.it.md) +- [Japanese / 日本語](https://github.com/supabase/supabase/blob/master/i18n/README.jp.md) +- [Norwegian (Bokmål) / Norsk (Bokmål)](https://github.com/supabase/supabase/blob/master/i18n/README.nb-no.md) +- [Polish / Polski](https://github.com/supabase/supabase/blob/master/i18n/README.pl.md) +- [Portuguese / Portuguese](https://github.com/supabase/supabase/blob/master/i18n/README.pt.md) +- [Portuguese (Brazilian) / Português Brasileiro](https://github.com/supabase/supabase/blob/master/i18n/README.pt-br.md) +- [Russian / Pусский](https://github.com/supabase/supabase/blob/master/i18n/README.ru.md) +- [Spanish / Español](https://github.com/supabase/supabase/blob/master/i18n/README.es.md) +- [Traditional Chinese / 正體中文](https://github.com/supabase/supabase/blob/master/i18n/README.zh-tw.md) +- [Turkish / Türkçe](https://github.com/supabase/supabase/blob/master/i18n/README.tr.md) +- [Ukrainian / Українська](https://github.com/supabase/supabase/blob/master/i18n/README.uk.md) + +![Map of the world](/images/blog/april-2021/map.png) + +## OpenAPI spec for Storage + +We released [Storage Api docs](https://supabase.github.io/storage-api) built using OpenAPI (swagger). + +![Storage API documentation](/images/blog/april-2021/storage-openapi.png) + +## Stripe Sync Engine (Experimental) + +We [open-sourced a server](https://github.com/supabase/stripe-sync-engine) which keeps any Postgres database in sync with Stripe. +This is experimental only. We're evaluating other tools such as [Singer](https://www.singer.io/tap/stripe/postgresql/), +which provide a more general solution (but are less "realtime"), and we're opening it up here to gather feedback. + +![Stripe sync engine](/images/blog/april-2021/stripe-sync-engine.jpg) + +## Community spotlight: Threaded comments + +One of the most powerful Postgres features is "recursive CTEs" which can be used for nested items (comments, pages, friend-graphs). [@lawrencecchen](https://twitter.com/lawrencecchen) has built a full [Threaded Comments demo](https://github.com/lawrencecchen/threaded-comments) which you can [Deploy with a single click](https://github.com/lawrencecchen/threaded-comments#instant-deploy). Want to add comments to your blog with [Full Text Search](/docs/reference/javascript/textsearch)? Just use Postgres. + + + +## Community spotlight: SupaScript + +It looks like [@burggraf2](https://twitter.com/burggraf2) got tired of waiting for us to ship Functions, and decided to +build a whole JS ecosystem within his Supabase database. If you want to write PG functions in JS, import remote libraries +from the web, and console log to your browser, check out this [SupaScript repo](https://github.com/burggraf/SupaScript). + +```js +// After installing: +// https://github.com/burggraf/SupaScript#installation + +/** + * Get all users who logged in this week. + * Use in the database: select * from users_this_week(); + * Use in the browser: supabase.rpc('users_this_week'); + */ +create or replace function users_this_week() +returns json as $$ + const moment = require('https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.js', false); + + const lastWeek = moment().subtract(7, 'days'); + const query = 'select * from auth.users where created_at > $1' + const users = sql(query, lastWeek); + + return users; +$$ language plv8; +``` + +## Community spotlight: Fireship + +Fireship reviewed Supabase last week, and despite being a (self-proclaimed) Firebase fan-boy, the review was very impartial. + + + +## Community + +- Watch [@everConfusedGuy](https://twitter.com/everConfusedGuy)'s talk at DevX conf - Building Supabase Storage: [YouTube video](https://www.youtube.com/watch?v=YsUYOsq_o7g) +- DuckDuckAbdaal by [@Nutlope](https://twitter.com/Nutlope) - a personalized search engine: [Twitter](https://twitter.com/Nutlope/status/1389082406477463557) +- Supabase in 6 minutes by [Georges Duverger](https://www.youtube.com/channel/UCNERPJ-vs61KEsD_dRNWFIw): [YouTube video](https://www.youtube.com/watch?v=c8DNV9yl0mg) +- Build a SaaS Platform with Stripe by [@\_\_dijonmusters:](https://twitter.com/_dijonmusters) [DEV blog](https://dev.to/dijonmusters/series/12346) +- Supabase & Sveltekit by Svelte Mastery: [YouTube video](https://www.youtube.com/watch?v=j4AV2Liojk0) +- Firebase vs. Supabase - Draftbit Office Hours: [YouTube Livestream](https://www.youtube.com/watch?v=9Yg6i_zCuiM) + +**Supabase GitHub Star Growth** + +- Our [main GitHub repo](https://github.com/supabase/supabase) grew 60% (by stars) and we saw a flood of new contributors. +- Our [UI Library](https://github.com/supabase/ui) grew 175% +- Our [Realtime Server](https://github.com/supabase/realtime) grew 39% after landing on the [front page of Hacker News](https://news.ycombinator.com/item?id=26968449). + +![Stars from github](/images/blog/april-2021/stars-all.png) + + + Source: repository.surf/supabase + + +If you want to keep up to date, make sure you [subscribe to our YouTube channel](https://www.youtube.com/c/supabase) or [follow us on Twitter](https://twitter.com/supabase). + +## Coming Next + +You might have noticed our Dashboard slowly changing (improving), as we migrate the components out to our [open source UI Library](https://github.com/supabase/ui). This progression is an important step towards offering a UI for [Local Development](/docs/guides/local-development) and [Self Hosting](/docs/guides/self-hosting). + +We're also working on our [Workflows engine](/blog/2021/04/02/supabase-workflows). This is quite a large task, but we're making progress and aiming to ship sometime in July. + +## One more thing + +[We started hiring](/docs/careers). + +![screenshot of our hiring page](/images/blog/april-2021/hiring.png) + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io/) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Subscribe to our [YouTube channel](https://www.youtube.com/c/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2021-06-02-supabase-beta-may-2021.mdx b/www/_blog/2021-06-02-supabase-beta-may-2021.mdx new file mode 100644 index 00000000000..acb604ecf46 --- /dev/null +++ b/www/_blog/2021-06-02-supabase-beta-may-2021.mdx @@ -0,0 +1,131 @@ +--- +title: Supabase Beta May 2021 +description: Apple & Twitter Logins, Supabase Grid, Go & Swift Libraries. +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: 2021-may/release-may-2021.jpg +thumb: 2021-may/release-may-2021.jpg +tags: + - release-notes +date: '2021-06-02' +--- + +Apple & Twitter Logins, Supabase Grid, Go & Swift Libraries. Lots of great stuff to try out this month. + +### Quick demo + +Watch a full demo: + + + +## Apple logins are now available + +Did you know: if you ship an app to the App Store with any third-party logins, you're required to enable Apple logins as well? Now you can with Supabase Auth. + +![Apple OAuth is now available in Supabase](/images/blog/2021-may/supabase-apple-login.png) + +## Twitter logins are now available + +You can also use Twitter as an OAuth provider with Supabase Auth. Twitter has a very archaic OAuth implementation, so this one took awhile. + +![Twitter OAuth is now available in Supabase](/images/blog/2021-may/supabase-twitter-login.png) + +## New storage policy editor + +We shipped a new Policy Editor for managing Row Level Security on your Storage. We provide some templates to simplify the process for new developers. + +![New Policy Editor](/images/blog/2021-may/storage-policies.png) + +## Supabase Grid + +We are still working on Open Sourcing our Dashboard, and took another step closer by publicly releasing a new [Supabase Grid](https://github.com/supabase/grid). It's not ready to use outside of the Supabase ecosystem, but over time we hope to make it usable with any Postgres Database. + +![This is an image of the new Supabase Grid](/images/blog/2021-may/table-grid.png) + +## Japan (Tokyo) 🇯🇵 is now available as a region + +There are a huge number of Supabase developers in Japan and China, and at their request we've launched Tokyo as a region. + +![Tokyo is now availabel as a region](/images/blog/2021-may/japan-region.png) + +## Return data as CSV + +You can now [retrieve your data](/docs/reference/javascript/select#return-data-as-csv) as Comma Separated Values. Thanks to [@andreivreja](https://github.com/andreivreja) for the [awesome PR](https://github.com/supabase/postgrest-js/pull/187). + +![Download data as a CSV](/images/blog/2021-may/return-data-as-csv.png) + +## New Go Libraries + +The community started developing the Go libraries. [postgrest-go](https://github.com/supabase/postgrest-go) is completed, [@Yusuf_Papurcu](https://twitter.com/Yusuf_Papurcu) and [@muratmirgun](https://twitter.com/muratmirgun) are working on the remaining libraries. + +![Supabase Go Libraries](/images/blog/2021-may/supabase-go-support.png) + +## New Swift Libraries + +The community started developing the Swift libraries too. [@satishbabariya](https://twitter.com/satishbabariya) is making huge progress on +[`storage-swift`](https://github.com/supabase/storage-swift), +[`gotrue-swift`](https://github.com/supabase/gotrue-swift), +[`realtime-swift`](https://github.com/supabase/realtime-swift), and +[`supabase-swift`](https://github.com/supabase/supabase-swift). + +![Supabase Swift Libraries](/images/blog/2021-may/supabase-swift-support.png) + +## Build in Public + +We started a weekly 1-hour live stream where we build in public. + +- [Build in Public 001](https://www.youtube.com/watch?v=p561ogKZ63o): Building a "Next.js + Supabase" Tutorial +- [Build in Public 002](https://twitter.com/p_phiri/status/1397815806990372865?s=20): `maybeSingle()` and "React + Supabase" Tutorial + + + +## Community + +- `@p_phiri` made his first OSS contribution, and documented it on YouTube. [Twitter](https://twitter.com/p_phiri/status/1397815806990372865?s=20). +- `@sonnylazuardi` built an awesome 3d globe using Supabase. [Twitter](https://twitter.com/sonnylazuardi/status/1397141285664792578?s=20). +- `@yallurium` released Part 2 of "Going Full Stack with Flutter and Supabase". [Twitter](https://twitter.com/yallurium/status/1396850742724632582?s=20). +- `@coderinblack` built an Audio Social Platform using Supabase. [Twitter](https://twitter.com/coderinblack/status/1396199050207121408). +- `@adityathakurxd` built a Flutter + Supabase starter kit. [GitHub](https://github.com/adityathakurxd/supabase_flutter). +- `@dshukertjr` built a geo-tagged video sharing app with Flutter + Supabase. [GitHub](https://github.com/dshukertjr/spot) +- `@JonoYeong` created a 6-minute overview of Supabase. [YouTube](https://www.youtube.com/watch?v=1F240hR7nHU). [Twitter](https://twitter.com/JonoYeong/status/1398451556723294208). +- Everyone who has produced Supabase content is now receiving their [swag](https://twitter.com/coderinblack/status/1397042488586559490?s=20). Send a link to your blog, app, or video to swag@supabase.io along with your address and we'll make sure you're included in the next drop. + +**Supabase GitHub Star Growth** + +![13223 stars on GitHub.](/images/blog/2021-may/supabase-stars-may-2021.png) + + + Source: repository.surf/supabase + + +If you want to keep up to date, make sure you [subscribe to our YouTube channel](https://www.youtube.com/c/supabase) or [follow us on Twitter](https://twitter.com/supabase). + +## Coming Next + +We're planning another Launch Week at the end of July. We'll probably have a quiet month of shipping this month so that we can get everything prepared for July. + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io/) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Subscribe to our [YouTube channel](https://www.youtube.com/c/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2021-07-01-roles-postgres-hooks.mdx b/www/_blog/2021-07-01-roles-postgres-hooks.mdx new file mode 100644 index 00000000000..aef471ea730 --- /dev/null +++ b/www/_blog/2021-07-01-roles-postgres-hooks.mdx @@ -0,0 +1,409 @@ +--- +title: Protecting reserved roles with PostgreSQL Hooks +description: Using Postgres Hooks to protect functionality in your Postgres database. +author: steve_chavez +author_url: https://github.com/steve-chavez +author_image_url: https://github.com/steve-chavez.png +authorURL: https://github.com/steve-chavez +image: postgres-hooks/og-postgres-hooks.jpg +thumb: postgres-hooks/cover-postgres-hooks.jpg +tags: + - postgres +date: '2021-07-02' +--- + +PostgreSQL manages permissions through roles. To create these roles, a database user needs the `CREATEROLE` privilege, +which not only allows role creation but also _modification_ of any role (except superusers). + +At Supabase, we use dedicated roles for each of our customers' backend services. For instance, our [Storage API](/storage)  +uses the `supabase_storage_admin` role for connecting to the database. Giving the `CREATEROLE` privilege to our customers would allow them to +drop this role and take their own Storage API down. + +And yet, we want to give our customers the ability to manage roles the same as they do it in on-premises databases, +with the usual `CREATE ROLE`, `ALTER ROLE`, and `DROP ROLE` statements. + +So, how do we grant them the `CREATEROLE` privilege and, at the same time, protect our own roles? In this blog post, +we explain how we managed to do this by using PostgreSQL Hooks in our [SupaUtils](https://github.com/supabase/supautils) extension. + +## Reserved Roles + +PostgreSQL has a list of [predefined roles](https://www.postgresql.org/docs/14/predefined-roles.html) — all prefixed +with "pg\_" — that cannot be dropped or altered. Attempting to do so will throw an error mentioning that the role is "reserved". + +```sql +alter role pg_monitor createdb; +ERROR: role name "pg_monitor" is reserved +DETAIL: Cannot alter reserved roles. +``` + +This mechanism is an internal implementation detail. Unfortunately Postgres doesn't allow us to define our own reserved roles. + +### RDS reserved roles + +Amazon RDS has a similar defense mechanism, all of its predefined roles — prefixed with "rds" — cannot be modified. + +```sql +alter role rdsadmin rename to another; +ERROR: The "rdsadmin" role cannot be renamed. +DETAIL: The "rdsadmin" role cannot be renamed because either the source + or the target name refer to an Amazon RDS reserved role name. +LOCATION: handle_rename, rdsutils.c:1534 +``` + +Again, the error mentions that the role is "reserved". + +Also note the `rdsutils.c` mention. That's not a stock Postgres source file. This means that the logic comes +from an RDS extension. We can confirm this is the case by showing the preloaded libraries. + +```sql +show shared_preload_libraries; + + shared_preload_libraries +----------------------------- + rdsutils,pg_stat_statements +``` + +`rdsutils` can be seen there. Naturally this lead us into thinking we can achieve the same logic with an extension +of our own, and thus the SupaUtils idea was born. + +## Extending PostgreSQL with Hooks + +PostgreSQL hooks allow us to extend internal functionality. Hooks can modify behavior at different places, +including when running SQL statements. + +For example, if we wanted to enforce our own password restrictions whenever a user changes passwords, we could +use the `check_password_hook` to verify the password. We would write out our own Custom Logic, and raise an error +if the password fails the password requirements. + +![This is an images of the lifecycle of a Postgres Hook.](/images/blog/postgres-hooks/hooks-postgres-alter-role.png) + +For `SupaUtils`, we're particularly interested in the `ProcessUtility_hook`, which allows us to hook into **utility statements:** every statement except `select`, `insert`, `delete` or `update`. They include `alter role` and `drop role`, which are the statements we want to hook on. + +### Hooks are global function pointers + +To use hooks, we can override functions pointers that are global. On the Postgres codebase, the `ProcessUtility_hook` is basically used[^1] like this: + +```c +// src/backend/tcop/utility.c + +// ProcessUtility_hook is NULL by default +ProcessUtility_hook_type ProcessUtility_hook = NULL; + +// This function is used for processing all the utility statements +void +ProcessUtility(PARAMS_OMITTED_FOR_BREVITY) +{ +// call the ProcessUtility_hook if it's not NULL +if (ProcessUtility_hook) + (*ProcessUtility_hook)(PARAMS_OMITTED_FOR_BREVITY); +// otherwise call the standard function used to process utility statements +else + standard_ProcessUtility(PARAMS_OMITTED_FOR_BREVITY); +} +``` + +As you can see, `ProcessUtility_hook` is `NULL` by default, so our extension should set it for the hook to run. Also, the `standard_ProcessUtility` function is the one that actually does the job of creating or modifying the roles (among other things) so our hook should also call it. + +### Loading and running the hook + +Each extension set in `shared_preload_libraries` will get its `_PG_init` function called. This function will allow us to set our hook onto `ProcessUtility_hook`. + +Since hooks are global function pointers, it might be the case that another extension modifies the hook pointer (on its own `_PG_init`) before us and sets its own hook. So we need to ensure we also run this previously-set hook, before or after our own hook runs. + +It's typically[^2] done like this: + +```c +// variable to store the previous hook +static ProcessUtility_hook_type prev_hook = NULL; + +// initialize our extension +void +_PG_init(void) +{ + // ProcessUtility_hook has the global function pointer. + // Store its value in case another extension already set its own hook. + prev_hook = ProcessUtility_hook; + // Now override the ProcessUtility_hook with our hook + ProcessUtility_hook = our_hook; +} + +static void +our_hook(PARAMS_OMITTED_FOR_BREVITY) +{ + // our hook logic goes here + + // If there was a previous hook, run it after our hook + if (prev_hook) + prev_hook(PARAMS_OMITTED_FOR_BREVITY); + // If there's no previous hook, call the standard function + else + standard_ProcessUtility(PARAMS_OMITTED_FOR_BREVITY); +} +``` + +## Setting up the SupaUtils extension + +We can use the concepts above to build our extension. + +First we'll need a Makefile in order to compile the extension code and include it into our PostgreSQL installation. + +```makefile +# Makefile + +# Our shared library +MODULE_big = supautils + +# Our object files to build for the library +OBJS = src/supautils.o + +# Tell pg_config to pass us the PostgreSQL extensions makefile(PGXS) +# and include it into our own Makefile through the standard "include" directive. +PG_CONFIG = pg_config +PGXS := $(shell $(PG_CONFIG) --pgxs) +include $(PGXS) +``` + +For the source file, we'll start with variable definitions and functions declarations. + +```c +// src/supautils.c + +// include common declarations +#include "postgres.h" + +// required macro for extension libraries to work +PG_MODULE_MAGIC; + +// variable for the previous hook +static ProcessUtility_hook_type prev_hook = NULL; + +// variable for our reserved roles configuration parameter +static char *reserved_roles = NULL; + +// function declaration for extension initialization +void _PG_init(void); + +// function declaration for our hook +static void supautils_hook( + PlannedStmt *pstmt, + const char *queryString, + ProcessUtilityContext context, + ParamListInfo params, + QueryEnvironment *queryEnv, + DestReceiver *dest, + QueryCompletion *completionTag +); + +// function declaration for our pure function that will return a reserved role +static char* look_for_reserved_role(Node *utility_stmt, List *reserved_role_list); +``` + +Up next we'll define each one of these function declarations. + +## Initializing the extension + +Let's now `_PG_init` our extension. Besides setting the hook here, we want to define our reserved roles as a configuration parameter, that way they can be modified by editing the `postgresql.conf` file. For this, we can use the `DefineCustomStringVariable` function, which inserts the parameter into Postgres "Grand Unified Configuration"(GUC) system. + +```c +void +_PG_init(void) +{ + // Store the previous hook + prev_hook = ProcessUtility_hook; + // Set our hook + ProcessUtility_hook = supautils_hook; + + // Define our "supautils.reserved_roles" parameter + // some arguments are unused so they are left as NULL + DefineCustomStringVariable("supautils.reserved_roles", + "Comma-separated list of roles that cannot be altered or dropped", + NULL, + // It will be assigned to the reserved_roles variable + &reserved_roles, + NULL, + // We should be able to reload this parameter without restarting the server, + // e.g. with "select pg_reload_conf()". + PGC_SIGHUP, + 0, + NULL, NULL, NULL); +} +``` + +## Running the SupaUtils hook + +Now that our hook is set, we'll define what it will do. As specified in the [ProcessUtility_hook_type](https://github.com/postgres/postgres/blob/f807e3410fdfc29ced6590c7c2afa76637e001ad/src/include/tcop/utility.h#L71-L75), the hook's first parameter is a `PlannedStmt`, this represents the planned statement — the output from the Postgres planner. This is a step before the statement is executed. + +We'll look for the presence of a reserved role in the planned statement. If there's one present, we'll report an error and abort the statement execution step. + +```c +static void +supautils_hook( + // The planned statement + PlannedStmt *pstmt, + // These parameters are here for completion, we'll not use any of them + const char *queryString, + ProcessUtilityContext context, + ParamListInfo params, + QueryEnvironment *queryEnv, + DestReceiver *dest, + QueryCompletion *completionTag +) +{ + // Get the utility statement from the planned statement + Node *utility_stmt = pstmt->utilityStmt; + + // Only do the logic if supautils.reserved_roles is not NULL + if(reserved_roles){ + // The found reserved role, assume none was found by default + char *reserved_role = NULL; + // Temp var for storing the list of reserved roles + List *reserved_role_list; + + // split the comma-separated string into a List by using a + // helper function from varlena.h + if (!SplitIdentifierString(pstrdup(reserved_roles), ',', &reserved_role_list)) + // abort and report an error if the splitting fails + ereport(ERROR, + (errcode(ERRCODE_INVALID_PARAMETER_VALUE), + errmsg("parameter \"%s\" must be a comma-separated list of " + "identifiers", reserved_roles))); + + // look for the reserved role in an internal function + reserved_role = look_for_reserved_role(utility_stmt, reserved_role_list); + + // we're done with the list so free it from memory + list_free(reserved_role_list); + + // abort and report an error if a reserved role was found + if(reserved_role) + ereport(ERROR, + (errcode(ERRCODE_INSUFFICIENT_PRIVILEGE), + errmsg("\"%s\" is a reserved role, it cannot be modified", reserved_role))); + } + + // Run the previous hook if defined or call the standard function + if (prev_hook) + prev_hook(pstmt, queryString, + context, params, queryEnv, + dest, completionTag); + else + standard_ProcessUtility(pstmt, queryString, + context, params, queryEnv, + dest, completionTag); +} + +``` + +## Looking for the reserved role + +Lastly, we'll define how we look for the reserved role. + +At this stage, we already have the utility statement and the reserved role list. All that's left to do is to define if the utility statement is an `ALTER ROLE` or `DROP ROLE` statement, and whether if the role it affects is a reserved one. + +```c +static char* +look_for_reserved_role(Node *utility_stmt, List *reserved_role_list) +{ + // Check the utility statement type + switch (utility_stmt->type) + { + // Matches statements like: + // ALTER ROLE role NOLOGIN + case T_AlterRoleStmt: + { + // cast the utility statement to an alter role statement + AlterRoleStmt *stmt = (AlterRoleStmt *) utility_stmt; + + //RoleSpec has the role name plus some attributes + RoleSpec *role = stmt->role; + + // postgres defines its own list utilities in pg_list.h + // ListCell is an element of the list that we'll use for iteration + ListCell *role_cell; + + // pg_list.h includes the foreach macro for iterating over lists + foreach(role_cell, reserved_role_list) + { + // get the list element + char *reserved_role = (char *) lfirst(role_cell); + + // compare the statement role with the reserved role + // get_rolespec_name will get the RoleSpec role name, + // even in cases where the role is the special case of + // "current_user" or "session_user" + if (strcmp(get_rolespec_name(role), reserved_role) == 0) + return reserved_role; + } + + break; + } + + // Matches statements like: + // DROP ROLE role + case T_DropRoleStmt: + { + // cast the utility statement to a drop role statement + DropRoleStmt *stmt = (DropRoleStmt *) utility_stmt; + ListCell *item; + + // the logic is the same as before, iterate over the reserved role list + // and find a match + foreach(item, stmt->roles) + { + RoleSpec *role = lfirst(item); + ListCell *role_cell; + + foreach(role_cell, reserved_role_list) + { + char *reserved_role = (char *) lfirst(role_cell); + + if (strcmp(get_rolespec_name(role), reserved_role) == 0) + return reserved_role; + } + } + + break; + } + + default: + break; + } + // Didn't find any reserved role on the statement, so return NULL + return NULL; +} +``` + +## Testing the extension + +Now that the code is finished, we can test the extension. Since we already have a `Makefile`, the extension can be installed by doing `make && make install`. Then, in postgresql.conf: + +```sql +# set the extension as preloaded, this will require a restart +shared_preload_libraries="supautils" + +# the reserved roles +supautils.reserved_roles="supabase_storage_admin, supabase_auth_admin" +``` + +We'll now try to alter or drop the reserved roles: + +```sql +alter role supabase_storage_admin nologin password 'fake'; +ERROR: "supabase_storage_admin" is a reserved role, it cannot be modified + +drop role supabase_auth_admin; +ERROR: "supabase_auth_admin" is a reserved role, it cannot be modified + +-- Success!! +``` + +## Wrapping up + +As you can see, PostgreSQL Hooks allow us to intercept SQL statements. There are many types of hooks, you can see unofficial documentation for these at [AmatanHead/psql-hooks](https://github.com/AmatanHead/psql-hooks). + +The full SupaUtils code is in our [GitHub repository](https://github.com/supabase/supautils/). + +By the way, if you like working on PostgreSQL tooling and extensions: we are hiring [PostgreSQL experts](/docs/careers/postgres-experts)! + +[^1]: You can see the `ProcessUtility_hook` declaration [here](https://github.com/postgres/postgres/blob/11e9caff82bc7326e2bc9782937cb03875050cc4/src/backend/tcop/utility.c#L75-L76) and its usage [here](https://github.com/postgres/postgres/blob/11e9caff82bc7326e2bc9782937cb03875050cc4/src/backend/tcop/utility.c#L515-L527). +[^2]: This is also done on [pg_stat_statements](https://github.com/postgres/postgres/blob/6991e774e0304f5ef488cf1ae4fa79578b6ae3d5/contrib/pg_stat_statements/pg_stat_statements.c#L1130-L1137) and [sepgsql](https://github.com/postgres/postgres/blob/6991e774e0304f5ef488cf1ae4fa79578b6ae3d5/contrib/sepgsql/hooks.c#L381-L388). diff --git a/www/_blog/2021-07-02-supabase-beta-june-2021.mdx b/www/_blog/2021-07-02-supabase-beta-june-2021.mdx new file mode 100644 index 00000000000..840b486061e --- /dev/null +++ b/www/_blog/2021-07-02-supabase-beta-june-2021.mdx @@ -0,0 +1,171 @@ +--- +title: Supabase Beta June 2021 +description: Discord Logins, Vercel Integration, Full text search, and OAuth guides. +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: 2021-june/release-june-2021.jpg +thumb: 2021-june/release-june-2021-cover.jpg +tags: + - release-notes +date: '2021-06-02' +toc_depth: 3 +--- + +Supabase is gearing up for another Launch Week on July the 26th. Until then, here's a few new things to try. + +### Quick demo + +Watch a full demo of this month's releases + + + +## Vercel integration + +Vercel just released their new integrations, which means you can now deploy a Postgres database on Supabase directly from your Vercel account. +Check it out! [vercel.com/integrations/supabase](https://vercel.com/integrations/supabase) + +![Supabase Vercel Integration](/images/blog/2021-june/supabase-vercel.png) + +## Discord logins are now available + +Building a community? There's almost no better tool than Discord (we're even trialling it ourselves). +If you're building a community product, Discord logins are the perfect option. + +![Discord logins](/images/blog/2021-june/supabase-discord.png) + +## New Guides + +We spent the month building up a new [Guides section](/docs/guides) in our Docs. Here are a few highlights: + +### Postgres Full Text Search + +Ever wanted to build a Search Engine? We just released a guide which shows you how to implement +[Full Text Search using Postgres](/docs/guides/database/full-text-search). + +![Postgres Full Text Search](/images/blog/2021-june/postgres-fts.png) + +### OAuth Guides + +We released step-by-step guides to help you set up OAuth with +[Apple](/docs/guides/auth/auth-apple), +[Bitbucket](/docs/guides/auth/auth-bitbucket), +[Facebook](/docs/guides/auth/auth-facebook), +[GitHub](/docs/guides/auth/auth-github), +[GitLab](/docs/guides/auth/auth-gitlab), +[Google](/docs/guides/auth/auth-google), and +[Twitter](/docs/guides/auth/auth-twitter). + +![Image of Apple's developer Portal](/images/blog/2021-june/apple-developer-portal.png) + +### Javascript + Postgres + +Did you know that you can use Javascript inside your Postgres database? Here's how, with the +[`plv8` extension](/docs/guides/database/extensions/plv8). + +![Postgres and Javascript with plv8](/images/blog/2021-june/supabase-plv8.png) + +## Public Storage Buckets + +Want to share all your favourite memes? Now it's even easier with Public Storage Buckets. Simply mark a bucket as +"Public" and the content will be accessible without a login. + + + +## Storage upserts + +Supabase Storage now supports `upsert`. Shoutout to [@ankitjena](https://github.com/ankitjena) for +[this Pull Request](https://github.com/supabase/storage-api/pull/32). + +![Storage now supports upserts](/images/blog/2021-june/supabase-storage-upsert.png) + +## Server restarts + +When things go wrong, sometime the best thing you can do is reboot. We released a restart button in the Dashboard, +the first of many debugging tools we'll be releasing over the next few months. + +![You can now restart you Supabase servers](/images/blog/2021-june/server-restarts.png) + +## Policy editor + +We added a new Table Policy Editor which makes Row Level Security even easier. We even included a few templates to get you started. + +![New editor for Row Level Security](/images/blog/2021-june/policy-editor.png) + +## Build in Public + +We run a weekly 1-hour live stream where we build in public. + +- [Build in Public 003](https://youtu.be/a2r-GGILQiA): Redwood PR, GitHub Discussions, Pricing Pages, Postgres Policies, Styling docs +- [Build in Public 004](https://youtu.be/7yhFmKmplDg): Svelte Quickstart, new `supabase-js` release, monthly GitHub release +- [Build in Public 006](https://youtu.be/LHYrqBb4q9I): Supabase Studio +- [Build in Public 007](https://youtu.be/R4gJhX_JFTo): Supabase Studio - API Docs + + + +## Community + +- [@dabit3](https://twitter.com/dabit3) released a complete guide to Supabase on FreeCodeCamp. [Twitter](https://twitter.com/freeCodeCamp/status/1404469119525732357) | [Blog](https://www.freecodecamp.org/news/the-complete-guide-to-full-stack-development-with-supabas/) +- [@raddevon](https://twitter.com/raddevon) built a social network using Supabase and Vue3. [Twitter](https://twitter.com/raddevon/status/1410401132845801479) | [YouTube](https://www.youtube.com/watch?v=x25a_q0vHUY) +- [@JonoYeong](https://twitter.com/JonoYeong) built live with Supabase + SvelteKit. [Twitter](https://twitter.com/JonoYeong/status/1409960155093946368) | [Twitch](https://www.twitch.tv/videos/1066520882) + +**Supabase GitHub Star Growth** + +![14200 stars on GitHub.](/images/blog/2021-june/github-june-2021.png) + + + Source: repository.surf/supabase + + +If you want to keep up to date, make sure you [subscribe to our YouTube channel](https://www.youtube.com/c/supabase) or +[follow us on Twitter](https://twitter.com/supabase). + +## External contributions + +### PostgREST + +- Primarily for Prisma users, we patched PostgREST [openapi-mode](https://github.com/PostgREST/postgrest/pull/1881) to ignore anon privileges for the OpenAPI output. + Credit to [@steve-chavez](https://github.com/steve-chavez/). +- We added better [PostgREST logging](https://github.com/PostgREST/postgrest/pull/1872) to include timestamps for every error + Credit to [@steve-chavez](https://github.com/steve-chavez/). + +### Auth0 + +- We fixed a XSS bug in the Auth0 Next.js library. [GitHub](https://github.com/auth0/nextjs-auth0/security/advisories/GHSA-954c-jjx6-cxv7) + Credit to [@inian](https://github.com/inian) and [Ishan Patel](https://github.com/git-ishanpatel) (a Supabase community member) + +## Coming Next + +Launch Week!! Remember that time we did a [Launch Week](/blog/2021/03/25/launch-week)? Well we're doing it again at the end of July. +Strap in, because we're shipping one thing every day for a week. + +Let's goooooo. + +![Launch week coming up.](/images/blog/supabase-launch-week.png) + +### Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io/) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Subscribe to our [YouTube channel](https://www.youtube.com/c/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2021-07-22-supabase-launch-week-sql.mdx b/www/_blog/2021-07-22-supabase-launch-week-sql.mdx new file mode 100644 index 00000000000..4240545c103 --- /dev/null +++ b/www/_blog/2021-07-22-supabase-launch-week-sql.mdx @@ -0,0 +1,109 @@ +--- +title: 'Supabase Launch Week II: The SQL' +description: Five days of Supabase. Again. +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: launch-week-sql/launchweek-2-the-sql-og.jpg +thumb: launch-week-sql/supabase-launch-the-sql.png +tags: + - launch-week +date: '2021-07-22' +toc_depth: 2 +--- + +In March, Supabase held a [Launch Week](/blog/2021/03/25/launch-week) where we launched a new product/feature every day for a week. + +It may seem crazy to do another launch week just four months later, but we couldn't give up on a good pun, so get ready for **Launch Week II: the SQL**. + +## What to expect + +Just like last time, we don't want to spoil the surprise. So for now we'll give you a teaser of what to expect. Come back each day to see what we launch, or follow us on Twitter to keep up to date: [@supabase](https://twitter.com/supabase) and follow the hashtag [#supalaunchweek](https://twitter.com/hashtag/supalaunchweek). + +## Monday 26 July: Community Day + +![Supabase Community](/images/blog/launch-week-sql/community-day.png) + +### **When?** + +Monday 26 July 2021. + +### What? + +One of the best things about building Supabase is the community. We're even luckier because we're an amalgamation of tools like Postgres and PostgREST. We're starting the week by shining a spotlight on some of the latest developments from the community. + +### Where? + +Read the [blog post](/blog/2021/07/26/supabase-community-day). + +## Tuesday 27 July: Storage v2 + +![Supabase storage v2](/images/blog/launch-week-sql/storage.png) + +### **When?** + +Tuesday 27 July 2021.[^1] + +### What? + +We shipped [Version 1 of Supabase Storage](/blog/2021/03/30/supabase-storage) in the last Launch Week, and now we've had 4 months to work on Storage Reloaded. + +### Where? + +Read the [blog post](/blog/2021/07/27/storage-beta). + +## Wednesday 28 July: Auth v2 + +![Supabase Auth v2](/images/blog/launch-week-sql/auth-v2.png) + +### **When?** + +Wednesday 28 July 2021.[^1] + +### What? + +What's cooler than Arnie in the 90's? Passwordless logins. We've [already](/docs/guides/auth/auth-apple) [built](/docs/guides/auth/auth-bitbucket) [support](/docs/guides/auth/auth-discord) [for](/docs/guides/auth/auth-facebook) [eight](/docs/guides/auth/auth-github) [different](/docs/guides/auth/auth-gitlab) [Oauth](/docs/guides/auth/auth-google) [providers](/docs/guides/auth/auth-twitter), so it's anyone's guess what can happen in Supabase Auth Episode II. + +### Where? + +Read the [blog post](/blog/2021/07/28/supabase-auth-passwordless-sms-login). + +## Thursday 29 July: Dashboard v2 + +![Supabase Dashboards](/images/blog/launch-week-sql/dashboards.png) + +### **When?** + +Thursday 29 July 2021. + +### What? + +Who needs a futuristic [Hoverboard from 2015](https://www.youtube.com/watch?v=NRkGYW9JAmQ) when you've got a super slick Dashboard from 2021. We've got some exciting changes coming to the Dashboard. + +### Where? + +Read the [blog post](/blog/2021/07/29/supabase-reports-and-metrics). + +## Friday 30 July: One more thing + +![Supabase prequels](/images/blog/launch-week-sql/prequel.png) + +### **When?** + +Friday 30 July 2021. + +### What? + +We all know that the best [SeQueLs](https://www.reddit.com/r/SequelMemes/) are actually [PreQueLs](https://www.reddit.com/r/PrequelMemes/). We've got a few surprises lined up for Friday that make the Supabase story a bit more complete. + +### Where? + +Read about [Supabase Hackathon](/blog/2021/07/30/supabase-swag-store), +[Supabase Functions Updates](/blog/2021/07/30/supabase-functions-updates), +and the Supabase [Swag Store](/2021/07/30/1-the-supabase-hackathon). + +[^1]: + When we first announced, Storage was on Wednesday and Auth was on Tuesday. We switched the order of these as we are doing a + Storage [presentation](https://www.meetup.com/the-monthly-dev-world-class-talks-by-expert-developers/events/278158726/) with + [daily.dev](https://daily.dev/) on Wednesday. diff --git a/www/_blog/2021-07-26-epsilon3-self-hosting.mdx b/www/_blog/2021-07-26-epsilon3-self-hosting.mdx new file mode 100644 index 00000000000..f5005583c8f --- /dev/null +++ b/www/_blog/2021-07-26-epsilon3-self-hosting.mdx @@ -0,0 +1,89 @@ +--- +title: 'Epsilon3 Self-Host Supabase To Revolutionize Space Operations ' +description: Learn how the team at Epsilon3 use Supabase to help teams execute secure and reliable operations in an industry that project spend runs into the billions. +author: rory_wilding +author_url: https://github.com/roryw10 +author_image_url: https://github.com/roryw10.png +authorURL: https://github.com/roryw10 +image: epsilon3/og-epsilon3.jpg +thumb: epsilon3/cover-epsilon3.jpg +tags: + - case-study +date: '2021-07-26' +toc_depth: 2 +--- + +Epsilon3 is a USA-based Y Combinator startup. They digitize paper-based procedures in the space industry using telemetry data, +simplifying testing and operations. Their product is rapidly becoming the OS for space projects and complex operations. + +Learn how the team at Epsilon3 uses Supabase to help teams execute secure and reliable operations in an industry where project +spend runs into the billions. + +### Space Operations + +Epsilon3's customers run testing and operational procedures in real-time. Epsilon3's solution allows online collaboration as a team, +instead of being siloed and separated which is an increasingly important requirement in a post-pandemic working world. +Epsilon3 is powering an industry where reliability is paramount. In the space industry, missions cost billions and need to run reliably. + +![Epsilon3 digitizes paper-based processes.](/images/blog/epsilon3/epsilon3-product.gif) + +Epsilon3's software saves operators time and reduces errors to improve complex operations. Their customers are using their software and +successfully sending satellites into space and are about to use Epsilon3's software for an operational Rocket Launch. As a result, their +reputation for improving the quality standard for complex operations has led to demand from other industries. The team is receiving +enquiries from clients in the robotics, logistics and medical equipment sectors who need a structured and standardized way of running +procedures and keeping audit trails. + +## Moving fast in regulated markets + +As a startup, Epsilon3 needs to move fast and scale. They require security, reliability, and performance. + +The team has a background in engineering from Northrop, Google, and SpaceX and understands the technical benefits Postgres offers as a +battle-tested open-source relational database. + +Real-time functionality is also a key for their customers to see how running procedures are progressing as the changes occur. + +The space industry is highly regulated, adding complexity. For example, in the USA, deployments must be in an ITAR-compliant way +(for instance AWS GovCloud supports ITAR compliance) while customers in countries outside the USA may need to host their data within their own +country. These customer requirements mean Epsilon3 must be able to offer flexible hosting options, including on-premises deployment. + + +

Billion dollar missions need to run reliably and securely.

+

+ We didn’t just want something that works, we wanted a solution implementing best practices. We + also needed a setup that we could self-host to meet compliance needs and allow on-premises + deployment options for our customers. +

+

+ We use Supabase because they give us an open-source scalable back-end built by database experts + that we can self-host. +

+

+ Supabase takes out the mental effort from our back-end infrastructure so we can focus on our + customers needs. +

+ + +### Supabase gives Postgres users Superpowers + +The team implemented a self-hosted Supabase setup. They use AWS with a self-hosted Supabase API powering an RDS Postgres instance. +This setup gives a balance of rapid development, reduced DevOps, and flexible hosting options. As Supabase uniquely offers real-time for +Postgres, it allows their customers to see updates from running procedures. Supabase offers well-supported client libraries that make +Postgres Row Level Security easy to use, which is a critical item on the Epsilon3 roadmap. + +All this was easy for the team to set up, even with self-hosting, so the team was able to focus on what they do best—helping their customers +run complex operations smoothly. With this implementation, Epsilon3 gets all the benefits of Postgres, plus the smooth developer experience and +support that Supabase is known for, without compromising their compliance needs. + +![Epsilon3 uses Supabase for hosting their critical infrastructure.](/images/blog/epsilon3/supabase-epsilon3-architecture.png) + +### Self-hosted Supabase, a superpower + +Self-hosting Supabase allows the crew at Epsilon3 to move fast. They are revolutionizing space operations securely and reliably in real-time whilst +staying compliant. The team is now seeing demand from other industries and is confident in their scaling capability because they know it's +just Postgres under the hood. + +Check out the [Epsilon3 website](https://www.epsilon3.io/) to learn more about the team and their OS for space operations. If you are interested +in self-hosting Supabase then you can **contact us** to learn more. diff --git a/www/_blog/2021-07-26-supabase-community-day.mdx b/www/_blog/2021-07-26-supabase-community-day.mdx new file mode 100644 index 00000000000..3995482185f --- /dev/null +++ b/www/_blog/2021-07-26-supabase-community-day.mdx @@ -0,0 +1,136 @@ +--- +title: 'Supabase Community Day' +description: Community Day +author: steve_chavez +author_url: https://github.com/steve-chavez +author_image_url: https://github.com/steve-chavez.png +authorURL: https://github.com/steve-chavez +thumb: launch-week-sql-day-1-community-day/launch-week-sql-day-1-community-day-thumb.jpg +image: launch-week-sql-day-1-community-day/launch-week-sql-day-1-community-day-og.jpg +tags: + - launch-week +date: '2021-07-26' +toc_depth: 2 +--- + +Supabase has grown a lot [^1] since last [Launch Week](/blog/2021/03/25/launch-week), +but it wouldn't be possible without some amazing open source tools. +Since we're shipping a few upgrades this week we feel it's only fair +to shine a spotlight on some tools and community efforts that make Supabase possible. + +## PostgreSQL version 13.3 + +![Postgres version 13 released](/images/blog/launch-week-sql-day-1-community-day/launch-week-sql-day-1-community-day-postgres-upgrade.jpg) + +PostgreSQL is a big part of Supabase, and it's also a huge inspiration - the speed that they ship, their community organization, +and their absolute dedication towards reliability. PostgreSQL 13.3 was released in June and (from today) every new Supabase project will +be on [PostgreSQL version 13.3](/blog/2021/07/26/supabase-postgres-13). + +### Giving back + +Supabase makes it easy to get started with Postgres, but we think you should try it even if you don't want to use Supabase. Here's a +few ways we make it easy to use PostgreSQL without Supabase: + +- Supabase was the first company to put Postgres in the [Digital Ocean Marketplace](https://marketplace.digitalocean.com/apps/supabase-postgres). + Since then it's been installed over 1000 times (not by us!). +- We provide a Postgres image in the [AWS marketplace](https://aws.amazon.com/marketplace/pp/prodview-lk2pfa5nafecg). +- We're packaging the Marketplace version, [along with "Bundles"](/blog/2021/07/26/supabase-postgres-13#postgresql-bundles) +- We're developing a few extensions: [supautils](https://github.com/supabase/supautils), [pg_net](https://github.com/supabase/pg_net), and a couple more soon to be announced. + +### Get involved + +- Follow the official [PostgreSQL Twitter](https://twitter.com/PostgreSQL) account. +- Join the official [mailing lists](https://www.postgresql.org/community/). + +## PostgREST version 8.0 + +![PostgREST version 8.0 released](/images/blog/launch-week-sql-day-1-community-day/launch-week-sql-day-1-community-day-postgrest.jpg) + +This new PostgREST stable version comes with the improvements we've made to make it truly enterprise-grade. Due to our commitment with OSS, +all of our improvements are upstreamed, so you can fully use them on your own self-hosted projects. + +### Highlights + +**Improved Performance**: Due to Supabase's high throughput requirements, PostgREST 8.0 handles up to 50% more throughput on +GET requests, according to our benchmarks. We converted all SELECT queries to use prepared statements and reduced logging +verbosity to make this possible. + +**Reduced downtime**: we need PostgREST to be more "set it and forget it", so reloading schema cache now has zero downtime. + +**Dynamic Configuration**: we've made it easier to handle PostgREST configuration at scale (we manage thousands of PostgREST instances). +This new version includes the ability to use an in-database configuration that is reloadable through a `NOTIFY` command. + +**Less admin burden**: PostgREST previously required the `pg_listen` utility to reload its schema cache. This is no longer needed. +The schema cache is reloadable with a simple `NOTIFY` command. + +**Better diagnostic information**: in the rare cases where PostgREST fails, we want to find the exact root cause quickly. +For this we've improved its logging by adding logging levels and timestamps to all server errors. + +**Simpler OpenAPI**: showing a complete OpenAPI output used to require a highly-privileged `anon` role. With the new `openapi-mode`, +this is no longer needed and `anon` can be kept with minimal privileges. + +The community has made many more enhancements and bug fixes for the new version. See +[v8.0 CHANGELOG](https://github.com/PostgREST/postgrest/releases/tag/v8.0.0) for the full list. + +### Get Started + +Want to get started with PostgREST? The Supabase community has built a number of client libraries to make it simpler to use: + +- Javascript: [postgrest-js](https://github.com/supabase/postgrest-js) +- Rust: [postgrest-rs](https://github.com/supabase/postgrest-rs) +- Go: [postgrest-go](https://github.com/supabase/postgrest-go) +- Python: [postgrest-py](https://github.com/supabase/postgrest-py) +- Dart: [postgrest-dart](https://github.com/supabase/postgrest-dart) +- C#: [postgrest-csharp](https://github.com/supabase/postgrest-csharp) +- Swift: [postgrest-swift](https://github.com/supabase/postgrest-swift) +- Ruby: [postgrest-rb](https://github.com/supabase/postgrest-rb) +- Kotlin: [postgrest-kt](https://github.com/supabase/postgrest-kt) + +### Get involved + +- Help with [PostgREST development](https://github.com/PostgREST/postgrest/blob/main/.github/CONTRIBUTING.md). +- Help with [PostgREST docs translations](https://github.com/PostgREST/postgrest-docs/issues/393). +- Follow the official [PostgREST Twitter](https://twitter.com/postgrest_org) account. + +## Supabase Flutter/Dart (Beta release) + +![Supabase Flutter Beta release](/images/blog/launch-week-sql-day-1-community-day/launch-week-sql-day-1-community-day-flutter-library.jpg) + +While the Supabase team have been busy with the Javascript libraries, the community have been beavering away with Dart. They've even +[built fully-functional apps](https://www.producthunt.com/posts/spot-2d300f54-7a0a-4dbf-aee2-4a75311217cc) using Supabase Auth and Storage. + +Today the Community are releasing both the Flutter and Dart libraries in Beta (with a bit of help from the Supabase team). + +### Get started + +- Check out the [Flutter Quickstart Guide](/docs/guides/with-flutter) +- Check out the code: + - Supabase Flutter: [GitHub](https://github.com/supabase/supabase-flutter/) | [Release](https://pub.dev/packages/supabase_flutter) + - Supabase Dart: [GitHub](https://github.com/supabase/supabase-dart/) | [Release](https://pub.dev/packages/supabase) + +### Get involved + +- Help [write](/docs/handbook/supasquad#author) the Flutter Docs. +- Help [maintain](/docs/handbook/supasquad#maintainer) the [Flutter](https://github.com/supabase/supabase-flutter/) + and [Dart](https://github.com/supabase/supabase-dart/) libraries. + +## Supabase Discord + +![Supabase Discord](/images/blog/launch-week-sql-day-1-community-day/launch-week-sql-day-1-community-day-discord-server.jpg) + +OK, OK, we get it - GitHub [Discussions](https://github.com/supabase/supabase/discussions) aren't enough for y'all. While we've been trying +to keep the conversation contained to our GitHub org, the community has been creating [subreddits](https://www.reddit.com/r/Supabase/), +StackOverflow [tags](https://stackoverflow.com/questions/tagged/supabase), and GitHub [topics](https://github.com/topics/supabase). + +A few weeks ago one of the community created a Community-led Discord, and so the team figured we might as well join the fun. + +We'll still be using Discussions for debugging, but if you're looking for a place to hang out with Supabase developers, Discord is where to find it. + +### Get involved + +Join the Supabase Community Discord: [discord.supabase.com](http://discord.supabase.com), say hi, and start building. + +[^1]: + Supabase has been one of the fastest growing startups [on GitHub](https://github.com/supabase/supabase) for four consecutive quarters: + 207% in [Q3](https://runacap.com/ross-index/q3-2020/) 2020; 1,373% in [Q4](https://runacap.com/ross-index/q4-2020/) 2020; + 462% in [Q1](https://runacap.com/ross-index/q1-2021/) 2021; 1,653% in [Q2](https://runacap.com/ross-index/q2-2021/) 2021. diff --git a/www/_blog/2021-07-26-supabase-postgres-13.mdx b/www/_blog/2021-07-26-supabase-postgres-13.mdx new file mode 100644 index 00000000000..6857acd7d0b --- /dev/null +++ b/www/_blog/2021-07-26-supabase-postgres-13.mdx @@ -0,0 +1,122 @@ +--- +title: 'Supabase is now on Postgres 13.3' +description: From today, new Supabase projects will be on a version of Supabase Postgres that runs on Postgres 13.3. +author: angelico_de_los_reyes +author_url: https://github.com/dragarcia +author_image_url: https://github.com/dragarcia.png +authorURL: https://github.com/dragarcia +image: pg13/postgres-13-og.jpg +thumb: pg13/postgres-13-thumb.jpg +tags: + - launch-week + - database +date: '2021-07-26' +toc_depth: 2 +--- + +From today, new Supabase projects will be on a version of [Supabase Postgres](https://github.com/supabase/postgres) that runs +on [Postgres 13.3](https://www.postgresql.org/about/news/postgresql-13-released-2077/). This won't be the only big change however in this version. +Here are a few other things that have changed under the hood. + +## PostgreSQL version 13.3 + +We've jumped from PostgreSQL 12.0 to PostgreSQL [version 13.3](https://www.postgresql.org/docs/13/release-13-3.html), introducing +significant performance improvements and some great new functionality. Some changes include: + +- native [UUID generation](https://www.postgresql.org/docs/13/functions-uuid.html) (!) using `gen_random_uuid` +- a new JSONB [datetime](https://www.postgresql.org/docs/13/functions-json.html) function +- vacuuming indexes in [parallel](https://www.postgresql.org/docs/13/sql-vacuum.html) +- [incremental sorting](https://www.postgresql.org/docs/13/using-explain.html#USING-EXPLAIN-BASICS) +- smaller [btree indexes](https://www.postgresql.org/docs/13/btree-implementation.html#BTREE-DEDUPLICATION) +- improvements to [extended statistics](https://www.postgresql.org/docs/13/planner-stats.html#PLANNER-STATS-EXTENDED) + +## Supabase Versioning + +Our [Postgres repo](https://github.com/supabase/postgres) has jumped from `0.15.0` to `13.3.0`. From now on, both major and minor versions of +Supabase Postgres will follow PostgreSQL. This makes it much easier to ascertain what version of PostgreSQL is installed. In the situation wherein +there are no updates to PostgreSQL in between releases, the patch version will be bumped up. + +## Large System Extensions (LSE) enabled for ARM instances + + + *Disclaimer for self-hosting: This is not available for x86 instances. All instances on the + Supabase platform have this enabled by default.* + + +The recent wave of Graviton 2 instances from AWS introduces support for the Large System Extensions (LSE). This looks to greatly enhance +application performance through atomics, and +[improves locking and synchronisation performance across large systems](https://github.com/aws/aws-graviton-getting-started#building-for-graviton-and-graviton2). + +### Preliminary Benchmarks + +Below is a comparison between the ARM versions of Supabase Postgres `0.15.0` and `13.3.0`. Both are using `m6gd.8xlarge` instances +and follow the PostgreSQL configuration [here](https://www.percona.com/blog/2021/01/22/postgresql-on-arm-based-aws-ec2-instances-is-it-any-good/). +The following configuration of `pgbench` was used. + +```bash hideCopy +pgbench -i -s 150 +``` + +Running the benchmark with 2, 4, 8, 16, 64, and 128 clients: + +```bash hideCopy +pgbench -P 5 -c {num_clients} -j {num_clients} -T 300 -M prepared postgres +``` + +![PostgreSQL 13.3 performance](/images/blog/pg13/postgres-13-performance.png) + +## Ubuntu 20.04 + +We have taken the opportunity to upgrade new projects from Ubuntu 18.04 to Ubuntu 20.04. A switch to Ubuntu 20.04 guarantees that the underlying +OS of Supabase Postgres is supported by the Canonical team up until the year 2025 (2023 for Ubuntu 18.04). + +## Built from source + +Driven by the need to enable LSE, the underlying PostgreSQL in this version was built from the ground up instead of downloaded binaries. +Supabase Postgres can now be easily upgraded whenever a new major or minor version of PostgreSQL is released. When PostgreSQL 14 comes out, +expect Supabase Postgres 14 to quickly follow. + +## New Extensions + +### `pgRouting` + +An extension of PostGIS, [`pgRouting`](https://pgrouting.org/) provides geospatial routing functionality. + +More information can be found [here](https://docs.pgrouting.org/latest/en/index.html). + +### `wal2json` + +Converts WAL output into clean and organized JSON objects. + +More information can be found [here](https://github.com/eulerto/wal2json). + +## Enhanced security + +To help combat brute force attacks, `fail2ban` has now been configured to protect direct connections to Postgres. This applies to both +ports `5432` (PostgreSQL) and `6543` (PgBouncer). + +IPs get banned for 10 minutes after three failed attempts, and we'll continue to fine-tune and improve the protections applied to the +database servers based on evolving traffic patterns. + +## PostgreSQL bundles + +`[Coming Soon]` + +Last but not the least, we're diversifying the images of Supabase Postgres available in the AWS and Digital Ocean Marketplaces. + +Instead of a single option, we'll soon offer four configurations of PostgreSQL. Each bundle offers functionality for +common use-cases. For example, if you're using Postgres with Serverless functions, you might want to run the PgBouncer bundle. If you want an +HTTP API with your Postgres offering you might want to run the PostgREST bundle. + +| `Name` | `PostgreSQL` | `PgBouncer` | `PostgREST` | +| ----------------------------------- | ------------ | ----------- | ----------- | +| Supabase Postgres | ✅ | | | +| Supabase Postgres: PgBouncer Bundle | ✅ | ✅ | | +| Supabase Postgres: PostgREST Bundle | ✅ | | ✅ | +| Supabase Postgres: Complete Bundle | ✅ | ✅ | ✅ | + +Each offering will be available for both the `x86` and `arm` architectures. + +## Try PostgreSQL 13 + +Try the new features of PostgreSQL 13.3 today by creating a [new project](https://app.supabase.io/) on Supabase. diff --git a/www/_blog/2021-07-27-spot-flutter-with-postgres.mdx b/www/_blog/2021-07-27-spot-flutter-with-postgres.mdx new file mode 100644 index 00000000000..d25c59fe665 --- /dev/null +++ b/www/_blog/2021-07-27-spot-flutter-with-postgres.mdx @@ -0,0 +1,90 @@ +--- +title: 'Spot: a video sharing app built with Flutter' +description: Spot is a geolocation-based video-sharing app with some social networking features. +author: rory_wilding +author_url: https://github.com/roryw10 +author_image_url: https://github.com/roryw10.png +authorURL: https://github.com/roryw10 +image: spot/og-spot-flutter-supabase.jpg +thumb: spot/cover-spot-flutter-supabase.jpg +tags: + - case-study +date: '2021-07-27' +toc_depth: 2 +--- + +Learn why Tyler decided Flutter and Supabase are the perfect tech-stack shipping innovative ideas fast. + +[Tyler Shukert](https://twitter.com/dshukertjr) is an indie developer who has been building websites and applications for seven years. +Tyler is a Firebase & Flutter expert who recently discovered Supabase. After falling in love with Supabase, +Tyler decided to launch his latest app. [Spot](https://www.producthunt.com/posts/spot-2d300f54-7a0a-4dbf-aee2-4a75311217cc) +is a geolocation-based video-sharing app with some social networking features. + +## NoSQL doesn't mean No Schema + +Tyler loves how easy it is to create high-quality web and mobile applications with Firebase. For the past few years he has honed +his Flutter, Angular, and Firebase skills to quickly ship mobile and web apps. But the more his development expertise grew, +the more he understood the limitations of Firebase. + +Before starting a project, Tyler is never sure if the project will grow. It could be an overnight success, or it might need to +pivot in a different direction. He finds this is particularly difficult with Firebase as he faces a denormalization dilemma. +Denormalization means combining the data into a single table to make data retrieval faster. Google promotes denormalization +as best practice for a snappier app experience. Denormalisation in Firebase takes work and requires additional development +time. For new projects, it is often unclear if they will reach a scale justifying the effort denormalization requires. +In relational databases like Postgres, data is normalized, meaning reduced data redundancy with maintained data integrity. + +## Supabase + Flutter: a match made in heaven + +When Tyler discovered Supabase on Twitter, he was intrigued by the promise of Postgres with Firebase-like features. +He wanted the benefits of SQL and Relational schemas, and decided to build an app to test Supabase. + +Tyler had been thinking about building Spot, a mobile app for sharing geo-based video content. When he previously planned Spot, +he felt like hacking around Firebase would be too much effort. After researching the PostGIS extension for geospatial data, +he realized Supabase was the perfect fit. As an avid Flutter fan, Supabase's Dart library was a bonus. +Tyler loves the open-source nature of Supabase and immediately began contributing to the Dart library to enable functionality that he needed. + +Tyler decided that Spot would be perfect to showcase the power of Supabase and Flutter. Since he's active in the open-source community, +he decided to open-source the whole project, making Spot one of the most interesting Supabase examples. + +![Spot screenshots.](/images/blog/spot/spot-screenshots.jpg) + +## Comparing Firebase to Supabase + +Although Spot seems simple, it has a lot of complicated components. Implementing social "Likes" requires `count` functionality, +which is notoriously tricky in Firebase. In Supabase, because it's just Postgres under the hood, `count` is implemented +using a simple SQL `count` query. + +Supabase has Row-Level Security, which Tyler uses as a filter - something he can't do with Firebase. + +Spot uses Supabase Storage for managing large video files. Firebase Storage [has a reputation](https://stackoverflow.com/questions/43851742/firebase-storage-very-slow-compared-to-firebase-hosting) for slowness until it is public, which was a privacy concern for Tyler. With Supabase Storage, this wasn't an issue - storage is performant and secure. + +The Firebase API pricing model makes it is difficult to predict pricing upfront for new projects. With Supabase, +Tyler doesn't need to worry about how many API calls his project makes. + +Supabase gives Spot speed, performance, and predictable pricing. + +As of today, Tyler has around 3000 installs for Spot and is getting ready to add new functionality. He is confident Supabase, +Postgres, and his data structure will enable future development. + + +

+ As soon as I saw Supabase I knew it was the perfect technology to use alongside Flutter to build + apps faster than ever. For apps like Spot where we handle user submitted files, it is very easy + to manage them securely. +

+

+ Supabaseを最初発見した時にこれとFlutterを組み合わせれば今まで以上に爆速でアプリ開発ができるだろうと思いました。 + Spotのようにユーザーがファイルを投稿するアプリの場合でもセキュアに取り扱うのが簡単で本当に助かります。 +

+ + +## Spot is Open Source + +With Supabase, Tyler can use Flutter to build a performant app quickly at a low cost. Tyler is now a massive fan of the Supabase +experience and has even joined the SupaSquad. + +You can download and install spot for [iOS](https://apps.apple.com/us/app/spot-videos/id1564675926?utm_source=supabase&utm_campaign=static) +and [Android](https://play.google.com/store/apps/details?id=app.spotvideo&utm_source=supabase&utm_campaign=static) +to see just how snappy his setup is. +Tyler has fully open-sourced his example - you can [clone the repo](https://github.com/dshukertjr/spot) +and use it as the basis of your next big idea. diff --git a/www/_blog/2021-07-27-storage-beta.mdx b/www/_blog/2021-07-27-storage-beta.mdx new file mode 100644 index 00000000000..cc13a234962 --- /dev/null +++ b/www/_blog/2021-07-27-storage-beta.mdx @@ -0,0 +1,169 @@ +--- +title: 'Supabase Storage now in Beta' +description: Supabase Storage moves into Beta. +author: inian +image: launch-week-sql-day-2/supabase-storage-beta-og.jpg +thumb: launch-week-sql-day-2/supabase-storage-beta.jpg +tags: + - storage + - launch-week +date: '2021-07-27' +toc_depth: 2 +--- + +At Supabase, one of our core values is [Kaizen](https://en.wikipedia.org/wiki/Kaizen) - continuous improvement. And that's exactly what we've been doing with Storage since it [launched](/blog/2021/03/30/supabase-storage) three months ago. Today, we are launching the Sequel to Storage Alpha (I bet you didn't see that coming): Storage Beta! + +## Streaming Media + +We've added support for streaming audio and video files. + +Clients can use the `Content-Range` HTTP header to request specific parts of a file from a server. This allows them to intelligently download the parts of the video that a user is viewing, without buffering irrelevant sections of the media file. Supabase Storage now supports this header, making it easier to host and watch [nyan cat videos](https://www.youtube.com/watch?v=SkgTxQm9DWM) all day long. + + + +## Public Buckets + +Public Buckets have been one of our most requested features. We launched without them because there are too [many horror stories](https://www.google.com/search?q=s3+bucket+negligence+award&oq=s3+bucket+negligence+award) of S3 buckets unintentionally exposing objects. We wanted to take the time to implement safeguards against this. + +To enable this feature safely, buckets are made private by default, with an extremely prominent warning in the dashboard when you choose to make them public. + +You can make objects public in S3 via multiple mechanisms (e.g. tags, or prefixes). While this allows for flexibility, it makes it hard to discover publicly exposed objects. To prevent any confusion, we decided that buckets must be public in their entirety. This public visibility is straightforward - if it's in a public bucket, it's public! + +Objects in public buckets can be accessed via a URL without any Authorization tokens or headers. This makes them perfect for hosting assets for your web or mobile application. + +Public buckets still require [Auth Policies](/docs/guides/storage#policy-examples) to upload and delete objects, allowing you to securely manage their contents. + + + +## Directory uploads + +You can now upload an entire directory to Supabase Storage and the directory structure is fully preserved after the upload. We used the [File and Directory entries API](https://developer.mozilla.org/en-US/docs/Web/API/File_and_Directory_Entries_API) for implementing this. This is a non-standard API, but we didn't find any compatibility issues in the browsers we support. So, now you can upload the [Storage GitHub repo](https://github.com/supabase/storage-api/) to storage 🤓 + + + +## A New Policy Editor + +Postgres [Row Level Security](https://www.postgresql.org/docs/13/ddl-rowsecurity.html) (RLS) is at the core of Supabase Storage and Auth. RLS lets you define complex policies, tightly integrated with Supabase Auth users, using the language you're already comfortable with - SQL. + +However, getting started with RLS can be daunting. To make it more approachable for beginners, we've included a set of pre-defined templates on our Dashboard, covering common use-cases. + +![Policy editor templates](/images/blog/launch-week-sql-day-2/policy-editor-1.png) + +Once you've selected a template, you choose which operations to allow and the Dashboard determines which API functions can access the bucket. For example, a user with INSERT permissions will be able to call the `createObject`, `copyObject` and `getSignedObject` functions in the `supabase-js` library. + +![Policy editor permissions](/images/blog/launch-week-sql-day-2/policy-editor-2.png) + +After writing the policy definition (which can be any valid SQL expression), you get an opportunity to review the final policy before saving. We made sure that there is no magic going on behind the scenes: you can always see the underlying SQL definition of the policies. As you become more comfortable with Row Level Security, you can define these policies directly using our SQL editor. + +## Using Storage in Local development + +It took some time to enable Storage on self-hosted Supabase. We wanted to provide a completely local experience during development, but storage had a hard dependency on an object storage service like S3. This required developers to create an S3 bucket, an IAM user in AWS, and add the credentials of the IAM user to the local setup, which was far from an ideal experience. + +From day 1, Supabase Storage was designed so that it would be easy to add new Storage backends. We knew we'd add more storage options like Google Cloud Storage or Backblaze, but little did we expect that this would be useful for our self-hosting setup! We implemented a new Storage Backend which [use a local filesystem](https://github.com/supabase/storage-api/blob/master/src/backend/file.ts) for storing objects. You can now get started with Storage without any additional setup, giving you a completely self-contained instance of Supabase. + +Check out our updated [self hosting guide](/docs/guides/self-hosting) and our [CLI](https://github.com/supabase/cli) to get started. + +## Upload anything + +At launch, you could pass in a `File` object and `supabase-js` used `FormData` to send a request to the storage server to upload the file. This made it easy to send the cache control information and other options directly to the server as a multipart request. + +However, `FormData` is only supported in the browser, making `supabase-js` incompatible with Node.js. The simplest way to solve this would have been to include the [FormData polyfill](https://www.npmjs.com/package/form-data) along with the library. + +At Supabase, we are [maniacal about performance](/blog/2020/12/13/supabase-dashboard-performance). Keeping our client libraries lean is a key differentiator. Our entire client library (including the clients for postgrest, storage, realtime and auth) is just 15.8 kb. If you are just interested in using a single service like storage, you can use the `storage-js` library directly which is [even smaller](https://bundlephobia.com/package/@supabase/storage-js@1.4.0). This made including polyfills like Formdata a no-go. + +![Supabase JS bundle size](/images/blog/launch-week-sql-day-2/supabase-js-size.png) + +We also considered shipping separate bundles for Node.js and the browser. This would have avoided polyfills for APIs which are already supported in each browser. However, this comes with an increase in complexity to our build process, and users would need to choose which flavor of the library to use in different environments like React Native, Deno, etc. We want to make our libraries universal. + +Instead, we modified the storage server to accept Binary data directly. With this change, you can directly upload binary Data and even NodeJS streams to the storage API. + +![NodeJS Stream upload](/images/blog/launch-week-sql-day-2/stream-upload.png) + +With this change in place, the client library supports uploading `ArrayBuffer`, `ArrayBufferView`, `Blob`, `Buffer`, `File`, `FormData`, `NodeJS.ReadableStream`, `ReadableStream` - without any change to the bundle size! This should enable you to use storage from an even wider range of environments. + +## Context menus + +The storage explorer in our Dashboard feels like using a file explorer in your operating system. There were a lot of challenges to make it feel intuitive and robust, since S3 is not a traditional filesystem. For example, S3 doesn't support a move operation natively - you need to copy the object to the new location and delete the original object. S3 also doesn't have a concept of directory, which means there is no API call to rename a directory. But to make the storage explorer feel like a native file explorer, we implemented these features. + +Context menus on folders +![Context menu 1](/images/blog/launch-week-sql-day-2/context-menu-1.png) + +Context menus on files +![Context menu 2](/images/blog/launch-week-sql-day-2/context-menu-2.png) + +### The case of the disappearing folders + +As we already mentioned, S3 doesn't really have a concept of directories. So if a user uploads an object with path `dir/subdir/avatar.png`, the dir and subdir are automatically "created" and there is no explicit API call to create them. + +This leads to an issue where if a user creates an empty directory and refreshes the page, the directory disappears since it is not persisted to S3. To simulate a normal filesystem (where empty directories are not garbage collected), we upload an empty file when the user creates a directory on the dashboard. The dashboard hides this placeholder file and the placeholder is deleted when the user uploads an object in the directory - voila, no more disappearing directories! + +## Performance improvements for large buckets + +We significantly improved rendering for a large number of items in the Dashboard. We use a virtualization library to render the objects in view and actively discard DOM elements that are not currently rendered from memory. This makes scrolling through thousands of items buttery smooth. + +Here is a demo testing rendering the heaviest object known to mankind - the `node_modules` folder! + + + +## API changes + +Supabase Storage now supports `upsert`. Shoutout to [@ankitjena](https://github.com/ankitjena) for +[this Pull Request](https://github.com/supabase/storage-api/pull/32). + +![Storage now supports upserts](/images/blog/2021-june/supabase-storage-upsert.png) + +We also have automated API docs generated [here](https://supabase.github.io/storage-api/#/) if you want to use the Storage API directly. + +### Storage in the wild + +We have a few production applications using Supabase Storage. Wataru is using Storage to power his community site [Shikutoku](https://shikutoku.me/) and Tyler is using Supabase Storage to store short video clips uploaded to his [Spot app](/blog/2021/07/27/spot-flutter-with-postgres) built with Flutter + + +

+ As soon as I saw Supabase I knew it was the perfect technology to use alongside Flutter to build + apps faster than ever. For apps like Spot where we handle user submitted files, it is very easy + to manage them securely. +

+

+ Supabaseを最初発見した時にこれとFlutterを組み合わせれば今まで以上に爆速でアプリ開発ができるだろうと思いました。Spotのようにユーザーがファイルを投稿するアプリの場合でもセキュアに取り扱うのが簡単で本当に助かります。 +

+ + + +

+ I think it’s a great service, simple and scalable. I like that the dashboard makes it easy to + check and search for images. +

+

+ シンプルで拡張性のある素晴らしいサービスだと思います。ダッシュボードで画像が確認しやすく、検索できるのもいいですね。 +

+ + +## What's next + +We're planning a Content Delivery Network for faster downloads, as well as basic transformation and optimization support for media files (like resizing, etc). We will continue our Kaizen on smaller improvements like allowing configurable upload limits and improving service stability and scalability. + +Anything else you want to see or can help implement in Storage? Reach out on our [Discord channel](https://discord.supabase.com/) and give Storage a try by [creating a project](https://app.supabase.io/) on Supabase! diff --git a/www/_blog/2021-07-28-mobbin-supabase-200000-users.mdx b/www/_blog/2021-07-28-mobbin-supabase-200000-users.mdx new file mode 100644 index 00000000000..039b82143a0 --- /dev/null +++ b/www/_blog/2021-07-28-mobbin-supabase-200000-users.mdx @@ -0,0 +1,89 @@ +--- +title: 'Mobbin uses Supabase to authenticate 200,000 users' +description: Learn how Mobbin migrated 200,000 users from Firebase for a better authentication experience. +author: rory_wilding +author_url: https://github.com/roryw10 +author_image_url: https://github.com/roryw10.png +authorURL: https://github.com/roryw10 +image: mobbin/og-mobbin-supabase.jpg +thumb: mobbin/cover-mobbin-supabase.jpg +tags: + - case-study + - auth +date: '2021-07-28' +toc_depth: 2 +--- + +Learn how Mobbin migrated 200,000 users from Firebase for a better authentication experience. + +Mobbin helps over 200,000 creators globally search and view the latest design patterns from well-known apps. +Their platform allows creators to search screenshots of mobile apps to inspire product development. +Creators use Mobbin to combine inspiration and develop new experiences. + +## From Idea to 30,000 users in one Product Hunt launch + +The initial concept for Mobbin was just a Dropbox full of screenshots. After sharing with their early users, +the team tried organizing them into folders but this quickly became unscalable. Clear interest from users encouraged them to build a full website. They used Firebase for the backend and launched on +[Product Hunt](https://www.producthunt.com/posts/mobbin-1). + +Mobbin went viral, and within the first week they had 30,000 users. In just over two years, they have grown to over 200,000 +registered users through word of mouth. Their curation continues to attract designers and creators globally. + +![Mobbin cover](/images/blog/mobbin/mobbin-cover.png) + +## Scaling issues put Mobbin growth at risk + +Firebase helped the team launch quickly, but at scale, they found Firebase lacked the functionality required for a high-quality user experience. + +The first problem was duplicate user logins. Firebase Authentication doesn't automatically merge users with the same email address. +For example, users cannot log in with Google and Facebook if they share the same email address. +Users struggled to upgrade to a paid account because they couldn't remember which authentication provider they signed up with. + +Next, they had issues with data integrity. While Firebase has 99.95% uptime, application code can (and does) fail. +Mobbin didn't want to implement idempotence for every mutative Firebase Function. Between a failed Function execution and a retry, +a document state might change without strict validation. The team could never be confident their data had the level of integrity they required. + +Finally, the team grew concerned with their increasing Firebase bill. Because of the document-based data structure, +their API requests required several round trips. At one point, they were making 5 million API requests per month. +These round trips made their website slow and led to a notable time investment hacking together a fix. + +![Mobbing screenshots](/images/blog/mobbin/mobbin-screenshots.jpg) + +## Migrating to Supabase + +Mobbin's initial product gave them a comprehensive understanding of customer requirements. For their second version, +they needed a better authentication experience, fairer pricing, and a relational database to deliver a quality +application sustainable for their business model. + +The team found Supabase and realized it covered all the bases. Not only that, their team had experience with the +tools open source tools that Supabase is built with. + +Auth, built using [GoTrue](https://github.com/supabase/gotrue), instantly solved their users' login issues. +Under the hood, Supabase is just Postgres, and Jian Jie (co-founder and CTO of Mobbin) knows this is one of the best battle-tested +open source relational databases. + +They decided that moving to Supabase was a no-brainer. The process itself was smooth - the real challenge was validating their +data integrity due to historical failures on their serverless functions. + +Mobbin is now successfully running on top of Supabase, with superior performance compared to their old Firebase setup. +Because Supabase does not charge based on API requests, Mobbin significantly reduced their monthly spending without maintaining a custom backend. + + +

Migrating to Supabase meant that we could instantly fix our Auth problems and save money.

+

+ Just being on Supabase alone gives us confidence we can deliver on whatever users need in the + future. +

+

+ The cool thing is now we know under the hood it's just Postgres, it really does feel like + anything is possible for the future of our product +

+ + +## Supabase saves Mobbin time and money + +Migrating to Supabase helped the team at Mobbin instantly improve the end-user experience and save costs. +They now add new features with confidence, and they continue to help creators all over the globe find inspiration for their next project. +You can [check out Mobbin on their website](https://mobbin.design/browse/ios/apps). + +Sign up to Supabase's free tier and set up a scalable backend in less than 2 minutes. diff --git a/www/_blog/2021-07-28-supabase-auth-passwordless-sms-login.mdx b/www/_blog/2021-07-28-supabase-auth-passwordless-sms-login.mdx new file mode 100644 index 00000000000..2f2972eae53 --- /dev/null +++ b/www/_blog/2021-07-28-supabase-auth-passwordless-sms-login.mdx @@ -0,0 +1,105 @@ +--- +title: 'Supabase Auth v2: Phone Auth now available' +description: Phone Auth is available today on all new and existing Supabase projects. +author: kangmingtay +author_url: https://github.com/kangmingtay +author_image_url: https://github.com/kangmingtay.png +authorURL: https://github.com/kangmingtay +image: auth-v2/supabase-auth-v2-og.jpg +thumb: auth-v2/supabase-auth-v2-cover.jpg +tags: + - launch-week + - auth +date: '2021-07-28' +toc_depth: 3 +--- + +Since launching Supabase Auth [last summer](https://news.ycombinator.com/item?id=24072051) it's proven to be a key part of the Supabase Stack. +We receive a constant stream of feature requests and community PRs resulting in a long +list of external providers including GitHub, Discord, Azure, Apple and more. + +Supabase Auth is similar to Auth0 and Firebase Auth with one major difference - the user data lives in your own database, +reducing lock-in, and making the auth system more extensible. You can write native PostgreSQL Row Level Security policies to +determine which data your users should (or should not) have access to. It can even be used in conjunction with other Supabase features, +such as [Storage](/storage), to control access for specific files and buckets. + +Today we're announcing some major new features for our [fork](https://github.com/supabase/gotrue) of Netlify's [GoTrue](https://github.com/netlify/gotrue) Auth server. + +## Phone Auth is here! + +Your users can now log in using their mobile with SMS-based OTPs (one-time password). + +### Passwordless SMS login + +Users can log in using a passwordless SMS based OTP with `supabase-js`, or directly with the Auth API. + +![Passwordless SMS login](/images/blog/auth-v2/passwordless-login.png) + +After logging in, the user will receive a six-digit One Time Password. The OTP can be easily verified. + +![Use SMS and password to login](/images/blog/auth-v2/verify-otp.png) + +### SMS login with passwords + +Phone Auth can be used in conjunction with a password. Using this flow, your users can subsequently log in +with either an OTP or a phone + password combo. + +![SMS login with passwords](/images/blog/auth-v2/phone-and-password-login.png) + +### Choose an SMS Provider + +Supabase Auth supports [Twilio](https://www.twilio.com/) as an SMS provider, with more options coming soon. +Simply plug your Twilio credentials into your Auth Settings in the Supabase Dashboard to get started. + +Check out the [documentation](/docs/guides/auth/auth-twilio) to get started with Mobile OTPs, +or watch the [Youtube guide](https://youtu.be/akScoPO01bc). + + + +### Multi-Factor Auth coming soon + +Phone Auth is available today on all new and existing Supabase projects. We've also laid the groundwork for mobile Multi-Factor +Auth and will be offering that as an option soon. + +## Even more OAuth providers + +The community has contributed tons of OAuth providers, and today we're announcing two more. + +Shoutout to [@ph1p](https://github.com/ph1p) who contributed [Twitch](/docs/guides/auth/auth-twitch) as our latest OAuth provider! +The Supabase team added [Discord](/docs/guides/auth/auth-discord) last month, bringing the total OAuth Providers to ten. + +![All Supabase OAuth providers](/images/blog/auth-v2/supabase-oauth-providers.png) + +You can request more providers on our [Auth repo](https://github.com/supabase/gotrue) and Pull Requests are, of course, always welcome. + +## Generate Confirmation Links + +To make life easy for developers, the Supabase hosted platform manages all Auth-related emails, including confirmation, +recovery, invite, and passwordless "magic-link" emails. The templates are customizable and we even offer the ability to bring your own SMTP provider. + +Some of our power users require a little more flexibility however. We've had a lot of requests to dynamically generate email content, +especially for sending internationalized emails. To handle situations like these, today we're adding the ability to +generate confirmation, invite, recovery, and magic links via an API endpoint. + +We've exposed this functionality in `supabase-js`, and it can be invoked with the use of your `service_role` admin key +(which means you should only be calling this function from a backend and not from the client itself). + +![Generate Confirmation Links](/images/blog/auth-v2/generate-links.png) + +## What's next? + +The next major item on the list is MFA (Multi-Factor Authentication) - which includes TOTP +([Time-Based One Time Password](https://en.wikipedia.org/wiki/Time-based_One-Time_Password)). + +Find out how Mobbin is using Supabase Auth to [manage 200,000 users](/blog/2021/07/28/mobbin-supabase-200000-users). + +Anything else you want to see or can help implement in Auth? Reach out on +[Discord](https://discord.supabase.com/) and give Auth a try by [creating a project](https://app.supabase.io/) on Supabase! diff --git a/www/_blog/2021-07-29-supabase-reports-and-metrics.mdx b/www/_blog/2021-07-29-supabase-reports-and-metrics.mdx new file mode 100644 index 00000000000..4b499a803f0 --- /dev/null +++ b/www/_blog/2021-07-29-supabase-reports-and-metrics.mdx @@ -0,0 +1,125 @@ +--- +title: 'Supabase Reports and Metrics' +description: We're exposing a full set of metrics in your projects, so that you can build better (and faster) products for your users. +author: div_arora +author_url: https://github.com/darora +author_image_url: https://github.com/darora.png +authorURL: https://github.com/darora +image: launch-week-sql-day-4-reports-and-metrics/supabase-reports-and-metrics-og.jpg +thumb: launch-week-sql-day-4-reports-and-metrics/reports-and-metrics-thumb.jpg +tags: + - launch-week + - reports + - database +date: '2021-07-29' +toc_depth: 3 +--- + +Supabase offers a supercharged Postgres instance, along with a set of complementary services, making it easy to build mobile and web applications. +Today, we're exposing a full set of metrics in your projects, so that you can build better (and faster) products for your users. + +## Reports page + +We've added a new "Reports" section to the Dashboard. You can view one month of data, including +API requests across all of Supabase's core pillars: +Database, Auth and Storage. We've included two instance health metrics, CPU usage and Memory usage, +with a lot more on the way. + +![Supabase reports screen](/images/blog/launch-week-sql-day-4-reports-and-metrics/reports-and-metrics-reports-screen.jpg) + +All charts are built with [Recharts](https://recharts.org/en-US), an MIT-licensed React chart library chosen for its ease of use. +We'll add customizable charts in the future, so we'd love to hear which libraries you'd like to see in Supabase. + +We support one configurable report per project, accessible and editable by all team members. In the next few weeks, +we'll expand to unlimited reports, with longer date range options, new layout configurations, report templates, +stacked charts and private/public visibility across your project's members. + +## New project home page + +Every project has a new home page with a weekly overview of important metrics. We've included usage bars for Database storage, +number of Auth users, and Storage space. + +And we're just getting warmed up. Over the next few months you'll see more project information, notifications, and highlights to +monitor your project health at a glance. + +![Supabase new dashboard app homescreen](/images/blog/launch-week-sql-day-4-reports-and-metrics/reports-and-metrics-homepage.jpg) + +## Observability metrics + +Backend as a Service? Infrastructure as a Service? We don't care about the label, but we do care about giving developers the relevant +observability metrics. Supabase gives you a full Postgres cluster for every project, and now we give you the tools to diagnose and manage +important infrastructure anomalies. + +All databases are now launched with `pg_stat_statements` enabled, so you can expect some useful query statistics in the future too. + +![Supabase observability metrics](/images/blog/launch-week-sql-day-4-reports-and-metrics/reports-and-metrics-observability-screen.jpg) + +## Building a metrics pipeline + +"If you can't measure it, you can't improve it." + +### Full control, full responsibility + +When developers build services and applications on top of Supabase, relying on the platform's reliability and performance. +Product observability is critical, as it allows developers to make decisions on where to spend their optimization dollars, +and to get ahead of possible issues before they become showstoppers. + +At Supabase, each project is provisioned with a Postgres cluster, and a suite of associated services that add, ahem, +supa-powers to the database. + +![Supabase architecture](/images/blog/launch-week-sql-day-4-reports-and-metrics/reports-infra.png) + +Our users get liberal access to each of these services - you can use PostgREST for a RESTful API, +Realtime to listen to changes in your Postgres instance, or even just open a raw connection to the database. +While this makes for an extremely flexible offering, it presents a diverse cast of [foot-guns](https://en.wiktionary.org/wiki/footgun). +Want to mess with Realtime? Why not bulk-insert millions of records on tables you've configured it to watch? +Feel like taking out your entire database? Just connect to it and run a wildly inefficient query! + +We're continuously rolling out protections to mitigate failure scenarios and to minimize the blast radius. +However, given the power and flexibility exposed via our services and the diverse workloads they support, +our users remain best positioned to make the call on what's reasonable for their project. +As such, we're also working on exposing as much data as possible to them. + +### Gathering relevant metrics + +Given the setup described above, there are two major categories of metrics that we care about. +There are metrics pertinent to the services mentioned ("Project Metrics") that get spun up for each project +(e.g. the number of active connections to the db), and there are metrics for the underlying infrastructure +(e.g. system health). Most of the time, our users shouldn't have to care about the latter, +though the nature of leaky abstractions dictates that sometimes they become relevant to Project Metrics as well. + +In order to build a comprehensive view of the project's health, each service needs to be instrumented along with its +underlying infrastructure. We're looking at hundreds of thousands of targets at our current scale +(likely approaching millions in the near future) each of them presenting hundreds of metrics of interest (every minute!). + +To buy ourselves some headroom, we built a federated approach: we run instances of our monitoring systems in each +geographical region we operate in. This provides a natural dimension for sharding, while reducing the latency for everyone. +We run [Prometheus](https://prometheus.io/) out of inertia, soon to be [VictoriaMetrics](https://victoriametrics.com/). +The monitoring instances scrape data from a number of exporters that are bundled into each of our projects. +A small subset of the metrics collected gets aggregated to a centralized VictoriaMetrics instance for easier cohort analysis. + +![Supabase Prometheus](/images/blog/launch-week-sql-day-4-reports-and-metrics/prometheus.png) + +### Available sources and metrics + +To start with, we're focusing on metrics a few of the most pertinent metrics: + +- Database metrics: CPU and RAM usage +- API Requests: Ingress, Egress, `GET`, `POST`, `PATCH`, `PUT`, `OPTIONS`, and all requests. +- Storage Requests: Ingress, Egress, `GET`, `POST`, `PATCH`, `PUT`, `OPTIONS`, and all requests. +- Auth Requests: Ingress, Egress, `GET`, `POST`, `PATCH`, `PUT`, `OPTIONS`, and all requests. + +## What's next? + +Where to begin? + +- Multiple reports per project: we've started with just one report per project, but in the next few weeks we'll allow you to create as many as you want. +- More metrics: we're just getting started. + - Number of active connections to your database. + - Various detailed stats from `pg_stat_statements`, `pg_stat_bgwriter`, `pg_stat_database`, `pg_stat_database_conflicts`. + - System level metrics like CPU, memory and disk utilization. +- Granularity: project statistics will come down to hourly. +- Longer time periods: view historical data going back several months. +- Interactive widgets: view-only reports are fine, but we wouldn't be a Postgres company if we didn't allow you to write your own SQL queries. + +Any other metrics you want to see in your projects? Reach out on our [Discord channel](https://discord.supabase.com/) and give Supabase a try by [creating a project](https://app.supabase.io/). diff --git a/www/_blog/2021-07-30-1-the-supabase-hackathon.mdx b/www/_blog/2021-07-30-1-the-supabase-hackathon.mdx new file mode 100644 index 00000000000..9db102a40a5 --- /dev/null +++ b/www/_blog/2021-07-30-1-the-supabase-hackathon.mdx @@ -0,0 +1,140 @@ +--- +title: 'The Supabase Hackathon' +description: A whole week of Hacking for Fun and Prizes. +author: ant_wilson +author_url: https://github.com/awalias +author_image_url: https://github.com/awalias.png +authorURL: https://github.com/awalias +image: hackathon/og-supabase-hackathon.png +thumb: hackathon/cover-supabase-hackathon.png +tags: + - launch-week + - hackathon +date: '2021-07-30' +toc_depth: 3 +--- + +# The Supabase Hackathon + +We've reached the end of [Launch Week II: The SQL](/blog/2021/07/22/supabase-launch-week-sql) - but it's the start of something else... + +The first Supabase Hackathon starts **right now**. + +## Key Facts + +- You have 7 days to build a new **Open Source** project using Supabase +- It can be whatever you want - a project, app, tool, library, anything +- Enter as an individual, or as a team of up to 5 people +- Submission deadline is 11:59pm Friday night PDT (6th August 2021) +- You can win one of these extremely [Limited Edition Olympic Gold](https://store.supabase.com/products/hackathon-prize) and Silver Supabase T-Shirts + +![Gold Tshirt](/images/blog/hackathon/tshirt.png) + +## Details + +### Schedule + +- Opening Ceremony - the Hackathon begins **NOW**! (8am PDT 30th July 2021) +- Work on your project any time this week +- Submission deadline (11.59pm PDT Friday 6th August 2021) +- Judges Deliberate (Saturday + Sunday) +- Medal Ceremony (Winners Announced) (9pm PDT Monday 9th August 2021) + +### Prizes + +There are 5 chances to win, there will be prizes for: + +- Best Overall Project +- Most Visually Pleasing +- Most Technically Impressive +- Most Fun/Interesting +- Best Meme (add it to your README) + +There will be a winner and a runner-up prize for each category. + +![Gold Tshirt](/images/blog/hackathon/prizes.png) + +### Submission + +You should submit your project using [this form](https://forms.gle/erYrSFKSErKVBFFC8). + +You will be asked to send a link to a GitHub (or similar) repo, in the README you should include: + +- link to hosted demo (if applicable) +- list of team members GitHub handles (and Twitter if they have one) +- any demo videos, instructions, or memes +- a brief description of how you used Supabase: + - to store data? + - realtime? + - auth? + - storage? +- any other info you want the judges to know (motivations/ideas/process) +- optional team photo + +### Judges + +We have assembled an All Star Judging Panel: + +- [@swyx](https://twitter.com/swyx/) +- [@themarcusbattle](https://twitter.com/themarcusbattle) +- The Supabase Team +- One more Mystery Guest + +![Judges](/images/blog/hackathon/judges.png) + +They will be looking for a few things, including: + +- creativity/inventiveness +- functions correctly/smoothly +- visually pleasing +- technically impressive +- use of Supabase features + - deep usage of a single feature or + - broad usage are both ok +- FUN! 😃 + +### Rules + +- Team size 1-5 (all team members on winning teams will receive a prize) +- You cannot be in multiple teams +- One submission per team +- All design elements, code, etc. for your project must be created **during** the event +- All entries must be Open Source (link to source code required in entry) +- Must use Supabase in some capacity +- Can be any language or framework +- You must submit before the deadline (no late entries) +- You can continue to make updates to your project after the submission deadline, but there is no guarantee that the judges will see additions made after the submission time. + +### Community + +The Supabase Team will be taking part in the Hackathon and you'll find us live building in our discord all week. We're temporarily adding two channels: + +- Text channel: hackathon +- Audio channel: hackathon + +If you need help or advice when building, find other people to join your team, or if you just want to chill and watch people build, come and join us! + +[Join our Discord](https://discord.supabase.com) + +![Discord Hangout](/images/blog/hackathon/community.png) + +### Guides + +Here's a collection of resources that will help you get started building with Supabase: + +- [Examples and Resources](/docs/guides/examples) +- [Supabase Crash Course](https://www.youtube.com/watch?v=7uKQBl9uZ00) [video] +- [Flutter Quickstart Guide](/docs/guides/with-flutter) +- [Nextjs Quickstart Guide](/docs/guides/with-nextjs) +- [Using Supabase inside Replit](/blog/2021/03/11/using-supabase-replit) +- [Full Stack Development with Next.js and Supabase – The Complete Guide](https://www.freecodecamp.org/news/the-complete-guide-to-full-stack-development-with-supabas/) +- [Auth Deep Dive - Learn everything there is to know about Supabase Auth](/docs/learn/auth-deep-dive/auth-deep-dive-jwts) [videos] +- [Send SMS notifications using Twilio](https://www.twilio.com/blog/send-sms-notifications-supabase-users-node-js-twilio-messaging) +- [How to Integrate Supabase in Your Ionic App](https://www.youtube.com/watch?v=pl9XfIWutKE) [video] +- [Building a Slack clone with authentication and realtime data syncing using Supabase](https://www.youtube.com/watch?v=LUMxJ4w-MUU) [video] +- [Creating Protected Routes In NextJS With Supabase](https://aboutmonica.com/blog/creating-protected-routes-in-next-js-with-supabase) + +### Additional Info + +- Any intellectual property developed during the hackathon will belong to the team that developed it. We expect that each team will have an agreement between themselves regarding the IP, but this is not required +- By making a submission you grant Supabase permission to use screenshots, code-snippets and/or links to your project or content of your README on our Twitter, blog, website, email updates, and in the Supabase discord server. Supabase does not make any claims over your IP. diff --git a/www/_blog/2021-07-30-supabase-functions-updates.mdx b/www/_blog/2021-07-30-supabase-functions-updates.mdx new file mode 100644 index 00000000000..37e7c281c3d --- /dev/null +++ b/www/_blog/2021-07-30-supabase-functions-updates.mdx @@ -0,0 +1,251 @@ +--- +title: 'Updates for Supabase Functions' +description: The question on everyone's mind - are we launching Supabase Functions? Well, it's complicated. +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: functions-updates/og-supabase-hooks.jpg +thumb: functions-updates/thumb-supabase-hooks.jpg +tags: + - launch-week + - functions +date: '2021-07-30' +toc_depth: 3 +--- + +The question on everyone's mind - are we launching Supabase Functions? Well, it's complicated. + +Today we're announcing _part_ of Functions - Supabase Hooks - in Alpha, for all **new** projects. + +We're also releasing support for Postgres Functions and Triggers in our Dashboard, and some timelines for the rest of Supabase Functions. +Let's cover the features we're launching today before the item that everyone is waiting for: Supabase Functions. + +## PostgreSQL Functions + +(Not to be confused with Supabase Functions!) + +Postgres has built-in support for [SQL functions](https://www.postgresql.org/docs/current/sql-createfunction.html). Today we're making it even easier for developers to build PostgreSQL Functions by releasing a native Functions editor. Soon we'll release some handy templates! + +![Postgres Functions](/images/blog/functions-updates/postgres-functions.png) + +You can call PostgreSQL Functions with `supabase-js` using your project API [[Docs](/docs/reference/javascript/rpc)]: + +```js hideCopy +const { data, error } = await supabase.rpc('best_star_wars_series', { + name: 'The Prequels', +}) +``` + +## PostgreSQL Triggers + +[Triggers](https://www.postgresql.org/docs/current/trigger-definition.html) are another amazing feature of Postgres, which allows you to execute any SQL code after inserting, updating, or deleting data. + +While triggers are a staple of Database Administrators, they can be a bit complex and hard to use. We plan to change that with a simple interface for building and managing PostgreSQL triggers. + +![Postgres Triggers](/images/blog/functions-updates/postgres-triggers.png) + +## Supabase Functions + +They say building a startup is like jumping off a cliff and assembling the plane on the way down. At Supabase it's more like assembling a 747 since, although we're still in Beta, thousands of companies depend on us to power their apps and websites. + +For the past few months we've been designing Supabase Functions based on our customer feedback. + +### BYO Functions, zero lock-in + +A recurring request from our customers is the ability to trigger their _existing_ Functions. +This is especially true for our Enterprise customers, but also Jamstack developers who develop API Functions directly within their stack (like Next.js [API routes](https://nextjs.org/docs/api-routes/introduction), or Redwood [Serverless Functions](https://redwoodjs.com/docs/serverless-functions)). + +### Timeline + +To meet these goals, we're releasing Supabase Functions in stages: + +- _Stage 1:_ Give developers the ability to trigger external HTTP functions - today, using Function Hooks. +- _Stage 2:_ Give developers the ability to trigger their own Serverless functions on AWS and GCP - Q4 2021. +- _Stage 3:_ Release our own Serverless Functions (Supabase Functions) - Q4 for Early Preview customers. + +![Supabase Functions timeline](/images/blog/functions-updates/functions-timeline.png) + +## Function Hooks (Alpha) + +Today we're releasing Functions Hooks in `ALPHA`. The `ALPHA` tag means that it is NOT stable, but it's available for testing and feedback. The API will change, so do not use it for anything critical. You have been warned. + +Hooks? Triggers? Firestore has the concept of [Function Triggers](https://firebase.google.com/docs/functions/firestore-events), which are very cool. +Supabase Hooks are the same concept, just with a different name. +Postgres already has the concept of [Triggers](https://www.postgresql.org/docs/current/triggers.html), and we thought this would be less confusing[^1]. + +### Hook Events + +Function Hooks allow you to "listen" to any change in your tables to trigger an asynchronous Function. You can hook into a few different events:`INSERT`, `UPDATE`, and `DELETE`. All events are fired **after** a database row is changed. Keen eyes will be able to spot the similarity to Postgres triggers, and that's because Function Hooks are just a convenience wrapper around triggers. + +![Hook Events](/images/blog/functions-updates/hook-events.png) + +### Hook Targets + +Supabase will support several different targets. + +- HTTP/Webhooks: Send HTTP requests directly from your Postgres Database. +- AWS Lambda/Google Cloud Run: Provide Supabase with a restricted IAM role to trigger Serverless functions natively. +- Supabase Functions: We'll develop an end-to-end experience. + +![Supabase Function Hooks](/images/blog/functions-updates/supabase-function-hooks.png) + +### Hook Payload + +If the target is a Serverless function or an HTTP `POST` request, the payload is automatically generated from the underlying table data. The format matches Supabase [Realtime](/docs/reference/javascript/subscribe), except in this case you don't a client to "listen" to the changes. This provides yet another mechanism for responding to database changes. + +```ts hideCopy +type InsertPayload = { + type: 'INSERT' + table: string + schema: string + record: TableRecord + old_record: null +} +type UpdatePayload = { + type: 'UPDATE' + table: string + schema: string + record: TableRecord + old_record: TableRecord +} +type DeletePayload = { + type: 'DELETE' + table: string + schema: string + record: null + old_record: TableRecord +} +``` + +## Hooks technical design: `pg_net v0.1` + +As with most of the Supabase platform, we leverage PostgreSQL's native functionality to implement Function Hooks. + +To build hooks, we've released a new PostgreSQL Extension, [pg_net](https://github.com/supabase/pg_net/), an asynchronous networking extension with an emphasis on scalability/throughput. In its initial (unstable) release we expose: + +- asynchronous HTTP `GET` requests. +- asynchronous HTTP `POST` requests with a JSON payload. + +The extension is (currently) capable of >300 requests per second and is the networking layer underpinning Function Hooks. For a complete view of capabilities, check out [the docs](https://supabase.github.io/pg_net/api/). + +### **Usage** + +`pg_net` allows you to make asynchronous HTTP requests directly within your SQL queries. + +```sql +-- Make a request +select + net.http_post( + url:='https://httpbin.org/post', + body:='{"hello": "world"}'::jsonb + ); + +-- Immediately returns a response ID +http_post +--------- + 1 +``` + +After making a request, the extension will return an ID. You can use this ID to collect a response. + +```sql hideCopy +-- Collect the response from a request +select + * +from + net.http_collect_response(1); + +-- Results (1 row) +status | message | response +--------+---------+---------- +SUCCESS ok ( + status_code := 200, + headers := '{"date": ...}', + body := '{"args": ...}' + )::net.http_response_result +``` + +You can cast the response to JSON within PostgreSQL: + +```sql +-- Collect the response json payload from a request +select + (response).body::json +from + net.http_collect_response(request_id:=1); +``` + +Result: + +```json noCopy + { + "args": {}, + "data": "{\"hello\": \"world\"}", + "files": {}, + "form": {}, + "headers": { + "Accept": "*/*", + "Content-Length": "18", + "Content-Type": "application/json", + "Host": "httpbin.org", + "User-Agent": "pg_net/0.1", + "X-Amzn-Trace-Id": "Root=1-61031a5c-7e1afeae69bffa8614d8e48e" + }, + "json": { + "hello": "world" + }, + "origin": "135.63.38.488", + "url": "https://httpbin.org/post" + } +(1 row) +``` + +### Implementation + +To build asynchronous behavior, we use a PostgreSQL [background worker](https://www.postgresql.org/docs/current/bgworker.html) with a [queue](https://github.com/supabase/pg_net/blob/3d52e7758909bb73bf7fa4586f42cea73ed239b6/sql/pg_net--0.1.sql#L11-L19). This, coupled with the [libcurl multi interface](https://curl.se/libcurl/c/libcurl-multi.html), enables us to do multiple simultaneous requests in the same background worker process. + +Shout out to [Paul Ramsey](https://github.com/pramsey), who gave us the implementation idea in [pgsql-http](https://github.com/pramsey/pgsql-http/#to-do). While we originally hoped to add background workers to his extension, the implementation became too cumbersome and we decided to start with a clean slate. The advantage of being async can be seen by making some requests with both extensions: + +```sql hideCopy +\timing on + +-- using pgsql-http to fetch from "supabase.io" 10 times +select + * +from + http_get('https://supabase.com') +cross join + generate_series(1, 10) _; + +-- Returns in 3.5 seconds +Time: 3501.935 ms + +-- using pg_net to fetch from "supabase.io" 10 times +select + net.http_get('https://supabase.com') +from + generate_series (1,10) _; + +-- Returns in 1.5 milliseconds +Time: 1.562 ms +``` + +Of course, the sync version waits until each request is completed to return the result, taking around 3.5 seconds for 10 requests; while the async version returns almost immediately in 1.5 milliseconds. This is really important for Supabase hooks, which run requests for every event fired from a SQL trigger - potentially thousands of requests per second. + +### Future/Roadmap + +This is only the beginning! First we'll thoroughly test it and make a stable release, then we expect to add support for + +- the remaining HTTP methods (`PUT` / `PATCH`) +- synchronous HTTP +- additional protocols e.g. SMTP, FTP +- more throughput (using epoll) + +## Get started today + +Function Hooks is enabled today on all [new projects](https://app.supabase.io). Find it under Database > Alpha Preview > Function Hooks. + +![Enable hooks](/images/blog/functions-updates/enable-hooks.png) + +[^1]: Postgres also has the concept of [Hooks](/blog/2021/07/01/roles-postgres-hooks), but they're more of an internal concept. diff --git a/www/_blog/2021-07-30-supabase-swag-store.mdx b/www/_blog/2021-07-30-supabase-swag-store.mdx new file mode 100644 index 00000000000..5e4b4ffdba6 --- /dev/null +++ b/www/_blog/2021-07-30-supabase-swag-store.mdx @@ -0,0 +1,66 @@ +--- +title: 'Supabase Swag Store' +description: Today we are officially launching the Supabase Swag Store. +author: rory_wilding +author_url: https://github.com/roryw10 +author_image_url: https://github.com/roryw10.png +authorURL: https://github.com/roryw10 +image: swag-store/og-supabase-swag-store.jpg +thumb: swag-store/cover-swag-store.jpg +tags: + - launch-week + - swag +date: '2021-07-30' +toc_depth: 3 +--- + +Today we are officially [launching the Supabase Swag Store](https://store.supabase.com/). + +Since we started gifting swag, we are constantly asked, "when will you launch a store?". +We take our swag game seriously. We're as hands-on with our swag as we are with our repos. +When you receive an item of swag from Supabase, you can be confident that we designed it, managed the production, packed it, and posted it. + +This process often means late nights for the team, making sure things are packed and ready to dispatch for the next day. +Why? Because we want to offer high-quality swag to our users. + +![Swag Shipping](/images/blog/swag-store/swag-shipping.jpg) + +## Swaggable Behavior + +Our primary goal with swag is gifting. We send swag to developers who make meaningful contributions to Supabase in a variety of ways. +This includes: + +- 📺 Creating Supabase related content. +- 🐛 Finding bugs in our software and reporting them or helping fix them. +- ⁉️ Answering questions and helping on GitHub discussions, Discord, Twitter. +- 👨‍💻 Developers who create pull requests on GitHub. +- 📲 Advocates who share Supabase related content on social media. +- 📚 Developers who contribute to open source libraries + +![Swag Winners](/images/blog/swag-store/swag-winners.png) + +For example, [Hassan's tweet caught our eye](https://twitter.com/Nutlope/status/1389082406477463557) because the idea is +innovative and uses Supabase as part of an interesting tech stack. We are amazed by the creative use cases you all find for Supabase. +We love it when folks #buildinpublic and share open-source examples that benefit the entire community. + +We do our best to identify members of the community engaging in these "swaggable behavior". +We don't have a specific benchmark for these activities. We can say, if you are engaging in these behaviors regularly, +then our Chief Swag Officer will find you and will get swag to you. We also like to do occasional random giveaways to +show some love for folks in the conversation. We will continue to announce these via Twitter and Discord. + +![I will find you](/images/blog/swag-store/i-will-find-you-meme.jpg) + +We have had significant demand from users who just wanted to rock some Supabase swag. +So, we decided to launch the [Supabase Swag Store](https://store.supabase.com/). + +We will put our hands up here and tell you we built the store using Shopify. We couldn't dogfood an entire eCommerce store. +Shopify is good enough, and we wanted to go live with this as part of launch week 🚀 👩‍🚀 + +Due to the lack of outsourcing, we need to highlight several things about the Supabase store: + +- We post from Singapore 💌 . There is currently a pandemic underway that is disrupting the international postal services. We currently have limited shipping options, and delivery can take some time. We are now trying to improve our delivery options while keeping as much control of the swag supply chain as possible. You can read more about our shipping conditions here. +- Swag is limited. We do limited production runs, usually to around 100 t-shirts at a time 👕 +- If it's in stock on the site, then you can buy it. If it's not, we will be working on a restock. The priority with inventory is to reward those contributing to Supabase. We will be actively trying to gift swag. When swag does land, it will likely sell out quickly. You can sign up to get alerted when there is a new swag drop. You can let us know here 👉 [swag@supabase.io](mailto:swag@supabase.io) +- In-house designs and small runs mean some swag will be limited edition. Once it's gone, it's gone forever. You might need to be fast to get it while it's 🔥 + +Check out the [Supabase Swag Store](https://store.supabase.com/) diff --git a/www/_blog/2021-08-09-hackathon-winners.mdx b/www/_blog/2021-08-09-hackathon-winners.mdx new file mode 100644 index 00000000000..6970bd58eae --- /dev/null +++ b/www/_blog/2021-08-09-hackathon-winners.mdx @@ -0,0 +1,159 @@ +--- +title: 'Open Source Hackathon Winners' +description: Let the medal ceremony begin for the best projects submitted during the Supabase Hackathon. +author: ant_wilson +author_url: https://github.com/awalias +author_image_url: https://github.com/awalias.png +authorURL: https://github.com/awalias +image: hackathon-winners/misc/winners-og.png +thumb: hackathon-winners/misc/winners-og.png +tags: + - hackathon +date: '2021-08-09' +toc_depth: 2 +--- + +# The Medal Ceremony + +We've reached the end of the first ever Supabase Hackathon and the entries have all been incredible. We received way more entrants than expected and therefore it took our judging panel a little longer than expected to get through their deliberations. + +Thanks to everyone who joined in, and made this hackathon awesome. We're already looking forward to the next one. But for now, let's dish out some medals. + +Don't forget that all the projects here are Open Source, so you can always dive into the code, PR, or fork projects you find interesting. + +## Best Overall Project + +### Winner + +[Work From](https://github.com/joshcawthorne/work-from) - by [@cawthornejosh](https://twitter.com/cawthornejosh) + +Josh's project allows employees to log which days and hours they'll be working and gives everyone on the team and within the company an overview of who is working when. The animations, UI/UX of this submission combined with the fact that it was built within a single week was absolutely mind-blowing! + +[![Work From](/images/blog/hackathon-winners/projects/workday.png)](https://github.com/joshcawthorne/work-from) + +### Runner Up + +[Fireplace](https://github.com/0xDebabrata/fireplace) - by [@0xDebabrata](https://twitter.com/0xDebabrata), [@\_anishbasu](https://twitter.com/_anishbasu), [@DebMondalX](https://github.com/DebMondalX) + +Fireplace makes great use of Supabase Storage for a shared video streaming experience, the killer feature here was the ability to share play, pause, and skip events across multiple users. + +[![Fireplace](/images/blog/hackathon-winners/projects/fireplace.png)](https://github.com/0xDebabrata/fireplace) + +## Most Visually Pleasing + +### Winner + +[Flutter Dictionary App](https://github.com/KathirvelChandrasekaran/dictionary_app) - by [@KathirvelChandrasekaran](https://github.com/KathirvelChandrasekaran) + +The judges found the design of this Flutter app to be super impressive, the animations and color palette are especially top drawer! + +[![Dictionary](/images/blog/hackathon-winners/projects/dictionary.png)](https://github.com/KathirvelChandrasekaran/dictionary_app) + +### Runner Up + +[Avatar Village](https://github.com/dshukertjr/avatar-village) - by [@dshukertjr](https://twitter.com/dshukertjr) + +Tyler's app allows you to come together and chat with strangers in the browser, the feature we loved most was the randomized avatar generation (click the button in the top right to try it out) + +[![tyler chat](/images/blog/hackathon-winners/projects/tyler.png)](https://github.com/dshukertjr/avatar-village) + +## Most Technically Challenging + +### Winner + +[Feature.so](https://github.com/richiemcilroy/feature) - by [@richiemcilroy](https://twitter.com/richiemcilroy) + +Boss work from Richie here - simply add a snippet to your app, then build and manage the components of your application from the Feature dashboard. An amazing example of where no-code is going. + +[![Feature dot so](/images/blog/hackathon-winners/projects/featureso.png)](https://github.com/richiemcilroy/feature) + +### Runner Up + +[Flutter Add-ons](https://github.com/bdlukaa/supabase_addons) - by [@bdlukaa](https://twitter.com/bdlukaa) + +Hook up your supabase credentials and Flutter app and Add-ons will start collecting metrics, analytics, and crashalytics, all in a neat dashboard with great visualization tools. Unbelievable that bdlukaa was able to build this in the space of a week. + +[![Add Ons](/images/blog/hackathon-winners/projects/addons.png)](https://github.com/bdlukaa/supabase_addons) + +## Most Fun/Interesting + +### Winner + +[Peckish Peach](https://github.com/Ngineer101/peckish-peach) - by [@nwbotha](https://twitter.com/nwbotha) + +Add at 4 or more ingredients to your list and Peckish Peach will use ML to generate a full recipe. You can have some real fun adding random foods together and seeing what the algo comes up with. Bonus points for the adorable Peach gif! + +[![Peach recipes](/images/blog/hackathon-winners/projects/peach1.png)](https://github.com/Ngineer101/peckish-peach) + +### Runner Up + +[Tamagotreal](https://github.com/mgilangjanuar/tamagotreal) - by [@mgilangjanuar](https://twitter.com/mgilangjanuar) + +Instagram for Pets! The best bit is all the interactions inside the app are from the perspective of your pet. We were loving the Tamagotchi throwback! + +[![tamogochi real insta](/images/blog/hackathon-winners/projects/tamog.png)](https://github.com/mgilangjanuar/tamagotreal) + +## Best Meme + +### Winner + +This cheeky one from lautaro had us tickled. + +[Bittermate Meme](https://github.com/imlautaro/bittermate#meme) - by [@mgilangjanuar](https://twitter.com/dev_lautaro) + +### Runner Up + +[Multiple Memes](https://github.com/rotimi-best/sveltedoc) - by [@rotimi-best](https://github.com/rotimi-best) + +![meme runner up 2](/images/blog/hackathon-winners/misc/meme3.jpg) - by [@wycowley](https://github.com/wycowley), by [@SonavAgarwal](https://github.com/SonavAgarwal) + +## The Prizes + +All gold medal winners will be contacted and sent one of these limited edition gold Supabase tees (one per team member), and all runners up will receive the same design in silver. Prize winners should keep an eye on their emails so we can collect T-Shirt size and shipping details. + +![Gold Tshirt](/images/blog/hackathon/tshirt.png) + +### Other Notable Projects + +Here's a list of Projects that made the shortlist or otherwise caught the judges eye: + +- [comradery](https://github.com/carlomigueldy/comradery) +- [furniture-exchange](https://github.com/dhaiwat10/furniture-exchange) +- [notes-overflow](https://github.com/DharmarajX24/notes-overflow/) +- [accio](https://github.com/fabianferno/accio) +- [discussbase](https://github.com/hilmanski/discussbase) +- [supabubbabase](https://github.com/ivanq3w/supabubbabase) +- [angular-starters](https://github.com/jneterer/angular-starters) +- [newbaseql](https://github.com/jonas-kgomo/newbaseql) +- [hartup](https://github.com/Rahat-ch/hartup) +- [ambient](https://github.com/sambarrowclough/ambient) +- [stories_w_supabase](https://github.com/semihpolat/stories_w_supabase) +- [Tokenized](https://github.com/Senkottuvelan/Tokenized) +- [fttx app](https://github.com/fttx-gr/app) +- [secret-diary](https://github.com/zernonia/secret-diary) + +### Participation Prize + +We also decided that everyone else should receive some participation prize, so we will be in touch with all the participants via email to collect your shipping details. + +If you want to join the community and build with us, find other people using Supabase, or if you just want to chill and watch people build, come and join us in Discord! + +[Join our Discord](https://discord.supabase.com) + +![Discord Hangout](/images/blog/hackathon/community.png) + +### Get Started Guides + +If you're inspired to build, here's a collection of resources that will help you get started building with Supabase: + +- [Examples and Resources](/docs/guides/examples) +- [Supabase Crash Course](https://www.youtube.com/watch?v=7uKQBl9uZ00) [video] +- [Flutter Quickstart Guide](/docs/guides/with-flutter) +- [Nextjs Quickstart Guide](/docs/guides/with-nextjs) +- [Using Supabase inside Replit](/blog/2021/03/11/using-supabase-replit) +- [Full Stack Development with Next.js and Supabase – The Complete Guide](https://www.freecodecamp.org/news/the-complete-guide-to-full-stack-development-with-supabas/) +- [Auth Deep Dive - Learn everything there is to know about Supabase Auth](/docs/learn/auth-deep-dive/auth-deep-dive-jwts) [videos] +- [Send SMS notifications using Twilio](https://www.twilio.com/blog/send-sms-notifications-supabase-users-node-js-twilio-messaging) +- [How to Integrate Supabase in Your Ionic App](https://www.youtube.com/watch?v=pl9XfIWutKE) [video] +- [Building a Slack clone with authentication and realtime data syncing using Supabase](https://www.youtube.com/watch?v=LUMxJ4w-MUU) [video] +- [Creating Protected Routes In NextJS With Supabase](https://aboutmonica.com/blog/creating-protected-routes-in-next-js-with-supabase) diff --git a/www/_blog/2021-08-12-supabase-beta-july-2021.mdx b/www/_blog/2021-08-12-supabase-beta-july-2021.mdx new file mode 100644 index 00000000000..5ca7355fb2b --- /dev/null +++ b/www/_blog/2021-08-12-supabase-beta-july-2021.mdx @@ -0,0 +1,142 @@ +--- +title: Supabase Beta July 2021 +description: Discord Logins, Vercel Integration, Full text search, and OAuth guides. +author: ant_wilson +author_url: https://github.com/awalias +author_image_url: https://github.com/awalias.png +authorURL: https://github.com/awalias +image: 2021-july/release-july-2021.jpg +thumb: 2021-july/release-july-2021-cover.jpg +tags: + - release-notes +date: '2021-08-12' +toc_depth: 2 +--- + +July ended with our second "Launch Week", where we shipped something every day for a week. There's a lot to get through this time! + +### Quick demo + +Watch a full demo of this month's releases. + + + +## Launch Week II: The SQL + +Following the success of our first Launch Week in March, we finished July with "[Launch Week II: The SQL](/blog/2021/07/22/supabase-launch-week-sql)". +The community has been sieving through a slew of bad puns and retro memes to discover the new feature announcements. + +![Launch Week II: The SQL](/images/blog/2021-july/supabase-launch-the-sql.png) + +## Auth v2 with Phone Auth + +Your users can now log in with SMS based mobile auth! We have a Twilio integration ([Guide Here](/docs/guides/auth/auth-twilio)) and will be adding more providers soon. + +Other Auth updating include, Twitch logins, and the ability to generate invite, recovery, confirmation, and magic links via the API, +for people who want more control over the email templating flow. Read the [blog post here](/blog/2021/07/28/supabase-auth-passwordless-sms-login). + +![Auth v2 with Phone Auth](/images/blog/2021-july/verify-phone.jpg) + +## Storage is now in Beta + +Storage updates include Media Streaming, Public Buckets, Directory Uploads, and a Performance Improvements. + +Streaming Media in particular opens up a whole new host of potential use cases, learn more about the [updates here](/blog/2021/07/27/storage-beta). + +![Auth v2 with Phone Auth](/images/blog/2021-july/storage.png) + +## Dashboard v2 + +We made some major new additions to the dashboard including usage statistics, a new project home, and tons of database insights. +Check the [post here](/blog/2021/07/29/supabase-reports-and-metrics) on what you get and how we built it. + +![Dashboard v2](/images/blog/2021-july/dashboards.png) + +## We launched a Discord server + +You'll find us hanging out regularly in the #hangout channel. +We even "live-fixed" some production errors in there on Monday night (which occurred literally 1 hour before our first announcement of the week! Typical!). +We're fast approaching 1,500 members so come and join the action! [discord.supabase.com](https://discord.supabase.com) + +![We launched a Discord server](/images/blog/2021-july/discord.png) + +## PostgreSQL 13 + +All new Supabase projects will be launched with PostgreSQL 13.3, and we're working on a migration path for old projects. +This gives you [looooaads of new stuff out the box](/blog/2021/07/26/supabase-postgres-13). + +![PostgreSQL 13](/images/blog/2021-july/postgres-13.png) + +## PostgREST v8.0 + +We worked with our friends at [PostgREST](https://postgrest.org/) to make some [huge improvements](/blog/2021/07/26/supabase-community-day#postgrest-version-80). +For those of you who don't know, every Supabase instance comes with a dedicated PostgREST server by default, +which provides the auto-generated CRUD API that we wrap with `supabase-js`. + +![PostgREST v8.0](/images/blog/2021-july/postgrest-8.png) + +## Flutter/Dart support + +Our community driven libs for the fast growing mobile and web framework are now in beta. Learn more by following the [Quickstart guide](/docs/guides/with-flutter). + +![Flutter/Dart support](/images/blog/2021-july/dart.png) + +## Hackathon + +We're running a week long hackathon starting NOW. There are some legit prizes, and you can win in a bunch of different categories. +Check the [full instructions here](/blog/2021/07/30/1-the-supabase-hackathon) on how to participate. Submissions close next Friday at midnight PST. + +![Hackathon](/images/blog/2021-july/hackathon.png) + +## Hooks & Functions + +We made an announcement on the progress of functions, and even shipped a few preliminary components, try them out and give us feedback as we continue to move towards this next major milestone. +Read the latest [updates here](/blog/2021/07/30/supabase-functions-updates). + +![Hooks & Functions](/images/blog/2021-july/hooks.jpg) + +## Swag Store + +Get your hands on some [Supabase Swag](https://store.supabase.com/), hand packed and mailed by our team based in Singapore. + +![Swag Store](/images/blog/2021-july/swag.png) + +## Community + +- [@traversymedia](https://twitter.com/traversymedia) made a [Supabase Crash Course](https://www.youtube.com/watch?v=7uKQBl9uZ00) video +- [@themarcusbattle](https://twitter.com/themarcusbattle/status/1419638564573360130?s=20) wrote a [guide](https://www.twilio.com/blog/send-sms-notifications-supabase-users-node-js-twilio-messaging) on sending sms notifications using node.js, Twilio, and Supabase (this is different to sms auth above) +- [@dots_hq](https://twitter.com/dots_hq) launched a slack/discord [community management tool](https://dots.community/) built on Supabase +- [@KennethCassel](https://twitter.com/KennethCassel) launched a [platform for building programming courses](https://www.slip.so/) using Supabase +- [@MobbinDesign](https://twitter.com/MobbinDesign) migrated their UI/UX library app to Supabase, currently [serving 200,000 users](/blog/2021/07/28/mobbin-supabase-200000-users) +- To the amazing users who are helping moderate our discord server, ya'll are amazing + +**Supabase GitHub Star Growth** + +![14200 stars on GitHub.](/images/blog/2021-july/github-growth.png) + + + Source: repository.surf/supabase + + +If you want to keep up to date, make sure you [subscribe to our YouTube channel](https://www.youtube.com/c/supabase) or +[follow us on Twitter](https://twitter.com/supabase). + +## Coming Next + +Security, stability, performance ... and Functions. + +## Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io/) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Subscribe to our [YouTube channel](https://www.youtube.com/c/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2021-09-10-supabase-beta-august-2021.mdx b/www/_blog/2021-09-10-supabase-beta-august-2021.mdx new file mode 100644 index 00000000000..e30edd18101 --- /dev/null +++ b/www/_blog/2021-09-10-supabase-beta-august-2021.mdx @@ -0,0 +1,165 @@ +--- +title: Supabase Beta August 2021 +description: Fundraising, Realtime Security, custom SMS templates, and deployments in South Korea. +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: 2021-august/release-august-2021.jpg +thumb: 2021-august/release-august-2021-cover.jpg +tags: + - release-notes +date: '2021-09-10' +toc_depth: 3 +--- + +We've raised $30M and shipped a bunch of features. Let's dive into what's been happening at Supabase during the month of August. + +### Quick recap + +Watch a recap of this month's release. + + + +## We raised $30 million + +Hot off the press, we raised our Series A. +We'll use the funds to do more of the same - ship features and hire open source developers. +We'll release more details soon. Read more on [TechCrunch](https://techcrunch.com/2021/09/09/supabase-raises-30m-for-its-open-source-insta-backend/). + +![Supabase Series A](/images/blog/2021-august/supabase-series-a.png) + +## Realtime Security, codename: WALRUS + +If you've been waiting for Row Level Security to land in Postgres [subscriptions](/docs/reference/javascript/subscribe), +then you're going to love our new repo: +[Write Ahead Log Realtime Unified Security (WALRUS)](https://github.com/supabase/walrus). +The name might be a bit forced, but the security design is deliberate. +It's not in production yet, but we're making the repo public for comments using an +[RFC process](https://github.com/supabase/walrus/blob/master/README.md#rfc-process). + +![Realtime Security, codename: WALRUS](/images/blog/2021-august/walrus.jpg) + +## Custom SMS templates + +If you're using SMS login in [Auth v2](/blog/2021/07/28/supabase-auth-passwordless-sms-login), you can now customize the SMS which is sent to your users. Read more in the [docs](/docs/guides/auth/auth-twilio#sms-custom-template). + +![Custom SMS templates](/images/blog/2021-august/custom-sms.png) + +## Dart and Flutter Docs + +Thanks entirely to [@dshukertjr](https://twitter.com/dshukertjr), we now have in-depth [reference Dart documentation](/docs/reference/dart/installing) for CRUD, Auth, Realtime and more! + +![Dart and Flutter Docs](/images/blog/2021-august/supabase-flutter.jpg) + +## We launched the South Korea region + +We added another region for those wanting to host their data and APIs in Seoul. We now have 12 regions to choose from + +![We launched the South Korea Region](/images/blog/2021-august/south-korea.png) + +## Table creation is even easier + +You can now create columns while creating your table. We've also added improvements for composite primary keys and foreign key creation. + +![Table creation is even easier](/images/blog/2021-august/create-tables.png) + +## Unbreakable CSV Imports + +Our previous importer would choke on CSV files which were too large. Not any more! + +![Unbreakable CSV Imports](/images/blog/2021-august/csv-imports.png) + +## Connection strings + +We now provide a handy copy utility for various database connection strings because we were so tired of looking them up on Stack Overflow. + +![Caption](/images/blog/2021-august/connection-strings.png) + +## We released a primer on Row Level Security + +RLS can be a bit foreign for developers getting started with Postgres. +This video by [@\_dijonmusters](https://twitter.com/_dijonmusters) demystifies it. If you find the video a useful medium for learning, consider [subscribing to our channel](https://www.youtube.com/c/supabase). + + + +## Community + +### We had a community Hackathon + +We held a one-week async Hackathon. Check out [all the winners](/blog/2021/08/09/hackathon-winners) - it was truly impressive what people were able to build in just 7 days. + +![We had a community Hackathon](/images/blog/2021-august/hackathon.png) + +### We had a team Hackathon + +The Supabase team didn't want to miss out on the fun so we held our own hackathon. It was a good way to dog food. Some notable projects include + +- [Supaflix](https://supaflix.vercel.app/) by [@abc3](https://twitter.com/abc3erl) [[GitHub](https://github.com/abc3/supaflix)] - a Netflix clone build with Supabase +- [Personal-Casts](https://github.com/inian/personal-casts) by [@everconfusedguy](https://twitter.com/everconfusedguy) [[GitHub](https://github.com/inian/personal-casts)] - converts Youtube videos and articles into a personal podcast feed. +- And it wouldn't be a Supabase hackathon without a high-effort meme entry. + Check out [meme.town](http://meme.town) by [@Joshenlimek](https://twitter.com/joshenlimek) [[GitHub](https://github.com/joshenlim/meme-maker)] + +![We had a team Hackathon](/images/blog/2021-august/meme-town.png) + +### GitHub Trending + +We hit 18,000 stars on GitHub, and got to the [top of GitHub trending](https://twitter.com/supabase/status/1435868863518760964) for Typescript. + +![GitHub Trending](/images/blog/2021-august/github-stars.png) + + + Source: repository.surf/supabase + + +If you want to keep up to date, make sure you [subscribe to our YouTube channel](https://www.youtube.com/c/supabase) or +[follow us on Twitter](https://twitter.com/supabase). + +## Dependency contributions + +### GoTrue (Auth) + +- HCaptcha - users can add captcha on their passwordless logins to prevent abuse
+ [https://github.com/supabase/gotrue/pull/192](https://github.com/supabase/gotrue/pull/192) +- Email change endpoint is fixed (sends out 2 emails, one to the old email and one to the new one)
+ [https://github.com/supabase/gotrue/pull/132](https://github.com/supabase/gotrue/pull/132) + +### PostgREST (APIs) + +- Allow a function with single unnamed parameter to be called with POST
+ [https://github.com/PostgREST/postgrest/issues/1735](https://github.com/PostgREST/postgrest/issues/1735) + +### pg_net (Function Hooks) + +- Better handling of URL errors
+ [https://github.com/supabase/pg_net/issues/39](https://github.com/supabase/pg_net/issues/39) + +## Coming Next + +Last December we [moved from Alpha to Beta](/beta), with a focus on Security, Performance, and Reliability. After a couple of Launch Weeks pushing out new and sexy features, we have decided it's time to focus on these again. + +By the time we're done, Supabase will be production-ready for all use cases. + +## Get started + +- Start using Supabase today: [app.supabase.io](https://app.supabase.io/) +- Make sure to [star us on GitHub](https://github.com/supabase/supabase) +- Follow us [on Twitter](https://twitter.com/supabase) +- Subscribe to our [YouTube channel](https://www.youtube.com/c/supabase) +- Become a [sponsor](https://github.com/sponsors/supabase) diff --git a/www/_blog/2021-09-28-supabase-hacktoberfest-hackathon-2021.mdx b/www/_blog/2021-09-28-supabase-hacktoberfest-hackathon-2021.mdx new file mode 100644 index 00000000000..0fc25d86734 --- /dev/null +++ b/www/_blog/2021-09-28-supabase-hacktoberfest-hackathon-2021.mdx @@ -0,0 +1,152 @@ +--- +title: 'Supabase Hacktoberfest Hackathon 2021' +description: We're running another Supabase Hackathon during Hacktoberfest! +author: thor_schaeff +author_url: https://github.com/thorwebdev +author_image_url: https://github.com/thorwebdev.png +authorURL: https://github.com/thorwebdev +image: hacktoberfest-hackathon/hacktoberfest_banner.png +thumb: hacktoberfest-hackathon/hacktoberfest_banner.png +tags: + - hacktoberfest + - hackathon +date: '2021-09-28' +toc_depth: 3 +--- + +# Supabase Hacktoberfest Hackathon 2021 + +We were absolutely blown away by [all the amazing projects](/blog/2021/08/09/hackathon-winners) you built during our [first Supabase Hackathon](/blog/2021/07/30/1-the-supabase-hackathon), that we were looking for an excuse to run our next virtual open-source hackathon, and we found it in the upcoming [Hacktoberfest](https://hacktoberfest.digitalocean.com/). + +## Here's the plan + +- On **Friday Oct 1st at 08:00am PT** we're kicking things off with our Hacktoberfest Discord Hangout. Join us in the #hackathon channel on our Discord server: [https://discord.gg/bnncdqgBSS](https://discord.gg/bnncdqgBSS) +- Then you have 10 days to build a new **open-source** project with Supabase or contribute to one of our [supabase-community projects](https://github.com/supabase-community?q=topic%3AHacktoberfest&type=&language=&sort=) that have the `hacktoberfest` topic. +- It can be whatever you want - a project, mobile app, tool, library, anything +- Enter as an individual, or as a team of up to 5 people +- Submission deadline is **Sunday Oct 10th at 11:59pm PT** +- Besides [earning your Hacktoberfest shirt](https://hacktoberfest.digitalocean.com/resources/participation), you can win some extremely limited edition Supabase swag ✨ (see [here](https://twitter.com/supabase/status/1440737587895799809?s=21) what folks won last time!) + +## Details + +### Timeline + +- **Friday Oct 1st at 08:00am PT:** Opening Ceremony in the #hackathon channel [on Discord](https://discord.gg/bnncdqgBSS). +- Build your project during the next 10 days and hang out with the community [on Discord](https://discord.gg/bnncdqgBSS). +- **Sunday Oct 10th at 11:59pm PT:** Submission deadline +- Judges Deliberate (Monday) +- We'll be contacting and announcing the winners [on Twitter](https://twitter.com/supabase) throughout the week after. + + {' '} + +### Prize categories + +There are 5 chances to win, there will be prizes for: + +- Best Overall Project +- Most Visually Pleasing +- Most Technically Impressive +- Best mobile project (can user Flutter, React Native, Ionic, etc.) +- Most Spooky/Fun (Halloween is coming up!) + +There will be a winner and a runner-up prize for each category. + +### Submission + +Submit your project via [madewithsupabase.com/hacktoberfest](https://www.madewithsupabase.com/hacktoberfest) + +You will be asked to send a link to a GitHub (or similar) repo, in the README you should include: + +- link to hosted demo (if applicable) +- list of team members github handles (and twitter if they have one) +- any demo videos, instructions, or memes +- a brief description of how you used Supabase: + - to store data? + - realtime? + - auth? + - storage? +- any other info you want the judges to know (motivations/ideas/process) +- _optional_ team photo + +### Judging & announcement of winners + +The Supabase team will excitedly review what you've built. They will be looking for a few things, including: + +- creativity/inventiveness +- functions correctly/smoothly +- visually pleasing +- technically impressive +- use of Supabase features + - deep usage of a single feature or + - broad usage are both ok +- FUN! 😃 + +We'll be contacting and announcing winners [on Twitter](https://twitter.com/supabase) throughout the week after submission closes. + + {' '} + +### Rules + +- Team size 1-5 (all team members on winning teams will receive a prize) +- You cannot be in multiple teams +- One submission per team +- All design elements, code, etc. for your project/feature must be created **during** the event +- All entries must be Open Source (link to source code required in entry) +- Must use Supabase in some capacity +- Can be any language or framework +- You must submit before the deadline (no late entries) +- You can continue to make updates to your project after the submission deadline, but there is no guarantee that the judges will see additions made after the submission time. + +### Community & help + +Hang out with the Supabase team and community on Discord: + +- Text channel: hackathon +- Audio channel: hackathon + +If you need help or advice when building, find other people to join your team, or if you just want to chill and watch people build, come and join us! + +Join our Discord: [discord.gg/bnncdqgBSS](https://discord.gg/bnncdqgBSS) + +![Discord Hangout](/images/blog/hackathon/community.png) + +### Resources & Guides + +Here's a collection of resources that will help you get started building with Supabase: + +- Need some inspiration? [See what folks built last time](/blog/2021/08/09/hackathon-winners)! +- [Examples and Resources](/docs/guides/examples) +- [Supabase Crash Course](https://www.youtube.com/watch?v=7uKQBl9uZ00) [video] +- [Flutter Quickstart Guide](/docs/guides/with-flutter) +- [Nextjs Quickstart Guide](/docs/guides/with-nextjs) +- [Using Supabase inside Replit](/blog/2021/03/11/using-supabase-replit) +- [Full Stack Development with Next.js and Supabase – The Complete Guide](https://www.freecodecamp.org/news/the-complete-guide-to-full-stack-development-with-supabas/) +- [Auth Deep Dive - Learn everything there is to know about Supabase Auth](/docs/learn/auth-deep-dive/auth-deep-dive-jwts) [videos] +- [Send SMS notifications using Twilio](https://www.twilio.com/blog/send-sms-notifications-supabase-users-node-js-twilio-messaging) +- [How to Integrate Supabase in Your Ionic App](https://www.youtube.com/watch?v=pl9XfIWutKE) [video] +- [Building a Slack clone with authentication and realtime data syncing using Supabase](https://www.youtube.com/watch?v=LUMxJ4w-MUU) [video] +- [Creating Protected Routes In NextJS With Supabase](https://aboutmonica.com/blog/creating-protected-routes-in-next-js-with-supabase) + +### Additional Info + +- Any intellectual property developed during the hackathon will belong to the team that developed it. We expect that each team will have an agreement between themselves regarding the IP, but this is not required +- By making a submission you grant Supabase permission to use screenshots, code-snippets and/or links to your project or content of your README on our twitter, blog, website, email updates, and in the Supabase discord server. Supabase does not make any claims over your IP. diff --git a/www/_blog/2021-10-04-supabase-beta-sept-2021.mdx b/www/_blog/2021-10-04-supabase-beta-sept-2021.mdx new file mode 100644 index 00000000000..4c9e3ec8ec6 --- /dev/null +++ b/www/_blog/2021-10-04-supabase-beta-sept-2021.mdx @@ -0,0 +1,131 @@ +--- +title: Supabase Beta Sept 2021 +description: Hackathon, Aborting request, UI updates, and now Hiring. +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: 2021-sept/release-sept-2021.jpg +thumb: 2021-sept/release-sept-2021-cover.jpg +tags: + - release-notes +date: '2021-10-04' +toc_depth: 3 +--- + +Did you know it's been 2 years since the [first commit](https://github.com/supabase/realtime/commit/175f649784147af80acfc9ff5be9d160285c76ea) to Realtime, our real-time engine for Postgres? Before we even existed as a company! +We spent this month updating docs and content, improving UX, and [onboarding Developer Advocates](https://twitter.com/thorwebdev/status/1441041268411277322)! + +## Hackathon v2 + +To kick off [Hacktoberfest](https://hacktoberfest.digitalocean.com/), another Supabase Hackathon is happening [right now](/blog/2021/09/28/supabase-hacktoberfest-hackathon-2021). You've got another 7 days to be in to win a limited edition t-shirt. + +![Hackathon](/images/blog/2021-sept/hacktober.png) + +## Abort Requests + +We added support for [AbortController](https://developer.mozilla.org/en-US/docs/Web/API/AbortController) in our Javascript library so that you can abort long-running queries. [[Docs](/docs/reference/javascript/select#aborting-requests-in-flight)] + +![Abort Requests](/images/blog/2021-sept/Supabase_abort_requests.png) + +## Improved table management + +We've made a number of changes to the Dashboard to expose some great features of PostgreSQL including: + +### Column types + +We've improved the column Type field so that it supports your [custom types](https://www.postgresql.org/docs/current/sql-createtype.html). + +![Column types](/images/blog/2021-sept/columns.png) + +### Is Unique + +We've made it simple to add a unique constraint when creating or editing a table. + +![Is Unique](/images/blog/2021-sept/is-unique.png) + +### Edit columns + +By popular request, you can now view all columns in a table at a glance and edit them in bulk. + +![Edit columns](/images/blog/2021-sept/edit-columns.png) + +## Cross-schema relationships + +We updated our [grid](https://github.com/supabase/grid) to support relationships across multiple schemas. + +![Cross-schema relationships](/images/blog/2021-sept/relationships.png) + +## Improved Auth Docs + +We've revamped the Auth docs - The docs are now broken down into [Authentication](/docs/guides/auth/auth-apple) and [Authorization](/docs/guides/auth/row-level-security), and organized alongside our [Deep Dive](/docs/learn/auth-deep-dive/auth-deep-dive-jwts) series. + +![Auth Docs](/images/blog/2021-sept/auth-docs.png) + +## Low Code demo + +Low Code demo, Using Supabase with [Clutch.io](http://clutch.io/) - [@\_dijonmusters](https://twitter.com/_dijonmusters) ran a [session at General Assembly](https://www.youtube.com/watch?t=642&v=5fsKMTeBKKY) showing how to use these two tools together to create apps using a low code approach. + + + +## Community + +There was a lot of new content this month. + +### Videos + +- How I built the #10 product in 30 days - [Gary Tokman [video]](https://www.youtube.com/watch?v=CS1myTKJBR4) +- GitHub OAuth flow with Supabase + React - [Nader Dabit [video]](https://www.youtube.com/watch?v=jSqTzZk9UMg) +- The Best Stack for Web Developers - [Christopher Kapic [video]](https://www.youtube.com/watch?v=-2s_87QkPEI) +- Flutter + Supabase Course - [Abhishvek [video]](https://www.youtube.com/watch?v=PjVG6QtUYw4) +- React Native Mobile Auth - [Aaron Saunders [video]](https://www.youtube.com/watch?v=aBuB-Q6vHDE) +- Self Hosting Supabase - [Kelvin Pompey [video]](https://www.youtube.com/watch?v=HCqta43JHkU) +- Teta Flutter Frontend builder - [Teta Team [product]](https://www.youtube.com/watch?v=rooTglpUuvE) +- Magic Link + Route Controls in Next.js - [Nader Dabit [Video]](https://www.youtube.com/watch?v=oXWImFqsQF4) +- Supabase in 6 minutes - [Nader Dabit [video]](https://www.youtube.com/watch?v=ogEitL8RwtQ) + +### Twitter + +We hit 16.5k followers. [Follow us](https://twitter.com/supabase/status/1441428275176247302) there for advance frontend tips and 👁️⚡👁️ + +![Twitter](/images/blog/2021-sept/twitter.png) + +### GitHub + +Not far from 20K stars: [github.com/supabase/supabase](http://github.com/supabase/supabase) + +![GitHub](/images/blog/2021-sept/stars.png) + +Source: [repository.surf/supabase](https://repository.surf/supabase) + +### Discord + +Our Discord is growing fast. Come hangout with 3500+ developers building on Supabase today: [discord.supabase.com](http://discord.supabase.com) + +![Discord](/images/blog/2021-sept/discord.png) + +## Hiring + +We're Hiring [SREs](https://about.supabase.com/careers/sre). We're fully remote and we love Open Source. [See open roles](https://about.supabase.com/careers). + +![hiring](/images/blog/2021-sept/hiring.png) + +## Coming Next + +We're warming up for another Launch Week! Last time was "[Launch Week II: the SQL](/blog/2021/07/22/supabase-launch-week-sql)". We're going to need another month to come up with a good pun again, so we'll aim for November. + +## Get started + +- Start using Supabase today: **[app.supabase.io](https://app.supabase.io/)** +- Make sure to **[star us on GitHub](https://github.com/supabase/supabase)** +- Follow us **[on Twitter](https://twitter.com/supabase)** +- Subscribe to our **[YouTube channel](https://www.youtube.com/c/supabase)** +- Become a **[sponsor](https://github.com/sponsors/supabase)** diff --git a/www/_blog/2021-10-14-hacktoberfest-hackathon-winners-2021.mdx b/www/_blog/2021-10-14-hacktoberfest-hackathon-winners-2021.mdx new file mode 100644 index 00000000000..7b05bded6e1 --- /dev/null +++ b/www/_blog/2021-10-14-hacktoberfest-hackathon-winners-2021.mdx @@ -0,0 +1,157 @@ +--- +title: 'Hacktoberfest Hackathon Winners 2021' +description: Celebrating many amazing projects submitted to our Hacktoberfest Hackathon. +author: thor_schaeff +author_url: https://github.com/thorwebdev +author_image_url: https://github.com/thorwebdev.png +authorURL: https://github.com/thorwebdev +image: hackathon-winners/misc/hacktoberfest-og.png +thumb: hackathon-winners/misc/hacktoberfest-og.png +tags: + - hacktoberfest + - hackathon +date: '2021-10-14' +toc_depth: 2 +--- + +Hacktoberfest is in full swing and we've been blown away by [all the incredible projects]() submitted to our second open-source Hackathon. + +We've picked our top ten favourite projects across five categories, and believe us, it was a tough decision to make! + +Since all submissions were so stellar, we've decided to reward everyone with a [limited edition participation tee](https://store.supabase.com/products/hacktoberfest-participation-tee). + +Now, let us introduce the winner and runner up for each category, and see below for the even more limited edition swag they've won! + +Lastly, remember that all projects are open-source, so do check them out and spend the second half of Hacktoberfest contributing to your favourite projects! + +## Best Overall Project + +### Winner + +[Pickle](https://github.com/alizahid/pickle) - by [@alizahid0](https://twitter.com/alizahid0) + +Ali built a blazingly fast, privacy and developer focused analytics service. Complete with a dashboard and docs. And the dashboard even syncs events in realtime. Mind blowing stuff! + +[![Pickle](/images/blog/hackathon-winners/projects/pickle.png)](https://github.com/alizahid/pickle) + +### Runner Up + +[og:supa](https://github.com/janniks/ogsupa) - by [@jnnksbrt](https://twitter.com/jnnksbrt) + +og:supa is a snazzy site allowing you to generate og:images for your posts to make empty link previews a thing of the past. And the site looks fabulous itself! + +[![Fireplace](/images/blog/hackathon-winners/projects/ogsupa.png)](https://github.com/janniks/ogsupa) + +## Most Visually Pleasing + +### Winner + +[CourseBuddy](https://github.com/seufernandez/coursebuddy) - by [@seufernandez](https://twitter.com/seufernandez) + +Fernand built a platform for students to share their learnings and notes with each other. A great cause with a great design and some awesome illustrations. + +[![CourseBuddy](/images/blog/hackathon-winners/projects/coursebuddy.png)](https://github.com/seufernandez/coursebuddy) + +### Runner Up + +[Relm](https://github.com/imsaptarshi/relm) - by [@imsaptarshiii](https://twitter.com/imsaptarshiii) + +Relm is a platform to help you build, manage, and nurture your communities, with features around managing events, tracking analytics, and sending newsletters. Complete with a slick design and UX. + +[![Relm demo](/images/blog/hackathon-winners/projects/relm.png)](https://www.loom.com/share/58f6be6a1f7241a3843b1edc82a3a40a) + +## Most Technically Impressive + +### Winner + +[Feedback](https://github.com/drmzio/feedback) - by [@drmzio](https://twitter.com/drmzio) + +Daniel built a feedback widget that you can include on your page to easily collect your user's sentiment about your page. Our feedback for Daniel: we love it! + +[![Feedback](/images/blog/hackathon-winners/projects/feedback.png)](https://github.com/drmzio/feedback) + +### Runner Up + +[Party Parrot as a Service](https://github.com/highlight-run/party-parrot-as-a-service) - by [@c00brill](https://twitter.com/c00brill), [@theJayKhatri](https://twitter.com/theJayKhatri), [@JohnPhamous](https://twitter.com/JohnPhamous) + +Who doesn't love a custom party parrot Slack emoji, but who has time to create a gif for each team member?! Let us introduce: Party Parrot as a Service! Just input a picture with your face in it and PPaaS will find it and create a party parrot gif for you! + +![Party Parrot Winners](https://camo.githubusercontent.com/96b1888e4ca2b8e4bdd75b865990f639a3fa076e8b06b32cf9eca20f74a0be4d/68747470733a2f2f692e696d6775722e636f6d2f6d6c4a316b5a502e676966) + +[![Party Parrot as a Service](/images/blog/hackathon-winners/projects/ppaas.png)](https://www.loom.com/share/8a20eac10ee94708960bd86835e3a000) + +## Best Mobile Project + +### Winner + +[Utility Manager Flutter App](https://github.com/KathirvelChandrasekaran/utility_manager_flutter_supabase) - by [@KathirvelChandrasekaran](https://github.com/KathirvelChandrasekaran) + +Kathirvel's [dictionary app](https://github.com/KathirvelChandrasekaran/dictionary_app) won him a [limited edition gold tee](https://store.supabase.com/products/hackathon-prize?variant=40662411673755) at our last hackathon, and with his not only useful but also brilliantly looking utility manager Flutter app he's able to extend his collection of limited edition Supabase tees. Well done! + +[![Dictionary](/images/blog/hackathon-winners/projects/utility.png)](https://github.com/KathirvelChandrasekaran/utility_manager_flutter_supabase) + +### Runner Up + +[TLWR](https://github.com/croquies/TLWR) - by [@Aqudi](https://github.com/Aqudi), [croquies](https://github.com/croquies) + +Taejung and Wonmo built a logger tool for Flutter based apps that logs and visualizes the path a user takes through your app to identify improvements to your user experience. + +[![TLWR video demo](/images/blog/hackathon-winners/projects/tlwr.png)](https://youtu.be/Yx4N2bONA44) + +## Most Spooky/Fun + +### Winner + +[Spookd](https://github.com/netgfx/Spookd) - by [@netgfx](https://twitter.com/netgfx) + +Michael prototyped a spooky halloween game using Framer and then made it actually playable by connecting Framer with Supabase. Now that's spooky good fun! + +[![TLWR video demo](/images/blog/hackathon-winners/projects/spookd.png)](https://youtu.be/8SsWL3unwGI) + +### Runner Up + +[uwudaily](https://github.com/maggie-j-liu/uwudaily) - by [@maggie-j-liu](https://github.com/maggie-j-liu), [@sampoder](https://github.com/sampoder), and [@eilla1](https://github.com/eilla1) + +This project by a group of high school students gave us the feel good vibes. On the one hand with their awesome website that conveniently lets you log your daily vibes and check in on your friends', and on the other hand because high school students are building brilliant things with Supabase. How freaking cool is that?! + +[![uwudaily](/images/blog/hackathon-winners/projects/uwu.png)](https://github.com/maggie-j-liu/uwudaily) + +## The Prizes + +As is now tradition with Supabase Hackathons, the winners will receive an [extremely limited edition gold medal shirt](https://store.supabase.com/products/hacktoberfest-gold-tee). + +![Gold Tshirt](https://cdn.shopify.com/s/files/1/0571/6125/3019/products/gold-shopify-hacktoberfest_940x.png) + +The same goes for the [silver medal shirts](https://store.supabase.com/products/hacktoberfest-silver-tee). + +![Silver Tshirt](https://cdn.shopify.com/s/files/1/0571/6125/3019/products/silver-shopify-hacktoberfest_940x.png) + +### Participation Prize + +It was extremely tough to pick the winners because of all the stellar submissions. As a thank you for sharing your fabulous projects with us and the community, we've decided to award a [limited edition participation tee](https://store.supabase.com/products/hacktoberfest-participation-tee) to everyone who submitted their projects to the hackathon. We'll be contacting everyone via Twitter or email in the coming days with instructions of how to redeem your extremely limited and valuable shirts. + +![Participation Tshirt](https://cdn.shopify.com/s/files/1/0571/6125/3019/products/entrant-shopify-hacktoberfest_940x.png) + +## Hang out with us and the community + +If you want to join the community and build with us, find other people using Supabase, or if you just want to chill and watch people build, come and join us in Discord! + +[Join our Discord](https://discord.supabase.com) + +![Discord Hangout](/images/blog/hackathon/community.png) + +### Get Started Guides + +If you're inspired to build, here's a collection of resources that will help you get started building with Supabase: + +- [Examples and Resources](/docs/guides/examples) +- [Supabase Crash Course](https://www.youtube.com/watch?v=7uKQBl9uZ00) [video] +- [Flutter Quickstart Guide](/docs/guides/with-flutter) +- [Nextjs Quickstart Guide](/docs/guides/with-nextjs) +- [Using Supabase inside Replit](/blog/2021/03/11/using-supabase-replit) +- [Full Stack Development with Next.js and Supabase – The Complete Guide](https://www.freecodecamp.org/news/the-complete-guide-to-full-stack-development-with-supabas/) +- [Auth Deep Dive - Learn everything there is to know about Supabase Auth](/docs/learn/auth-deep-dive/auth-deep-dive-jwts) [videos] +- [Send SMS notifications using Twilio](https://www.twilio.com/blog/send-sms-notifications-supabase-users-node-js-twilio-messaging) +- [How to Integrate Supabase in Your Ionic App](https://www.youtube.com/watch?v=pl9XfIWutKE) [video] +- [Building a Slack clone with authentication and realtime data syncing using Supabase](https://www.youtube.com/watch?v=LUMxJ4w-MUU) [video] +- [Creating Protected Routes In NextJS With Supabase](https://aboutmonica.com/blog/creating-protected-routes-in-next-js-with-supabase) diff --git a/www/_blog/2021-10-19-replenysh-time-to-value-in-less-than-24-hours.mdx b/www/_blog/2021-10-19-replenysh-time-to-value-in-less-than-24-hours.mdx new file mode 100644 index 00000000000..6b4eb895c5b --- /dev/null +++ b/www/_blog/2021-10-19-replenysh-time-to-value-in-less-than-24-hours.mdx @@ -0,0 +1,77 @@ +--- +title: 'Replenysh uses Supabase to implement OTP in less than 24-hours' +description: Learn how Replenysh uses Supabase to power the circular economy, redefining how brands interact with their customers and products. +author: rory_wilding +author_url: https://github.com/roryw10 +author_image_url: https://github.com/roryw10.png +authorURL: https://github.com/roryw10 +image: replenysh/og-replenysh.png +thumb: replenysh/thumb-replenysh.png +tags: + - case-study + - auth +date: '2021-10-19' +toc_depth: 2 +--- + +Replenysh connects brands who want to recover their products and packaging with communities looking to monetize used materials. + +Learn how Replenysh uses Supabase to power the circular economy, redefining how brands interact with their customers & products. + +## Material recovery offers brands a new way to connect to their customers + +At the end of a linear economy, products usually end up in landfills or the ocean. Every year, 8 million metric tons of plastics enter our ocean. This is on top of the estimated 150 million metric tons that currently circulate our marine environments. In the USA alone, every year, 139 million tons of waste is sent to landfills. + +The problem is our current waste and recycling infrastructure can't support that demand. With less than 10% of material actually getting recycled, the vast majority just ends up in a landfill or as pollution. + +Replenysh is building a solution to this problem by creating entirely new infrastructure to help brands get their materials back. They're building an ecosystem of tools to enable any community in the world to do the right thing. + +Whenever material is dropped off at a host, brands have the opportunity to engage with that person, resulting in a win-win situation for the planet, the brands, and the individual who all want to make a positive impact. Anyone in the community can take their used products and materials to the hosts — with that material being tracked all the way back to the brands and manufacturers who will reuse it. Brands have the opportunity to engage with that person, resulting in a win-win situation for the planet, the brands, and the individual who all want to make a positive impact. This turns a traditional consumption model into an opportunity for brands and customers to participate in the circular economy. + +Brands are adopting Replenysh to demonstrate their commitment to making a positive environmental impact, while seeking to engage with consumers in a new, authentic way. Replenysh provides the technology to communities that are helping build the future infrastructure where all materials are traceable and reused. + +![Linear vs Circular economy](/images/blog/replenysh/circular-economy.png) + +## Refactoring code leads to a better way forward + +Historically the team created their own backend infrastructure, setting up APIs and Authentication to run their own OTP system with Twilio and passwords. Postgres is essential to their requirements because Replenysh uses Row Level Security for authorization. Before adopting Supabase, the team used a Haskell server with a different Postgres instance deployed on Heroku. + +The team decided to do a large refactor of their codebase and began investigating alternative hosting options to help speed up development time and reduce maintenance. + +Firebase seemed appealing due to its ability to get started quickly, but the team didn't want to migrate away from a relational database. Specifically, Postgres and RLS fit their requirements. + +When the team discovered Supabase on Hacker News they felt excitement. Supabase has a reputation for a smooth developer experience, providing Postgres and Row Level Security as a core feature. + +As a bonus, Supabase provided more than just a database, reducing their DevOps overhead. After reading the [Supabase Auth documentation](/docs/guides/auth) the team determined they can have the functionality they need, like SMS OTP. When they saw [Mobbin are using Supabase at scale](/blog/2021/07/28/mobbin-supabase-200000-users), they decided to migrate to Supabase. + +## Globally recognized brands need quality at scale + +Less than a day after beginning development with Supabase, the team completed their SMS OTP implementation, and deployed their app to the app store a few weeks later. + +![Replenysh-Mobile-App](/images/blog/replenysh/Replenysh-Mobile-App.png) + +Replenysh clients include brands with global recognition and millions of customers. With their reputation at stake, major brands have a high-quality threshold. If a global brand asks its customers to adopt a technology, the user experience must be high quality and reliable. Their customers' primary interaction point is mobile-first. This means a robust and smooth mobile Auth experience is non-negotiable. After switching to Supabase, when they demo, clients are instantly impressed with just how easy it is for users to log in with an SMS OTP and start participating in the circular economy. As a result, some of the world's largest retailers and beverage companies have recently joined Replenysh and the circular economy. + +![Replenysh-large-screen-view](/images/blog/replenysh/Replenysh-large-screen-view.png) + +## Supabase means faster development and reduced maintenance + + +

+ We saw the Auth update for launch week we thought it was the perfect time to get going with + Supabase. +

+

+ We implemented & pushed live phone (OTP) auth and had something ready to deploy to the app store + in less than 24-hours! +

+

+ Supabase's developer experience lived up to its reputation. Our app is ready to launch with + major brands to help them reach sustainability goals and connect with their customers in a + meaningful way +

+ + +## Supabase help Replenysh continue to scale + +Supabase turbo-charged Replenysh's development time with a seamless end-user mobile login experience. They are ready to help major brands engage with their users through participation in the circular economy. With Supabase, the team knows they have a slick auth experience, reduced DevOps overhead, and can continue to scale with Postgres. You can test out the Supabase developer experience today by [starting a new project on the free tier!.](https://app.supabase.io/) diff --git a/www/_blog/2021-10-28-supabase-series-a.mdx b/www/_blog/2021-10-28-supabase-series-a.mdx new file mode 100644 index 00000000000..cd838ffc50a --- /dev/null +++ b/www/_blog/2021-10-28-supabase-series-a.mdx @@ -0,0 +1,270 @@ +--- +title: 'Supabase $30m Series A' +description: Supabase just raised $30M, bringing our total funding to $36M. +author: paul_copplestone +image: series-a/supabase-series-a.png +thumb: series-a/supabase-series-a.png +tags: + - supabase +date: '2021-10-28' +toc_depth: 3 +--- + +Supabase [just raised $30M](https://techcrunch.com/2021/09/09/supabase-raises-30m-for-its-open-source-insta-backend/), +bringing our total funding to $36M. How will we spend this? Read on to find out. + +## We're growing fast + +From the outside, you can see that we're growing fast. +To solidify some of the numbers with internal metrics: + +### Database Growth + +As of September, we've launched over 50,000 databases. This is _only_ on our hosted platform - it doesn't include our open source offering, +because we don't add telemetry. Active databases are growing 35% per month. + +![Supabase has launched more than 50000 databases](/images/blog/series-a/total-databases.png) + +### Developers + +As of September, over 40,000 developers have signed up to Supabase from some of the world's leading companies. +Because of the versatility of Postgres, they're building everything from +[counter-fraud systems for Fintech](/blog/2020/12/02/case-study-xendit) to +[digital platforms powering 200,000 users](/blog/2021/07/28/mobbin-supabase-200000-users). + + + +### Community + +Supabase has been in GitHub's top-15 fastest growing open source startups for +[five consecutive quarters](https://twitter.com/kiwicopple/status/1451104569266671619), +and our [Discord](https://discord.supabase.com) has grown to nearly 4000 members since launching just 3 months ago. +Our growth is all organic. + +![Supabase Discord](/images/blog/series-a/discord-supabase-community.png) + +## About the round + +Supabase is an ambitious project. Firebase, to their credit, is a very well-developed platform which offers _a lot_ of functionality. +Building an alternative is a bit like launching five different startups at once. + +That said, our approach has been clear from the start: we don't want to re-invent the wheel. +We want to leverage existing open source products wherever we can, improving them by up-streaming changes and employing maintainers +([PostgREST](/blog/2020/06/15/supabase-steve-chavez), +[PostgreSQL](https://www.postgresql.org/message-id/CABwTF4UZzYoHcaEGe2cESVn-e9dc3wzg%3Dmvx7Tz8qbKJ7p3UKA%40mail.gmail.com)). +This model is the real promise of open source, and we've been lucky to have investors who have backed our approach +since the start - Y Combinator, Mozilla, and our lead investor, Coatue. + +Because of their conviction in Supabase, Coatue doubled down on their Seed investment to lead our Series A. We're extremely excited to welcome +[Caryn Marooney](https://www.linkedin.com/in/caryn-marooney/) to our Board. + + +

We are proud to lead a second consecutive round in Supabase and officially join the board.

+

+ We continue to be impressed by Paul and Ant and it has been a pleasure partnering with them. We + believe that the team has done an impressive job scaling their open-source community and think + that the strong traction and adoption speaks for itself. +

+ + +### Joining the round + +We've had a number of new investors join the round, this time a lot of operators and partners: + +- Elad Gill +- Tom Preston-Werner (GitHub cofounder) +- Solomon Hykes (Docker cofounder) +- Alex Solomon (PagerDuty cofounder) +- Guillermo Rauch (Vercel founder) +- Kurt Mackey (Fly cofounder) +- Chris Nguyen (LogDNA cofounder) +- Tod Sacerdoti (Pipedream Founder) +- Alana Anderson (Base Case Capital) +- Astasia Myers (Quiet Capital) +- (and more) + + + See all investors + + +## Building Supabase + +Our early positioning is an "open source Firebase alternative" but you might be surprised to learn that this is a small part of the Supabase vision. + +Firebase is arguably one of the best tools in the world for building _new products_, but it has a flaw: scalability. + +### Phase 1: Start with scalability + +The term "open source Firebase alternative" is becoming popular now, and we are often asked: how are we different? + +Simple. Supabase has smuggled scalability into the product, perhaps without you noticing. +Every Supabase project is a _full_ Postgres database. It's not "Postgres compatible", it's not "built on top of", +and we don't abstract it. If we did, your applications would face the same scalability issues as Firebase. + +Supabase simply makes Postgres easy to use - hopefully easier than any other database platform you've ever used. + +We plan to make Postgres the default database for every developer in the world. How do we do that? By making Postgres both easy +(Phase 2: tooling) and scalable (Phase 3: Cloud-Native Postgres). + +### Phase 2: Postgres Tooling + +User-facing applications usually require tools beyond just a database and frontend framework: + +- **APIs:** to provide access to your database from untrusted systems. +- **Authentication:** for users sign ups. +- **File Storage:** for large images and media. + +Supabase makes all of this easy. Beyond the database we offer [Auth](/docs/guides/auth), +RESTful and Realtime [APIs](/docs/guides/api), a [Storage](/docs/guides/storage) +system for large files, and a bunch of other tools - all wrapped up into a simple-to-use Dashboard. + +![Supabase Dashboard](/images/blog/series-a/dashboard.png) + +And this is where Supabase really differentiates itself: by doing less. All of these features build on top of PostgreSQL's +existing functionality. + +- **Row Level Security:** restrict user access to data and files using Postgres Policies. +- **Realtime data streams:** subscribe to database changes using the logical replication stream. +- **Function Hooks:** trigger external systems using Postgres triggers and our [async request extension](https://github.com/supabase/pg_net/). +- **RESTful APIs:** query your database [tables](/docs/reference/javascript/select) and [functions](/docs/reference/javascript/rpc) over HTTP, using [PostgREST](https://postgrest.org). + +### Phase 3: Cloud-native PostgreSQL + +PostgreSQL was created over 30 years ago, and it's one of the safest and most reliable databases in the world. + +But modern developers are becoming accustomed to cloud-native services with several characteristics: + +- Automatic scaling. +- Low latency anywhere in the world. +- Billing based on usage. + +PostgreSQL is still catching up to the modern cloud environment in some areas. What does a Cloud-native PostgreSQL look like? + +- **Branching:** developers should be able to "fork" a database at any point. This is particularly important for Jamstack developers who run deployments for every Git branch. +- **Scalable storage:** storage should grow and shrink without the user needing to provision more space themselves. +- **Distributed:** An entire fleet of databases, distributed around the world, should feel like a single database (and even better if all nodes can accept read/write workloads). +- **Ephemeral compute:** developers don't want to be charged for a database which isn't doing anything. Likewise - if they are running huge computation then the database should scale up seamlessly, and scale down to zero when it's unused. +- **Snapshots and time-travel:** developers should be able to roll back to any point in time, or take a copy of their database with just a click of a button. + +This is the future of Supabase - a platform to power your transactional workloads: no matter how big or small; no matter the use-case. +We're building a cloud-native Postgres platform. + +## Join us + +We have a track record of hiring open source maintainers, PostgREST is maintained by a +[Supabase developer](/blog/2020/06/15/supabase-steve-chavez), one of our first hires over a year ago. +We've recently added [another developer](https://www.postgresql.org/message-id/CABwTF4UZzYoHcaEGe2cESVn-e9dc3wzg%3Dmvx7Tz8qbKJ7p3UKA%40mail.gmail.com) +with the explicit goal of working within the PostgreSQL community. + +If you want to help us build the future of cloud-native Postgres, join us: +[https://about.supabase.com/careers/postgres-experts](https://about.supabase.com/careers/postgres-experts) + +## Get started + +- Start using Supabase today: **[app.supabase.io](https://app.supabase.io/)** +- Make sure to **[star us on GitHub](https://github.com/supabase/supabase)** +- Follow us **[on Twitter](https://twitter.com/supabase)** +- Subscribe to our **[YouTube channel](https://www.youtube.com/c/supabase)** +- Become a **[sponsor](https://github.com/sponsors/supabase)** diff --git a/www/_blog/2021-11-05-supabase-beta-october-2021.mdx b/www/_blog/2021-11-05-supabase-beta-october-2021.mdx new file mode 100644 index 00000000000..75aa68f298b --- /dev/null +++ b/www/_blog/2021-11-05-supabase-beta-october-2021.mdx @@ -0,0 +1,180 @@ +--- +title: Supabase Beta October 2021 +description: Three new Auth providers, multi-schema support, and we're gearing up for another Launch Week. +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: 2021-oct/release-oct-2021.jpg +thumb: 2021-oct/release-oct-2021-cover.jpg +tags: + - release-notes +date: '2021-11-07' +toc_depth: 3 +--- + +We released three new Auth providers, multi-schema support, and we're gearing up for another Launch Week. + +### Quick recap + +Watch a recap of this month's release. + + + +## Slack, Spotify, and MessageBird logins + +Thanks to [`@HarryET`](https://github.com/supabase/gotrue/pull/245) and our friends at [MessageBird](https://github.com/supabase/gotrue/pull/210) +we have 3 new Auth providers this month: +[Slack](https://supabase.com/docs/guides/auth/auth-slack), +[Spotify](https://supabase.com/docs/guides/auth/auth-spotify), and +[MessageBird](https://supabase.com/docs/guides/auth/auth-messagebird) phone logins. + +![Supabase Auth: Login with Slack](/images/blog/2021-oct/supabase-auth-slack.png) + +## Multi-schema support + +### Dashboard + +Browse data in any database schema using the Schema switcher in the Dashboard. + +![Multi-schema support](/images/blog/2021-oct/multi-schema.png) + +### API + +You can access any schema with your API, after enabling access in the Dashboard. +[Docs](https://supabase.com/docs/reference/javascript/initializing#api-schemas). + +![Multi-schema support (API)](/images/blog/2021-oct/supabase-multi-schema-support.png) + +## Fresh Docs and Guides + +We have a TON of new guides, with videos too. + +### Database Functions + +Learn about PostgreSQL Functions. [Docs](https://supabase.com/docs/guides/database/functions). + + + +### Auth Overview + +Learn about all the exciting features of Auth within Supabase. [Docs](https://supabase.com/docs/guides/auth/intro). + + + +### API Features + +Learn more about the power of PostgREST for RESTful APIs. [Docs](https://supabase.com/docs/guides/api#restful-api). + + + +### And more + +- Redwood Quickstart: [https://supabase.com/docs/guides/with-redwoodjs](https://supabase.com/docs/guides/with-redwoodjs) +- Expanded Self-hosting: [https://supabase.com/docs/guides/hosting/overview](https://supabase.com/docs/guides/hosting/overview) +- Expanded Auth Reference docs with [serverside functions](https://supabase.com/docs/reference/javascript/auth-api-deleteuser). +- "Before you launch" checklist: [https://supabase.com/docs/going-into-prod](https://supabase.com/docs/going-into-prod) + +!["Before you launch" checklist](/images/blog/2021-oct/launch-ckecklist.png) + +## Community + +There was a lot of activity this month. + +### Supabase at Jamstack conf + +Supabase attended the Jamstack conf. Watch us catch up with Matt, the cofounder of Netlify (minute 8). + + + +### Supabase at Next.js conf + +And [Jon](https://twitter.com/_dijonmusters) made a guest appearance at this year's amazing [Next.js Conf](https://nextjs.org/conf). + + + +### Community Highlights + +- Vue 3 | Workout Tracker App - John Komarnicki [video](https://www.youtube.com/watch?v=3tF0fGkd4ho) +- Adalo + Supabase - Flywheel Media [video](https://www.youtube.com/watch?v=YGP1LXctLk4) +- Nuxt 3 Beta + Supabase - BenCodeZen [video](https://www.youtube.com/watch?v=5vB120atiaU) +- Made With Supabase (now on Nuxt 3) - Zernonia [site](https://www.madewithsupabase.com/) +- Nuxt 3 + Tailwind + Supabase - Ekene Eze [video](https://www.youtube.com/watch?v=xbE11CfZpNQ) +- SQL Functions - Răzvan Stătescu [article](https://dev.to/razvanstatescu/how-to-run-custom-sql-queries-using-functions-in-supabase-2nna) +- `supabase-py v0.0.3` released - [repo](https://github.com/supabase-community/supabase-py/releases/tag/v0.0.3) +- `nuxt-supabase v2.2.1` released - [repo](https://github.com/supabase-community/nuxt-supabase) +- `vue-supabase v2.2.3` released - [repo](https://github.com/supabase-community/vue-supabase) + +### GitHub + +We hit 20K stars!! 21,268 to be exact: [github.com/supabase/supabase](http://github.com/supabase/supabase) + +![GitHub](/images/blog/2021-oct/stars.png) + +Source: [repository.surf/supabase](https://repository.surf/supabase) + +Check out some of our other community stats in our latest [Series A Blog Post](/blog/2021/10/28/supabase-series-a). + +## Coming Next: Launch Week III + +We had Launch Week [numero uno](https://supabase.com/blog/2021/03/25/launch-week) in March, and the sequel "[Launch Week II: the SQL](https://supabase.com/blog/2021/07/22/supabase-launch-week-sql)" in July. + +Now we're going even bigger with the third installment: `Launch Week III: The Trilogy`. Join us on 29th November on our [Discord](https://discord.supabase.com). + +![Launch Week III](/images/blog/2021-oct/og-launchweek-3.jpg) + +## Get started + +- Start using Supabase today: **[app.supabase.io](https://app.supabase.io/)** +- Make sure to **[star us on GitHub](https://github.com/supabase/supabase)** +- Follow us **[on Twitter](https://twitter.com/supabase)** +- Subscribe to our **[YouTube channel](https://www.youtube.com/c/supabase)** +- Become a **[sponsor](https://github.com/sponsors/supabase)** diff --git a/www/_blog/2021-11-26-supabase-how-we-launch.mdx b/www/_blog/2021-11-26-supabase-how-we-launch.mdx new file mode 100644 index 00000000000..7e496abf694 --- /dev/null +++ b/www/_blog/2021-11-26-supabase-how-we-launch.mdx @@ -0,0 +1,119 @@ +--- +title: 'How we launch at Supabase' +description: The history and methodology of Supabase Launch Week. +author: ant_wilson +author_url: https://github.com/awalias +author_image_url: https://github.com/awalias.png +authorURL: https://github.com/awalias +image: how-we-launch/how-we-launch-og.jpg +thumb: how-we-launch/how-we-launch-thumb.jpg +tags: + - tech +date: '2021-11-26' +toc_depth: 3 +--- + +Next week is Supabase Launch Week. It's our third Launch Week this year, and is a key part of a Product-Led Growth strategy that has enabled us to increase the number of databases we manage 47% month-on-month for the last 18 months. + +We often get asked about how we're able to ship so relentlessly, and being an open source company we thought it appropriate to start "open sourcing" some of our methods around building and shipping. Our user base is constructed of companies and individuals who themselves are building for the web and marketing to enormous audiences. Hopefully they can learn some of our tricks and in turn contribute back to the community with their own launch strategies and tactics, helping us continuously learn and improve. + +Before I go into the nuts and bolts of what Launch Week is, and the exact processes we follow when executing one, it's probably useful if I explain how we landed on this methodology in the first place. + +![supabase monthly growth](/images/blog/how-we-launch/total-databases-launched.jpg) + +### A brief history of growth at Supabase + +We started work on Supabase in January 2020. Our growth plan from the start included being accepted into YCombinator. Dev Tool companies who enter YC gain a huge advantage from day one. You're placed in a cohort of hundreds of other early-stage startups, the majority of whom are developing software, and have just been given a bunch of funding, making them ideal early customers! This, however, turned out to be only a small part of what YC ultimately gifted us. + +At the time we joined the batch, we had around 80 alpha users of varying levels of activeness. Our plan was to spend the batch iterating the product around these early alpha users, and to do a big public launch a week or so before Demo Day (an event where you pitch to a shiver of investors). Our plan was foiled however, when an early user shared our site on Hacker News. The post stayed on the home page for several days, and ended up being one of the most upvoted dev tools launches ever (second only to Stripe!). Overnight, the number of databases we were hosting increased ten-fold. Bugs, breakages and feature requests flooded in from every angle; a fantastic problem to have for a fledgling startup. Over the course of the next 2 months we worked hard on a few major items, including Supabase Auth, and migrating our entire stack between cloud providers, along with hundreds of other smaller fixes and incremental improvements - both to our product, and to our company. + +A few weeks before Demo Day, we announced Auth, and shouted about it as loudly as possible. We posted it everywhere, and recruited our recently onboarded squad of [Technical Angel Investors](https://supabase.com/company#investors) to help us boost our message on social media. The response was solid, and led to an increase in the rate of user acquisition, and activation/retention rates. + +Post YC can often be a sink or swim moment for companies. Throughout the batch, you have regular check-ins with world-class operators, your batch mates, and inspirational talks from founders several steps ahead. When you leave, the external pressure drops, and it's up to you to put the frameworks in place to maintain your rate of progress. You no longer have the likes of Michael Siebel asking you why it's taking you so long to get Auth out the door and in the hands of users. When faced with this problem we sat down and said, "why don't we just pretend that we're starting the batch again, and do our best to recreate the conditions of an accelerator internally, complete with our very own Demo Day?". We found the actual YC Demo Day is kind of an arbitrary deadline useful for motivating all kinds of internal initiatives, whether it's fundraising, growth, or product. So we said to the team, let's just choose an arbitrary date 3 months from now, and we'll ship _something_ huge. + +We went the whole hog. We had kick-off events, we invited external people to come in and talk to the team about their origin stories, and even had custom swag made up specific to this product cycle. The _something_, turned out to be [Supabase Beta](https://supabase.com/beta), an announcement that marked a huge advancement in the Stability, Performance, and Security of our hosted platform. This announcement resulted in a stark increase in the rate of developer sign-ups and activation. Our "fixed timeline, flexible scope" approach to launching products had proved successful with the team. And what's more, the build-up to launch, and the launch itself, was some of the most fun any of us had had. Our small team was flying high on adrenaline, and everyone could see for themselves the immediate and direct impact their work had on Supabase's viral adoption. + +The very next week, still high on adrenaline, we met for a retrospective. The debrief, however, quickly turned into a planning meeting, and the question was raised "what is the MOST ambitious thing we could hope to ship 3 months from now?". A few projects got kicked about until someone suggested, "why just have one launch? Why can't we aim to ship one major feature or announcement every day for a week?". It was quickly agreed that Launch Day would instead become Launch Week. + +During the last week of March 2021, we went on to ship [7 major features](/blog/2021/03/25/launch-week#friday-one-more-thing). We once again saw an immediate uptick in growth rate which helped solidify our strategy. + +More recently we ran "[Launch Week II: The SQL](/blog/2021/07/22/supabase-launch-week-sql)", where we bumped the versions of several key products in our stack, and added a [Community Day](https://supabase.com/blog/2021/07/26/supabase-community-day) with the aim of boosting visibility and support of various open source tools and projects that we rely on, along with products, frameworks, and tooling built by the rapidly expanding [Supabase Community](https://github.com/supabase-community/). + +We're now just a few days away from Launch Week III, and over time have incrementally improved upon many of the processes and tactics that help us maximize output whilst minimizing stress on the team. So let's get into some specifics about how we run a product cycle and the resulting Launch Week. + +### The Planning Meeting + +Spanning 12 different countries makes it challenging to find a time that works for everyone, but gathering together online is the first step. + +We always start the meeting by firing up a Google Jam Board and collectively constructing "The Supabase Universe", this is a giant brain dump of terms and concepts related to Supabase. What we're building, who it's for, who we're trying to hire, what our goals and metrics are. Literally everything that's anything to do with Supabase goes down on this virtual whiteboard. The purpose is to ensure everyone gets out of their daily mode of operation and loads up the business as a whole into their brains. Developers should be loading up marketing concepts, and the marketers should be thinking about engineering. If we're overly focused on one particular area (often engineering), then we risk setting a course in the wrong direction for the entire quarter. It's also a method of getting all the "obvious" stuff down on paper so you can move on and focus the creative efforts of everyone on new ideas; a technique borrowed from the creative industries. + +![supabase monthly growth](/images/blog/how-we-launch/supabase-universe.jpg) + +Once everyone is warmed up, we dive into the high-level goals and metrics. Are our metrics still relevant? And if so, which ones should we be aiming to boost and why? The more direct a connection between actions and metrics the better, so it's important to remind everyone of what the north star is before we start scheming on how to reach it. + +Then comes the main course - what are we going to build or do that's going to move the needle? List down as many ideas as possible, and go through a process of sorting and filtering as you go. Try not to go too deep on any particular idea, in-depth analysis and exploration can be done later in break out sessions, make sure you have someone responsible for pulling you out of these rabbit holes if the team starts to get drawn in to too much detail. + +For us, an essential part of this process is the idea that the scope is flexible - at this stage of ideation it's often impossible to tell whether an engineering project is going to take 2 or 102 days. We will always try our best to have it ready for Launch Week, but if not no worries, we'll shout about something else, and include it in the next one. + +Lastly we will give some discussion to hiring and any other business, and schedule any follow-up meetings or breakouts required. + +### The Kick Off Meeting + +After the breakouts we typically have a much clearer idea of what we want to aim for, and if the projects themselves are realistic. Our list at this point often sits around 12 items in length. Some projects will drop out and others will be introduced during the course of the next few months, which is ok. Each project typically has a lead assigned, and another couple of people will register their interest in helping out. + +For the kick-off, I always try and come up with some grotesquely garish branding (this is an internal project after all) and find some loose theme to roll with. The purpose of the meeting is to remind everyone of the goals, the timeline, and the current list of announcements we plan to make during the launch. + +![supabase monthly growth](/images/blog/how-we-launch/how-we-launch-stickers.jpg) + +### Time to Work + +Then it's time to get our heads down. One important point to make here is that the 3-month cycle doesn't necessarily replace more traditional project management methodologies. We leave it up to the project leads to decide how to run their project. Some teams opt for kanban boards, and stand-ups. Other projects run like open source repos, with RFCs, issue management, and fully async comms. + +Another key thing to mention here is that we very rarely hold back features until Launch Week. Actually, quite the opposite is true, we encourage everyone to ship features as early as possible. We announce features as they ship in our monthly Beta Update blog and newsletter - which is often limited to a blast radius containing existing users. Full write-ups, marketing copy, and broad Top-of-Funnel type marketing efforts will often happen during Launch Week to hype up these features. Actually, we've found that you can launch a new feature many times over and always manage to reach people who either forgot, ignored, or just plain missed it the first few times. We're so close to our own projects that we often overestimate the reach of our online marketing efforts. + +In the weeks leading up to Launch Week, we review more closely the list of items we want to Launch and start to plan for what supporting materials we'll need. There are some things such as press, which needs to be organized up to 3 weeks before you plan to Launch, so you better get started early on those items. Also being aware of which third parties are going to be involved is important. Maybe we're shipping an integration with some other tool or company, cross-company communication can be a blocker, so better to start early. + +![supabase monthly growth](/images/blog/how-we-launch/how-we-launch-timeline.jpg) + +### Pre-Launch Week + +One of our learnings from previous Launch Weeks was to no longer ship to prod on the day of the Launch itself :). We had a blast live-debugging prod issues on Discord last time, but this was not so conducive to getting enough sleep. Our Launch Weeks have become a marathon, so it's ideal to get all the major integrations done a week early. Also writing the content and getting someone to edit can take a couple of iterations. This all seems obvious written down here, but it took us a few iterations to start being more regimented. + +We have more regular check-ins throughout this week, and make sure everyone is on the same page. We have a process of "swarming" around sticky issues and blockers and a good amount of testing will be done by people who were not involved in the development of a given feature. Particularly around DX, which is an extremely high priority topic at Supabase. + +### Launch Week + +I can't think of many things more fun than executing on a Supabase Launch Week. It's the culmination of 3 months of epic work from a highly skilled team of folks distributed across every corner of the planet. The awesome thing is that, with most of the features we ship, the person who implemented the code will be the same person who writes the marketing content. This means that the content usually includes deep technical discussion. They're also probably the best person to decide which will be the most effective channels to market that particular feature. As an example, when we launched [ui.supabase.com](http://ui.supabase.com), we made sure to hit up all the front end and design channels, made sure it ranked on Product Hunt, and reached out to some friendly designers to help boost our message. This is very different from the approach we took to marketing our [file storage offering](https://supabase.com/blog/2021/03/30/supabase-storage). The technical design discussion of Storage is better suited to channels like Hacker News, and technical conference audiences who may be more interested in DX than UI components. + +When it comes to the day of each launch we've gotten into the habit of constructing a finely detailed schedule to follow. It will contain items such as: + +- 7:30am Twitter spaces reminder tweet +- 7:55am Product Hunt goes live +- 8:00am Blog post goes live +- 8:05am Post launch tweet 1 +- 8:10am Share tweet with Angels +- 8:15am Twitter spaces go live + +Of course, it's possible to run this all without such a fine-grained schedule, but the launches can get kind of hectic, so it's easier to not have to think - just do. + +### The Rest + +Despite being a ton of fun, it's inevitable that some team members will have pulled long days and nights to get their feature out the door, as well as pumping it on as many marketing channels as possible. Launching new things also includes managing support requests, bug fixes, responding to questions, and even managing PRs from the community excited to contribute to new repos or areas of the codebase. This is unsustainable without proper rest so each cycle ends with a good amount of downtime and maintenance mode. Having said that, the adrenaline of Launch Week often spills over into the following days and weeks, so it's not uncommon for members of the team to continue in Launch Mode for a while before taking some downtime. + +### The Retrospective + +Once the dust has settled, the **most** **important** phase of the entire process can begin. To skip the retro would be to rubbish the entire process, as we would never learn from mistakes or adapt to capitalize on new tactics discovered throughout the preceding weeks and months. We always make sure to cover what went well, what went badly, and what can be improved. This list is then read aloud again at the start of the next planning meeting. The process as it exists today is the product of 4 previous iterations, and is still far from its final form. Amongst other things, our team is growing fast, so it's yet to be seen if the same processes will extend to so many team members, and in which ways they will have to adapt. Lastly, we always make sure to discuss the question "Is Launch Week still relevant?", and "How would we know if we were approaching some local maxima in terms of process and productive output?". + +![supabase monthly growth](/images/blog/how-we-launch/how-we-launch-retrospective.jpg) + +### Some Other Thoughts + +This "internal accelerator" model has worked well within Supabase as a 2-person team and is still proving effective now at 30, but there's no telling whether it would work as well in other organizations. I would be very keen to learn from those who also do something similar. + +In some ways, running Supabase is like launching many startups at the same time, we have to build and maintain many different parallel projects in order to match Firebase's incredible suite of products, which could be one reason why it lends itself so well to this acceleration model. And, in fact, being a Firebase alternative is only a small part of [what we want to achieve with Supabase](https://supabase.com/blog/2021/10/28/supabase-series-a), so we have many, many more initiatives to run as we grow. + +Running an accelerator model may also be why we've had success [hiring so many other founders](https://about.supabase.com/careers/founders). We're able to give a high degree of autonomy to individuals when it comes to managing projects and initiatives. If this kind of work environment sounds interesting to you, we have tons of [open roles](https://about.supabase.com/careers). We've already hired people who joined because they "couldn't stand to watch another Launch Week from the sidelines" and team members often quote experiencing their first Launch Week as one of the highlights of their Supabase journey so far. It clearly has benefits that extend beyond just growth and user activation. + +Make sure you follow us on [Twitter](https://twitter.com/supabase), join our [Discord](https://discord.supabase.com), or [sign up for Supabase](https://app.supabase.io) in order to keep up to date on all things Supabase. + +Supabase is the Open Source Firebase Alternative. diff --git a/www/_blog/2021-11-26-supabase-launch-week-the-trilogy.mdx b/www/_blog/2021-11-26-supabase-launch-week-the-trilogy.mdx new file mode 100644 index 00000000000..3946d79ce83 --- /dev/null +++ b/www/_blog/2021-11-26-supabase-launch-week-the-trilogy.mdx @@ -0,0 +1,113 @@ +--- +title: 'Supabase Launch Week III: Holiday Special' +description: Tis the season to be shipping. +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: launch-week-three/launch-week-three-og.jpg +thumb: launch-week-three/launch-week-three-thumb.jpg +tags: + - launch-week +date: '2021-11-26' +toc_depth: 2 +--- + +In March, Supabase held a [Launch Week](/blog/2021/03/25/launch-week) where we launched a new product/feature every day for a week. + +In July we did [Launch Week II: The SQL](/blog/2021/07/22/supabase-launch-week-sql), with another week of feature releases. + +Santa's little hackers have been hard at work because we've got another five days of launches ready to go. + +## What to expect + +We don't want to spoil the surprise, so for now we'll give you a teaser of what to expect. Come back each day to see what we launch, or follow us on twitter to keep up to date: [@supabase](https://twitter.com/supabase) and follow the hashtag [#supalaunchweek](https://twitter.com/hashtag/supalaunchweek). + +## Monday: Community Day + +![Monday: Community Day](/images/blog/launch-week-three/communityday.jpg) + +### **When?** + +Monday 29 November 2021: 7am PT + +### What? + +Last Launch Week we introduced the idea of Community Day - a day where we shine a spotlight on some of the open source tools that we use, and community contributions. If you liked that one, you're going to love this one. + +### Where? + +Read the [blog post](/blog/2021/11/29/community-day). + +Watch the Twitter Spaces recap on [YouTube](https://youtu.be/9zmaKt6evxw). + +## Tuesday: Dashboard Surprise + +![Tuesday: Dashboard Surprise](/images/blog/launch-week-three/elf.jpg) + +### **When?** + +Tuesday 30 November 2021: 7am PT + +### What? + +We've released [Supabase Studio](https://github.com/supabase/supabase/tree/master/studio). The same Dashboard that you're using on our Platform is now available for Local Development and Self-Hosting. + +### Where? + +Read the [blog post](/blog/2021/11/30/supabase-studio). + +Watch the Twitter Spaces recap on [YouTube](https://youtu.be/n1QGq75ZzvE). + +## Wednesday: Realtime Updates + +![Wednesday: Realtime Updates](/images/blog/launch-week-three/grinch.jpg) + +### **When?** + +Wednesday 1 December 2021: 7am PT + +### What? + +We released Realtime Row Level Security. + +### Where? + +Read the [blog post](/blog/2021/12/01/realtime-row-level-security-in-postgresql). + +Watch the Twitter Spaces recap on [YouTube](https://youtu.be/4thVj8j19s). + +## Thursday: A new player enters the game + +![Thursday: A new player enters the game](/images/blog/launch-week-three/arnie.jpg) + +### **When?** + +Thursday 2 December 2021. + +### What? + +We acquired [Logflare](https://logflare.app). + +### Where? + +Read the [blog post](/blog/2021/12/02/supabase-acquires-logflare). + +Watch the Twitter Spaces recap on [YouTube](https://youtu.be/4thVj8j19s). + +## Friday: (One more thing) + +![Friday: (One more thing)](/images/blog/launch-week-three/danny.jpg) + +### **When?** + +Friday 3 December 2021. + +### What? + +Let's be honest. It's never just one more thing. Today we announced five more things 🔥. + +### Where? + +Read the [blog post](/blog/2021/12/03/launch-week-three-friday-five-more-things). + diff --git a/www/_blog/2021-11-28-postgrest-9.mdx b/www/_blog/2021-11-28-postgrest-9.mdx new file mode 100644 index 00000000000..1fec332bb9e --- /dev/null +++ b/www/_blog/2021-11-28-postgrest-9.mdx @@ -0,0 +1,109 @@ +--- +title: 'PostgREST 9' +description: New features and updates in PostgREST version 9. +author: steve_chavez +author_url: https://github.com/steve-chavez +author_image_url: https://github.com/steve-chavez.png +authorURL: https://github.com/steve-chavez +image: postgrest-9/whats-new-in-postgrest-9-og.png +thumb: postgrest-9/whats-new-in-postgrest-9-thumb.png +tags: + - launch-week + - release-notes + - tech + - community +date: '2021-11-27' +toc_depth: 2 +--- + + +PostgREST turns your PostgreSQL database automatically into a RESTful API. Today, PostgREST 9 was [released](https://postgrest.org/en/v9.0/releases/v9.0.0.html). Let's take a look at some of the new features. + +## Resource embedding with Inner Joins + +PostgREST 9 brings a [much-requested feature](https://github.com/supabase/postgrest-js/issues/197): the ability to do `inner joins` when embedding a table. + +Here's an example with `supabase-js`: + +```js hideCopy +const { data, error } = await supabase + .from('messages') + .select('*, users!inner(*)') + .eq('users.username', 'Jane') +``` + +With the new `!inner` keyword, you can now filter rows of the top-level table (`messages`) based on a filter (`eq`) of the embedded table (`users`). +This works across all Supabase client libraries and you can use it with any of the available operators (`gt`, `in`, etc.) + +[Read more](https://postgrest.org/en/v9.0/releases/v9.0.0.html#resource-embedding-with-top-level-filtering). + +## Functions with unnamed parameters + +You can now make `POST` requests to functions with a single unnamed parameter. This is particularly useful for webhooks that send JSON payloads. + +For example, imagine you were using Postmark as an email provider and you wanted to save email bounces using their [bounce webhook](https://postmarkapp.com/developer/webhooks/bounce-webhook). +Previously this wouldn't be possible with PostgREST, as every function required a named parameter. + +As of PostgREST 9, this is possible. +Simply create a function inside your PostgreSQL database to receive the raw JSON: + +```sql hideCopy +create function store_bounces(json) +returns json +language sql +as $$ + insert into bounces (webhook_id, email) + values ( + ($1->>'ID')::bigint, + ($1->>'Email')::text + ); + + select '{ "status": 200 }'::json; +$$; +``` + +And the webhook can send data directly to your database via an `rpc` call: + +```bash hideCopy +POST https://.supabase.co/rest/v1/rpc/store_bounces HTTP/1.1 +Content-Type: application/json + +{ + "RecordType": "Bounce", + "MessageStream": "outbound", + "ID": 4323372036854775807, + "Type": "HardBounce", + "MessageID": "883953f4-6105-42a2-a16a-77a8eac79483", + "Description": "The server was unable to deliver your message (ex: unknown user, mailbox not found).", + "Details": "Test bounce details", + "Email": "john@example.com", + "From": "sender@example.com", + "BouncedAt": "2019-11-05T16:33:54.9070259Z" +} +``` + +[Read more](https://postgrest.org/en/v9.0/api.html#s-proc-single-unnamed). + + +## PostgreSQL 14 compatibility + +If you've ever done your own custom `auth` functions using PostgREST [HTTP Context](https://postgrest.org/en/v8.0/api.html#accessing-request-headers-cookies-and-jwt-claims), +note that a breaking change was necessary for PostgreSQL 14 Compatibility. You'll need to update them: + + +| `From` | `To` | +| --- | --- | +| `current_setting('request.jwt.claim.custom-claim', true)` | `current_setting('request.jwt.claims', true)::json->>'custom-claim'` | +| `current_setting('request.header.custom-header', true)` | `current_setting('request.headers', true)::json->>'custom-header'` | + + +If you only use Supabase default `auth` functions(`auth.email()`, `auth.uid()`, `auth.role()`), then no action is required because we have updated the functions to handle these changes transparently. + +[Read more](https://postgrest.org/en/v9.0/releases/v9.0.0.html#postgresql-14-compatibility). + +## Release notes + +There are a lot more improvements released in PostgREST 9, including [support for Partitioned Tables](https://postgrest.org/en/v9.0/releases/v9.0.0.html#partitioned-tables), +[improved doc](https://postgrest.org/en/v9.0/releases/v9.0.0.html#documentation-improvements), and [bug fixes](https://postgrest.org/en/v9.0/releases/v9.0.0.html#bug-fixes). + +You can see the full updates on the [PostgREST 9 release notes](https://postgrest.org/en/v9.0/releases/v9.0.0.html). diff --git a/www/_blog/2021-11-28-whats-new-in-postgres-14.mdx b/www/_blog/2021-11-28-whats-new-in-postgres-14.mdx new file mode 100644 index 00000000000..d5902d112e7 --- /dev/null +++ b/www/_blog/2021-11-28-whats-new-in-postgres-14.mdx @@ -0,0 +1,166 @@ +--- +title: 'New in PostgreSQL 14: What every developer should know' +description: 'A quick look at some new features and functionality in PostgreSQL 14.' +author: gurjeet +author_url: https://github.com/gurjeet +author_image_url: https://github.com/gurjeet.png +authorURL: https://github.com/gurjeet +image: whats-new-in-postgres-14/whats-new-in-postgres-14-og.png +thumb: whats-new-in-postgres-14/whats-new-in-postgres-14-thumb.png +tags: + - tech +date: '2021-11-28' +toc_depth: 3 +--- + +Every web developer knows the importance of choosing a suitable database for building modern apps. +Even though NoSQL, NewSQL, and other types of databases have received a great deal of buzz in the last few years, +relational database management systems (or RDBMS) are still relevant for several critical business use cases and will likely do so in the foreseeable future. +Among the many open-source relational databases available, [PostgreSQL](https://supabase.com/docs/guides/database/introduction) is a popular choice among developers. +It was named [DBMS of the year in 2020](https://db-engines.com/en/blog_post/85) by +DBEngines, and with every release of PostgreSQL new features are available making it easy for developers and administrators to run their apps. + +This blog will highlight some key features of the newly available PostgreSQL 14, which every developer can benefit from. So, let's dive right in. + +## Complex data type support + +### JSON subscripting + +PostgreSQL continues to add innovations for complex data types, making JSON data more accessible. In postgreSQL 14, developers can use subscripts to iterate through JSON key pairs and fetch corresponding values. For example, using this capability, nested JSON fields can be quickly traversed to retrieve values to reconstruct application objects. + +```sql hideCopy +select ( + '{ "PostgreSQL": { "release": 14 }}'::jsonb +)['PostgreSQL']['release']; + + jsonb +------- + 14 +``` + +### Working with disjointed data ranges + +In the real world, data ranges are pretty common. For example, if you have sensor readings going into a PostgreSQL database, you may want to define a range for +low, medium, and high metrics. Before version 14, you could set data ranges for integers, numerics, timestamps, and other data types. +However, these ranges had to be contiguous, and it required multiple insert records across the different ranges. +In PostgreSQL 14, a single insert statement can be used to map data across multiple noncontiguous ranges. Let's check it out with an example. + +First, create an enum data type to capture low, medium, and high sensor reading levels. + +```sql hideCopy +create type valid_levels as enum ( + 'low', 'medium', 'high' +); +``` + +To store sensor reading metric data, create a table consisting of the sensor description, the level and the range of timestamps when the sensor was at that level. + +```sql hideCopy +create table sensor_range ( + reading_id serial primary key, + metric_desc varchar(100), + metric_level valid_levels, + metric_ts tsmultirange +); +``` + +Now, insert some data into the table. Note that, the insert statement below provides two time ranges that are not contiguous. + +```sql hideCopy +insert into sensor_range ( + metric_desc, + metric_level, + metric_ts +) +values ( + 'Temperature', + 'high', + '{[2021-11-01 6:00, 2021-11-01 10:00],[2021-11-05 14:00, 2021-11-05 20:00]}' +); + +insert into sensor_range ( + metric_desc, + metric_level, + metric_ts +) +values ( + 'Temperature', + 'low', + '{[2021-11-01 10:00, 2021-11-01 12:00],[2021-11-05 21:00, 2021-11-05 22:00]}' +); +``` + +Query the data in the table to see the inserted data rows + +```sql hideCopy +select * +from sensor_range; +``` + +``` hideCopy +| `reading_id` | `metric_desc` | `metric_level` | `metric_ts` | +|--------------|---------------|----------------|-----------------------------------------------------------------------------| +| 1 | Temperature | high | {[2021-11-01 6:00, 2021-11-01 10:00],[2021-11-05 14:00, 2021-11-05 20:00]} | +| 2 | Temperature | low | {[2021-11-01 10:00, 2021-11-01 12:00],[2021-11-05 21:00, 2021-11-05 22:00]} | +``` + +## Improved performance and monitoring + +### Query pipelining + +If you're a developer accessing PostgreSQL using a high-level programming language, the database driver you're using is likely based on a C library called libpq. For example, suppose your application performs several write operations within a short period, or your network has a higher latency. In that case, you may want to fire off several queries over the same network connection simultaneously, so you don't have to wait for a reply after each query. Under the hood, libpq can send multiple queries to PostgreSQL while maintaining a queue of queries that are waiting for results. This queue consumes additional memory on both the client and server. Developers can now take advantage of PostgreSQL 14's client-side query pipeline mode using clients built on top of the latest libpq library to accelerate app performance. + +Aside from query pipelining, the latest PostgreSQL 14 release brings several other enhancements to query parallelism, including improved performance of parallel sequential scans, parallel query execution capabilities for Foreign Data Wrappers, and the ability to run parallel queries when refreshing materialized views. With this, your PostgreSQL server can now do more work for you at a lower cost. + +### Monitoring and troubleshooting queries + +Ask any database troubleshooting expert, and they will tell you that without a way to correlate data across different database components, investigating and monitoring query-related issues can quickly become a nightmare. When it comes to PostgreSQL, the SQL statement’s query_id can be used for this purpose, allowing database experts an easy way to identify workload patterns quickly, detect rogue run-away or slow queries, and common query-related issues. Before PostgreSQL 14, this information was only available using the pg_stat_statements [extension](https://supabase.com/docs/guides/database/extensions), which shows aggregate statistics about queries that have finished executing, but now this information is additionally available for live running queries with pg_stat_activity, in the EXPLAIN VERBOSE statement, and log files. +An example of using query_id IN EXPLAIN (VERBOSE) statement + +Start by altering the system to enable the query_id + +```sql hideCopy +alter system set compute_query_id = 'on'; +``` + +Restart the PostgreSQL database for the alter system statement to take effect. + +Run the following query that selects schema and table names from the catalog tables + +```sql hideCopy +explain (verbose, costs off) +select schemaname, tablename +from pg_tables, pg_sleep(5) +where schemaname <> 'pg_catalog'; +``` + +View the result of the EXPLAIN statement + +![View the result of the EXPLAIN statement](/images/blog/whats-new-in-postgres-14/explain-statement.png) + +Notice that the query identifier is in the output:
+`Query Identifier: 4856400161806292488` + +## Enhanced security + +Security remains top of mind for every organization, and PostgreSQL 14 brings some critical enhancements in this area. + +Have you ever wanted to [manage database user access](https://supabase.com/docs/guides/auth/managing-user-data) so that only specific individuals have read-only access? For example, consider a situation where you would like to host some sample data online for a demo and not allow demo users to modify or delete data. With the latest PostgreSQL version 14, you can easily set that up using a single GRANT statement. + +```sql hideCopy +grant pg_read_all_data to bobfries; +``` + +From an authentication perspective, if you're still managing passwords in the database without [third-party login providers](https://supabase.com/docs/guides/auth#third-party-logins), +you may want to read this. Since version 10, PostgreSQL supports several different hashing mechanisms such as MD5 and SCRAM-SHA-256 to store user passwords on disk. +However, to keep up with the [latest security weaknesses around MD5](https://en.wikipedia.org/wiki/MD5#Security) and meet regulatory compliance requirements, +PostgreSQL 14 has made SCRAM-SHA-256 the default password management mechanism. So, if you are using old PostgreSQL client software, +you may want to update it, to be able to connect to the newer versions of the database server. + +## It's only the tip of the iceberg + +Indeed, there's a lot more to explore in the latest PostgreSQL, and we've barely scratched the surface of what PostgreSQL 14 has to offer. +There's no better way to experience some of these features than by trying them out for yourself. +You can check out these new features within your Supabase project without having to perform a local installation. + +Explore the [Supabase dashboard now](https://app.supabase.io) and get started with your new project. diff --git a/www/_blog/2021-11-29-community-day.mdx b/www/_blog/2021-11-29-community-day.mdx new file mode 100644 index 00000000000..78fa60a3680 --- /dev/null +++ b/www/_blog/2021-11-29-community-day.mdx @@ -0,0 +1,136 @@ +--- +title: 'Community Day' +description: Kicking off launch week by highlighting the communities around Supabase. +author: thor_schaeff +author_url: https://github.com/thorwebdev +author_image_url: https://github.com/thorwebdev.png +authorURL: https://github.com/thorwebdev +image: launch-week-three/community-day/supabase-oss.jpg +thumb: launch-week-three/community-day/supabase-oss.jpg +tags: + - launch-week + - community +date: '2021-11-29' +toc_depth: 2 +--- + +Supabase combines existing open-source tools with our own open-source contributions to provide a delightful experience for developers. As part of this goal we hope to build a community of communities, bringing together developers from many different tools, as well as new developers looking to get involved with open source. + +To kick off launch week we want to showcase some of the communities that make up the Supabase community, highlight some of their updates, and celebrate everyone who contributes their time to the Supabase mission. + +So let's get cracking, we've got a lot to cover. 🚀 + +## Open Source Spotlight: Kong API Gateway + +Supabase provides a whole bunch of features that are made up of a [collection of open-source tools](/docs/architecture). To orchestrate these different services and functionalities we use the [Kong API Gateway](https://github.com/Kong/kong). + +As a user of our hosted offering you don't really need to know all this, but we love showcasing the amazing open-source tools that we work with, and so we've invited [Vik Gamov](https://twitter.com/gAmUssA) to give you a little intro to [Kong](https://github.com/Kong/kong): + + + +## PostgreSQL 14 updates + +![Postgres-14](/images/blog/whats-new-in-postgres-14/whats-new-in-postgres-14-og.png) + +Every web developer knows the importance of choosing a suitable database for building modern apps. +Even though NoSQL, NewSQL, and other types of databases have received a great deal of buzz in the last few years, +relational database management systems (or RDBMS) are still relevant for several critical business use cases and will likely do so in the foreseeable future. +Among the many open-source relational databases available, [PostgreSQL](/docs/guides/database/introduction) is a popular choice among developers. +It was named [DBMS of the year in 2020](https://db-engines.com/en/blog_post/85) by +DBEngines, and with every release of PostgreSQL new features are available making it easy for developers and administrators to run their apps. + +[Gurjeet](https://twitter.com/0xGurjeet), one of our Postgres engineers, has written up a [blogpost](/blog/2021/11/28/whats-new-in-postgres-14) with the most important updates the every dev should know. + +## PostgREST 9 updates + +![PostgREST-9](/images/blog/launch-week-three/community-day/postgrest-9-og.png) + +We've had a lot of feedback on our Postgres APIs, and we've been hard at work with the [PostgREST team](https://github.com/orgs/PostgREST/people) to improve an already-incredible product. + +Some new features include + +- Inner Joins +- Functions with unnamed parameters +- PostgreSQL 14 compatibility + +From tomorrow, every Supabase project will be on PostgREST 9 (including existing projects). + +Read about some of the new features in PostgREST 9 [here](/blog/2021/11/28/postgrest-9). + +## New community partner: GitGuardian + +![gitguardian-supabase-partnership.jpeg](/images/blog/launch-week-three/community-day/gitguardian-supabase-partnership.jpeg) + +[As you (hopefully) know](/docs/learn/auth-deep-dive/auth-deep-dive-jwts#jwts-in-supabase), keeping your service role key secret is a crucial part of securing your database. But we also know that it can be difficult to make sure it stays secret as your team grows and you don't accidentally leak it. To help you with this, [we've partnered with GitGuardian](https://blog.gitguardian.com/the-detector-of-the-month-november-2021/). + +GitGuardian helps developers keep 250+ types of secrets out of source code. Their automated secrets detection and remediation solution secures every step of the development life cycle, helping you monitor your code for sensitive data. Read [their blog post](https://blog.gitguardian.com/the-detector-of-the-month-november-2021/) to learn more. + +## Auth updates + +![new-oauth-providers.jpg](/images/blog/launch-week-three/community-day/new-oauth-providers.jpg) + +The beauty of building in the open is that the community can get involved in adding new OAuth providers, which is exactly what [@TheHarryET](https://twitter.com/TheHarryET) and [MonsterDeveloper](https://github.com/MonsterDeveloper) have been doing. Thanks to them you can now provide sign-in with [Slack](/docs/guides/auth/auth-slack) as well as [Spotify](/docs/guides/auth/auth-spotify) to your users, as well as use [MessageBird](/docs/guides/auth/auth-messagebird) for phone auth as an alternative to the existing [Twilio](/docs/guides/auth/auth-twilio) integration. + +## SupaSquad updates + +The [SupaSquad](/docs/handbook/supasquad) is an official Supabase advocate program where community members help build and manage the Supabase community. + +Among many other awesome things, the SupaSquad has been absolutely on fire building [client libraries](/docs/reference/javascript/supabase-client) for all flavors of backends and environments. + +![client-libs.jpg](/images/blog/launch-week-three/community-day/client-libs.jpg) + +### Python client library updates + +- New maintainers [`@Dreinon`](https://github.com/dreinon), [`@anand2312`](https://github.com/anand2312), and [`@leynier`](https://github.com/leynier). 💚 +- `gotrue-py` rewritten and now at feature parity with `gotrue-js`. +- `postgrest-py` now support synchronous operations as well instead of just asynchronous operations in the past. Also at feature parity with `postgrest-js`. +- `supabase-py` is now `supabase` (e.g. you do `pip3 install supabase` instead of `pip3 install supabase-py`). +- Storage is working for the Python client library but it's yet to be extracted out as a standalone lib. + +## New tutorials and integration guides + +Our own [Jon Meyers](https://twitter.com/_dijonmusters) and the broader community have been busy creating awesome tutorials and integration guides to help everyone build even more amazing things with Supabase: + +- Jon has added official guides for working with [Auth0](/docs/guides/integrations/auth0) and [Vercel](/docs/guides/integrations/vercel), +- [Jonny Summers-Muir](https://twitter.com/JSummersMuir) has been busy paving the way for [Prisma](/docs/guides/integrations/prisma), and +- [Aman Mittal](https://github.com/amandeepmittal) has hooked us up with a guide for [Draftbit](/docs/guides/integrations/draftbit)! + +And below are some of the community one's we've come across recently. If you've created one yourself, please notify us by tagging us in a Tweet! + +- [Supabase & Sveltekit - Build Twitter in 75 minutes](https://youtu.be/mPQyckogDYc) +- [Supabase Auth With Next.Js 12 Middleware](https://jitsu.com/blog/supabase-nextjs-middleware#what-were-going-to-build) +- [Vue 3 & Supabase | Workout Tracker App](https://www.youtube.com/watch?v=3tF0fGkd4ho) +- [Use Supabase Auth with Vue.js 3](https://vueschool.io/articles/vuejs-tutorials/use-supabase-auth-with-vue-js-3/) +- [Dynamic Jamstack with Stencil and Supabase](https://ionicframework.com/blog/dynamic-jamstack-with-stencil-and-supabase) + +## Developer stories + +Anytime we scroll through [madewithsupabase.com](https://www.madewithsupabase.com/) we're absolutely blown away by the awesome things y'all are building with Supabase. + +So we reached out to some of our users, requesting a short video to learn more and we were overwhelmed with your gracious submissions. We've started a user stories playlist and we are so excited to see many more of these stories in the future. 💚 + + + +And with that, we officially declare Launch Week as open 🥳 Check back [here](/blog) every day this week to see what new things we are shipping. We can't wait to share them with you 🚀 + +## Want even more Supabase in your life? + +![tiktok.png](/images/blog/launch-week-three/community-day/tiktok.png) + +We've got some stellar swag drops and behind the scenes footage for you on our new [TikTok page](https://www.tiktok.com/@supabase.com). Make sure to follow us there as we'll be giving away some swag randomly to 10 peeps who follow us during launch week! diff --git a/www/_blog/2021-11-30-supabase-studio.mdx b/www/_blog/2021-11-30-supabase-studio.mdx new file mode 100644 index 00000000000..0156764d1e5 --- /dev/null +++ b/www/_blog/2021-11-30-supabase-studio.mdx @@ -0,0 +1,111 @@ +--- +title: "Supabase Studio" +description: "The same Dashboard that you're using on our Platform is now available for local development and Self-Hosting." +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: launch-week-three/studio/open-source-studio-og.png +thumb: launch-week-three/studio/open-source-studio-thumb.png +tags: + - launch-week + - frontend + - studio +date: '2021-11-30' +toc_depth: 2 +--- + +Today we're releasing [Supabase Studio](https://github.com/supabase/supabase/tree/master/studio). +The same Dashboard that you're using on our Platform is now available for [Local Development](https://supabase.com/docs/guides/local-development) +and [Self-Hosting](https://supabase.com/docs/guides/hosting/overview). + +## Background + +Let's get the obvious question out of the way - why wasn't it already open source? + +When Ant and I started Supabase the codebase was one large monorepo which contained everything from the dashboard to cloud infrastructure code to experimental code. +This is our preferred development setup - we like to keep all code in one place so that we have a single source of truth and tightly coupled CI workflows. + +The original Dashboard really wasn't much except a couple of buttons which allowed our Alpha users to start and stop a Supabase project - back then only a PostgreSQL connection string. + +Then time went on, and we started gaining traction - a lot faster than expected. +The nice thing about building for developers is that they are very vocal about the features they want to see next. +And so we kept shipping - a SQL editor, a Table view, User management, auto-generated Docs, and everything else you can find on the Dashboard today. + +We've been planning to make the Dashboard public for a long time now, starting with [Supabase UI](http://ui.supabase.com/), +[`supabase/grid`](https://github.com/supabase/grid), and a standalone [PR](https://github.com/supabase/supabase/pull/2281) for Supabase Studio. +But as feature requests kept rolling in it became a Sisyphean task to maintain separate code bases. + +After the last Launch Week, we decided to prioritize the Studio. + +## Approaches for managing shared codebases + +We investigated a few different approaches used in the open source world. There are three popular strategies that we found amongst OSS projects and some of our YC alum: + +- Maintain separate code bases. Pluck changes from one to another. +- Keep two repos in sync using some mixture of git submodules or a tool like [copycat](https://github.com/atomix/copycat) +- Use the same codebase, abstracting platform-specific code behind an API and feature flags. + +Our frontend [team](https://github.com/orgs/supabase/teams/frontend/members) experimented with the first two approaches where they plucked (injected, merged, and wrangled) code for our Platform. +Time-to-production become a lot slower, an unacceptable outcome at Supabase. + +Eventually we decided to open source all the frontend code, a shared codebase for both the Platform and Self Hosting. + +
+ +Special shout out + +Sentry do a fantastic job of documenting their strategy for managing a shared codebase and served as a great model for Supabase. +
+ + +## Build in public + +For the past week, the dashboard you've been using on the Platform has been deployed from our [main repository](https://github.com/supabase/supabase/tree/master/studio). + +This fits one of our core philosophies at Supabase: do less. Less code to manage means less bugs. Fewer codebases means faster shipping. + +![Open Source Table Editor](/images/blog/launch-week-three/studio/open-source-studio-table-editor.png) + +It also fits the development philosophy of every other part of Supabase: building in public, "warts and all". + +This is a huge step forward for the community. Supabase users can now spot a bug, fix it in the open source repository, +and have it shipped to both the Platform and Self-Hosted environments - all in a few hours. + +## Technical details + +Let's jump into some of the technical implementation for Supabase Studio. + +### Tech stack + +Studio is a Javascript application with a few key pieces of technology: + +- [Next.js](https://nextjs.org/) - A frontend Javascript framework built with React. +- [Tailwind](https://tailwindcss.com/) - A utility-first CSS framework. +- [Supabase UI](https://ui.supabase.com/) - Our own component library. +- [MobX](https://www.mobxjs.com/) - A state management library. +- A host of other [useful libraries](https://github.com/supabase/supabase/blob/master/studio/package.json), including [Radix UI](https://www.radix-ui.com), [Lottiefiles](https://lottiefiles.com/), [react-grid-layout](https://github.com/react-grid-layout/react-grid-layout), and [zxcvbn](https://github.com/dropbox/zxcvbn). + +### What's included + +Studio is designed to work with existing deployments - either the local hosted, docker setup, or our CLI. +It is not intended for managing the deployment and administration of projects - that's out of scope. + +The features exposed on Studio for existing deployments are limited to those which manage your database: + +- Table & SQL editors. (Saved queries are unavailable for now) +- Database management: Policies, roles, extensions, replication. +- API documentation. + +Over time we'll expose a lot more of the codebase in the self-hosted Dashboard, this was as much as we could do for this Launch Week! + +## How to contribute? + +Check out the full instructions in our [Studio Readme](https://github.com/supabase/supabase/tree/master/studio). + +### We are live and launched on Product Hunt + +Our new open source Studio is also on Product Hunt right now. If you like what you see, please give it an upvote and a review. + +[![Open Source Table Editor](https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=321226&theme=light)](https://www.producthunt.com/posts/open-source-postgresql-studio?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-open-source-postgresql-studio) + diff --git a/www/_blog/2021-12-01-realtime-row-level-security-in-postgresql.mdx b/www/_blog/2021-12-01-realtime-row-level-security-in-postgresql.mdx new file mode 100644 index 00000000000..23a9549d971 --- /dev/null +++ b/www/_blog/2021-12-01-realtime-row-level-security-in-postgresql.mdx @@ -0,0 +1,186 @@ +--- +title: "Realtime Postgres RLS now available on Supabase" +description: "Realtime database changes are now broadcast to authenticated users, respecting the same PostgreSQL policies that you use for Row Level Security." +author: oli_rice +author_url: https://github.com/olirice +author_image_url: https://github.com/olirice.png +authorURL: https://github.com/olirice +image: launch-week-three/realtime-row-level-security-in-postgresql/realtime-row-level-security-in-postgresql-og.png +thumb: launch-week-three/realtime-row-level-security-in-postgresql/realtime-row-level-security-in-postgresql-thumb.png +tags: + - launch-week + - realtime + - security +date: '2021-12-01' +toc_depth: 3 +--- + +Realtime is a server that listens to changes in your PostgreSQL database and broadcasts the changes to clients through a websocket connection. + +Today, we're announcing security improvements to Realtime, where database changes will be broadcast to authenticated users, respecting the same PostgreSQL policies that you use for Row Level Security. + +## Demo + + + + +## Overview + +Since the first commit of Realtime server back in [September 2019](https://github.com/supabase/realtime/commit/175f649784147af80acfc9ff5be9d160285c76ea), +we've worked hard to improve its usability and scalability. + +Until now, Realtime did not adhere to RLS policies and instead broadcast all database changes to all clients. +The unsafe nature of this behavior is the reason why Realtime has been an opt-in feature, and a key reason why we are still in Beta. + +As more developers rely on Realtime to receive and send database changes in their apps and services, +security has become a primary concern for us and others in the community who wish to build secure systems with Realtime. + +Supabase projects have supported Row Level Security (RLS) for API authorization since our [Auth launch](https://supabase.io/blog/2020/08/05/supabase-auth). +In that time, it has quickly become the recommended way to implement authorization. + +As we were evaluating possible solutions to improve Realtime security, we looked to our Auth implementation as inspiration for a cohesive security system. + +Today, we're updating Realtime to respect PostgreSQL RLS policies, so you can define your security rules once and have them automatically apply everywhere! + +Before diving deeper into our Realtime RLS implementation, let's briefly cover how RLS works in PostgreSQL. + +## Row Level Security Primer + +When you need to control access to individual rows of data, PostgreSQL has you covered with [Row Level Security (RLS) policies](https://www.postgresql.org/docs/current/ddl-rowsecurity.html). +An RLS policy is a snippet of SQL filtering which users have the authority to create/read/update/delete rows in a table. + +For example, the following policy would allow users to select their own rows in a todos table: + +```sql hideCopy +create policy todo_select_policy + on todos for select + using ( auth.uid() = user_id ); +``` + +which is equivalent to adding + +```sql hideCopy +select * +from todos +where auth.uid() = todos.user_id; -- Policy is implicitly added. +``` + +to queries. + +Check out the [Row Level Security guide](https://supabase.com/docs/guides/auth/row-level-security) for more info on how to use RLS with your project. + +## Realtime Design + +Our Realtime server receives and decodes binary changes from PostgreSQL logical replication, converts those changes to JSON, and broadcasts them to all connected clients. + +### Challenge for RLS + +The challenge, when applying row level security to the replication stream is that the visibility of a row may be different for each user subscribed to a database table. + +We recognized that to fully secure Realtime in accordance with row level security, a row's visibility must be checked separately for each user on every change. +However, this quickly becomes a performance bottleneck when the number of changes, or number of subscribers, is large. + +Since we can't control the number of subscribers or the number of changed records, we instead focused on making the security check for each user on every change as fast as possible. + +### Implementation Overview + +With these challenges in mind, we upstreamed the security responsibility to the database. Write Ahead Log Realtime Unified Security (WALRUS) exposes a PostgreSQL +function that Realtime server invokes with database changes. + +### WALRUS Implementation + +[WALRUS](https://github.com/supabase/walrus) inspects each record in the replication change to: + +- Identify the source table (e.g. `public.notes`). +- Identify the change's action (INSERT/UPDATE/DELETE/TRUNCATE*). +- Query the `subscription` table to determine the connected users who are actively subscribed to the source table. The `subscription` table is kept up to date by the Realtime server and tracks all connected users and the tables they are currently subscribed to. +- For each subscriber: + - Assume the identity of the subscriber. + - Query the source table to see if the record is visible to that subscriber. +- Report the list of subscribers who are authorized to view the record back to Realtime server. + +*Realtime server does not broadcast TRUNCATE changes + +**Efficiently Query to Check Access** + +To maximize throughput, the query used to evaluate if a row is visible to a subscriber always queries using the tables primary key. + +For example: + +```sql hideCopy +select exists(select 1 from some_table where id = 806); +``` + +When more than one subscriber exists, the query is wrapped in a [prepared statement](https://www.postgresql.org/docs/13/sql-prepare.html) to remove the cost of the PostgreSQL +query planner on subsequent calls. The query planner time is frequently 2-3x execution time for simple queries, so this immediately multiplies throughput in the most common cases! + +```sql hideCopy +"Planning Time: 0.099 ms" +"Execution Time: 0.051 ms" +``` + +**Colocation** + +Colocating the security engine with subscriber data inside PostgreSQL allows us to avoid significant overhead when applying RLS policies. +Namely, network round-trip latency and I/O bottlenecks are removed while connection overhead is reduced relative to testing each record's visibility by polling the database from a separate process. +Instead, the SQL function only consumes a single connection and performs no network I/O. + +### Performance + +The throughput performance of the database server is best measured in terms of record processing time. As the number of subscribers to a table grows, the time required to process each record, +and the resultant processing time also grows. + +![supabase-realtime-processing-per-subscription](/images/blog/launch-week-three/realtime-row-level-security-in-postgresql/supabase-realtime-processing-per-subscription.png) + +
+ +| Subscribers | 1 | 5 | 10 | 25 | 50 | 100 | 250 | 500 | 1,000 | 2,000 | 5,000 | 10,000 | +|------------------------|------|------|------|------|------|------|------|------|-------|-------|-------|--------| +| Processing Time (ms) | 11.2 | 12.5 | 14.2 | 16.7 | 18.8 | 24.5 | 27.8 | 29.1 | 64.7 | 75.5 | 158.4 | 303.8 | + +
+ +## Best Practices for Performance + +To get the most out of Realtime row level security, follow these guidelines: + +### Disable for public tables + +If your data is insensitive or publicly available, such as stock prices listed under NASDAQ, then don't enable row level security! + +The fastest security policy is one that doesn't exist :) + +### Optimize your policies + +If you do need row level security, make sure that your policies are fast. + +Remember that your policy is executed *each* time a query touches the table that the policy is applied to. If your policy is slow, all access to that table will be slow. +Avoid joins within RLS policies when you can, and make sure all filter conditions use an index. + +Additionally, keep in mind that if you use joins within an RLS policy, any RLS policies on the tables you're joining to will also be executed in turn, adding to the overall overhead. + +### Small primary keys + +Keep your primary keys small and efficient. + +Use single column primary keys with a fixed field size (integer, uuid, etc.) over text or multi-column indexes. + +## Next Steps + +Realtime RLS is available today on all existing and new Supabase projects. To get started, upgrade your Supabase JavaScript client to version v1.23.0 +and launch your new PostgreSQL database today: [database.new](https://database.new) + +## Credits + +Authored by: + +- [Oliver Rice](https://github.com/olirice) +- [Wen Bo Xie](https://github.com/w3b6x9) \ No newline at end of file diff --git a/www/_blog/2021-12-02-supabase-acquires-logflare.mdx b/www/_blog/2021-12-02-supabase-acquires-logflare.mdx new file mode 100644 index 00000000000..ed9f3d87044 --- /dev/null +++ b/www/_blog/2021-12-02-supabase-acquires-logflare.mdx @@ -0,0 +1,129 @@ +--- +title: 'Supabase acquires Logflare' +description: "Today, we're ecstatic to announce that Logflare is joining Supabase." +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: launch-week-three/supabase-acquires-logflare/supabase-acquires-logflare-og.png +thumb: launch-week-three/supabase-acquires-logflare/supabase-acquires-logflare-thumb.png +tags: + - launch-week + - logging +date: '2021-12-02' +toc_depth: 3 +--- + +Back in May 2020, we [tweeted about](https://twitter.com/supabase/status/1265922290237071361?lang=bg) one of the most impressive products we had ever used: Logflare, a log ingestion platform. + +
+
+

+ Really impressed with{' '} + @logflare_logs. We've + been on the front page of{' '} + + #hackernews + {' '} + for 24 hours anticipating the HN hug of death. Looks like we made it through OK and Logflare + has been ingesting everything without breaking a sweat{' '} + https://t.co/RWKHIgmWh6{' '} + pic.twitter.com/dQ2xqFTdco +

+ — Supabase (@supabase) May 28, 2020 +
+
+ +Today, we're ecstatic to announce that Logflare is joining Supabase. + +## Why logging? + +A log platform might seem like a strange acquisition for Supabase - after all, there are no "Firebase Logs". + +Logging is one of the most unappreciated parts of a tech stack, often an after-thought. But when leveraged correctly, logs give developers superpowers. + +### Debugging + +Logs are an integral part of the developer workflow. When you're programming in Javascript, or Rust, or Go, how often do you rely on the console output to inspect and fix errors? Database debuggers have a lot to learn from programmer tooling. + +We want to provide the best database developer experience in the world, and so we're making debugging a first-class citizen. + +### Observability + +Databases can be a black box when it comes to spotting errors, finding slow queries, and testing performance optimizations. + +The full Supabase stack is more than just a database. It includes various tools working together - APIs, Storage, Auth, and CDNs. A broad tech stack needs a unified measurement system to give a birds-eye view of everything happening within your Supabase project. + +This is especially true for our enterprise customers, who need to know that their servers are not just operating, but optimized with alerting the instant anything goes wrong. + +### Analytics + +While it's not immediately apparent, logs are analytics! Especially when a developer can correlate log entries, and enrich them with database data. + +Imagine tracing one of your user's network requests from the browser to a database query. Perhaps you'd like to know which of your users are making the most API requests, or downloading the most files, or spending the most time connected to the application? + +With granular logs, this becomes possible and paves the way for an incredible developer experience: managing your API versioning, predicting growth, and managing billing costs. + +## Why Logflare? + +Since that first tweet in May 2020, our platform has generated billions of log entries. During that time, Logflare has been a staple product in our day-to-day operations. There are a few reasons why Logflare is such a great match for Supabase. + +- Chase! The founder of Logflare, [Chase](https://twitter.com/chasers), is an accomplished founder, incredibly product-focused, and an all-around mensch. With over 10 years of experience in data aggregation, Chase is the type of talented person that every team dreams of working with. +- Elixir. Logflare is built with Elixir, the same as our Realtime Engine. We love Elixir at Supabase, and it's nice to have it power another key part of the Supabase stack. +- Real-time. Logflare isn't just for querying logs, it displays what's happening in realtime, allowing you to debug your systems live. +- Branding. Who doesn't love the vivid green with dark mode? 😎 + +![supabase-realtime-processing-per-subscription](/images/blog/launch-week-three/supabase-acquires-logflare/logflare-screenshot.png) + +## Why is Logflare joining Supabase? + + +

+ I really like how Supabase is taking an existing, proven, piece of technology and making it more + accessible for more users. A lot of people already use Postgres, but they don't take advantage + of powerful features built into the database. Supabase is exposing these features more + prominently, making them more accessible to more developers with technology, and educating + people on how to leverage these features for a better experience for end users. +

+

+ With Logflare, we've been trying to do this exact thing for analytics oriented databases. We've + started with BigQuery. Logflare makes it easier to stream inserts with by automatically adapting + the underlying schema for you. We make it easier to inspect and query your stream. And with + Logflare Endpoints we're starting to make it easier to operationalize analytics by allowing + people to build APIs from SQL statements. With Endpoints developers can enhance user facing + applications without setting up traditionally tedious and brittle data pipelines. We've started + with BigQuery but will soon be supporting other backends optimized for various analytics use + cases. +

+ + +## Supabase + Logs + +We still have a lot of technical work to integrate Logflare into Supabase, with plans of fully supporting the existing Vercel and Cloudflare integrations. + +In just the past 10 days, we've been working on a few of the new Dashboard features, which you'll be able to see very soon. + +Over the next few weeks, we plan to release these features (once we have a chance to polish them up), and you'll be able to query your logs with your favorite language - SQL 😀. + + + + +## Open source + +Right now, Logflare works natively with Big Query. But as our track record has proven, we're 100% committed to open source. We're working on the future of a fully open-source version of Logflare, with support for various storage engines. + +## Next steps + +If you're an existing Logflare user, we'll be migrating everything to Supabase in the coming months. We'll work closely with you to ensure that the transition is seamless, and introduce the same [pricing levels](https://logflare.app/pricing) that Logflare offers today. + +We've worked with Chase on a list of potential questions you might have about the transition. If you have any concerns or questions, you can reach out to support@supabase.io. + + diff --git a/www/_blog/2021-12-03-launch-week-three-friday-five-more-things.mdx b/www/_blog/2021-12-03-launch-week-three-friday-five-more-things.mdx new file mode 100644 index 00000000000..3df2ccbfa70 --- /dev/null +++ b/www/_blog/2021-12-03-launch-week-three-friday-five-more-things.mdx @@ -0,0 +1,104 @@ +--- +title: 'Five more things' +description: It's never just one more thing! +author: ant_wilson +author_url: https://github.com/awalias +author_image_url: https://github.com/awalias.png +authorURL: https://github.com/awalias +image: launch-week-three/five-more-things/five-more-things-og.png +thumb: launch-week-three/five-more-things/five-more-things-thumb.png +tags: + - launch-week + - graphql + - CDN + - functions +date: '2021-12-03' +toc_depth: 3 +--- + +## Open source GraphQL PostgreSQL Extension + +Today we're open sourcing [pg_graphql](https://github.com/supabase/pg_graphql), a work-in-progress native PostgreSQL extension adding GraphQL support. The extension keeps schema generation, query parsing, and resolvers all neatly contained on your database server requiring no external services. + +`pg_graphql` inspects an existing PostgreSQL schema and reflects a GraphQL schema with resolvers that are: + +- performant +- always up-to-date +- compliant with best practices +- serverless +- open source + +Interested? Read more about the technical implementation here. + +![graphQL.png](/images/blog/launch-week-three/five-more-things/graphQL.png) + +## Supabase CDN + +Today we are launching Supabase CDN for all projects. All requests are routed through global network of more than 250 cities. + +Assets stored in Supabase Storage benefit the most from this feature since they have a default cache time of 1 hour. They load an order of magnitude faster, usually in just tens of ms! After the initial request, the asset will be cached at the edge and doesn't hit your Supabase server. This frees up more resources in your project to handle other requests. + +Our Postgrest, Gotrue and Realtime APIs are also faster since SSL is terminated at the edge. This is a brief overview of some of our other performance enhancements we have enabled under the hood. + +### TLS 1.3 + +Usually, negotiating a new SSL connection requires at least 3 round trips between the client and the server. This leads to a degraded experience for users with high latencies. TLS1.3 reduces the number of roundtrips to negotiate an SSL connection from 3 to 2. It also supports Zero Round Trip Time (0-RTT) session resumption. This lets repeat users to resume a connection without any additional roundtrips! + +### HTTP/3 + +HTTP/3 or HTTP over QUIC is the successor to HTTP/2. This protocol is based on UDP instead of TCP. HTTP/3 is faster than HTTP/2 (conditions apply), is more secure, future proof. + +### Brotli + +Brotli is a new compression algorithm that performs better than gzip. All text based responses from Supabase (including the massive amount of Javascript required to render websites these days) are compressed with Brotli. + +We can also ensure a higher degree of reliability of your Supabase APIs with a CDN by defending against Denial of Service Attacks and bots. + +![too_damn_high.png](/images/blog/launch-week-three/five-more-things/too_damn_high.png) + +## (Yet another) Supabase Functions update + +It's been four months since our [last Functions update](https://supabase.com/blog/2021/07/30/supabase-functions-updates) and (as it's becoming a tradition at the end of Launch Week) we have another update for you. + +Unfortunately we're still not in a position to release anything. There are a few reasons for this - mainly it's because we've been hyper focused on a couple major milestones: + +Since our last Functions update we've [raised our Series A,](https://supabase.com/blog/2021/10/28/supabase-series-a) [acquired a company](https://supabase.com/blog/2021/12/02/supabase-acquires-logflare), built [Realtime Row Level Security](https://supabase.com/blog/2021/12/01/realtime-row-level-security-in-postgresql), [open sourced the dashboard](https://supabase.com/blog/2021/11/30/supabase-studio), built a GraphQL extension for PostgreSQL, and added four Auth providers, all while growing the community, supporting open-source tools, and delivering a few other things that the community felt was important. + +That being said, we *have* been working on Functions, iterating through different designs to figure out what's going to have the biggest impact for Supabase developers. So today we are going to open up our ideas and designs through our [RFC repo](https://github.com/supabase/rfcs) (request for comments). + +There are two important RFCs related to functions: + +- [[RFC: 0004]: Functions](https://github.com/supabase/rfcs/blob/rfc/functions/rfc/0004-functions.md) - Outlines various options for implementing Supabase Functions. +- [[RFC: 0005]: Functions with containers](https://github.com/supabase/rfcs/pull/5) - Outlines our design of Functions with containers, the implementation that we are heavily leaning towards. + +![functions.png](/images/blog/launch-week-three/five-more-things/functions.png) + +## Free Supabase egghead.io course + +![build-a-saas-product-with-next-js-supabase-and-stripe.png](/images/blog/launch-week-three/five-more-things/build-a-saas-product-with-next-js-supabase-and-stripe.png) + +We've partnered with the fine folks at [egghead.io](http://egghead.io) to bring you a free, in-depth course where you'll learn how to ["Build a SaaS product with Next.js, Supabase and Stripe"](https://egghead.io/courses/build-a-saas-product-with-next-js-supabase-and-stripe-61f2bc20). + +You will learn how to build a subscription-based billing project from scratch, and by the end of the course, have something deployed to production that can make you very real money! + +[Check it out](https://egghead.io/courses/build-a-saas-product-with-next-js-supabase-and-stripe-61f2bc20) entirely free on egghead, and build something that can generate some income, while you enjoy your holidays! + +![SaaS meme](/images/blog/launch-week-three/five-more-things/saas-meme.png) + +## Kicking off the Holiday Hackdays + +![holiday-hackdays-og.png](/images/blog/launch-week-three/five-more-things/holiday-hackdays-og.png) + +While not everyone will be celebrating the holidays this December, we can all be united in celebrating open-source software, and to do so we're kicking off the "Holiday Hackdays" (loosely inspired by the [12 Pubs of Christmas](https://www.irelandbeforeyoudie.com/12-pubs-of-christmas-rules-tips-everything-you-need-for-a-great-night/) only a bit healthier). + +Starting today at 7am PT we'll be hacking together for the next 10 days until 23:59pm PT on Sunday December 12th. And because we've launched [row-level security for our Realtime API](https://supabase.com/blog/2021/12/01/realtime-row-level-security-in-postgresql) earlier this week, we'd love for you to use it in your Hackathon project. May it be to build a [Santa Tracker](https://www.freecodecamp.org/news/create-your-own-santa-tracker-with-gatsby-and-react-leaflet/) or that secure family chat app to bring all your relatives together for the festive season, be creative and most importantly have fun 🥳 + +[As always](https://supabase.com/blog/2021/10/14/hacktoberfest-hackathon-winners-2021#the-prizes), we'll have some extremely limited edition swag to give away that can only be won by participating in the Hackathon! + +The Supabase team will be participating as well, for example [Jon](https://twitter.com/_dijonmusters) and Thor, inspired by [Egghead's "Holiday Course Release Extravaganza"](https://egghead.io/20-days), will be building an Advent Calendar for all the [awesome community content](https://supabase.com/blog/2021/11/29/community-day#new-tutorials-and-integration-guides) you've been creating. Get ready for a cool open-source project which will be using a lot of the hottest Supabase features! To make sure you don't miss this one, follow us on [Twitter](https://twitter.com/supabase) and subscribe to our [YouTube channel](https://www.youtube.com/supabase). We'll see you there. + +Find the full hackathon details and rules in the [blog post](https://supabase.com/blog/2021/12/03/supabase-holiday-hackdays-hackathon). + +That's it, that's another Launch Week wrapped. See you at the next one, or in the meantime on Discord, and until then, happy hacking! + +![devs.png](/images/blog/launch-week-three/five-more-things/devs.png) \ No newline at end of file diff --git a/www/_blog/2021-12-03-pg-graphql.mdx b/www/_blog/2021-12-03-pg-graphql.mdx new file mode 100644 index 00000000000..54352d67423 --- /dev/null +++ b/www/_blog/2021-12-03-pg-graphql.mdx @@ -0,0 +1,199 @@ +--- +title: 'pg_graphql: A GraphQL extension for PostgreSQL' +description: GraphQL support is in development for PostgreSQL + Supabase. +author: oli_rice +author_url: https://github.com/olirice +author_image_url: https://github.com/olirice.png +authorURL: https://github.com/olirice +image: launch-week-three/five-more-things/supabase-pg-graphql-og.png +thumb: launch-week-three/five-more-things/supabase-pg-graphql-thumb.png +tags: + - launch-week + - community + - graphql +date: '2021-12-03' +toc_depth: 3 +--- + +Today we're open sourcing [`pg_graphql`](https://github.com/supabase/pg_graphql), a work-in-progress native PostgreSQL extension adding GraphQL support. The extension keeps schema generation, query parsing, and resolvers all neatly contained on your database server requiring no external services. + +`pg_graphql` inspects an existing PostgreSQL schema and reflects a GraphQL schema with resolvers that are: + +- performant +- always up-to-date +- compliant with best practices +- serverless +- open source + +Interested? You're [3 commands away](https://supabase.github.io/pg_graphql/quickstart/) from a live [GraphiQL](https://graphql-dotnet.github.io/docs/getting-started/graphiql/) demo. + + +## Motivation + +The Supabase stack is centered around PostgreSQL as the single source of truth. All data, configuration, and security are housed in the database so any GraphQL solution needed to be equivalently SQL-centric. + +With that in mind, we took a look at the landscape and considered two excellent technologies, [Graphile](https://www.graphile.org/postgraphile/), and [Hasura](https://hasura.io/). + +| Requirements | Graphile | Hasura | +|--------------------------|----------|--------| +| Open Source | ✅ | ✅ | +| Reflected GraphQL Schema | ✅ | ✅ | +| Reflected Resolvers | ✅ | ✅ | +| Always up-to-date | ✅ | ✅ | +| Performant | ✅ | ✅ | + +We found both options to be largely viable for the core feature set. + +Which left us with one final hang-up: we host free-tier projects on VMs with 1 GB of memory. After tallying the resources reserved for PostgreSQL, PostgREST, Kong, GoTrue, and a handful of smaller services, we were left with a total memory budget of ... 0 MB 😬. Unsurprisingly, our pathological memory target disqualified any option that required launching another process in those VMs. + +For that reason, we decided to invest in a lightweight alternative that runs in the database, and can be exposed over HTTP using the existing [PostgREST](https://supabase.com/docs/guides/api) deployments' [RPC functionality.](https://postgrest.org/en/v8.0/api.html#stored-procedures) + +By our most conservative estimate, that reduces the platform's memory requirements by 525 TB/hours every month, saving 💰 and 🌳. + +## Design + +As a native PostgreSQL extension, `pg_graphl` is written in a combination of C and SQL. Each GraphQL query is parsed, validated, and transpiled to SQL, all within the database. + +Each GraphQL request is resolved by a single SQL statement. That SQL statement aggregates requested data as a JSON document to return to the caller. This approach results in blazing fast response times, avoids the [N+1 query problem](https://medium.com/the-marcy-lab-school/what-is-the-n-1-problem-in-graphql-dd4921cb3c1a), and hits the theoretical minimum achievable network IO overhead of any GraphQL to SQL resolver. No special permissions are required for the PostgreSQL role executing queries, so `pg_graphql` is fully compatible with your existing [row level security policies](/docs/guides/auth/row-level-security). + +Embedding the GraphQL server directly in the database allows us to leverage PostgreSQL's built-in solutions for common challenges: + +Caching → `PREPARE STATEMENT` + +Errors → `RAISE EXCEPTION` + +Bad Data → `ROLLBACK` + +Authorization → `CREATE POLICY` + +Similarly, `pg_graphql` benefits from PostgreSQL's strong [ACID](https://database.guide/what-is-acid-in-databases/) guarantees and can expose them through its API. + +Ever wanted to execute multiple operations in a single transaction? Each request is managed in a single transaction so with a multi-operation GraphQL request and `pg_graphql`, that behavior falls out for free! + +### Schema Reflection + +As a limited example of how the reflection engine works, here's how it converts a single table into a full GraphQL schema. + +```sql hideCopy +# schema.sql +create table account( + id serial primary key, + email varchar(255) not null, + created_at timestamp not null, + updated_at timestamp not null +); +``` + +Translates into + +```graphql hideCopy +# schema.graphql +scalar Cursor +scalar DateTime +scalar JSON +scalar UUID +scalar BigInt + +type PageInfo { + hasNextPage: Boolean! + hasPreviousPage: Boolean! + startCursor: String! + endCursor: String! +} + +type Query { + account(nodeId: ID!): Account + allAccounts( + after: Cursor, + before: Cursor, + first: Int, + last: Int + ): AccountConnection +} + +type Account { + nodeId: ID! + id: String! + email: String! + createdAt: DateTime! + updatedAt: DateTime! +} + +type AccountEdge { + cursor: String! + node: Account +} + +type AccountConnection { + totalCount: Int! + pageInfo: PageInfo! + edges: [AccountEdge] +} +``` + +Where `Query` type's `account` field selects a single account by its globally unique `ID` and `allAccounts` enables pagination via the [relay connections specification](https://relay.dev/graphql/connections.htm). Under the SQL hood, iterating through pages is handled using keyset pagination giving consistent retrieval times on every page. + +For a more complete examples with relationships, enums, and more exotic types check out the [reflection doc](https://supabase.github.io/pg_graphql/reflection). + +### API + +`pg_graphql`'s public API is a single SQL function that returns JSON. + +```sql hideCopy +gql.resolve( + stmt text, -- the graphql query/mutation + variables jsonb default '{}'::jsonb, -- key value pairs +) + returns jsonb +``` + +For example, a GraphQL query selecting the `id` field for a collection of type `Book` would look like this: + +```sql hideCopy +gqldb= select gql.resolve($$ + +query { + allBooks { + edges { + node { + id + } + } + } +} + +$$); + + resolve +---------------------------------------------------------------------- +{"data": {"allBooks": {"edges": [{"node": {"id": 1}}]}}, "errors": []} +``` + +We're opting to expose the function over HTTP through PostgREST but you could also connect to the PostgreSQL database and call the function directly from your server code in any programming language. + +## Performance + +When it comes to APIs, performance counts. Here are some figures from [Apache Bench](https://www.tutorialspoint.com/apache_bench/apache_bench_quick_guide.htm) showing 2,205 requests/second on a 4 core machine with 16 GB of memory. + +```markdown hideCopy +Concurrency Level: 8 +Time taken for tests: 3.628 seconds +Complete requests: 8000 +Failed requests: 0 +Total transferred: 1768000 bytes +Total body sent: 1928000 +HTML transferred: 368000 bytes +Requests per second: 2205.21 [#/sec] (mean) +Time per request: 3.628 [ms] (mean) +Time per request: 0.453 [ms] (mean, across all concurrent requests) +Transfer rate: 475.93 [Kbytes/sec] received +``` + +Full steps to reproduce this output are available in [the docs](https://supabase.github.io/pg_graphql). + +## Open Source + +`pg_graphql` is [open source software](https://github.com/supabase/pg_graphql/). As always, Issues and PRs are welcome. + + +[Try `pg_graphql`](https://supabase.github.io/pg_graphql/quickstart/) today to see a live [GraphiQL](https://graphql-dotnet.github.io/docs/getting-started/graphiql/) demo. diff --git a/www/_blog/2021-12-03-supabase-holiday-hackdays-hackathon.mdx b/www/_blog/2021-12-03-supabase-holiday-hackdays-hackathon.mdx new file mode 100644 index 00000000000..fb8990ba27b --- /dev/null +++ b/www/_blog/2021-12-03-supabase-holiday-hackdays-hackathon.mdx @@ -0,0 +1,135 @@ +--- +title: 'Kicking off the Holiday Hackdays' +description: Build cool stuff and celebrate open-source software with us during the Holiday Hackdays! +author: thor_schaeff +author_url: https://github.com/thorwebdev +author_image_url: https://github.com/thorwebdev.png +authorURL: https://github.com/thorwebdev +image: launch-week-three/holiday-hackdays-og.png +thumb: launch-week-three/holiday-hackdays-og.png +tags: + - hackathon + - community +date: '2021-12-03' +toc_depth: 3 +--- + +While not everyone will be celebrating the holidays this December, we can all be united in celebrating open-source software, and to do so we're kicking off the "Holiday Hackdays" (loosely inspired by the [12 Pubs of Christmas](https://www.irelandbeforeyoudie.com/12-pubs-of-christmas-rules-tips-everything-you-need-for-a-great-night/), only a bit healthier). + +Starting today at 7am PT we'll be hacking together for the next 10 days until 23:59pm PT on Sunday December 12th. And because we've launched [row-level security for our Realtime API](https://supabase.com/blog/2021/12/01/realtime-row-level-security-in-postgresql) earlier this week, we'd love for you to use it in your Hackathon project. May it be to build a [Santa Tracker](https://www.freecodecamp.org/news/create-your-own-santa-tracker-with-gatsby-and-react-leaflet/) or that secure family chat app to bring all your relatives together for the festive season, be creative and most importantly have fun 🥳 + +[As always](https://supabase.com/blog/2021/10/14/hacktoberfest-hackathon-winners-2021#the-prizes), we'll have some extremely limited edition swag to give away that can only be won by participating in the Hackathon! + +The Supabase team will be participating as well, for example [Jon](https://twitter.com/_dijonmusters) and I, inspired by [Egghead's "Holiday Course Release Extravaganza"](https://egghead.io/20-days), will be building an Advent Calendar for all the [awesome community content](https://supabase.com/blog/2021/11/29/community-day#new-tutorials-and-integration-guides) you've been creating. Get ready for a cool open-source project which will be using a lot of the hottest Supabase features! To make sure you don't miss this one, follow us on [Twitter](https://twitter.com/supabase) and subscribe to our [YouTube channel](https://www.youtube.com/supabase). We'll see you there. + +## Details + +### Timeline + +- **Friday Dec 3rd at 07:00am PT:** Last day of Launch Week. Join us on [Twitter Spaces](https://twitter.com/i/spaces/1eaKbNDPEOYKX?s=20) for the kickoff announcement. +- Build your project during the next 10 days and hang out with the community [on Discord](https://discord.gg/bnncdqgBSS). +- **Sunday Dec 12th at 11:59pm PT:** Submission deadline +- Judges Deliberate (Monday) +- We'll be contacting and announcing the winners [on Twitter](https://twitter.com/supabase) throughout the week after. + + + +### Prize categories + +There are multiple chances to win, there will be prizes for: + +- Most impressive usage of the Realtime API features +- Most fun / holiday themed project + +There will be a winner and a runner-up prize for each category. + +### Submission + +Submit your project via [madewithsupabase.com/holiday-hackdays](https://www.madewithsupabase.com/holiday-hackdays) + +You will be asked to send a link to a GitHub (or similar) repo, in the README you should include: + +- link to hosted demo (if applicable) +- list of team members github handles (and twitter if they have one) +- any demo videos, instructions, or memes +- a brief description of how you used Supabase: + - to store data? + - realtime? + - auth? + - storage? +- any other info you want the judges to know (motivations/ideas/process) +- _optional_ team photo + +### Judging & announcement of winners + +The Supabase team will excitedly review what you've built. They will be looking for a few things, including: + +- creativity/inventiveness +- functions correctly/smoothly +- visually pleasing +- technically impressive +- use of Supabase features + - deep usage of a single feature or + - broad usage are both ok +- FUN! 😃 + +We'll be contacting and announcing winners [on Twitter](https://twitter.com/supabase) throughout the week after submission closes. + + {' '} + +### Rules + +- Team size 1-5 (all team members on winning teams will receive a prize) +- You cannot be in multiple teams +- One submission per team +- All design elements, code, etc. for your project/feature must be created **during** the event +- All entries must be Open Source (link to source code required in entry) +- Must use Supabase in some capacity +- Can be any language or framework +- You must submit before the deadline (no late entries) +- You can continue to make updates to your project after the submission deadline, but there is no guarantee that the judges will see additions made after the submission time. + +### Community & help + +Hang out with the Supabase team and community on Discord: + +- Text channel: hackathon +- Audio channel: hackathon + +If you need help or advice when building, find other people to join your team, or if you just want to chill and watch people build, come and join us! + +Join our Discord: [discord.gg/bnncdqgBSS](https://discord.gg/bnncdqgBSS) + +![Discord Hangout](/images/blog/hackathon/community.png) + +### Resources & Guides + +Here's a collection of resources that will help you get started building with Supabase: + +- Need some inspiration? [See what folks built last time](/blog/2021/08/09/hackathon-winners)! +- [Examples and Resources](/docs/guides/examples) +- [Supabase Crash Course](https://www.youtube.com/watch?v=7uKQBl9uZ00) [video] +- [Flutter Quickstart Guide](/docs/guides/with-flutter) +- [Nextjs Quickstart Guide](/docs/guides/with-nextjs) +- [Using Supabase inside Replit](/blog/2021/03/11/using-supabase-replit) +- [Full Stack Development with Next.js and Supabase – The Complete Guide](https://www.freecodecamp.org/news/the-complete-guide-to-full-stack-development-with-supabas/) +- [Auth Deep Dive - Learn everything there is to know about Supabase Auth](/docs/learn/auth-deep-dive/auth-deep-dive-jwts) [videos] +- [Send SMS notifications using Twilio](https://www.twilio.com/blog/send-sms-notifications-supabase-users-node-js-twilio-messaging) +- [How to Integrate Supabase in Your Ionic App](https://www.youtube.com/watch?v=pl9XfIWutKE) [video] +- [Building a Slack clone with authentication and realtime data syncing using Supabase](https://www.youtube.com/watch?v=LUMxJ4w-MUU) [video] +- [Creating Protected Routes In NextJS With Supabase](https://aboutmonica.com/blog/creating-protected-routes-in-next-js-with-supabase) + +### Additional Info + +- Any intellectual property developed during the hackathon will belong to the team that developed it. We expect that each team will have an agreement between themselves regarding the IP, but this is not required +- By making a submission you grant Supabase permission to use screenshots, code-snippets and/or links to your project or content of your README on our twitter, blog, website, email updates, and in the Supabase discord server. Supabase does not make any claims over your IP. diff --git a/www/_blog/2021-12-15-beta-november-2021-launch-week-recap.mdx b/www/_blog/2021-12-15-beta-november-2021-launch-week-recap.mdx new file mode 100644 index 00000000000..61ffb6a548d --- /dev/null +++ b/www/_blog/2021-12-15-beta-november-2021-launch-week-recap.mdx @@ -0,0 +1,119 @@ +--- +title: 'Supabase Beta November 2021: Launch Week Recap' +description: We wrapped up November with Supabase's third Launch Week. Here's all the awesome stuff that got shipped ... +author: ant_wilson +author_url: https://github.com/awalias +author_image_url: https://github.com/awalias.png +authorURL: https://github.com/awalias +image: 2021-nov/release-nov-2021.jpg +thumb: 2021-nov/release-nov-2021-cover.jpg +tags: + - release-notes +date: '2021-12-15' +toc_depth: 3 +--- + +We wrapped up November with Supabase's third Launch Week. It also happens to be 12 months since we moved from alpha to beta. + +Here's all the awesome stuff that got shipped during Launch Week... + +## Supabase Studio + +We [open sourced the Dashboard](/blog/2021/11/30/supabase-studio) - it's now included in Self-Hosting, and the community are now able to contribute, +which is going to help us move even faster! Expect many more updates to the dashboard over the coming weeks and months! [Read the code for yourself.](https://github.com/supabase/supabase/tree/master/studio) + +![Supabase Studio](/images/blog/2021-nov/studio.jpg) + +## We acquired Logflare + +We were early Logflare users, and found it to be one of the most impressive products we'd ever used. So impressive in fact, that we wanted to offer it's capabilities to our entire user base. +You'll now find fully searchable Supabase API and database logs within the dashboard, and we're also in the process of open sourcing the codebase. [Read more about the acquisition](/blog/2021/12/02/supabase-acquires-logflare). + +![We acquired Logflare](/images/blog/2021-nov/logflare.png) + +## Realtime Row Level Security + +[Security rules now work for Realtime](/blog/2021/12/01/realtime-row-level-security-in-postgresql). +All of your row level security policies now work with the realtime API, so you can limit streams and subscriptions on a per user basis (or any configuration you want!). + + +![Realtime Row Level Security](/images/blog/2021-nov/realtime.png) + +## GraphQL is coming to Supabase + +We heard you! And built a Postgres extension for [querying your database with GraphQL](/blog/2021/12/03/pg-graphql). +This means that each GraphQL request is resolved by a single SQL statement and hits the theoretical minimum achievable network IO overhead of any GraphQL to SQL resolver. + +![GraphQL is coming to Supabase](/images/blog/2021-nov/graphql.png) + +## Supabase now runs on PostgreSQL 14 + +One of the most exciting things to happen in databases this year was the release of PG 14. +Which is now the default database used on our hosted platform. Read more here about [why we're so excited about it](/blog/2021/11/28/whats-new-in-postgres-14). + + +![Supabase now runs on PostgreSQL 14](/images/blog/2021-nov/pg14.png) + +## PostgREST 9.0 + +PostgREST is the tool we use to introspect your schema and make your database available over a RESTful API. +We also sponsor and help maintain this amazing open source project. Version 9.0 was just released and has also been rolled out to all new and existing Supabase projects on our hosted platform. +[Check out the blog post](/blog/2021/11/28/postgrest-9) by Steve Chavez, the maintainer of PostgREST. + +![PostgREST 9.0 ](/images/blog/2021-nov/postgrest9.png) + +## Building a SaaS? + +We have [a course for that](https://egghead.io/courses/build-a-saas-product-with-next-js-supabase-and-stripe-61f2bc20). +You'll learn how to combine Next.js, Stripe, and Supabase to launch your business in no time at all. +It's honestly mind blowing how quickly you can get products out the door with this stack. Oh and it's free. + +![Building a SaaS? ](/images/blog/2021-nov/course.jpg) + +## New Storage CDN + +Serving your files in no time - Get eye wateringly fast load times for your media files. [Read all about the benefits](/blog/2021/12/03/launch-week-three-friday-five-more-things#supabase-cdn). + +![New Storage CDN](/images/blog/2021-nov/too_damn_high.png) + +## How we Launch + +We "open sourced" our launch methodology - Learn about how we plan, execute, and retrospect launch weeks internally. [Read the post](/blog/2021/11/26/supabase-how-we-launch). +supabase monthly growth + +![How we Launch](/images/blog/2021-nov/supabase-universe.jpg) + +## Community + +### Highlights + +- Community Day [blog](/blog/2021/11/29/community-day#new-tutorials-and-integration-guides) +- The SupaSquad has been busy [blog](/blog/2021/11/29/community-day#supasquad-updates) +- 10 startups on what they're building with Supabase [video](https://www.youtube.com/watch?v=QAm1x7KaLq4&list=PL5S4mPUpp4OuzQN-a_FY3OZQuYo4NmXvb&t=3s) +- New official integration guides [blog](https://supabase.com/blog/2021/11/29/community-day#new-tutorials-and-integration-guides) +- Add Supabase in Teta [video](https://www.youtube.com/watch?v=lt-Vebxk-Mk) +- Auth flow with Remix and Supabase [video](https://www.youtube.com/watch?v=-KiH8feOHSc) +- Discovering Supabase [video](https://www.youtube.com/watch?v=WToGeMIdoSY) +- Next.js with Magic Links [blog](https://dev.to/dailydevtips1/authenticating-nextjs-with-supabase-auth-magic-links-363e) +- Next.js + Auth0 + Supabase [blog](https://auth0.com/blog/using-nextjs-and-auth0-with-supabase/) + +### TikTok + +Supabase is [now on TikTok](https://www.tiktok.com/@supabase.com?) - Watch us ship to some questionable beats. + +![GitHub](/images/blog/2021-nov/tiktok.png) + + +### GitHub + +We hit 25K stars!! [github.com/supabase/supabase](http://github.com/supabase/supabase) + +![GitHub](/images/blog/2021-nov/stars.png) + +## Get started + +- Start using Supabase today: **[app.supabase.io](https://app.supabase.io/)** +- Make sure to **[star us on GitHub](https://github.com/supabase/supabase)** +- Follow us **[on Twitter](https://twitter.com/supabase)** +- Subscribe to our **[YouTube channel](https://www.youtube.com/c/supabase)** +- Become a **[sponsor](https://github.com/sponsors/supabase)** \ No newline at end of file diff --git a/www/_blog/2021-12-17-holiday-hackdays-winners-2021.mdx b/www/_blog/2021-12-17-holiday-hackdays-winners-2021.mdx new file mode 100644 index 00000000000..e85c0afda5e --- /dev/null +++ b/www/_blog/2021-12-17-holiday-hackdays-winners-2021.mdx @@ -0,0 +1,122 @@ +--- +title: 'Holiday Hackdays Winners 2021' +description: Celebrating many amazing projects submitted to our Holiday Hackdays Hackathon. +author: thor_schaeff +author_url: https://github.com/thorwebdev +author_image_url: https://github.com/thorwebdev.png +authorURL: https://github.com/thorwebdev +image: hackathon-winners/holiday-hackdays/holiday-hackdays-winners-og.png +thumb: hackathon-winners/holiday-hackdays/holiday-hackdays-winners-og.png +tags: + - community + - hackathon +date: '2021-12-17' +toc_depth: 2 +--- + +To cool down from [our latest launch week](/blog/2021/12/15/beta-november-2021-launch-week-recap) we (virtually) [sat down with y'all](https://youtu.be/TijBVcV4jXw) and started hacking, and once again we absolutely loved your hackathon submissions and are excited to send some extremely limited swag your way! + +As always, it was challenging to pick the winners from all the great submissions! You can see all the amazing projects submitted on [madewithsupabase.com](https://www.madewithsupabase.com/holiday-hackdays). And now, without further ado, let's look at some of our favourites in more detail: + +## Best Overall Project + +### Winner + +[Swappy.one](https://github.com/zernonia/swappy-one) - by [@zernonia](https://twitter.com/zernonia) + +Zernonia is one of our [SupaSquad](https://supabase.com/docs/handbook/supasquad) members and continuously blows our minds with his creativity for the open-source projects he creates. For example, he's also the mastermind behind [madewithsupabase.com](https://www.madewithsupabase.com/), one of our favourite resources to see what y'all are building. + +Now he can add a gold tee to his collection, and we're starting to run out of swag ideas to show our appreciation! (Send us some ideas on [Twitter](https://twitter.com/supabase)!) + +[![Swappy.one](https://www.madewithsupabase.com/api/resize?link=Swappy.one-rsx33-Frame%2030.png&w=1000)](https://github.com/zernonia/swappy-one) + +### Runner Up + +[Chivel](https://github.com/lalit2005/chivel) - by [@lalitcodes](https://twitter.com/lalitcodes) and [@ChapagainAshik](https://twitter.com/ChapagainAshik) + +Chivel is a tool to quickly generate a landing page for your YouTube channel. For example check out this snazzy page that they've generated for the Supabase channel: [supabase.chivel.tk](https://supabase.chivel.tk/)! + +A great idea that deserves some silver tees! + +[![Chivel](https://www.madewithsupabase.com/api/resize?link=Chivel-a03sx-ogimage.png&w=1000)](https://github.com/lalit2005/chivel) + +## Best Realtime Project + +### Winner + +[rtPoll](https://github.com/emilioschepis/rtpoll) - by [@emilioschepis](https://twitter.com/emilioschepis) & brother Federico. + +Brothers Emilio and Federico built a platform to quickly create polls and share them around. Seeing poll results is great, but you know what's even better? Exactly, seeing poll results in realtime! + +[![rtPoll](https://madewithsupabase.com/api/resize?link=RT%20Poll%20-%20Realtime%20Polls-bpl8s-rtpoll-rt.png&w=1000)](https://github.com/emilioschepis/rtpoll) + +### Runner Up + +[e2ee-chat](https://github.com/arnu515/supabase-e2ee-chat) - by [@arnu5152](https://twitter.com/arnu5152) + +A chat app is a fairly obvious use case for realtime syncing, but this project caught our eye because the chat is end-to-end encrypted! + +[![e2ee-chat](https://www.madewithsupabase.com/api/resize?link=End-to-end%20encrypted%20chat-eap1qg-Screenshot%20from%202021-12-12%2014-32-08.png&w=1000)](https://github.com/arnu515/supabase-e2ee-chat) + +## Best Christmas Themed + +### Winner + +[Santa Banter](https://github.com/Keoooo/santa-banter) - by [@AndyKeogh](https://twitter.com/AndyKeogh) + +Not only do we love a good rhyme, but we also love Christmas themed jokes, so Andy's Santa Banter checks all the boxes. Head over there now to submit your best jokes! + +[![Santa Banter](https://madewithsupabase.com/api/resize?link=Santa%20Banter%20-dc8wef-Screenshot%202021-12-07%20at%2009.59.08.png&w=1000)](https://github.com/Keoooo/santa-banter) + +### Runner Up + +[Holiday Sweater](https://github.com/Morel-Tech/ugly_sweater_app) - by [@mtwichel](https://twitter.com/mtwichel) + +Ugly sweaters are an integral part of the Christmas Holidays. With Marcus' awesome Flutter app you can now vote on your favourite sweaters from around the globe! + +[![Holiday Sweater](https://madewithsupabase.com/api/resize?link=Holiday%20Sweater%20Contest-pjm3r-Screen%20Shot%202021-12-12%20at%2010.52.24%20PM.png&w=1000)](https://github.com/Morel-Tech/ugly_sweater_app) + +## Most Visually Pleasing + +### Winner + +[the get list](https://github.com/glowdex/wishlist) - by [@glowdexapp](https://github.com/glowdexapp) + +This visually stunning website allows you to create a wishlist to share with your friends so they don't need to wreck their brains for gift ideas. Here, have a look at what I want this Christmas: [thegetlist.co/list/thorwebdev](https://www.thegetlist.co/list/thorwebdev). + +[![the get list](https://www.madewithsupabase.com/api/resize?link=thegetlist.png&w=1000)](https://github.com/glowdex/wishlist) + +### Runner Up + +[card creator](https://github.com/maggie-j-liu/card-creator) - by [maggie-j-liu](https://github.com/maggie-j-liu), [Arash](https://github.com/arashnrim), [@eiilla11](https://twitter.com/eiilla11), and [@_pranavnt](https://twitter.com/_pranavnt) + +This team of high school hackers just keeps knocking it out of the park again. In our [Hacktoberfest Hackathon](https://supabase.com/blog/2021/10/14/hacktoberfest-hackathon-winners-2021#most-spookyfun) they already made it onto the podium. This time around they built this stunning greeting card platform that lets you send well wishes to your friends around the globe in no time. We love it! + +[![card creator](https://madewithsupabase.com/api/resize?link=Card%20Creator-vs9hc-Screen%20Shot%202021-12-12%20at%2011.12.23%20PM.png&w=1000)](https://youtu.be/Yx4N2bONA44) + +## The Prizes + +As is now tradition with Supabase Hackathons, the winners will receive an extremely limited edition gold medal shirt. + +![Gold Tshirt](/images/blog/hackathon-winners/holiday-hackdays/holiday-hackdays-winners-shirt.png) + +And the runner uppers will receive the same shirt but in silver. These shirts are limited to winners of the hackathon and will never be produced again. Keep them safe like your favourite NFTs! + +## Hang out with us and the community + +If you want to join the community and build with us, find other people using Supabase, or if you just want to chill and watch people build, come and join us in Discord! + +[Join our Discord](https://discord.supabase.com) + +![Discord Hangout](/images/blog/hackathon/community.png) + +### Get Started Guides + +If you're inspired to build, check out some of the latest resources: + +- [Build a SaaS product with Next.js, Supabase and Stripe](https://egghead.io/courses/build-a-saas-product-with-next-js-supabase-and-stripe-61f2bc20) +- [Supabase & Sveltekit - Build Twitter in 75 minutes](https://youtu.be/mPQyckogDYc) +- [Supabase Auth With Next.Js 12 Middleware](https://jitsu.com/blog/supabase-nextjs-middleware#what-were-going-to-build) +- [Vue 3 & Supabase | Workout Tracker App](https://www.youtube.com/watch?v=3tF0fGkd4ho) +- [Use Supabase Auth with Vue.js 3](https://vueschool.io/articles/vuejs-tutorials/use-supabase-auth-with-vue-js-3/) +- [Dynamic Jamstack with Stencil and Supabase](https://ionicframework.com/blog/dynamic-jamstack-with-stencil-and-supabase) diff --git a/www/_blog/2022-01-20-product-hunt-golden-kitty-awards-2021.mdx b/www/_blog/2022-01-20-product-hunt-golden-kitty-awards-2021.mdx new file mode 100644 index 00000000000..e78eaacbbcd --- /dev/null +++ b/www/_blog/2022-01-20-product-hunt-golden-kitty-awards-2021.mdx @@ -0,0 +1,44 @@ +--- +title: 'Golden Kitty Awards Ceremony Watch Party with Supabase' +description: Hang out with us while watching the Product Hunt Golden Kitty Awards Ceremony +author: thor_schaeff +author_url: https://github.com/thorwebdev +author_image_url: https://github.com/thorwebdev.png +authorURL: https://github.com/thorwebdev +image: product-hunt-golden-kitty-awards-2021.png +thumb: product-hunt-golden-kitty-awards-2021-thumb.png +tags: + - community +date: '2022-01-20' +toc_depth: 2 +--- + +Last week [Supabase UI](https://ui.supabase.com/), our open-source UI component library inspired by Tailwind and AntDesign, was nominated for the Product Hunt Golden Kitty Awards. + + + +Thanks to your contributions and upvotes, Supabase UI has made it to the finals, and to celebrate we'd like to invite you all to hang out with us on Discord (at least whoever manages to stay up) to watch the Awards Ceremony on Thursday Jan 27th at 9am PT (Thursday 5pm GMT, Friday 1am SG). + +## How to join + +[![Product hunt](https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=290768&theme=light)](https://www.producthunt.com/posts/supabase-ui) + +1. [Upvote Supabase UI](https://www.producthunt.com/posts/supabase-ui) (if you haven't already). +2. Register for the [Golden Kitty Awards Ceremony 2021](https://app.experiencewelcome.com/events/rPurvb/stages/epflG6). +3. Join us [on Discord](https://discord.supabase.com/) in the "hangout" channel. +4. Have fun and win Product Hunt & SupaSWAG \o/ + +Join our Discord: [discord.supabase.com](https://discord.supabase.com/) + +![Discord Hangout](/images/blog/hackathon/community.png) diff --git a/www/_blog/2022-01-20-supabase-beta-december-2021.mdx b/www/_blog/2022-01-20-supabase-beta-december-2021.mdx new file mode 100644 index 00000000000..f6aab395c74 --- /dev/null +++ b/www/_blog/2022-01-20-supabase-beta-december-2021.mdx @@ -0,0 +1,156 @@ +--- +title: Supabase Beta December 2021 +description: New crypto extension, Postgres videos, and a bunch of cool integrations. +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: 2021-dec/release-dec-2021.png +thumb: 2021-dec/release-dec-2021-cover.png +tags: + - release-notes +date: '2022-01-20' +toc_depth: 3 +--- + +Happy 2022. We're looking forward to a year of shipping product and helping our users build great things! + +Here's a bunch of stuff we shipped throughout December... + +## Hackathon Winners + +We had a ton of awesome projects [submitted for our Holiday Hackdays](/blog/2021/12/17/holiday-hackdays-winners-2021), all of the submissions are open source so come and check out the code for some of our top picks! + +[![hackathon winners](/images/blog/2021-dec/hackathon.png)](/blog/2021/12/17/holiday-hackdays-winners-2021) + +## New crypto extension - pg_crypto + +We just added pg_sodium as an extension inside all postgres instances. +Which means you can easily do encryption, decryption, hashing, and cryptographic signing from within your postgres functions and queries. +Enable it from the Database > Extensions tab in the [Supabase Dashboard](https://app.supabase.io). + +[![pg sodium support](/images/blog/2021-dec/pgsodium.png)](https://app.supabase.io) + +## PostgreSQL Videos + +### Call Postgres functions from JavaScript with RPC + +Jon Meyers walks you through how to write more complex queries and logic in your database, and invoke it via the API. + + + +### Call any API using PostgreSQL functions + +We recently added the ability to call any external HTTP endpoint from your postgres functions. Jon shows you how! + + + +### Create PostgreSQL Functions with Supabase + +Triggers allow you to execute SQL in response to any table changes. Learn how to write PostgreSQL triggers with Jon! + + + +### Hiring + +We're Hiring - for a ton of new roles across engineering, marketing, and HR. We hire fully remotely, and you'll get to work alongside some incredible people, on one of the fastest growing open source companies. [See which roles we're hiring for](https://about.supabase.com/careers). + +[![supabase is hiring](/images/blog/2021-dec/hiring.png)](https://about.supabase.com/careers) + +## Community + +There was a lot of activity this month. + +### Learn With Jason + +Let Jason and Jon show you how to build an app with Next.js and Supabase on top of Netlify! + + + +### Divjoy integration + +Divjoy announced their [Supabase Integration](https://divjoy.com/?database=supabase) - The React codebase generator allows you to choose your stack, choose your template, and generate your codebase. + +![pg sodium support](/images/blog/2021-dec/divjoy.png) + +### n8n + Supabase + +[n8n](https://n8n.io/) added a Supabase node. + + + +### Python Upgrades + +The Community released a whole bunch of updated Python libs including: supabase v0.0.4 - gotrue v0.3.0 - realtime v0.0.4 - storage3 v0.1.0 + +See the full list of [community supported libs](https://github.com/supabase-community/). + +[![supabase community libs](/images/blog/2021-dec/python.png)](https://github.com/supabase-community/) + +### Twitter + +We're having a 24/7*365 meme-fest on [Twitter](https://twitter.com/supabase) + + + +### TikTok + +Check us out on [TikTok](https://www.tiktok.com/@supabase.com?fromUrl=%2Fsupabase.com&lang=en) + +[![tiktok](/images/blog/2021-dec/tiktok.png)](https://www.tiktok.com/@supabase.com?fromUrl=%2Fsupabase.com&lang=en) + +### Swag Store + +A reminder that we have a [Supabase Swag Store](https://store.supabase.com) + +[![swag store](/images/blog/2021-dec/swag.jpg)](https://store.supabase.com) + +### GitHub + +We hit 26K stars!!: [github.com/supabase/supabase](http://github.com/supabase/supabase) + +![GitHub](/images/blog/2021-dec/stars.png) + +Source: [repository.surf/supabase](https://repository.surf/supabase) + +Check out some of our other community stats in our latest [Series A Blog Post](/blog/2021/10/28/supabase-series-a). + +## Get started + +- Start using Supabase today: **[app.supabase.io](https://app.supabase.io/)** +- Make sure to **[star us on GitHub](https://github.com/supabase/supabase)** +- Follow us **[on Twitter](https://twitter.com/supabase)** +- Subscribe to our **[YouTube channel](https://www.youtube.com/c/supabase)** +- Become a **[sponsor](https://github.com/sponsors/supabase)** diff --git a/www/_blog/2022-02-22-supabase-beta-january-2022.mdx b/www/_blog/2022-02-22-supabase-beta-january-2022.mdx new file mode 100644 index 00000000000..f267e55d393 --- /dev/null +++ b/www/_blog/2022-02-22-supabase-beta-january-2022.mdx @@ -0,0 +1,207 @@ +--- +title: Supabase Beta January 2022 +description: New auth providers, SMS providers, and new videos. +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: 2022-january/thumb.jpg +thumb: 2022-january/thumb.jpg +tags: + - release-notes +date: '2022-02-22' +toc_depth: 3 +--- + +This month's beta update is more stacked than the Superbowl (\*Supa-bowl) halftime show. Here’s all of the highlights from January... + +## New OAuth providers + +![New 0Auth Providers](/images/blog/2022-january/new-auth-providers-supabase_monthly-email-jan-2022.png) + +We’re continually amazed by how quickly new auth providers are being added into Supabase, and last month, 2 more have been added. + +### Notion + +Added by [zernonia](https://github.com/zernonia). +You may already know him as the maintainer of [madewithsupabase.com](https://www.madewithsupabase.com/). + +### LinkedIn + +Added by [riderx](https://github.com/riderx). +You may already be familiar with Martin from his podcast [Indie Makers](https://podcasts.apple.com/us/podcast/indie-makers/id1488437972). + +## New SMS providers + +![New SMS Providers](/images/blog/2022-january/new-sms-providers-supabase_monthly-email-jan-2022.png) + +Along with the new 0Auth providers above, last month saw the addition of two more SMS phone providers to allow you to authenticate users via an SMS OTP (One-Time Password) token. + +### Vonage + +**[Vonage](https://www.vonage.com/)** is a US-based cloud communications provider. +Added by [devkiran](https://github.com/devkiran) (from [BoxyHQ](https://twitter.com/BoxyHQ)). + +### Textlocal + +We are now fulfilling a popular request with this Indian-compliant SMS provider, [Textlocal](https://www.textlocal.com/). +Also added by [devkiran](https://github.com/devkiran). + +### Other SMS providers + +Just a reminder, we also support [Twilio](https://supabase.com/docs/guides/auth/auth-twilio) and [MessageBird](https://supabase.com/docs/guides/auth/auth-messagebird). + +On a final note, we are hiring for an [Auth Engineer](https://about.supabase.com/careers/auth-engineers). + +## Query logs with SQL + +Supabase logs are more powerful with the [newly added SQL querying](https://github.com/supabase/supabase/pull/4734). + +We added [timestamp filtering](https://github.com/supabase/supabase/pull/4904), and you’ll notice our usage charts have [more time spans available](https://github.com/supabase/supabase/pull/4732). + +We’re enabling developers to quickly diagnose issues with their projects with powerful logging and observability tools and we have a lot more to come. + +## GraphQL v0.1.0 + +![Graph QL v0.1.0](/images/blog/2022-january/pg_graphql_0.1.0_monthly-email-dec-2021.png) + +Last month we released [`pg_graphql`](https://github.com/supabase/pg_graphql) v0.1.0, which includes [Comment Directives](https://supabase.github.io/pg_graphql/configuration/#comment-directives). + +We haven’t released GraphQL onto the platform yet because we it's still under heavy development. You can expect availability in the next few months. + +Example + +```sql +create table account( + id serial primary key +); + +comment on table public.account is +e'@graphql({ "name": "AccountHolder" })'; +``` + +Result + +```jsx +// Renames "Account" to "AccountHolder" +type AccountHolder { + id: Int! +} +``` + +## New examples + +### Remix Auth + +It’s all anyone seems to be [talking about](https://twitter.com/jkup/status/1456360115205033989). We genuinely love what [Remix](https://remix.run/) are doing, so it’s only right that we show off how Remix and Supabase work well together. + +Check out the new [Remix Auth example](https://github.com/supabase/supabase/tree/master/examples/remix-auth), and let us know what you think. + +### Expo Todo List + +Our React Native example has been correctly updated to be an Expo example. +[Check it out here](https://github.com/supabase/supabase/tree/master/examples/expo-todo-list). + +## Video: API requests with Function Hooks + +There's no stopping [Jon Meyers](https://jonmeyers.io/videos)! He’s back with an in-depth video on how to easily [automate API requests](https://www.youtube.com/watch?v=codAs9-NeHM&feature=emb_title) using our very own Function Hooks. + +You'll learn how to listen to _any_ database change, then send those changes [in a payload](https://supabase.com/blog/2021/07/30/supabase-functions-updates#hook-payload) via HTTP request. + + + +## Set your own support ticket priority + + +As with any platform, there can be the occasional glitch. + +The Supabase Dashboard includes a dedicated support form that goes straight to our support inbox. This support form includes your project information and, +since we all want to see your issues solved, we thought it would make sense that _you_ could set the priority of your support tickets. + +This change has drastically improved response times for urgent support tickets. +The form includes extra “urgent” levels for the PRO and Pay As You Go projects. + +And, as part of our continued commitment to Support, we are hiring [Support Engineers](https://about.supabase.com/careers/support-and-qa). + +## Community + +As always, the community has been amazing during the month of February. + +### Supabase + Snaplet + +Are you maintaining multiple environments? Snaplet helps you copy a production database and clone it into different environments. + +Check out the [Supabase clone environments](https://docs.snaplet.dev/tutorials/supabase-clone-environments) tutorial on the Snaplet docs. + + + +### Supabase + Retool + +Retool has put together a brilliant 10 minute admin panel setup using Supabase with Retool. + + + +### Learn with Jason + +Jason Lengstorf caught up with our very own [Jon Meyers](https://jonmeyers.io/) on his awesome show, [Learn with Jason](https://www.youtube.com/watch?v=8vqY1KT4TLU), to talk about building an app [with Supabase and NextJS](https://supabase.com/docs/guides/with-nextjs). + + + +### New article highlights + +- Arctype published a new guide showing how to connect to your Supabase database. [Link](https://arctype.com/postgres/connect/supabase-postgres) +- Marmalabs built a Supabase adapter for react-admin, the frontend framework for building admin applications on top of REST/GraphQL services. [Link](https://github.com/marmelab/ra-supabase) +- HotGlue created a guide showing how easy it is to integrate Salesforce and Supabase. [Link](https://www.notion.so/Supabase-and-hotglue-article-9e7f5583d27c419490ee7d536d6d269d) + +### PostgREST + +One of Supabase’s key tools that allow a lot of our functionality has had some updates. + +- `pg_listen` was removed in favor of PostgREST’s built-in schema reloading. +- PostgREST database connection pool size gets scaled with instance size for better performance for certain workload shapes. + +## Coming Next: Launch Week IV + +Preparation for Launch Week 4 is underway! + +Of course, we can’t tell you what will happen (perhaps because we don’t know ourselves yet), but you can always speculate in the community [Discord server](https://discord.supabase.com/), or even [tweet us your predictions](https://twitter.com/supabase). + +## Get started + +- Start using Supabase today: **[app.supabase.io](https://app.supabase.io/)** +- Make sure to **[star us on GitHub](https://github.com/supabase/supabase)** +- Follow us **[on Twitter](https://twitter.com/supabase)** +- Subscribe to our **[YouTube channel](https://www.youtube.com/c/supabase)** +- Become a **[sponsor](https://github.com/sponsors/supabase)** diff --git a/www/_blog/2022-03-08-audit.mdx b/www/_blog/2022-03-08-audit.mdx new file mode 100644 index 00000000000..f067d7f8df5 --- /dev/null +++ b/www/_blog/2022-03-08-audit.mdx @@ -0,0 +1,356 @@ +--- +title: Postgres Auditing in 150 lines of SQL +description: PostgreSQL has a robust set of features which we can leverage to create a generic auditing solution in 150 lines of SQL. +author: oli_rice +author_url: https://github.com/olirice +author_image_url: https://github.com/olirice.png +authorURL: https://github.com/olirice +image: supa-audit/postgres_auditing_in_150_lines_of_SQL.png +thumb: supa-audit/postgres_auditing_in_150_lines_of_SQL.png +tags: + - postgres +date: '2022-03-08' +toc_depth: 3 +--- + +Data auditing is a system that tracks changes to tables' contents over time. +PostgreSQL has a robust set of features which we can leverage to create a generic auditing solution in 150 lines of SQL. + +Auditing is particularly useful for historical analysis. To demonstrate, imagine you have a `users` table that tracks when a user is online. +You might add a `status` column which can have one of two values: `online` and `offline`. How would you track how long a user is online for throughout an entire month? +An auditing system would track every change with timestamps, and so you can measure the difference between each timestamp and sum them up for the entire month. + +The goals of our auditing solution are: + +- low maintenance +- easy to use +- fast to query + +To demonstrate what we're working towards, the following example shows what we'll have at the end of the blog post: + +```sql +-- create a table +create table public.members( + id int primary key, + name text not null +); + +-- Enable auditing on the new table +select audit.enable_tracking('public.members'); +``` + +Produce some records to audit + +```sql +-- create a new record +insert into public.members(id, name) values (1, 'foo'); + +-- edit the record +update public.members set name = 'bar' where id = 1; + +-- delete the record +delete from public.members; +``` + +Review the audit log + +```sql +select * from audit.record_history +``` + +```markdown +id | record_id | old_record_id | op | ts | table_oid | table_schema | table_name | record | old_record +----+--------------------------------------+--------------------------------------+--------+-------------------------------------+-----------+--------------+------------+--------------------------+-------------------------- +2 | 1ecd5ff0-1b6b-5bc2-ad80-1cb19769c081 | | INSERT | Mon Feb 28 18:13:52.698511 2022 PST | 16452 | public | members | {"id": 1, "name": "foo"} | +3 | 1ecd5ff0-1b6b-5bc2-ad80-1cb19769c081 | 1ecd5ff0-1b6b-5bc2-ad80-1cb19769c081 | UPDATE | Mon Feb 28 18:13:52.698511 2022 PST | 16452 | public | members | {"id": 1, "name": "bar"} | {"id": 1, "name": "foo"} +4 | | 1ecd5ff0-1b6b-5bc2-ad80-1cb19769c081 | DELETE | Mon Feb 28 18:13:52.698511 2022 PST | 16452 | public | members | | {"id": 1, "name": "bar"} +(3 rows) +``` + +Notice that our `record_id` and `old_record_id` stayed constant as we updated the row so we can easily query for a single row's history over time! + +## Lets get building + +### Namespace + +To quote a tenet from [the zen of python](https://www.python.org/dev/peps/pep-0020/): + +> Namespaces are one honking great idea -- let's do more of those! + +So first things first, we'll create a separate schema named `audit` to house our auditing entities. + +```sql +create schema if not exists audit; +``` + +### Storage + +Next, we need a table to track inserts, updates and deletes. + +Classically, an audit table's schema mirrors the table being audited and appends some metadata columns like the commit's timestamp. That solution has a few maintenance challenges: + +- enabling auditing on a table requires a database migration +- when the source table's schema changes, the audit table's schema must also change + +So instead, we'll lean on PostgreSQL's schema-less [`JSONB` data type](https://www.postgresql.org/docs/current/datatype-json.html) to store each record's data in a single column. +That approach has the added benefit of allowing us to store multiple tables' audit history in a single audit table. + +```sql +create table audit.record_version( + id bigserial primary key, + -- auditing metadata + record_id uuid, -- identifies a new record by it's table + primary key + old_record_id uuid, -- ^ + op varchar(8) not null, -- INSERT/UPDATE/DELETE/TRUNCATE + ts timestamptz not null default now(), + -- table identifiers + table_oid oid not null, -- pg internal id for a table + table_schema name not null, -- audited table's schema name e.g. 'public' + table_name name not null, -- audited table's table name e.g. 'account' + -- record data + record jsonb, -- contents of the new record + old_record jsonb -- previous record contents (for UPDATE/DELETE) +); +``` + +
+ Postgres version compatibility +

+ The table above uses PostgreSQL's built-in{' '} + uuid functionality, which + is available from version 14. For backwards compatibility you can use the uuid-ossp extension. +

+

+ create extension if not exists "uuid-ossp"; +

+
+ +### Query Patterns + +An audit log doesn't do us much good if its too slow to query! There are 2 query patterns we think are table stakes (😉) for an audit system: + +**Changes to a Table in a Time Range** + +For time slices, we need an index on the `ts` column. Since the table is append-only and the `ts` column is populated by insertion date, our values for `ts` are naturally in ascending order. + +PostgreSQL's builtin [BRIN index](https://www.postgresql.org/docs/current/brin-intro.html) can leverage that correlation between value and physical location to produce an index that, at scale, is many hundreds of times smaller than the default (BTREE index) with faster lookup times. + +```sql +-- index ts for time range filtering +create index record_version_ts + on audit.record_version + using brin(ts); +``` + +For table filtering, we've included a `table_oid` column which tracks PostgreSQL's internal numeric table identifier. We can add an index to this column instead of the `table_schema` and `table_name` columns, minimizing the index size and offering better performance. + +```sql +-- index table_oid for table filtering +create index record_version_table_oid + on audit.record_version + using btree(table_oid); +``` + +**Changes to a Record Over Time** + +One of the downsides to storing each row's data as `jsonb` is that filtering based on a column's value becomes very inefficient. If we want to look up a row's history quickly, we need to extract and index a unique identifier for each row. + +For the globally unique identifier, we'll use the following structure + +``` +[table_oid, primary_key_value_1, primary_key_value_2, ...] +``` + +and hash that array as a UUID v5 to get an efficiently indexable UUID type to identify the row that is robust to data changes. + +We'll use one utility function to lookup a record's primary key column names: + +```sql +create or replace function audit.primary_key_columns(entity_oid oid) + returns text[] + stable + security definer + language sql +as $$ + -- Looks up the names of a table's primary key columns + select + coalesce( + array_agg(pa.attname::text order by pa.attnum), + array[]::text[] + ) column_names + from + pg_index pi + join pg_attribute pa + on pi.indrelid = pa.attrelid + and pa.attnum = any(pi.indkey) + where + indrelid = $1 + and indisprimary +$$; +``` + +and another to consume the `table_oid` and primary key, converting the result into the record's UUID. + +```sql +create or replace function audit.to_record_id( + entity_oid oid, + pkey_cols text[], + rec jsonb +) + returns uuid + stable + language sql +as $$ + select + case + when rec is null then null + -- if no primary key exists, use a random uuid + when pkey_cols = array[]::text[] then uuid_generate_v4() + else ( + select + uuid_generate_v5( + 'fd62bc3d-8d6e-43c2-919c-802ba3762271', + ( + jsonb_build_array(to_jsonb($1)) + || jsonb_agg($3 ->> key_) + )::text + ) + from + unnest($2) x(key_) + ) + end +$$; +``` + +Finally, we index the `record_id` and `old_record_id` columns that contain these unique identifiers for fast querying. + +```sql +-- index record_id for fast searching +create index record_version_record_id + on audit.record_version(record_id) + where record_id is not null; + +-- index old_record_id for fast searching +create index record_version_old_record_id + on audit.record_version(record_id) + where old_record_id is not null; +``` + +### Enrollment + +Okay, so we have a home for our audit data that we're confident it can be queried efficiently. Now how do we populate it? + +We need the audit table to populate without end-users making any changes to their transactions. So we'll set up a [trigger](https://www.postgresql.org/docs/current/sql-createtrigger.html) to fire when the data changes. In this case, we'll fire the trigger once for every inserted/updated/deleted row. + +```sql +create or replace function audit.insert_update_delete_trigger() + returns trigger + security definer + language plpgsql +as $$ +declare + pkey_cols text[] = audit.primary_key_columns(TG_RELID); + record_jsonb jsonb = to_jsonb(new); + record_id uuid = audit.to_record_id(TG_RELID, pkey_cols, record_jsonb); + old_record_jsonb jsonb = to_jsonb(old); + old_record_id uuid = audit.to_record_id(TG_RELID, pkey_cols, old_record_jsonb); +begin + + insert into audit.record_version( + record_id, + old_record_id, + op, + table_oid, + table_schema, + table_name, + record, + old_record + ) + select + record_id, + old_record_id, + TG_OP, + TG_RELID, + TG_TABLE_SCHEMA, + TG_TABLE_NAME, + record_jsonb, + old_record_jsonb; + + return coalesce(new, old); +end; +$$; +``` + +## Public API + +Finally, we'll wrap up the trigger creation and removal process behind a clean, idempotent, user facing API. + +The API we'll expose for enabling auditing on a table is + +```sql +select audit.enable_tracking('.'::regclass); +``` + +and for disabling tracking + +```sql +select audit.disable_tracking('.
'::regclass); +``` + +Under the hood, those functions register our auditing trigger against the requested table. + +```sql +create or replace function audit.enable_tracking(regclass) + returns void + volatile + security definer + language plpgsql +as $$ +declare + statement_row text = format(' + create trigger audit_i_u_d + before insert or update or delete + on %I + for each row + execute procedure audit.insert_update_delete_trigger();', + $1 + ); + + pkey_cols text[] = audit.primary_key_columns($1); +begin + if pkey_cols = array[]::text[] then + raise exception 'Table % can not be audited because it has no primary key', $1; + end if; + + if not exists(select 1 from pg_trigger where tgrelid = $1 and tgname = 'audit_i_u_d') then + execute statement_row; + end if; +end; +$$; + +create or replace function audit.disable_tracking(regclass) + returns void + volatile + security definer + language plpgsql +as $$ +declare + statement_row text = format( + 'drop trigger if exists audit_i_u_d on %I;', + $1 + ); +begin + execute statement_row; +end; +$$; +``` + +And we're done with 2 lines of code to spare! + +### Performance + +Auditing tables always reduces throughput of inserts, updates, and deletes. In cases where throughput is less than 1000 writes per second the overhead is typically negligible. For tables with a higher write frequency, consider logging changes outside of SQL with a tool like [pgAudit](https://www.pgaudit.org/). + +### Do I really expect you to copy/paste all that? + +Nope, for a turnkey solution to auditing in PostgreSQL, we've packaged this script into an extension with some extra goodies like `TRUNCATE` support. Check it out at https://github.com/supabase/supa_audit. diff --git a/www/_blog/2022-03-25-should-i-open-source-my-company.mdx b/www/_blog/2022-03-25-should-i-open-source-my-company.mdx new file mode 100644 index 00000000000..4cd07fccb99 --- /dev/null +++ b/www/_blog/2022-03-25-should-i-open-source-my-company.mdx @@ -0,0 +1,122 @@ +--- +title: 'Should I Open Source my Company?' +description: The unexpected upsides of building in public +author: ant_wilson +author_url: https://github.com/awalias +author_image_url: https://github.com/awalias.png +authorURL: https://github.com/awalias +image: open-source/open-source-thumb.png +thumb: open-source/open-source-thumb.png +tags: + - open-source + - community + - supabase + - hiring +date: '2022-03-25' +toc_depth: 3 +--- + +Supabase has been open source from day one. This is one of the best decisions we've made. It didn't feel like a difficult decision at the time, since [kiwicopple](http://github.com/kiwicopple) and I are long time users and advocates of great open projects like PostgreSQL, Python, Bitcoin, React, [... insert long list]. Open-sourcing Supabase ended up surprising us in many ways. Many people imagine that maintaining your business in public might be burdensome - but the opposite is true. There are many unexpected upsides that have made building Supabase - the product and the company - easier. + +While some of this advice comes from our lens as a Dev Tools or PaaS company, most of it will apply to any software company. + +When we discuss open source business models with other founders, there are three complaints that come up again and again. These are: + +- People might criticize my messy/bad/unfinished code +- Hackers will find and exploit security holes +- Competitors will steal my Intellectual Property + +We'll cover each of these in detail and follow up with some of the surprising benefits we discovered building Supabase, namely how open source: + +- Solves your dev talent problem +- Improves your product (massively) +- Will carry us to Utopia + +Let's dive in. + +## But my code is bad + +This is just ego. The person who spends the most time thinking about you is you, and the person who spends the most time stressing over your bad code is you as well. If someone else is spending time stressing over your bad or messy code, then it's likely you've hit upon something worth pursuing. The folk story of the [Stone Soup](https://en.wikipedia.org/wiki/Stone_Soup) applies here. If you share good ideas with the community they will adopt and improve on them with you. The community will help refactor and replace any bad code, and they might even introduce new code quality guidelines to your project, improving the process for everyone who comes after. Toxic community members who complain about bad code instead of making suggestions to improve it are not the people you want in your community anyway. + +All open source contributors have a graveyard of old projects. What's cool about this is that people looking to build something similar have a library of ideas and approaches to learn from. They may take inspiration from your approach to certain problems. At the very least, they won't be wasting time making your same mistakes. Don't worry about old projects ruining your reputation. At best people will find them useful. At worse they won't get noticed anyway. + +![bad-code.png](/images/blog/open-source/bad-code.png) + +## Getting to secure + +One of the biggest fears running a hosted solution where the code is publicly available is malicious actors will read your code, discover exploits, and hack your services. In our experience, [Linus's law](https://en.wikipedia.org/wiki/Linus%27s_law) of "given enough eyeballs, all bugs are shallow" also applies to security issues. Since the very early days of Supabase we have had (often anonymous) security researchers active in our code and platform, helping us find potential issues. If you're offering a software as a service, make simple instructions available at [/.well-known/security.txt](https://supabase.com/.well-known/security.txt) to let the good guys know how to disclose potential issues to you. + +The premier example of how open source projects can be more secure than proprietary code bases is Bitcoin. In [his 2015 talk](https://www.youtube.com/watch?v=810aKcfM__Q) Andreas M. Antonopoulos describes how closed source banking systems have the software equivalent of weak immune systems, because huge security holes can be obfuscated for long periods of time, and when eventually exploited can have enormous detrimental effects. On the flip side of this is an open source protocol like Bitcoin, where any security holes are there for all to see. Exploits are found early and often, and then patched. Remember that successful software companies can take more than a decade to build. Over a long time period, open source systems will tend towards a more secure state over secretive, proprietary systems, especially in a time when hiring talented security engineers is extremely competitive. + +![security.png](/images/blog/open-source/security.png) + +## Beating the competition + +In software ideas are cheap. Value is almost always created in execution of ideas. When you share your ideas with the world, it frees up your brain to focus on things that matter most. Instead of spending time worrying about which contractors or partners have access to your code base, you can focus on iterating faster. You'll probably be surprised how the open source community responds to your openness. + +### Grow a community of experts + +In order to build a successful company, you'll have to execute well and grow your customer base over a long period of time, let's say 10 years. In this Ultra Marathon, any advantages gained by competitors peeking at your code base are unlikely to be material over that 10 year period. It's likely that you'll have to iterate on, and refactor your code base many times over during that period. Building a team and a community that is the best in the world at iterating on *your* solution is how you will win in the long term. + +### Winning in the market + +If you're in a market with a huge (and growing) TAM, that is *really* worth pursuing, it's unlikely to be a winner takes all situation. The first lesson is to find a segment of users you can “wow” and then iterate like crazy. Every second you focus on your competitors is time you could be focused on improving your product or your team. If a competitor forks your open source project, and is able to out-ship you, then I would argue that you were bound to lose that particular race anyway. + +On top of all this, IP and patents in software are notoriously difficult to enforce. It will save you time, money, and mental energy if you're not worrying about trying to protect your software ideas with lawyers. You can protect your business much better by becoming the best in the world at implementing your software ideas. + +![secrets.png](/images/blog/open-source/secrets.png) + +### Late stage + +Once your project reaches significant scale, you might find yourself in a situation like Elastic, or Mongo, where large cloud providers are offering your product with a superior distribution model. + +Firstly, if you're just starting out, the biggest problem facing you right now is getting to that point. If you become so successful that AWS is deciding to take resources away from one of it's many billion dollar product lines to compete with you in hosting your product, you're doing something *very* right. + +Secondly, and more constructively, you should prepare for this eventuality by finding areas where you can outcompete anyone. Most cloud providers are notoriously bad at Developer Experience for example, so take advantage of that and make DX one of your core competencies. If after 6 years, Google tries to steal your lunch, you should have a brand, a team, and a community, that have spent the last few years preparing for a David versus Goliath-type fight. Make sure you're not blindsided by something like this by planning for it from the beginning. You have enough time and focus on your side to construct a winning strategy. + +### Stop worrying + +In general if a competitor is looking to you for ideas, then good luck to them. They'll always be a step behind you, and expending more energy than you are by worrying about their competition. Especially in the early stages, when resource is scarce. + +--- + +Now that we've addressed some of the common objections, let's move on to some of the surprising benefits. + +## Hiring developers + +One of the biggest complaints of startups - no matter the size - is how hard it is to hire developers. Sourcing is hard, assessing developers is hard, convincing them of the quality of their future colleagues is hard. Being open source can solve your developer hiring problems! + +### Sourcing openly + +All developers benefit from open-source, and many developers look to pay those benefits forward by contributing to open source projects they find interesting. Maybe they contribute because of a good community, maybe they're trying to learn a new technology, or enjoy solving hard technical problems in new and novel codebases. If you lower the barriers to contribute code to your open source project, there's a good chance great developers will find your project. They might contribute in issue discussions, solve bugs, identify problems, or review PRs. Every contributor may not be open to work, but many will be attracted by the prospect of working on open source code as part of their full time gig. It's a huge advantage open source companies have over closed sourced ones. At Supabase we didn't start doing outbound recruitment until after we already hired 32 developers, and been operating for more than 2 years. Open source has been, and will continue to be, our primary source of finding new (and incredible) talent. Being a remote and async company, we find having an open source hiring strategy means candidates are self selecting for these skills, which makes our job of screening for them much easier. + +![leetcode.png](/images/blog/open-source/leetcode.png) + +### No, I won't take home your take home test + +One of the biggest complaints developers make while looking for their next gig is having to solve LeetCode problems or do take-home tests in the interview process. They are time-consuming, arduous, and often don't represent the type of work they'll be doing on the job. However, if someone contributes to your repo you already have: + +- examples of how the person communicates with team/community members asynchronously and in a remote setting. +- examples of *real world* code contribution. + +And the candidate gets to see all this from the company side as well! Does this team value code quality? Do they communicate effectively? Do they make good technical decisions? + +People who have been hired at Supabase through our repos have made themselves indispensable. Many of them drove the development of existing repos, and even started new client libraries and SDKs. And not one of them were ever required to solve a LeetCode problem over Zoom. + +## But does it integrate with Excel? + +When building a startup, you might find that you only really have the time to solve your biggest problems. In order to move fast, you need to focus on what 80% of the user base is asking for. The features requested by the minority are prone to getting indefinitely shunted. When your systems are open source however, these users have the ability to contribute the features themselves, expanding the usefulness of your software - sometimes to new use cases that you didn't even know existed. This happens most often with integrations and adaptors. Users might want an Azure or Vercel integration, and if someone else can provide the development resources to make those connections, then everyone using your project benefits as a result. + +## It's 2022. Where are the flying cars? + +In a world with no open source, technology companies everywhere are re-inventing the wheel, on loop... forever. To combat this at Supabase, we don't just open source our new projects. We always try to support existing open source projects, before inventing new ones. + +Think about each of the automotive companies today. Writing proprietary functions, to build proprietary UI elements, on proprietary windowing libraries, running inside proprietary operating systems, using proprietary drivers, to display an error message that you'll probably never see! What a waste of developer time and effort! + +I won't evangelize too much here... I think this meme summarizes my feelings on the subject... + +![open-source.png](/images/blog/open-source/open-source.png) + +## More evidence please + +Next week is Supabase Launch Week. It's the culmination of everything the team and community have spent the last 3 months working on. If you're not convinced by my arguments above, I believe the rate at which the Supabase community is progressing, in such a short time, speaks to all the benefits of running an open source company. See the [Launch Week 4 post](/blog/2022/03/25/supabase-launch-week-four) for all the details. And visit [our GitHub](https://github.com/supabase) if you want to get involved. diff --git a/www/_blog/2022-03-25-supabase-launch-week-four.mdx b/www/_blog/2022-03-25-supabase-launch-week-four.mdx new file mode 100644 index 00000000000..d195270a60c --- /dev/null +++ b/www/_blog/2022-03-25-supabase-launch-week-four.mdx @@ -0,0 +1,178 @@ +--- +title: 'Supabase Launch Week IV' +description: 'Launch Week 4: One new feature every day for an entire week. Starting Monday 28th March.' +author: paul_copplestone +author_url: https://github.com/kiwicopple +author_image_url: https://github.com/kiwicopple.png +authorURL: https://github.com/kiwicopple +image: launch-week-4/friday-before/launchweek-4-promo-cal.png +thumb: launch-week-4/friday-before/launchweek-4-promo.png +tags: + - launch-week +date: '2022-03-25' +toc_depth: 2 +--- + +By now you probably know the drill. Supabase Launch Week: we launch one thing, or sometimes a couple, +every day for an entire week. + +If this is your first Launch Week, check out our previous Launch Weeks for a taste of what's to come: + +- [Launch Week I](/blog/2021/03/25/launch-week) +- [Launch Week II: The SQL](/blog/2021/07/22/supabase-launch-week-sql) +- [Launch Week III: The Trilogy](/blog/2021/11/26/supabase-launch-week-the-trilogy) + +## What to expect + +Launch Week Four has something for everybody. + +We don't want to spoil the surprise, so for now we'll give you a teaser for each day. +Come back each day to see what we launch, or follow us on twitter ([@supabase](https://twitter.com/supabase)) +to keep updated by following the hashtag [#SupaLaunchWeek](https://twitter.com/hashtag/SupaLaunchWeek). + +## Pre-launch party + +Watch us as we kick off Launch Week, shipping this blog post. + + + +## Monday: Community Day + +![Monday: Community Day](/images/blog/launch-week-4/friday-before/community.png) + +### What? + +All for one, and one for all. It has become a tradition to kick off Launch Week with Community Day - +a day where we shine a spotlight on some of the the open source tools that we use and community contributions. +This Community Day is going to be our biggest one yet. +Have a look at the [#SupaLaunchWeek hashtag on Twitter](https://twitter.com/hashtag/SupaLaunchWeek?src=hashtag_click) +to see some of the awesome guests that will be joining us. + +[Launch Week IV: Community Day.](/blog/2022/03/28/community-day) + +### When? + +Monday 28 March 2022: 9am PT + +### Where? + +- Read the [blogpost](/blog/2022/03/28/community-day). +- Listen back to the [Twitter Spaces](https://twitter.com/i/spaces/1mnxedEZzVPJX). +- Watch the [recording](https://youtu.be/D0gIgjozOzc). + +## Tuesday: Something for the Frontend team + +![Tuesday: Something for the Frontend team](/images/blog/launch-week-4/friday-before/beatles.png) + +### What? + +If Postgres could talk it would sing “I am the WALRUS”. +Since last Launch Week we've been busy shipping. Tune in on Tuesday to learn about a brand new way to fetch your data. + +[GraphQL is now available in Supabase!](/blog/2022/03/29/graphql-now-available) + +### When? + +Tuesday 29 March 2022: 9am PT + +### Where? + +- Read the [blog post](/blog/2022/03/29/graphql-now-available). +- Listen back to the [Twitter Spaces](https://twitter.com/i/spaces/1dRKZlAQPaVJB). +- Watch live on [YouTube](https://youtu.be/fApxu_U_hdw). + +## Wednesday: Something for the Enterprise + +![Wednesday: Something for the Enterprise](/images/blog/launch-week-4/friday-before/channel-4-news.png) + +### What? + +Tune in to ~~Channel~~ Launch Week Four News updates to hear about some classy Enterprise updates. +100% of the time, it works every time. + +[Introducing Supabase Enterprise](/blog/2022/03/30/supabase-enterprise). + +### When? + +Wednesday 30 March 2022: 9am PT + +### Where? + +- Read the [blog post](/blog/2022/03/30/supabase-enterprise). +- Listen back to the [Twitter Spaces](https://twitter.com/i/spaces/1dRKZlAdaawJB). +- Watch live on [YouTube](https://youtu.be/UZrl1cwzTDg). + +## Thursday: Something for the Fullstack team + +![Thursday: Something for the Fullstack team](/images/blog/launch-week-4/friday-before/fantastic.png) + +### What? + +This one's gonna be hotter than the Human Torch 🔥, more scalable than Mister Fantastic, more rock solid than The Thing,~ +~and the latency will be harder to find than Invisible Woman. + +[Edge Functions are now available in Supabase](/blog/2022/03/31/supabase-edge-functions) + +### When? + +Wednesday 31 March 2022: 9am PT + +### Where? + +- Read the [blog post](/blog/2022/03/31/supabase-edge-functions). +- Listen back to the [Twitter Spaces](https://twitter.com/i/spaces/1dRKZlAdaawJB). +- Watch live on [YouTube](https://youtu.be/fApxu_U_hdw). + +## Friday: Something for everybody + +![Friday: Something for everybody](/images/blog/launch-week-4/friday-before/turtles.png) + +### What? + +Absolutely, definitely not an April Fool's joke. Friday is reserved for “one more thing(s)” - +a secret announcement of some sort. There's always too much to ship in a week, so let's be honest - +it's never really just _one_ more thing. + + +### When? + +Friday 1 April 2022: 9am PT + +### Where? + +- [Supabrew - Never Code Thirsty](/blog/2022/04/01/supabrew) +- [Supabase Realtime, with Multiplayer Features](/blog/2022/04/01/supabase-realtime-with-multiplayer-features) + + +## Wrap-up Hackathon: Bring the func(🕺) + +![Untitled](/images/blog/launch-week-4/friday-before/dino.png) + +### What + +Finally, we're continuing our tradition of wrapping up Launch Week by rolling into a 10-day virtual Hackathon. +As always, you'll have the chance to win extremely limited Supabase Swag, +and you'll be able to play around with the new features we're about to launch. + +We're also delighted to be partnering with [the future forest company](https://thefutureforestcompany.com/) +to plant a tree for every project that is being submitted for the Hackathon. +So let's build some cool open-source projects and a forest at the same time! + +### When + +Friday 1 April 2022: 9:00am PT - Sunday 9 April 11:59pm PT + +### Where + +We're extremely excited to see what you'll build and can't wait to dive into your submissions on +[madewithsupabase.com](https://www.madewithsupabase.com/). + +Check out the blog post - [Hackathon: Bring the Func](/blog/2022/04/01/hackathon-bring-the-func). diff --git a/www/_blog/2022-03-28-community-day.mdx b/www/_blog/2022-03-28-community-day.mdx new file mode 100644 index 00000000000..58cecc1cf79 --- /dev/null +++ b/www/_blog/2022-03-28-community-day.mdx @@ -0,0 +1,227 @@ +--- +title: 'Community Day' +description: Kicking off Launch Week IV with contributors, partners, and friends. +author: thor_schaeff +author_url: https://github.com/thorwebdev +author_image_url: https://github.com/thorwebdev.png +authorURL: https://github.com/thorwebdev +image: launch-week-4/community-day/community-day-thumb.png +thumb: launch-week-4/community-day/community-day-thumb.png +tags: + - launch-week + - community +date: '2022-03-28' +toc_depth: 3 +--- + +Supabase combines existing open-source tools with our own open-source contributions to provide a delightful experience for all developers. As part of this, we’re building a community of communities, bringing together developers from many different backgrounds, as well as new developers looking to get involved with open source. + +To kick off launch week, as it is now tradition, we’re showcasing some of the communities and contributors that make up the Supabase community, highlighting their awesome work, and celebrating everyone who contributes their time to the Supabase mission. 💚 + +## Launch Week IV - what to expect + +Supabase Launch Week was born out of [YC Demo Day](https://www.ycombinator.com/demoday), a looming deadline towards the end of each Y Combinator batch. A deadline that forces you to deliver a lot of complex functionality in a short amount of time. + +With Launch Week, we replicate Demo Day conditions, but for a whole week! This is the secret formula that works for us: + +- The Friday before, we publish a blog post about a topic of interest (e.g. [How we launch at Supabase](https://supabase.com/blog/2021/11/26/supabase-how-we-launch), or this time around we [explore whether you should open source your company](https://supabase.com/blog/2022/03/25/should-i-open-source-my-company) — hint: we think you most likely should!) as well as an [overview blogpost](https://supabase.com/blog/2022/03/25/supabase-launch-week-four) with tons of memes and hints to what we’re shipping each day. +- Monday is Community Day, where we rally many of the awesome contributors and partners together and showcase awesome things around Supabase and open-source. This is also the time to watch out for the [#SupaLaunchWeek hashtag on Twitter](https://twitter.com/hashtag/SupaLaunchWeek?src=hashtag_click) as we arm our guest speakers, [Angels](https://supabase.com/blog/2021/03/25/angels-of-supabase), and [SupaSquad](https://supabase.com/docs/handbook/supasquad) with free swag codes. +- Tuesday, Wednesday, and Thursday are the big feature launches. +- Friday has become the feature kitchen sink, as we ship too many things to fit into one week. It’s our “One more thing(s)” day. +- And last but not least, coming out of Launch Week, we roll into a 10 day virtual hackathon with the community submitting tons of awesome projects to [madewithsupabase.com](https://www.madewithsupabase.com/), which, once upon a time, was a hackathon project itself. I know, quite the inception kinda stuff - so cool! + +We repeat this roughly on a quarterly cadence, and I’ll tell ya, it becomes positively addictive. So strap in, and join us for a week of Fun(🕺). + +## Supabase is now a GitHub secret scanning partner + +![community-day-github.png](/images/blog/launch-week-4/community-day/community-day-github.png) + +GitHub secret scanning protects users by searching repositories for known types of secrets. By identifying and flagging these secrets, GitHub’s scans help prevent data leaks and fraud. + +[We have partnered with GitHub](https://github.blog/changelog/2022-03-28-supabase-is-now-a-github-secret-scanning-partner/) to scan for Supabase service role API keys, which allow full access to the database. If they detect any keys with `service_role` privileges being pushed to GitHub, they will forward the API key to us, so that we can automatically revoke the detected secrets and notify you - protecting your data against malicious actors. + +## PostgREST 10 Pre-Release + +![community-day-postgrest10.png](/images/blog/launch-week-4/community-day/community-day-postgrest10.png) + +PostgREST v10 is not wrapped up yet, however a pre-release with the [latest features and fixes](https://postgrest.org/en/latest/releases/latest.html) is already available for Supabase users. v10 is mostly focused on improving availability and includes improvements to the API (and therefore [supabase-js](https://github.com/supabase/supabase-js)) too. + +### Composite Types fields and Array Type elements + +In prior versions, [computed columns](https://github.com/supabase/supabase/discussions/2825#discussioncomment-1167121) were required to access composite types fields or +array elements. This is no longer the case. You can now use the usual arrow operators (`->`) to do this. Assuming you have: + +```sql +create type full_name as ( + first_name text, + middle_names text[], + first_surname text, + second_surname text, + reign_name text +); + +create table famous_people ( + name full_name, + occupation text +); +``` + +You can query for the `full_name` fields and just an element of its `middle_names` array with: + +```jsx +const { data, error } = await supabase + .from('users') + .select( + ` + name->first_name, + name->middle_names->0, + name->first_surname, + occupation` + ) + .eq('name->reign_name', 'Edward VIII') + +console.log(data) +// { +// "first_name": "Edward", +// "middle_names": "Albert", +// "first_surname": "David", +// "occupation": "King of the United Kingdom" +// } +``` + +### Improved error messages + +For better typing, PostgREST is committing to a standard form for all its errors. It follows the PostgreSQL format with the `message`, `detail`, `hint` and `code` fields, these will always show (with `null` as a default) in every error response. For more details you can check the [Errors page](https://postgrest.org/en/latest/errors.html). + +### Improved availability + +Linux's [EMFILE](https://blog.izs.me/2013/07/wtf-is-emfile-and-why-does-it-happen-to-me/) ("Too many open files") affected PostgREST when it was under heavy load, +sometimes making it unresponsive and in need of a manual restart. This is no longer the case and it will now recover from EMFILE. + +Additionally, PostgREST now has [liveness and readiness checks](https://postgrest.org/en/latest/admin.html#health-check) which allows the Supabase infrastructure team to check its state to help it recover if necessary. + +### Upcoming + +When finished, PostgREST v10 will also include the ability to `limit` updates and deletes affected rows plus some other goodies for mutations. + +## Auth updates + +### New OAuth providers + +![community-day-auth-providers.png](/images/blog/launch-week-4/community-day/community-day-auth-providers.png) + +The beauty of open source is that anyone can contribute to make the project even better. This is especially true for supabase-auth as we get contributions and ideas for new oauth providers every month! This launch week, we’ve had 4 new OAuth provider contributions: + +- [Keycloak](https://supabase.com/docs/guides/auth/auth-keycloak) ([@fspijkerman](https://github.com/fspijkerman)) +- [Notion](https://supabase.com/docs/guides/auth/auth-notion) ([@zernonia](https://github.com/zernonia)) +- [Zoom](https://supabase.com/docs/guides/auth/auth-zoom) ([@devkiran](https://github.com/devkiran)) +- [WorkOS](https://supabase.com/docs/guides/auth/auth-workos) ([@bnjmnt4n](https://github.com/bnjmnt4n)) + +### New Phone providers + +![community-day-auth-phone.png](/images/blog/launch-week-4/community-day/community-day-auth-phone.png) + +We’ve also added 2 new phone providers from the same contributor: + +- [Vonage](https://supabase.com/docs/guides/auth/auth-vonage) ([@devkiran](https://github.com/devkiran)) +- [TextLocal](https://github.com/supabase/gotrue/pull/342) ([@devkiran](https://github.com/devkiran)) + +If you haven’t tried out phone auth yet, check out [this blog post](https://supabase.com/blog/2021/07/28/supabase-auth-passwordless-sms-login) to get started! + +### Send OTP via Email + +We’ve added support for sending an OTP via email instead of url links. All you have to do is to add `{{ .Token }}` in your email templates. You can use the `verifyOTP` method to verify the otp sent. + +![Untitled](/images/blog/launch-week-4/community-day/Untitled.png) + +### Server-side auth for Next.js and Nuxt (SvelteKit and Remix coming soon) + +![supabase-auth-helpers-nextjs.png](/images/blog/launch-week-4/community-day/supabase-auth-helpers-nextjs.png) + +While server-side auth has always been possible, we’ve heard from many of you that auth can be tough, especially when doing server-side rendering (SSR) or using the new Next.js middleware capabilities. + +That’s why we’ve built the [supabase-auth-helpers](https://github.com/supabase-community/supabase-auth-helpers), a collection of framework-specific auth utilities that make working with Supabase Auth a pleasant experience, no matter what framework you’re using. + +We’ve started with Next.js, and we’re working on helpers for Remix, and SvelteKit, so make sure to star and watch the repo! + +We’ve also worked with our friends at Vercel to update our https://github.com/vercel/nextjs-subscription-payments example to use the new auth helpers. + +In parallel, our friends at [NuxtLabs](https://nuxtlabs.com/) have developed [Supabase helpers for Nuxt 3](https://github.com/nuxt-community/supabase-module), and it’s a damn nice DX. [Check it out](https://supabase.nuxtjs.org/)! + +As always, all of this is open-source. Feedback, feature requests, and contributions are very welcome! + +## Open Source Spotlight: Charm.sh + +[Charm.sh](http://Charm.sh) builds open-source tools that make the command line glamorous. If you use the [Supabase CLI](https://supabase.com/docs/reference/cli/about) you’ve probably come across some of their features already, and we plan to utilise more of them in the future to improve our CLI experience further. + +For our community day open source spotlight feature, we’re delighted to have [Bashbunni](https://twitter.com/bash_bunni) give us an overview of what’s possible with Charm: + + + +## New courses and learning materials + +### Ionic Quickstart Guides + +![community-day-iconic.png](/images/blog/launch-week-4/community-day/community-day-iconic.png) + +The awesome folks at [Ionic](https://twitter.com/Ionicframework) have put together some quickstart guides for [Angular](https://supabase.com/docs/guides/with-ionic-angular), [React](https://supabase.com/docs/guides/with-ionic-react), and [Vue](https://supabase.com/docs/guides/with-ionic-vue). These guides walk you through building an app which allows users to login and update some basic profile details. + +### Everything Svelte + +![Untitled](/images/blog/launch-week-4/community-day/Untitled%201.png) + +From the good folks at Everything Svelte, this course teaches you everything you need to know to build to a custom full stack web application. They start from scratch (no starter files!) then take it one step at a time, building the frontend *and* backend. This course explores topics like authentication, accepting payments, relational databases, testing, and automatic deployment. + +Head over to [everythingsvelte.com](https://www.everythingsvelte.com/) and sign up to get notified when the course launches later in spring! + +### Level Up Tutorials + +![community-day-level-up.png](/images/blog/launch-week-4/community-day/community-day-level-up.png) + +Excited to see what all the fuss is about with this new framework called Remix? Played with Remix and wanna go deeper integrating Supabase? We’ve got you covered! Jon has been working with Scott Tolinski over at [Level Up Tutorials](https://leveluptutorials.com/) to create the perfect guide for building a fullstack, authenticated, realtime application using Remix and Supabase. + +This goes much deeper than your basic “hello world” or “todo: app, showing how to use loaders and actions in Remix to synchronize complex state between multiple clients. The course uses Row Level Security to implement access policies within the database, and shows how cookies can be used to query Supabase from the server-side. + +Join us for the [official course drop party on YouTube](https://www.youtube.com/watch?v=rntEMgaenHs) where we will be doing a Q&A about Supabase, Remix and what will be covered in the course. + +Can’t make the event? Chuck your name on the [mailing list](https://jonmeyers.io/subscribe/remix) and we’ll let you know when the course is live (and maybe even send out some exclusive discounts! 🤫) + +### Egghead tutorials featuring SupaSquad + +![community-day-egghead.png](/images/blog/launch-week-4/community-day/community-day-egghead.png) + +After a flood of positive feedback on Jon’s “[Build a SaaS product with Next.js, Supabase and Stripe](https://egghead.io/courses/build-a-saas-product-with-next-js-supabase-and-stripe-61f2bc20)” [Egghead.io](http://Egghead.io) course, we’re doubling down with Egghead this year, partnering with them to build more tailored pathways for learning Supabase. + +We’ll be working with our fabulous [SupaSquad](https://supabase.com/docs/handbook/supasquad) to identify the right instructors for all the different topics we’re looking to cover. If you’re interested in becoming an instructor for Supabase on Egghead, fill in the [form to join](https://supabase.com/docs/handbook/supasquad#how-to-join) the SupaSquad. + +Also, do let us know what topics you’d like to learn about [on Twitter](https://twitter.com/supabase). + +## Launching the Supabase Partner Gallery + +![community-day-integrations.png](/images/blog/launch-week-4/community-day/community-day-integrations.png) + +We’ve been blown away by the amazing integrations that developers and companies have been building on top of Supabase. To keep track of all the things that work with Supabase, we’re launching a partner gallery which allows you to browse integrations and experts. Check it out at [supabase.com/partners](https://supabase.com/partners). + +If you’ve built an integration that works with Supabase or have experience working with Supabase and want to offer your services to others, we’d love to hear from you: [supabase.com/partners/#become-a-partner](https://supabase.com/partners/#become-a-partner) + +Of course the code for our partner gallery is also open source, and we’ve even split it out into a separate example repository which is a neat showcase of how to use [Postgres Full Text Search](https://supabase.com/docs/guides/database/full-text-search). It’s super powerful, it’s like a search engine within Postgres! + +## Hackathon + +On Friday, 1st of April, at the end of Launch Week, we’ll be rolling into another one of our 10-day virtual Hackathons. As always, you’ll have the chance to win extremely limited Supabase Swag, and you’ll be able to play around with the new features we’re about to launch. + +We’re extremely excited to see what you’ll build and can’t wait to dive into your submissions on [madewithsupabase.com](https://www.madewithsupabase.com/). + +We’re also delighted to be partnering with [the Future Forest Company](https://thefutureforestcompany.com/) to plant a tree for every project that is being submitted for the Hackathon. Let’s build some cool open-source projects and start a forest at the same time! + +## Let’s get launching 🚀 + +And with that, we officially declare Launch Week as open! Check back [here](/blog/2022/03/25/supabase-launch-week-four) every day this week to see what new things we are shipping. We can't wait to share them with you! diff --git a/www/_blog/2022-03-29-graphql-now-available.mdx b/www/_blog/2022-03-29-graphql-now-available.mdx new file mode 100644 index 00000000000..dc2e53fa8ff --- /dev/null +++ b/www/_blog/2022-03-29-graphql-now-available.mdx @@ -0,0 +1,324 @@ +--- +title: 'GraphQL is now available in Supabase' +description: GraphQL support is now in general availability on the Supabase platform via our open source PostgreSQL extension, pg_graphql (beta). +author: oli_rice,dthyresson +image: launch-week-4/tuesday-graphql/graphql-thumb-og.png +thumb: launch-week-4/tuesday-graphql/graphql-thumb.png +tags: + - launch-week + - graphql +date: '2022-03-29' +toc_depth: 3 +--- + +GraphQL support is now in general availability on the Supabase platform via our [open source](https://github.com/supabase/pg_graphql/) PostgreSQL extension, +[`pg_graphql](https://supabase.github.io/pg_graphql/) (beta)`. + +![supameme.png](/images/blog/launch-week-4/tuesday-graphql/supameme.png) + +`pg_graphql` enables you to query existing PostgreSQL databases using GraphQL, either from within SQL or over HTTP: + +From SQL: + +```sql +select graphql.resolve($$ + { + accountCollection(first: 1) { + edges { + node { + id + firstName + address { + countryCode + } + } + } + } + } +$$); +``` + +or over HTTP: + +```bash +curl -X POST https://.supabase.co/graphql/v1 \ + -H 'apiKey: '\ + -H 'Content-Type: application/json' \ + --data-raw ' + { + "query":"{ accountCollection(first: 3) { edges { node { id } } } }" + }' +``` + +## Schema Reflection + +GraphQL types and fields are reflected from the SQL schema: + +- Tables become types +- Columns become fields +- Foreign keys become relations + +For example: + +```sql +create table "Account"( + "id" serial primary key, + "email" varchar(255) not null, + "createdAt" timestamp not null, + "updatedAt" timestamp not null +); + +-- Rebuild the GraphQL Schema Cache +select graphql.rebuild_schema(); +``` + +Translates to the GraphQL base type + +```graphql +type Account { + id: Int! + email: String! + createdAt: DateTime! + updatedAt: DateTime! +} +``` + +And exposes bulk CRUD operations on the `Query` and `Mutation` types, complete with relay style keyset pagination, filters, and ordering and (optional) name inflection. + +```graphql +type Query { + accountCollection( + first: Int + last: Int + before: Cursor + after: Cursor + filter: AccountFilter + orderBy: [AccountOrderBy!] + ): AccountConnection +} + +type Mutation { + insertIntoAccountCollection( + objects: [AccountInsertInput!]! + ): AccountInsertResponse + + updateAccountCollection( + set: AccountUpdateInput! + filter: AccountFilter + atMost: Int! = 1 + ): AccountUpdateResponse! + + deleteFromAccountCollection( + filter: AccountFilter + atMost: Int! = 1 + ): AccountDeleteResponse! +``` + +For a complete example with relationships, check out the [reflection docs](https://supabase.github.io/pg_graphql/reflection/). + +## Security + +An advantage to embedding GraphQL directly in the database is that we can lean on PostgreSQL's built-in primitives for authentication and authorization. + +### Authentication + +The GraphQL types exposed by `pg_graphql` are filtered according to the SQL role's [INSERT/UPDATE/DELETE permissions](https://www.postgresql.org/docs/current/sql-grant.html). +At Supabase, each API request is resolved in the database using the role in the request's JWT. + +Anonymous users receive the `anon` role, and logged in users get the `authenticated` role. In either case, pg_graphql resolves requests according to the SQL permissions. +The [introspection schema](https://graphql.org/learn/introspection/) is similarly filtered to limit exposed types and fields to those that the user has permission to access. +That means we can serve multiple GraphQL schemas for users of differing privilege levels from a single endpoint! + +### Authorization + +Another nice side effect of making PostgreSQL do the heavy lifting is that GraphQL queries respect your existing +[row level security policies](https://www.postgresql.org/docs/current/ddl-rowsecurity.html) right out-of-the-box. No additional configuration required. + +## Performance + +Each [free tier database](https://supabase.com/pricing) on the Supabase platform runs on a dedicated AWS t4g.micro instance with 2 vCPUs and 1 GB of memory. +To squeeze the most out of that limited hardware we had to make a few significant optimizations: + +**GraphQL queries are always transpiled into exactly one SQL query** + +The SQL queries select and aggregate requested data into the shape of the GraphQL JSON response. +In addition to solving the [N+1 query problem](https://medium.com/the-marcy-lab-school/what-is-the-n-1-problem-in-graphql-dd4921cb3c1a), a common issue with GraphQL resolvers, +GraphQL queries requiring multiple joins typically produce significantly less IO due to reduced data duplication. + +For example, when selecting all comments for a blog post: + +```sql +select + blog_posts.title, + comments.body as comment_body +from + blog_posts +join + comments on blog_posts.id = comments.blog_post_id +``` + +a SQL response would duplicate all data from the `blog_posts` table (title). + +```markdown +| title | comment_body | +| ---------- | ------------------------------ | +| F1sRt P0$T | this guy gets it! | +| F1sRt P0$T | you should re-write it in rust | +| F1sRt P0$T | 10% off daily vitamin http:... | +``` + +Compared to the equivalent GraphQL response. + +```json +{ + "blogPostCollection": { + "edges": { + "node": + "title": "F1sRt P0$T" + "commentCollection": { + "edges": [ + "node": { + "body": "this guy gets it!" + }, + "node": { + "body": "you should re-write it in rust" + }, + "node": { + "body": "10% off daily vitamin http:..." + } + ] + } + } + } + } +} +``` + +Which has no duplication of data. + +The difference in payload size is negligible in this case, but as the number of 1-to-many joins grows, data duplication in the SQL response grows geometrically. + +**Queries are cached as [prepared statements](https://www.postgresql.org/docs/current/sql-prepare.html)** + +After a GraphQL query is transpiled to SQL, it is added to the prepared statement cache so subsequent requests with the same structure (think pagination) can skip the transpilation step. + +Using prepared statements also allows PostgreSQL to skip the overhead of computing a query plan. For small, on-index, queries, +the query planning step can take several times as long as the query's execution time, so the saving is significant at scale. + +**All operations are bulk** + +Finally, all reflected query and mutation fields support bulk operations to nudge users towards consuming the API efficiently. +Batching similar operations reduces network round-trips and time spent in the database. + +**Result** + +As a result of these optimizations, the throughput of a “hello world” equivalent query on Supabase free-tier hardware is: + +- 377.4 requests/second through the API (mean) +- 656.2 queries/second through SQL (single connection, mean) + +## Getting Started + + + +To enable GraphQL in your Supabase instance, enable `pg_graphql` from the dashboard. + + + +Or create the extension in your database + +```sql +create extension pg_graphql; +``` + +And we're done! + +The GraphQL endpoint is available at: `https://.supabase.co/graphql/v1` + +## Example app: Build a HN clone with Postgres and GraphQL + +![graph-ql-example-app.png](/images/blog/launch-week-4/tuesday-graphql/graph-ql-example-app.png) + +We're excited to have worked with [The Guild](https://www.the-guild.dev) to show you [how to use](https://supabase-graphql-example.vercel.app/about) `pg_graphql` +and their tools to build a [HackerNews clone](https://supabase-graphql-example.vercel.app/). + +The [demo application](https://supabase-graphql-example.vercel.app/) showcases: + +- **CRUD (Query + Mutation Operations).** + Data is fetched from the GraphQL layer auto-generated via `pg_graphql`. +- **Cursor Based Pagination.** + `pg_graphql` generates standardized pagination types and fields as defined by the GraphQL Cursor Connections Specification. +- **Authorization / RLS.** + GraphQL requests made include Supabase authorization headers so that Row Level Security on the Postgres layer ensures that viewers can only access what they are allowed to — and authenticated users can only update what they should. +- **Code generation.** + Introspect your GraphQL schema and operations to generates the types for full backend to frontend type-safety. +- **Postgres Triggers and Functions.** + Recalculate the feed scoring each time someone votes. +- **Supabase UI.** + Use Auth widget straight out the box to handle logins and access tokens. + +![graph-ql-example-app-2.png](/images/blog/launch-week-4/tuesday-graphql/graph-ql-example-app-2.png) + +Now instead of using the Supabase PostgREST API to query your database ... + +```jsx +// using Supabase PostgREST + +const { data, error } = await supabase + .from('profile') + .select('id, username, bio, avatarUrl, website') +``` + +... all data fetching and updates are done using the same GraphQL operations you know and love! 🤯 + +``` +// using GraphQL + +query ProfilesQuery { + profileCollection { + edges { + node { + id + username + bio + avatarUrl + website + } + } + } +} +``` + +🎁  Get the code on GitHub here: [github.com/supabase-community/supabase-graphql-example](https://github.com/supabase-community/supabase-graphql-example) + +## Supabase + The Guild + +![graphql-supabase-guild.png](/images/blog/launch-week-4/tuesday-graphql/graphql-supabase-guild.png) + +This is just the start of what we hope to be a close collaboration with the Guild, whose expertise of the GraphQL ecosystem will guide the development of Supabase's GraphQL features. +The Guild and Supabase share a similar approach to open source - we both favor collaboration and composability, making collaboration easy and productive. + +Be sure to visit [The Guild](https://www.the-guild.dev) and [follow them](https://twitter.com/TheGuildDev) to stay informed of the latest developments in GraphQL. + +## Limitations & Roadmap + +Our first general availability release of `pg_graphql` supports: + +- Full CRUD on table columns with scalar types +- Read only support for array types +- Extending types with [computed fields](https://supabase.github.io/pg_graphql/computed_fields/) +- Configuration with [SQL comments](https://supabase.github.io/pg_graphql/configuration/) + +In the near term, we plan to fully support array and json/b types. Longer term, we intend to support views and custom mutations from user defined functions. + +Didn't see the feature you're interested in? [Let us know](https://github.com/supabase/pg_graphql/issues) diff --git a/www/_blog/2022-03-30-supabase-enterprise.mdx b/www/_blog/2022-03-30-supabase-enterprise.mdx new file mode 100644 index 00000000000..568afd907ad --- /dev/null +++ b/www/_blog/2022-03-30-supabase-enterprise.mdx @@ -0,0 +1,278 @@ +--- +title: 'Introducing Supabase Enterprise' +description: 'Today we are releasing Supabase Enterprise, a suite of features to scale your project.' +author: rory_wilding,paul_copplestone +image: launch-week-4/enterprise-day/enterprise-thumb.png +thumb: launch-week-4/enterprise-day/enterprise-thumb.png +tags: + - launch-week + - enterprise +date: '2022-03-30' +toc_depth: 3 +--- + +As our platform continues its rapid adoption within the developer community, we're seeing a growing segment of users building business-critical applications that require enterprise-grade resilience. + + + +## Enterprise features for everybody + +Some features are too good to limit to large customers, so today we're introducing a few enterprise features into the Pro tier. + +### Spend caps + + + +To simplify pricing, we've merged the “Pro” and “Pay as you go” tiers and introduced monthly spend caps to avoid nasty billing surprises. +These changes are to keep Supabase pricing [predictable, transparent, and developer friendly](/blog/2021/03/29/pricing). + +When you upgrade to the Pro Tier, spend caps are turned on by default, limiting your per-project costs to $25 per month. +We're also retaining our soft limits while we manage the transition to granular spend-caps, so your service will continue to run even if your usage exceeds $25 (we'll contact you directly when you go over the limit). Right now there is a global project spend-cap, and in the future you'll have full control with configurable spend-caps on a “per-feature” basis. + +### Database Add-ons + + + +Today we're releasing self-serve Database Add-ons. + +What do you do when your project hits production and your userbase is sky-rocketing? +Many developers have been asking to scale their projects on-demand. Database Add-ons give everyone this control. + +Today, Database Add-ons are available for a small set of customers. We will progressively release this for everyone by the end of next week (Friday 8th April). + +### New Log Explorer + + + + +Today we're releasing a brand new [Log Explorer](/docs/guides/platform/logs) in the Supabase Dashboard. +As big advocates of SQL, we've done what any good Postgres fanatics would do - we're giving you the ability to query your logs using SQL. +And if you're new to SQL, we have plenty of templates included. +This is just one of the exciting features we are releasing through our [Logflare acquisition](/blog/2021/12/02/supabase-acquires-logflare). +Log history is available to every Supabase project: + +- Free Tier: 7 days of log history +- Pro Tier: 30 days of log history +- Enterprise Tier: 90 days of log history + +### Elixir Livebooks + +Today we're releasing [Elixir Livebooks for Monitoring](https://github.com/supabase/livebooks), starting with built-in monitoring for PgBouncer, a Postgres connection pooler. + +![PGBoucner](/images/blog/launch-week-4/enterprise-day/pg-bouncer.png) + +While our default PgBouncer settings work for 98% of our customers, sometimes they require customization for unique load patterns. +For example, Supabase is popular with web3 projects where traffic can be very unpredictable - especially when you partner with Snoop Dogg. +When [sound.xyz](http://sound.xyz) dropped [an NFT with Snoop](https://www.sound.xyz/snoopdogg/death-row-mix-vol-1), we customized their pooler to handle significant load. +Their database handled over 9,000 simultaneously connections from Vercel's serverless API. + + +

In our MVP, we started with a serverless stack to simplify DevOps. Supabase made it dead simple to get PgBouncer and Postgres running so we could focus on the product.

+

+ As we started hitting scale, they've been crucial to supporting our drops. When Snoop Dogg debuted on Sound, Supabase was able to help us provision our data store to handle the load. +

+

+ As we rearchitect our backend stack towards scaled microservices, we can be confident that managing Postgres won't be a bottleneck. +

+

+ Supabase takes out the mental effort from our back-end infrastructure so we can focus on our + customers needs. +

+ + +If you want to monitor your own PgBouncer connections you can easily [spin up a Livebook](https://github.com/supabase/livebooks) on a free [Fly.io](http://fly.io) instance. + +## Enterprise Features + +With the release of our new Enterprise Tier, we're announcing a tonne of new features for Enterprise customers. + +### Point-in-Time Recovery + + + +Disaster Recovery is a critical process for any company, even for the most fault-tolerant products. What happens when you accidentally delete that database column +because of a clumsy `where` clause? Even with Supabase's daily backups, a day's worth of data can be lost if disaster strikes at the most inopportune time. + +Every Enterprise project on the Supabase platform has access to Point-in-Time Recovery (PITR), allowing projects to recover from a snapshot mere seconds after a disaster. +Supabase PITR is powered by [WAL-G](https://github.com/wal-g/wal-g), an open source archival and restoration tool. + +### Prometheus Endpoints + +![Prometheus](/images/blog/launch-week-4/enterprise-day/prometheus.png) + +If you run critical infrastructure you likely use Prometheus to monitor your metrics. We've now exposed a Prometheus compatible endpoint for our Enterprise customers. +This allows them to scrape Supabase metrics into their own metrics infrastructure for real-time monitoring and alerting. This makes monitoring Supabase as easy as building with Supabase. + +If you want access to the Prometheus Endpoint, [contact the Supabase Enterprise team](/contact/enterprise) today and we'll get you setup. + +### SLAs & Enterprise Support + + + +For our enterprise customers we know that service level agreements and support response times are also critical features. We continue to treat support as an +important priority for all tiers, though enterprise users require confidence that our response times meet their business needs. We now offer faster response times for Enterprise customers, +alongside Priority and Priority Plus support packages for those who need more comprehensive support. You can find further details around our SLAs & support +[in our documentation](/docs/company/sla). + +### Enterprise Pricing + +![enterprise-pricing](/images/blog/launch-week-4/enterprise-day/enterprise-pricing.png) + +If you need more information on our Enterprise tier, Pricing, SLAs, Support packages, or want to learn more about how Supabase can meet your scaling needs just +[contact us](/contact/enterprise). + +## Coming soon + +We have a lot more Enterprise features under development, available to early-access customers: + +### SOC2 + +We are actively working towards our SOC2 Type II certification by monitoring and patching alerts raised by our security monitoring platform. +SOC2 covers a wide spectrum of potential security areas and achieving SOC2 would also ease compliance with other major certifications like ISO-27001 and HIPAA. + +### Log ingestion + +Supabase is now ingesting over 4 billion log events every week, just from the Postgres instances we host on the platform. +Soon you'll be able to ingest logs and analytics from anywhere directly into your Supabase project. + +### Foreign Data Wrappers + +Ingesting your logs is one thing, but what about querying them directly from your PostgreSQL database? What if you can figure out how many API requests one of your users made last month? +Or how many gigabytes of video a user streamed from [Supabase Storage](/storage)? Watch this space! + +### Materialized Views + +Querying huge datasets can be time-consuming, especially when you are aggregating billions of rows of historical logs. Supabase will make this simple with auto-updating views, +saved to disk for increased performance. These views update periodically at a cadence that you decide. You'll even be able to fetch these views with your +[Supabase API](/docs/guides/api)! + +## Next steps + +Get started today with all of our Enterprise Features on [app.supabase.io](https://app.supabase.io), or [contact the Supabase Enterprise team](/contact/enterprise) +if you want to access our Enterprise features. diff --git a/www/_blog/2022-03-31-supabase-edge-functions.mdx b/www/_blog/2022-03-31-supabase-edge-functions.mdx new file mode 100644 index 00000000000..3f40ac2e2d4 --- /dev/null +++ b/www/_blog/2022-03-31-supabase-edge-functions.mdx @@ -0,0 +1,141 @@ +--- +title: Edge Functions are now available in Supabase +description: Today we're launching Edge Functions. Edge Functions let you execute Typescript code close to your users, no matter where they're located. +author: inian +image: launch-week-4/thursday-functions/functions-thumb.png +thumb: launch-week-4/thursday-functions/functions-thumb.png +tags: + - launch-week + - functions +date: '2022-03-31' +toc_depth: 3 +--- + +Today we're launching one of our [most](https://twitter.com/lau_cazanove/status/1506530181946691592) [requested](https://twitter.com/edgarasben/status/1506653203458363393) and [highly-](https://twitter.com/runjep/status/1507462077216088069)[anticipated](https://twitter.com/marcopolotwo/status/1506431782362632195) [features](https://github.com/supabase/supabase/discussions/4269) — Edge Functions. Edge Functions let you execute Typescript code close to your users, no matter where they're located. + +Edge Functions are executed on the secure-by-default [Deno runtime](https://deno.land/), and deployed around the world in seconds using Deno's [hosted Deno Deploy offering](https://deno.com/deploy). However, as a user of Supabase Edge Functions, you don't need to know or worry about any of that; we handle all the gnarly details, delivering a seamless experience that allows you to focus on your business logic. + +## Choosing a platform + +Serverless compute options can be broken down into two broad categories: + +- Containers as a Service (e.g. Google Cloud Run, Fly.io) +- Functions as a Service (e.g. AWS Lambda, Cloudflare Workers, Fastly Compute @ Edge, Suborbital) + +Additionally, there are self-hosted offerings within each category as well (e.g. Firecracker sort-of for the former, OpenFaaS for the latter). + +Our first critical decision was to choose Functions as a Service (”FaaS”) over Containers and other alternatives. While Containers can allow for more flexible workloads, authoring and maintaining Functions allows for a substantially simpler developer experience-something Supabase has always focused on. As a Supabase user, all you need to think about is the business logic you wanted to write a Function for in the first place; you don't need to think about optimizing docker image builds, updating your system dependencies, etc. + +Additionally, while a lot of work has been invested in improving container start-up times, Functions generally still enjoy significantly faster start-ups. + +Our next major decision was to choose global deployments instead of a deploying to a specific geographical region. +![Functions deployment region](/images/blog/launch-week-4/thursday-functions/where-functions-deploy.png) +Launching Functions in a single region (e.g. close to your database) can present a lot of advantages if there are a lot of database operations being executed within your business logic. + +However, Supabase already offers a flexible solution for that - [Database Functions](https://supabase.com/docs/guides/database/functions)! As such, for Supabase [Edge] Functions, we decided to deploy far-and-wide so that they are as close to your end-users as possible. You can even invoke a Database Function from an Edge Function, allowing you to enjoy the best of both worlds. + +## The Deno runtime + +Deno is a modern Typescript and JavaScript runtime created with first-class support for web technologies. Here some of the reasons why we're excited about Deno: + +### Open-source + +_Deno Deploy_ is Deno's hosted service and, although it is proprietary, the Deno CLI is open source. This means that the open source offering from Deno maintains feature-parity with the proprietary service. If you use Deno to develop functions locally, its behavior will be the same as when deployed on the edge, unlocking an incredible developer experience. We couldn't achieve a similarly seamless experience with e.g. AWS Lambda, no matter how much we tried. + +Deno even goes a step further than maintaining feature-parity, releasing all new APIs to open-source **first** before rolling them out to their hosted offering. This ensures that you can always develop and test bleeding-edge functionality locally, with all the tools you're used to and familiar with, before deploying to a hosted cloud environment. + +### Batteries included + +Deno comes with all the tools needed for a modern, productive developer experience, so you can spend less time searching through third party modules, and more time being productive. Out of the box, it includes support for Typescript, ES modules, and provides [test runners](https://deno.land/manual/testing), [formatters](https://deno.land/manual/tools/formatter), [linters](https://deno.land/manual/tools/linter), [bundlers](https://deno.land/manual/tools/bundler) and a package manager. + +### Secure by default + +Like modern web browsers, the Deno runtime executes your code in a secure sandbox by default. Functions cannot access environment variables, network or filesystem unless they are explicitly allowed. Supply chain attacks have been a daunting problem in the Node ecosystem and Deno mitigates many of these attacks by having a security-first model. + +## The Supa-Deno platform + +When a request comes in to an Edge Function you deploy on Supabase, it first lands at a “Relay”. The [Relay](https://github.com/supabase/functions-relay) acts as an API gateway, authenticating the JWT, and providing some additional functionality like logging and rate-limiting. Upon receiving the incoming request, the Relay retrieves the metadata for your Function, and uses it to construct a unique identifier (”Deployment ID”) for the Function. This Deployment ID then gets passed over to the Deno Deploy platform, which takes care of invoking your Function securely, and passing your output back to the Relay, which in turn passes it back to your end-user. + +If a user's request comes in for your Function before it has been cached by the Deno Deploy platform (a ”cold start”), it reaches out to Supabase to retrieve your Functions code, and any associated permissions and secrets. Even though this might sound like a lot of work, we've worked to ensure that these cold starts are still pretty spiffy. + +![Functions architecture](/images/blog/launch-week-4/thursday-functions/functions-architecture.png) + +The primary goal of this architecture is to reduce the amount of work done in the hot path (marked in purple above). Each component in the hot path is globally distributed so that Edge Functions start up and respond to your users' requests fast. + +### Region: Earth 🌎 + +Supabase Edge Functions are deployed to one region - Earth (and we're exploring Mars as an additional region 👽). Edge Functions are deployed to over 30 data centers in a matter of seconds, ensuring fast response times no matter where your users are located. + +[Database Functions](https://supabase.com/docs/guides/database/functions) (also served via our [REST and GraphQL APIs](https://supabase.com/docs/guides/api)) are colocated with your Postgres database, making them ideal for DB-intensive operations. These APIs can also be called seamlessly from your Supabase Edge Functions, making for a powerful combination. + +### Scale to zero + +Functions scale down to zero and you only pay for what you use. This makes them great for an extremely wide variety of workloads-whether you're starting out with extremely sporadic usage, or bursty request patterns, or using them consistently and heavily. + +## A fun and efficient Developer Experience + +Delivering a phenomenal Developer Experience is something we care about a lot at Supabase. In the serverless functions space, we've found that local development and testing, coupled with fast deploys are critical. + +We've [extended the Supabase CLI](https://supabase.com/docs/guides/local-development) to optimize the Edge Functions DX along these two dimensions. You get live-reloading, and a local Deno environment that matches the production environment, making for a great local iteration environment. + + + +Once you've tested your Function locally (or gone straight to production cos you live _on the edge_ ... get it?) it takes just seconds to deploy a new function and see the logs streaming in your Dashboard—ensuring a tight iteration loop with your production environment. + + + +Our observability pipeline has been built [using Logflare](https://supabase.com/blog/2021/12/02/supabase-acquires-logflare). Structured logs from your Edge Functions get sent to Logflare, which also processes them into metrics. Your Supabase Dashboard is able to reach out to Logflare endpoints, and with some of the [(not so) secret sauce](https://supabase.com/blog/2021/11/30/supabase-studio) from our front-end team, you get responsive charts and logs for your Edge Functions. + +![new —> deploy —> invoke —> logs](/images/blog/launch-week-4/thursday-functions/functions-new-deploy-invoke-logs.gif) +new —> deploy —> invoke —> logs + +To round off the end-to-end experience, `supabase-js` now works in Deno, making it easy to interact with the rest of your Supabase project from within your Edge Functions. Your project's URLs, API keys, and database connection strings are made available as environment variables within your Function to make this even easier. And if you want to interact with third-party APIs which require a secret key, such as Stripe, you can easily and securely make these available to your Function as environment variables via the Supabase CLI. To get an idea for what is possible, check out our examples page [here](https://github.com/supabase/supabase/tree/master/examples/edge-functions). + +## Quickstart + + + +Can't wait to get started? Develop, test, and deploy your first Supabase Edge Function in less than 7 minutes with our [Quickstart Video Tutorial](https://youtu.be/rzglqRdZUQE)! +Check the [Edge Functions Docs](https://supabase.com/docs/guides/functions) for the steps. + +## Example apps: Mobile payments with React Native and Flutter + +When researching use-cases with all of you, [processing payments](https://github.com/supabase/supabase/discussions/4269#discussioncomment-1748067) was being pointed out the most, so naturally, to support the launch, we've created example apps in collaboration with Stripe for [React Native](https://github.com/supabase-community/expo-stripe-payments-with-supabase-functions) and [Flutter](https://github.com/supabase-community/flutter-stripe-payments-with-supabase-functions), to allow you to get started and earn money even faster. + +![functions-payment-example](/images/blog/launch-week-4/thursday-functions/functions-payment.gif) + +## Can I host static sites + +Even though Deno supports [rendering `jsx` and `tsx` files](https://deno.land/manual/jsx_dom/jsx), we don't plan on becoming a website hosting provider with Edge Functions. For now, Edge Functions can only be invoked via the `POST` method. Offering secure and fast web hosting with a good developer experience is a hard problem to solve and there are [other](https://www.netlify.com/) [fantastic](https://vercel.com/) [providers](https://pages.cloudflare.com/) which do exactly that. + +From our experience launching Supabase Storage last year, becoming a hosting provider is not something you want to take lightly. Malicious folks will upload their phishing sites whenever they get a chance and this can quickly spiral out of control, causing you to land on the denylist in the [Safe Browsing dataset](https://safebrowsing.google.com/). Even though we removed the project within minutes after being notified, various ISPs had already cached the information from the Safe browsing dataset and were “helping” their users by restricting access to the Supabase domain. This isn't something we're planning to repeat. But as always, we'd love to hear your use cases and feature requests, we're just one [GitHub discussion](https://github.com/supabase/supabase/discussions) away! + +## Roadmap + +These are some of the features that are on our roadmap for functions. + +- Cron functions to trigger your function on a schedule +- Studio support and self hosting multiple functions +- Optimizing cold start times +- Wasm is a great fit for running functions and companies like [Suborbital](https://suborbital.dev/) are leading the charge by making it easy to write functions that run in a Wasm-based runtime. Deno supports Wasm natively and we plan on allowing users to write their functions in languages that compile down to Wasm like Rust. +- We can expose Deno's permission model so that you can lock down your functions further by restricting outbound connections to specific domains. +- To invoke functions, you need a valid JWT signed by your project's JWT secret. We plan on making this verification optional. This enables more use cases like hooking up Supabase functions to Stripe webhooks where the function manages it's own authentication. + +Give us a shout with your feedback and excited to see what you build in the hackathon! diff --git a/www/_blog/2022-04-01-hackathon-bring-the-func.mdx b/www/_blog/2022-04-01-hackathon-bring-the-func.mdx new file mode 100644 index 00000000000..9fcb351b8c1 --- /dev/null +++ b/www/_blog/2022-04-01-hackathon-bring-the-func.mdx @@ -0,0 +1,140 @@ +--- +title: 'Hackathon: Bring the Func(🕺)' +description: Build open-source projects with our latest features, win limited edition swag and plant a tree! +author: thor_schaeff +author_url: https://github.com/thorwebdev +author_image_url: https://github.com/thorwebdev.png +authorURL: https://github.com/thorwebdev +image: launch-week-4/friday-hackathon/hackathon-fun-og.png +thumb: launch-week-4/friday-hackathon/hackathon-fun-og.png +tags: + - hackathon + - community +date: '2022-04-01T16:00:00' +toc_depth: 3 +--- + +We can’t believe that it’s already a wrap on our [fourth launch week](https://supabase.com/blog/2022/03/25/supabase-launch-week-four)! To keep the party and excitement going, and as [is now tradition](https://supabase.com/blog/2022/03/28/community-day#launch-week-iv---what-to-expect), starting at 9am PT today we'll be hacking together for the next 10 days until 23:59pm PT on Sunday April 10th. And because we’ve launched [GraphQL support](https://supabase.com/blog/2022/03/29/graphql-now-available) and [Supabase Edge Functions](https://supabase.com/blog/2022/03/30/supabase-enterprise), these will be the major themes and therefore categories for the hackathon. + +For some inspiration, check out [TheGuildDev](https://twitter.com/TheGuildDev)’s [GraphQL HackerNews clone](https://supabase-graphql-example.vercel.app/), and [Tyler’s](https://twitter.com/dshukertjr) [Flutter](https://github.com/supabase-community/flutter-stripe-payments-with-supabase-functions) and [Thor’s](https://twitter.com/thorwebdev) [React Native](https://github.com/supabase-community/expo-stripe-payments-with-supabase-functions) apps with Supabase Edge Functions, or have a browse through [madewithsupabase.com](http://madewithsupabase.com)! + +As always, we'll have some extremely limited edition swag to give away that can only be won by participating in the Hackathon! + +![hackathon_bring_the_func.png](/images/blog/launch-week-4/friday-hackathon/hackathon_bring_the_func.png) + +We’re absolutely stoked to see what amazing things y’all will build and submit to [madewithsupabase.com](https://www.madewithsupabase.com/bring-the-func). + +Finally, we're delighted to be partnering with [the Future Forest Company](https://thefutureforestcompany.com/) to plant a tree for every project that is being submitted for the Hackathon. Let’s build some cool open-source projects and start the SupaForest at the same time! + +## Details + +### Timeline + +- **Friday April 1st at 08:30am PT:** Last day of Launch Week. Join us on [Twitter Spaces](https://twitter.com/i/spaces/1BdxYwWBzeDGX) for the kickoff announcement. +- Build your project during the next 10 days and hang out with the community [on Discord](https://discord.gg/bnncdqgBSS). +- **Sunday April 10th at 11:59pm PT:** Submission deadline +- Judges Deliberate (Monday) +- We'll be contacting and announcing the winners [on Twitter](https://twitter.com/supabase) throughout the week after. + + + +### Prize categories + +There are multiple chances to win, there will be prizes for: + +- Most impressive GraphQL project (must use [pg_graphql](https://supabase.com/blog/2022/03/29/graphql-now-available#getting-started)) +- Most interesting usage of [Edge Functions]() +- Most fun / visually pleasing (get creative) + +There will be a winner and a runner-up prize for each category. And for each project submitted we'll plant a tree and provide you with a certificate via [the future forest company](https://thefutureforestcompany.com/) to include in your project. + +### Submission + +Submit your project via [madewithsupabase.com/bring-the-func](https://www.madewithsupabase.com/bring-the-func) + +You will be asked to send a link to a GitHub (or similar) repo, in the README you should include: + +- link to hosted demo (if applicable) +- list of team members github handles (and twitter if they have one) +- any demo videos, instructions, or memes +- a brief description of how you used Supabase: + - to serve data via REST or GraphQL? + - Realtime? + - Auth? + - Storage? + - Functions on the edge? +- any other info you want the judges to know (motivations/ideas/process) +- _optional_ team photo +- _optional_ a meme + +### Judging & announcement of winners + +The Supabase team will excitedly review what you've built. They will be looking for a few things, including: + +- creativity/inventiveness +- functions correctly/smoothly +- visually pleasing +- technically impressive +- use of Supabase features + - deep usage of a single feature or + - broad usage are both ok +- FUN! 😃 + +We'll be contacting and announcing winners [on Twitter](https://twitter.com/supabase) throughout the week after submission closes. + + {' '} + +### Rules + +- Team size 1-5 (all team members on winning teams will receive a prize) +- You cannot be in multiple teams +- One submission per team +- All design elements, code, etc. for your project/feature must be created **during** the event +- All entries must be Open Source (link to source code required in entry) +- Must use Supabase in some capacity +- Can be any language or framework +- You must submit before the deadline (no late entries) +- You can continue to make updates to your project after the submission deadline, but there is no guarantee that the judges will see additions made after the submission time. + +### Community & help + +Hang out with the Supabase team and community on Discord: + +- Text channel: hackathon +- Audio channel: hackathon + +If you need help or advice when building, find other people to join your team, or if you just want to chill and watch people build, come and join us! + +Join our Discord: [discord.supabase.com](https://discord.supabase.com) + +![Discord Hangout](/images/blog/hackathon/community.png) + +### Resources & Guides + +Here's a collection of resources that will help you get started building with Supabase: + +- Getting started with [GraphQL on Supabase](https://supabase.com/blog/2022/03/29/graphql-now-available#getting-started) +- [GraphQL HackerNews clone](https://supabase-graphql-example.vercel.app/) +- [Edge Functions Guide](https://supabase.com/docs/guides/functions) +- [Edge Functions Quickstart video](https://youtu.be/rzglqRdZUQE) +- [Supabase CLI local development guide](https://supabase.com/docs/guides/local-development) +- [Edge Functions examples](https://github.com/supabase/supabase/tree/master/examples/edge-functions) + +### Additional Info + +- Any intellectual property developed during the hackathon will belong to the team that developed it. We expect that each team will have an agreement between themselves regarding the IP, but this is not required +- By making a submission you grant Supabase permission to use screenshots, code-snippets and/or links to your project or content of your README on our twitter, blog, website, email updates, and in the Supabase discord server. Supabase does not make any claims over your IP. diff --git a/www/_blog/2022-04-01-supabase-realtime-with-multiplayer-features.mdx b/www/_blog/2022-04-01-supabase-realtime-with-multiplayer-features.mdx new file mode 100644 index 00000000000..e86f6423582 --- /dev/null +++ b/www/_blog/2022-04-01-supabase-realtime-with-multiplayer-features.mdx @@ -0,0 +1,79 @@ +--- +title: Supabase Realtime, with Multiplayer Features +description: Today we're announced Realtime, with multiplayer features. Realtime enables broadcast, presence, and listening to database changes delivered over WebSockets. +author: wenbo_xie +image: launch-week-4/friday-realtime/multiplayer-realtime-thumb.png +thumb: launch-week-4/friday-realtime/multiplayer-realtime-thumb.png +tags: + - launch-week + - realtime +date: '2022-04-01T22:30:00' +toc_depth: 3 +--- + +Today is the 1st of April, or April Fool's Day, but I like to think of today as Supabase Realtime Day where we announce and demo the next version of Realtime. + +Here's the next version of Realtime, with multiplayer features. + + + +We've made quite a few iterations on Realtime in the past. The first major version of Realtime listened to a single database by streaming changes from PostgreSQL's Write-Ahead Log and sending them to clients via WebSockets. The second major version introduced better security via WALRUS (Write Ahead Log Realtime Unified Security) which adheres to a database's RLS policies to determine authorized clients. However, this version continues to be single tenant as it can only poll one database at a time. + +The next and third major version, announced today on new Supabase Realtime Day, introduces multi-tenancy to listen to many databases. Additionally, this new version introduces a distributed cluster of nodes, which introduces better resource utilization, fault-tolerance, and lower latencies that directly translates to better performance for developers. We're fortunate to have built Realtime on Elixir and Phoenix, as the language and framework are great for concurrency, distributed computing, and WebSockets. We'll continue to support the existing Realtime feature of listening to database changes, but now we're also introducing the ability for developers to use WebSockets to build multiplayer games, collaborative apps, and support a wide array of use cases. + +## New Features + +### Presence + +![realtime-multiplayer-presence.png](/images/blog/launch-week-4/friday-realtime/realtime-multiplayer-presence.png) + +Presence is great for showing when your users are online. When a user connects or disconnects (even accidentally!), the server automatically detects this and let's everyone else know. +Presence is powered by [CRDTs](https://crdt.tech/) (Conflict-free Replicated Data Type) on a distributed cluster useful for storing synced data across nodes. + + +### Broadcast + +![realtime-multiplayer-broadcast.png](/images/blog/launch-week-4/friday-realtime/realtime-multiplayer-broadcast.png) + +Broadcasts are perfect for sending ephemeral events, like cursor movements. It's incredibly useful for gaming where you need to send messages across all connected users without storing them in the database. +In Realtime, connected users communicate with other subscribing & publishing to topics. + +### Extensions + +In this version of Realtime we're re-architecting the way that we listen to PostgreSQL databases by opening the WebSocket functionality for general use. +Instead of only using WebSockets to broadcast database changes, we are now moving the PostgreSQL listener to an “extension” architecture. This opens up numerous new ways of extending the server. +Here are just a few that we've heard: + +- Multiple Postgres: listen to multiple PostgreSQL databases at the same time. +- Other databases: Listen to database changes from other databases, like MySQL. +- Finance: Listen to stock market events and broadcast them to connected users. +- Web3: Listen to blockchain events and broadcast them to connected users. +- A server clock which broadcasts a timer to every connected client (e.g. auction sites) + +We're extremely excited about what the community develops. + +## Demo + +To show off the functionality that we're releasing, we've built a demo application. + +[multiplayer.dev](https://multiplayer.dev) + +Tech stack: + +- [Realtime](https://github.com/supabase/realtime), powered by the [Phoenix Web Framework](https://www.phoenixframework.org/) and [Elixir](https://elixir-lang.org/). +- [Next.js](https://nextjs.org/) by [Vercel](https://vercel.com). +- Deployed on a [Fly.io](https://fly.io) - cluster of 20 nodes distributed around the world 🌍. + +## Getting started + +Sign up for the waitlist at [multiplayer.dev](https://multiplayer.dev). + +You can follow development in our [open source repository on GitHub](https://github.com/supabase/realtime/tree/multiplayer). diff --git a/www/_blog/2022-04-01-supabrew.mdx b/www/_blog/2022-04-01-supabrew.mdx new file mode 100644 index 00000000000..cce894d4ed9 --- /dev/null +++ b/www/_blog/2022-04-01-supabrew.mdx @@ -0,0 +1,37 @@ +--- +title: Supabrew - Never Code Thirsty +description: A light and refreshing non-alcoholic beer for devs. +author: ant_wilson +image: launch-week-4/friday-supabrew/productShot1.jpg +thumb: launch-week-4/friday-supabrew/productShot1.png +tags: + - launch-week +date: '2022-04-01T11:00:00' +toc_depth: 3 +--- + +Supabase is best known as being a Developer Experience focused database company. As we expand our offerings and feature set, it’s only natural that we expand into other greenfield areas of the Developer Experience stack. After all, Supabase exists to solve developer problems, wherever we find them. + +One thing we noticed ALL developers require when they sit down to code is refreshment. There’s nothing worse than being in the middle of a 4000 line PR review and experiencing an extreme, unquenchable thirst. After extensive market review, we discovered that there doesn’t yet exist a product to fill this gap in the market. + +![copplepack.jpg](/images/blog/launch-week-4/friday-supabrew/copplepack.jpg) + +We surveyed our 80,000 registered developers, and asked them if they could help us design the perfect beverage for coding - what would it be? The result was a light, refreshing, low sugar, and non-alcoholic beverage. + +If you’ve been following our social media recently you will have seen that the entire team is currently working from a remote location in Bavaria, Germany. This is no coincidence. We came here primarily to sample beverages from some of the world’s oldest and best breweries. And we are proud to announce for the first time today, our latest solution to Developer Experience problems has arrived... + +### SupaBrew. An all-natural, light and refreshing non-alcoholic beer - engineered specifically for the needs of devs. + +![antines.png](/images/blog/launch-week-4/friday-supabrew/antines.jpg) + +Brewed in accordance with strict Germany Beer Purity laws, SupaBrew is made from 3 open source ingredients: Barley, Hops, and Water. With the absence of preservatives, you can be sure that you’re feeding your brain with only the purest liquids, which will keep your mind sharp, enabling you to squash bugs and center divs late into the night, and through to the early hours of the morning. And it’s not just an evening beverage, we specifically adapted the taste so you can even enjoy it during your 9am stand ups. + +You won’t have any blockers to report when it comes to sustainability either. Each bottle is made from recycled CRT monitors, and the labels are made from Ubuntu stickers leftover from last years’ FOSDEM. + +![ines_swing.jpg](/images/blog/launch-week-4/friday-supabrew/ines_swing.jpg) + +By far the best feature of SupaBrew, is the pricing structure. Thanks to an innovative product-led growth strategy, indie devs can start enjoying SupaBrew for free. As your consumption increases, you can move onto our Pay-as-you-Drink plan. And features such as priority delivery, empty bottle collections, and CopplePack (your order will be hand picked and packed by our Chief Brewing Officer - [kiwicopple](http://github.com/kiwicopple)) are available as Enterprise add-ons. Subscription based plans, and pay-per-seat arrangements are also available for teams of 15 and larger. + +Want to get started with SupaBrew? Head over to our [swag store](https://store.supabase.com/products/supabrew-6-pack?variant=42199068541083) to order your first crate now. + +This is of course an April Fools, but since you're here why not check out what else we [dropped this week](/blog/2022/03/25/supabase-launch-week-four). diff --git a/www/_blog/2022-04-15-beta-update-march-2022.mdx b/www/_blog/2022-04-15-beta-update-march-2022.mdx new file mode 100644 index 00000000000..9888153c9d4 --- /dev/null +++ b/www/_blog/2022-04-15-beta-update-march-2022.mdx @@ -0,0 +1,108 @@ +--- +title: Supabase Beta March 2022 +description: Functions, GraphQL, and much more. +author: ant_wilson +image: 2022-march/thumb.jpg +thumb: 2022-march/thumb.jpg +tags: + - launch-week +date: '2022-04-15T11:00:00' +toc_depth: 3 +--- + +Definitely our most feature-packed month so far. Here's a ton of stuff we shipped throughout March... + +## Functions + +The one we've all been waiting for. You can now [deploy Javascript & Typescript functions](/blog/2022/03/31/supabase-edge-functions) to Supabase. You can develop and test locally, link a project, and deploy globally to the edge in a matter of seconds! + +[![supabase functions](/images/blog/2022-march/functions.png)](/blog/2022/03/31/supabase-edge-functions) + +## GraphQL + +You can now [query your Supabase database with GraphQL](/blog/2022/03/29/graphql-now-available). We built this as a postgres extension, so it's portable, open source, and solves some of the problems that exist in other GraphQL implementations. + +[![graphql](/images/blog/2022-march/graphql.jpg)](/blog/2022/03/29/graphql-now-available) + +## Realtime + +Supabase Realtime [now supports multiplayer and presence](/blog/2022/04/01/supabase-realtime-with-multiplayer-features), so you can build collaborative applications like Figma and Google Docs with Supabase. Come and have some fun on our demo application. + +[![realtime](/images/blog/2022-march/realtime.png)](/blog/2022/04/01/supabase-realtime-with-multiplayer-features) + +## Enterprise + +[Logging and Observability dashboard](/blog/2022/03/30/supabase-enterprise), Prometheus endpoint, SLAs, premium support, pricing updates, and Point-In-Time-Recovery. Everything you need to use Supabase at scale. + +[![enterprise](/images/blog/2022-march/enterprise.png)](/blog/2022/03/30/supabase-enterprise) + +## GitHub Secret Scanning + +We're now an official [GitHub secret scanning partner](/blog/2022/03/28/community-day#supabase-is-now-a-github-secret-scanning-partner), meaning that if you accidentally push your service_role key to GitHub, you'll get a notification email, and your keys will automatically be rolled on Supabase. For private repos you can disable this. + +[![secret scanning](/images/blog/2022-march/secret-scanning.png)](/blog/2022/03/28/community-day#supabase-is-now-a-github-secret-scanning-partner) + +## Community Day + +[PostgREST 10 pre-release](/blog/2022/03/28/community-day#postgrest-10-pre-release), new OAuth providers, Next-JS auth helpers, new courses, and an open source Partner Gallery. + +[![community day](/images/blog/2022-march/community-day.png)](/blog/2022/03/28/community-day) + +## Should I open source my company? + +[We wrote an article](/blog/2022/03/25/should-i-open-source-my-company) for anyone considoring making their codebase open source. We explore the advantages and tackle some common concerns. + +[![open source](/images/blog/2022-march/open-source.png)](/blog/2022/03/25/should-i-open-source-my-company) + +## Supabrew - Never Code Thirsty + +For April Fools - [we announced a non-alcoholic](/blog/2022/04/01/supabrew), light, and refreshing brew. Perfect for coding late into the night. We're pushing the boundaries of Developer Experience. + +[![supabrew](/images/blog/2022-march/supabrew.png)](/blog/2022/04/01/supabrew) + +## Video Highlights + +Relive all the action from Launch Week 4: +- [Community Day Live Stream](https://www.youtube.com/watch?v=D0gIgjozOzc) on YouTube +- [GraphQL Announcement Live Stream](https://www.youtube.com/watch?v=fApxu_U_hdw) on YouTube +- [Enterprise Announcements Live Stream](https://www.youtube.com/watch?v=UZrl1cwzTDg) on YouTube +- [Functions Announcement with Deno Team](https://www.youtube.com/watch?v=Xci5SOv76k0) on YouTube +- [Realtime Demo App](https://www.youtube.com/watch?v=BelYEMJ2N00) on YouTube +- [Realtime Remix w/Supabase Launch Party](https://www.youtube.com/watch?v=rntEMgaenHs) on YouTube +- [Building an Image Gallery with Vercel](https://www.youtube.com/watch?v=BSoRXk1FIw8) by Lee Robinson + +## Hiring + +We're Hiring - for a ton of new roles across engineering, marketing, and HR. We hire fully remotely, and you'll get to work alongside some incredible people, on one of the fastest growing open source companies. [See which roles we're hiring for](https://about.supabase.com/careers). + +[![supabase is hiring](/images/blog/2021-dec/hiring.png)](https://about.supabase.com/careers) + +## Twitter + +We're having a 24/7*365 meme-fest on [Twitter](https://twitter.com/supabase). Come join us. + +[![supabase twitter](/images/blog/2022-march/twitter.png)](https://twitter.com/supabase) + +## TikTok + +Check us out on [TikTok](https://www.tiktok.com/@supabase.com?fromUrl=%2Fsupabase.com&lang=en) + +[![tiktok](/images/blog/2021-dec/tiktok.png)](https://www.tiktok.com/@supabase.com?fromUrl=%2Fsupabase.com&lang=en) + +## Swag Store + +A reminder that we have a [Supabase Swag Store](https://store.supabase.com) + +[![swag store](/images/blog/2021-dec/swag.jpg)](https://store.supabase.com) + +## GitHub + +We hit 30K stars!!: [github.com/supabase/supabase](http://github.com/supabase/supabase) + +## Get started + +- Start using Supabase today: **[app.supabase.io](https://app.supabase.io/)** +- Make sure to **[star us on GitHub](https://github.com/supabase/supabase)** +- Follow us **[on Twitter](https://twitter.com/supabase)** +- Subscribe to our **[YouTube channel](https://www.youtube.com/c/supabase)** +- Become a **[sponsor](https://github.com/sponsors/supabase)** diff --git a/www/_blog/2022-04-18-bring-the-func-hackathon-winners.mdx b/www/_blog/2022-04-18-bring-the-func-hackathon-winners.mdx new file mode 100644 index 00000000000..bf619282d2c --- /dev/null +++ b/www/_blog/2022-04-18-bring-the-func-hackathon-winners.mdx @@ -0,0 +1,102 @@ +--- +title: 'Bring the Func Hackathon Winners 2022' +description: Celebrating many amazing OSS Hackathon projects using GraphQL and Edge Functions. +author: thor_schaeff +author_url: https://github.com/thorwebdev +author_image_url: https://github.com/thorwebdev.png +authorURL: https://github.com/thorwebdev +image: hackathon-winners/bring-the-func/funcwinners.png +thumb: hackathon-winners/bring-the-func/funcwinners.png +tags: + - community + - hackathon +date: '2022-04-18' +toc_depth: 2 +--- + +To cool down from [our latest launch week](/blog/2022/03/25/supabase-launch-week-four) we (virtually) sat down with y'all and started hacking, and once again we absolutely loved your hackathon submissions and are excited to send some extremely limited swag your way and plant some trees for each of your submitted projects! + +As always, it was challenging to pick the winners from all the great submissions! You can see all the amazing projects submitted on [madewithsupabase.com](https://www.madewithsupabase.com/bring-the-func). And now, without further ado, let's look at some of our favourites in more detail: + +## Most Impressive GraphQL Project + +### Winner + +[mintbaseXsupabase](https://github.com/3lLobo/mintbaseXsupabase) - by [@Flowolfpro](https://twitter.com/Flowolfpro) and [@the_reshma](https://twitter.com/the_reshma) + +Think NFTs meet Instagram, this app lets you browse, like, and comment on NFTs. + +[![mintbaseXsupabase](https://madewithsupabase-git-bring-the-func-zernonia.vercel.app/api/resize?link=mintbasexsupabase-1dttd-162639349-3f334480-f8a9-4b58-88b1-0a6688a16ffapng&w=1000)](https://github.com/3lLobo/mintbaseXsupabase) + +### Runner Up + +[Pgm Dictionary](https://github.com/n4ze3m/PgmDictionary) - by [@n4ze3m](https://twitter.com/n4ze3m) + +This UrbanDictionary clone uses NextJS, Mantine, and Supabase to power a community dictionary project. + +A great idea that deserves some silver tees! + +[![Pgm Dictionary](https://madewithsupabase-git-bring-the-func-zernonia.vercel.app/api/resize?link=pgm-26sp1-screenzy-1649267250672png&w=1000)](https://github.com/n4ze3m/PgmDictionary) + +## Most Interesting Usage Of Edge Functions + +### Winner + +[Wen NFT](https://github.com/gbibeaul/supabase-wen) - by [@gbibeaul](https://twitter.com/gbibeaul) + +Next up is the category for our newest feature, Edge Functions! The winner here is Wen NFT, which helps anyone manage NFT communities by helping to prove ownership for community access. + +[![Wen NFT](https://madewithsupabase-git-bring-the-func-zernonia.vercel.app/api/resize?link=wen-nft-37xz7-screenshot-2022-04-03-at-19-31-44-web3-fullstackpng&w=1000)](https://github.com/gbibeaul/supabase-wen) + +### Runner Up + +[DocuPool](https://github.com/emilioschepis/docupool) - by [@emilioschepis](https://twitter.com/emilioschepis) and brother Federico. + +Docupool is our runner up in the Edge Functions category. Emilio and brother Federico built Docupool to let you share documents and notes, and unlock other people’s content with tokens you collect through the app. + +[![DocuPool](https://madewithsupabase-git-bring-the-func-zernonia.vercel.app/api/resize?link=docupool-document-sharing-platform-svuxo-screen-shot-2022-04-10-at-222753png&w=1000)](https://github.com/emilioschepis/docupool) + +## Most Fun / Most Visually Pleasing + +### Winner + +[AbileneX](https://github.com/okezieuc/abilenex) - by [@okeziechiedozie](https://github.com/okeziechiedozie) + +Our final category is Most Fun or Visually Pleasing, and AbileneX is our winner. This free tool creates links you can share to gather feedback on your ideas. + +[![AbileneX](https://madewithsupabase-git-bring-the-func-zernonia.vercel.app/api/resize?link=abilenex-the-revolutionary-idea-feedback-tool-7iaib-cover-imagepng&w=1000)](https://github.com/okezieuc/abilenex) + +### Runner Up + +[Kardow](https://github.com/Kardow/kardow-app) - by [SimonGingras18](https://twitter.com/SimonGingras18) + +Kardow is our runner up for Most Fun or Visually Pleasing. This project management tool lets you customize your UI while you add and manage your tasks. + +[![Kardow](https://madewithsupabase-git-bring-the-func-zernonia.vercel.app/api/resize?link=kardow-1ust9-kardow-templatepng&w=1000)](https://github.com/Kardow/kardow-app) + +## The Prizes + +As is now tradition with Supabase Hackathons, the winners will receive an extremely limited edition gold medal shirt. + +![Gold Tshirt](/images/blog/hackathon-winners/bring-the-func/gold_function_tee.png) + +And the runner uppers will receive the same shirt but in silver. These shirts are limited to winners of the hackathon and will never be produced again. Keep them safe like your favourite NFTs! + +## Hang out with us and the community + +If you want to join the community and build with us, find other people using Supabase, or if you just want to chill and watch people build, come and join us in Discord! + +[Join our Discord](https://discord.supabase.com) + +![Discord Hangout](/images/blog/hackathon/community.png) + +### Get Started Guides + +If you're inspired to build, check out some of the latest resources: + +- Getting started with [GraphQL on Supabase](https://supabase.com/blog/2022/03/29/graphql-now-available#getting-started) +- [GraphQL HackerNews clone](https://supabase-graphql-example.vercel.app/) +- [Edge Functions Guide](https://supabase.com/docs/guides/functions) +- [Edge Functions Quickstart video](https://youtu.be/rzglqRdZUQE) +- [Supabase CLI local development guide](https://supabase.com/docs/guides/local-development) +- [Edge Functions examples](https://github.com/supabase/supabase/tree/master/examples/edge-functions) diff --git a/www/_blog/2022-04-20-partner-gallery-works-with-supabase.mdx b/www/_blog/2022-04-20-partner-gallery-works-with-supabase.mdx new file mode 100644 index 00000000000..eaea01bbd94 --- /dev/null +++ b/www/_blog/2022-04-20-partner-gallery-works-with-supabase.mdx @@ -0,0 +1,218 @@ +--- +title: Works With Supabase - announcing our Partner Gallery +description: Introducing our Partner Gallery - open source and made with Supabase. +author: alaister,shanerice,thor_schaeff +image: partner-gallery/partner-showcase-thumb.png +thumb: partner-gallery/partner-showcase-thumb.png +tags: + - community + - partnerships +date: '2022-04-20' +toc_depth: 3 +--- + +# Introducing our Partner Gallery - open source and made with Supabase + +Supabase is a collaborative effort across many open-source projects, and we’re incredibly fortunate that you all have rallied around us to make Supabase what it is today. + +To keep track of all the great tools and people that “Work With Supabase”, we’ve built a [Partner Gallery](/partners) that showcases integration partners who are extending how Supabase works, as well as experts who are certified to help you build new, exciting things. + +![partner-gallery-screenshot.png](/images/blog/partner-gallery/partner-gallery-screenshot.png) + +As with anything at Supabase, the Partner Gallery is built on top of the [Supabase stack](/docs/architecture) and is, of course, open-source. If you’re looking to build a partner gallery yourself, feel free to use our template as a start: [github.com/supabase-community/partner-gallery-example](https://github.com/supabase-community/partner-gallery-example). It’s packed with goodies like [Postgres Full Text Search](/docs/guides/database/full-text-search), `next-image` with Supabase Storage, and sending emails based on an insert trigger with Supabase Edge Functions. + +# Partner showcase - new integrations and expert services + + + +## Expert services + +Some agencies and developer experts have specialized experience building with Supabase. If you’re looking for the right partner to bring your application to life, check out the experts on [supabase.com/partners/experts](/partners/experts). + +If you have expertise developing with Supabase and want to offer your expert services, you can [apply to become a partner today](/partners/integrations#become-a-partner). + +Please join us in welcoming our first two experts! + +### Morrow + + + +Morrow is an app development agency headquartered in Bristol, UK. Their mission is to consult, build and support cutting-edge innovation. + +Their specialisms are working with Supabase, React Native, Netlify and Swell to produce bespoke solutions that are robust and beautiful. + +Morrow was awarded UK App Dev Agency of the Year 2022. + +### Quinence + +![Quinence](/images/blog/partner-gallery/expert-quinence.png) + +Quinence is a boutique product development studio from Singapore. + +They build digital products that delight. You give them an idea, and they can deliver the complete experience with hyper-scalable infrastructure. + +## Integrations + +There are so many fantastic tools out there making it easier than ever to build stunning applications or helping you with a specific workflow. We’re ecstatic that many of them chose to integrate with Supabase to give you even more superpowers. + +We’re starting off with a selection across auth, developer tools, and low-code tools. If you’ve built a tool that integrates with Supabase, we’d love to [hear from you](/partners/integrations#become-a-partner)! + +## Auth + +### Clerk + + + +Clerk authenticates users, manages session tokens, and provides user management functionality that can be used in combination with the authorization logic available in Supabase through PostgreSQL Row Level Security (RLS) policies. + +### Stytch + +![Stytch](/images/blog/partner-gallery/integration-stytch.png) + +Stytch provides an all-in-one platform for passwordless auth. Stytch makes it easy for you to embed passwordless solutions into your websites and apps for better security, better conversion rates, and a better end user experience. + +## DevTools + +### Prisma + + + +Prisma is an open source next-generation ORM. It consists of the following parts: + +- Prisma Client: Auto-generated and type-safe query builder for Node.js & TypeScript. +- Prisma Migrate: Migration system. +- Prisma Studio: GUI to view and edit data in your database. + +### Snaplet + + + +Snaplet is a developer tool that copies a Postgres database, transforming personal information, so that you can safely code against actual data. This functionality makes it possible to easily achieve environment parity in Supabase. + +### Vercel + +![Vercel](/images/blog/partner-gallery/integration-vercel.png) + +Vercel enables developers to build and publish wonderful things. They build products for developers and designers. And those who aspire to become one. This makes it the perfect tool for building web apps with Supabase. + +### pgMustard + + + +pgMustard speeds up your journey from knowing which query is a problem to working out what can be done about it. + +Reading EXPLAIN ANALYZE output can be tough. + +Even if you know how, Postgres includes so much useful information, it is easy to miss something important. And for queries that do a lot, the plans are even more useful-yet-time-consuming. + +## Low-Code + +### Clutch + + + +What can I achieve with Clutch & Supabase? Anything you can think of where a database would be necessary for your project. Examples include building a blog, real-time chat app, booking platform, and todo list, Supabase, and Clutch provides all the necessary tools to build your projects quickly and efficiently. + +### Appsmith + + + +Appsmith is an open-source framework for building internal tools. It lets you drag-and-drop UI components to build pages, connect to any API, database or GraphQL source and write logic with JavaScript objects. + +### Draftbit + +![Draftbit](/images/blog/partner-gallery/integration-draftbit.png) + +Draftbit is a "pro-code" low-code mobile app building platform. Draftbit exports React Native source code that is 100% run on open-source languages and libraries. + +### Plasmic + + + +By connecting Supabase with Plasmic, a visual builder for the web, you can build data-backed applications without code. While many users leverage Plasmic to quickly launch and iterate on landing pages, Plasmic can be used as a general-purpose visual builder for React, which can be used to design and implement fully featured read-write applications. + +### Teta + + + +Teta is an online cooperative app builder. It allows designers and developers to collaborate in real-time on the design and development of mobile applications, through a convenient visual interface that allows the export of Flutter code. diff --git a/www/components/AdminAccess/index.tsx b/www/components/AdminAccess/index.tsx new file mode 100644 index 00000000000..fc7f82059a3 --- /dev/null +++ b/www/components/AdminAccess/index.tsx @@ -0,0 +1,26 @@ +import React, { useState } from 'react' +import Tabs from 'components/AdminAccess/tabs' +import SectionHeader from 'components/UI/SectionHeader' +import { useRouter } from 'next/router' +import SectionContainer from '../Layouts/SectionContainer' +import ImageCarousel from '../Carousels/ImageCarousel' + +import TableViewCarouselData from 'data/products/database/table-view-carousel.json' + +import AdminAccessData from 'data/home/admin-access.json' + +const AdminAccess = () => { + const { basePath } = useRouter() + const [tabId, setTabId] = useState('tabTableEditor') + + return ( + +
+

Build your app without leaving the dashboard

+
+ + + ) +} + +export default AdminAccess diff --git a/www/components/AdminAccess/tabs.tsx b/www/components/AdminAccess/tabs.tsx new file mode 100644 index 00000000000..753b2f85b44 --- /dev/null +++ b/www/components/AdminAccess/tabs.tsx @@ -0,0 +1,68 @@ +import TabMarkup from 'data/AdminAccess.json' +import { Tabs as SBTabs, Button } from '@supabase/ui' + +type Props = { + tabId: string + setTabId: Function +} + +function Tabs(props: Props) { + const { tabId, setTabId } = props + + function handleTabChange(id: string) { + return setTabId(id) + } + + return ( +
+
+
+ handleTabChange(id)} + activeId={tabId} + type="underlined" + size="large" + block + > + +
+

{TabMarkup['tabTableEditor'].header}

+
+

{TabMarkup['tabTableEditor'].description}

+
+
+ + + + + + +
+

{TabMarkup['tabSqlEditor'].header}

+
+

{TabMarkup['tabSqlEditor'].description}

+
+
+ + + + + +
+

{TabMarkup['tabAuthRules'].header}

+
+

{TabMarkup['tabAuthRules'].description}

+
+
+ + + + + +
+
+
+ ) +} + +export default Tabs diff --git a/www/components/AuthWidget/AuthComponentExample.tsx b/www/components/AuthWidget/AuthComponentExample.tsx new file mode 100644 index 00000000000..ec0e3b3e7c0 --- /dev/null +++ b/www/components/AuthWidget/AuthComponentExample.tsx @@ -0,0 +1,251 @@ +import { useEffect, useState } from 'react' +import { createClient } from '@supabase/supabase-js' +import { + Badge, + Button, + Card, + // Auth, + Space, + Tabs, + IconCode, + IconSearch, +} from '@supabase/ui' +import CodeBlock from '../CodeBlock/CodeBlock' +// Import Swiper React components +import { Swiper, SwiperSlide } from 'swiper/react' +import Link from 'next/link' +import { useRouter } from 'next/router' + +import { useTheme } from '../Providers' + +const supabase = createClient( + 'https://rsnibhkhsbfnncjmwnkj.supabase.co', + 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyb2xlIjoiYW5vbiIsImlhdCI6MTYxNTIxNDE1MywiZXhwIjoxOTMwNzkwMTUzfQ.OQEbAaTfgDdLCCht251P2JRD3QDnui6nsU8N-tZA_Mc' +) + +function AuthComponentExample() { + const { isDarkMode } = useTheme() + const { basePath } = useRouter() + + // // store API swiper instance + // const [imageSwiper, setImageSwiper] = useState(undefined) + // const [imageSwiperActiveIndex, setImageSwiperActiveIndex] = useState(0) + + // function handleNavChange(e: number) { + // console.log(e) + // setImageSwiperActiveIndex(e) + // // @ts-ignore + // imageSwiper.slideTo(e) + // } + + // const AuthContainer = (props: any) => { + // const { user } = Auth.useUser() + // if (user) { + // return ( + // <> + //

Signed in: {user.email}

+ // + // + // ) + // } + // return props.children + // } + + return ( +
+ {/* handleNavChange(Number(id))} + > + }> + + + } id="1"> + + + */} +
+ + +
+ + +
+ + Logo +

{'Acme Company'}

+ + Demo +
+

Sign in with

+
+ + + + + + + + + + + + + + + + + + + +
+
+
+

or continue with

+
+
+ {/* + + + + */} + + +
+ + + +
+ +

Signed in: {user.email}

+ +
+ ) + } + return props.children; + }; + + return ( + + + + + + ); +} +`} + lang="js" + /> +
+ + +
+
+ ) +} + +export default AuthComponentExample diff --git a/www/components/AuthWidget/AuthWidget.tsx b/www/components/AuthWidget/AuthWidget.tsx new file mode 100644 index 00000000000..87aa96947cf --- /dev/null +++ b/www/components/AuthWidget/AuthWidget.tsx @@ -0,0 +1,235 @@ +import { useState } from 'react' +import { createClient, Provider } from '@supabase/supabase-js' + +import DefaultLayout from '~/components/Layouts/Default' +import CodeBlock from '~/components/CodeBlock/CodeBlock' +import { + Button, + // Auth, + Card, + Checkbox, + Divider, + Radio, + Select, + Space, + Tabs, + Input, + Toggle, + IconCode, + IconZoomIn, + IconCopy, + IconColumns, +} from '@supabase/ui' + +import AuthStyles from './Auth.module.css' + +function AuthPage() { + const supabase = createClient( + 'https://rsnibhkhsbfnncjmwnkj.supabase.co', + 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyb2xlIjoiYW5vbiIsImlhdCI6MTYxNTIxNDE1MywiZXhwIjoxOTMwNzkwMTUzfQ.OQEbAaTfgDdLCCht251P2JRD3QDnui6nsU8N-tZA_Mc' + ) + + type SizeProps = 'tiny' | 'small' | 'medium' | 'large' | 'xlarge' + type LayoutProps = 'horizontal' | 'vertical' + + const [companyName, setCompanyName] = useState('Acme Company') + const [widgetSize, setWidgetSize] = useState('tiny') + const [socialLogins, setSocialLogins] = useState(true) + const [socialLoginLayout, setSocialLoginLayout] = useState('horizontal') + const [socialColors, setSocialColors] = useState(false) + + const socials: Provider[] = ['facebook', 'google', 'bitbucket', 'github', 'gitlab'] + + const formSize = 'small' + const formLayout = 'vertical' + + return ( + +
+
+
+

ReactJS Auth Widget

+

+ An API built from the groud up just for Storage.With powerful library clients coming + soon that allow for asset optimasation and image transformation +

+
+
+
+
+ + + + , + ]} + > + }> +
+ + +
+ + +

{companyName}

+ +
+ {/* */} + + +
+ + } id="panel-2"> +
+ + + + + + ) + } + `} + lang="js" + /> +
+ + +
+
+
+ +
+
+
+ +
+

Customise your login form

+

Our ReactJS Auth form will help you get going even quicker

+
+ + setCompanyName(e.target.value)} + /> + {/* @ts-ignore */} + + + + setSocialLogins(!socialLogins)} + /> + {socialLogins && ( + <> + + {/* @ts-ignore */} + ) => + // @ts-ignore + setSocialLoginLayout(e.target.value) + } + > + + + + setSocialColors(!socialColors)} + /> + + )} + + + + setWidgetSize(e.target.value)} + > + + + + + + + +
+
+
+
+
+ + ) +} + +export default AuthPage diff --git a/www/components/Blog/BlogHeader.tsx b/www/components/Blog/BlogHeader.tsx new file mode 100644 index 00000000000..c1c494969c0 --- /dev/null +++ b/www/components/Blog/BlogHeader.tsx @@ -0,0 +1,19 @@ +import React from 'react' + +interface Props { + title: string +} + +export default function BlogHeader({ title }: Props) { + return ( +
+
+
+

+ {title} +

+
+
+
+ ) +} diff --git a/www/components/Blog/BlogListItem.tsx b/www/components/Blog/BlogListItem.tsx new file mode 100644 index 00000000000..b1a70d0abce --- /dev/null +++ b/www/components/Blog/BlogListItem.tsx @@ -0,0 +1,76 @@ +import authors from 'lib/authors.json' +import Image from 'next/image' +import React from 'react' +import Author from '~/types/author' +import PostTypes from '~/types/post' + +interface Props { + post: PostTypes +} + +const BlogListItem = ({ post }: Props) => { + const authorArray: string[] | undefined = post.author ? post.author.split(',') : [] + const author = [] + + if (authorArray) { + for (let i = 0; i < authorArray.length; i++) { + author.push( + authors.find((authors: Author) => { + return authors.author_id === authorArray[i] + }) + ) + } + } + + return ( + + ) +} + +export default BlogListItem diff --git a/www/components/BuiltWithSupabase/index.tsx b/www/components/BuiltWithSupabase/index.tsx new file mode 100644 index 00000000000..e928f6994bf --- /dev/null +++ b/www/components/BuiltWithSupabase/index.tsx @@ -0,0 +1,50 @@ +import { useRouter } from 'next/router' +import { Button, IconGitHub } from '@supabase/ui' +import SectionContainer from '../Layouts/SectionContainer' +import ExampleCard from '../ExampleCard' + +import Examples from 'data/Examples.json' +import Link from 'next/link' +// import Button from '../Button' + +const BuiltExamples = () => { + const { basePath } = useRouter() + return ( + +
+

What can you build with supabase?

+

There are many example apps and starter projects to get going

+
+ + + + + + +
+
+
+ {Examples.slice(0, 6).map((example, i) => { + return ( +
2 && `sm:hidden lg:block`}`} + key={i} + > + +
+ ) + })} +
+ + ) +} + +export default BuiltExamples diff --git a/www/components/Button.tsx b/www/components/Button.tsx new file mode 100644 index 00000000000..ecf4b18e8d0 --- /dev/null +++ b/www/components/Button.tsx @@ -0,0 +1,57 @@ +import Link from 'next/link' + +type Props = { + type?: 'primary' | 'secondary' + text: string + url?: string + className?: string + hideArrow?: boolean +} + +const Button = (props: Props) => { + const { type = 'primary', text, url, className, hideArrow = false } = props + + const colorClass = + type === 'primary' + ? 'px-3 py-2 shadow-sm border border-transparent text-white bg-brand-700 hover:bg-brand-800 focus:ring-2 focus:ring-offset-2 focus:ring-brand-500' + : 'text-brand-700 bg-none' + + const textClass = type === 'primary' ? 'font-medium left-3 group-hover:left-0' : 'font-normal' + + const arrowClass = type === 'primary' ? '' : 'relative -left-1 group-hover:left-0' + + let buttonStyles = { + textShadow: 'none', + } + if (type === 'primary') { + buttonStyles.textShadow = '0px 0px 6px rgba(13, 128, 86, 0.8)' + } + + const renderButton = () => ( + + ) + + return url ? {renderButton()} : renderButton() +} + +export default Button diff --git a/www/components/CTABanner/index.tsx b/www/components/CTABanner/index.tsx new file mode 100644 index 00000000000..5d9cffc6a44 --- /dev/null +++ b/www/components/CTABanner/index.tsx @@ -0,0 +1,29 @@ +import { Button } from '@supabase/ui' + +const CTABanner = (props: any) => { + const { darkerBg } = props + return ( +
+
+

+ Build in a weekend, + scale to millions +

+
+ +
+ ) +} + +export default CTABanner diff --git a/www/components/Card.tsx b/www/components/Card.tsx new file mode 100644 index 00000000000..f6c995195e2 --- /dev/null +++ b/www/components/Card.tsx @@ -0,0 +1,100 @@ +import Button from 'components/Button' + +type PostMetaProps = { + name: string + avatarUrl: string + publishDate: string + readLength: number +} + +type Props = { + title: string + type: 'Project Example' | 'Case Study' | 'Blog Post' + description: string + imgUrl: string + url: string + logoUrl?: string + ctaText?: string + icons?: any[] + postMeta?: PostMetaProps +} + +const Card = (props: Props) => { + const { + title, + type, + description, + imgUrl, + url, + logoUrl = '', + ctaText = '', + icons = [], + postMeta = { + name: '', + avatarUrl: '', + publishDate: '', + readLength: '', + }, + } = props + + const iconMarkup = + icons && + icons.map((icon: any) => { + return ( + {icon.imgAlt} + ) + }) + + return ( + +
+ {title} +
+
+
+ {/* {icons && ( +
+ {iconMarkup} +
+ )} */} +

{type}

+
+ {/* {logoUrl && } */} + {title &&

{title}

} +

+ {type !== 'Project Example' ? postMeta.publishDate : description} +

+
+
+ {type === 'Case Study' && postMeta.name.length > 0 && ( +
+
+ {postMeta.name} + +
+
+

{postMeta.name}

+
+ + + {postMeta.readLength} min read +
+
+
+ )} + {ctaText &&
+ + ) +} + +export default Card diff --git a/www/components/Carousels/ImageCarousel.module.css b/www/components/Carousels/ImageCarousel.module.css new file mode 100644 index 00000000000..5a8c40ab2af --- /dev/null +++ b/www/components/Carousels/ImageCarousel.module.css @@ -0,0 +1,6 @@ +/* bright */ +.gradient-bg { + background: linear-gradient(338.96deg, rgba(0, 0, 0, 0.2) -18.99%, rgba(0, 0, 0, 0) 25.34%), + linear-gradient(300.08deg, #53ffb1 7.6%, #3ecf8e 64.93%); + /* transform: rotate(-89.79deg); */ +} diff --git a/www/components/Carousels/ImageCarousel.tsx b/www/components/Carousels/ImageCarousel.tsx new file mode 100644 index 00000000000..f461f5bea5c --- /dev/null +++ b/www/components/Carousels/ImageCarousel.tsx @@ -0,0 +1,184 @@ +import { useRouter } from 'next/router' +import { Tabs, Button, IconCornerRightUp, IconArrowUpRight } from '@supabase/ui' +import { useState } from 'react' + +// Import Swiper React components +import { Swiper, SwiperSlide } from 'swiper/react' + +// Import Swiper styles +import 'swiper/swiper.min.css' + +import ImageCarouselStyles from './ImageCarousel.module.css' +import Link from 'next/link' +import Image from 'next/image' +import TextLink from '../TextLink' + +interface Content { + title: string + label?: string + img_url?: string + video_url?: string + text?: string + cta?: string + url?: string +} + +interface ImageCarouselProps { + content: Content[] + footer?: React.ReactNode + altTabView?: boolean +} + +function ImageCarousel(props: ImageCarouselProps) { + // base path for images + const { basePath } = useRouter() + + // store API swiper instance + const [imageSwiper, setImageSwiper] = useState(undefined) + const [swiperDetails, setSwiperDetails] = useState(undefined) + + const [imageSwiperActiveIndex, setImageSwiperActiveIndex] = useState(0) + + function handleImageSwiperNav(e: number) { + setImageSwiperActiveIndex(e) + // @ts-ignore + imageSwiper.slideTo(e) + // @ts-ignore + swiperDetails.slideTo(e) + } + + const details = ( +
+

+ Allow fetch something +

+

+

+ This would only allow the authenticated user access to a folder that is named after their + own account UID. This is useful for things like profile images. +

+

+

+ +

+
+ ) + + return ( +
+
+
+
+ handleImageSwiperNav(Number(id))} + > + {props.content.map((content: Content, i) => { + return ( + + + + ) + })} + +
+
+ + {props.content.map((content: Content, i: number) => { + return ( + + {content.img_url && ( + + )} + {content.video_url && ( + + )} + + ) + })} + +
+
+
+
+
+ handleImageSwiperNav(Number(id))} + > + {props.content.map((content: Content, i: number) => { + return ( + + ) + })} + +
+ + {props.content.map((content, i) => { + return ( + +

{content.title}

+

{content.text}

+ + + ) + })} + {props.footer &&
{props.footer}
} + +
+
+ ) +} + +export default ImageCarousel diff --git a/www/components/Carousels/SplitCodeBlockCarousel.tsx b/www/components/Carousels/SplitCodeBlockCarousel.tsx new file mode 100644 index 00000000000..ee4e7cb1197 --- /dev/null +++ b/www/components/Carousels/SplitCodeBlockCarousel.tsx @@ -0,0 +1,152 @@ +import { useState } from 'react' +// Import Swiper React components +import { Swiper, SwiperSlide } from 'swiper/react' + +import { Tabs, Button, Space } from '@supabase/ui' +import CodeBlock from '../CodeBlock/CodeBlock' + +// Import Swiper styles +import 'swiper/swiper.min.css' +import { Badge } from '@supabase/ui' +import Link from 'next/link' + +interface Content { + lang: 'js' | 'py' | 'sql' + title: string + code: string + detail_title?: string + detail_text?: string + badges_label?: string + badges?: string[] + url?: string +} + +interface SplitCodeBlockCarousel { + content: Content[] + footer?: React.ReactNode + altTabView?: boolean +} + +function SplitCodeBlockCarousel(props: SplitCodeBlockCarousel) { + // store API swiper instance + const [apiSwiper, setApiSwiper] = useState(undefined) + const [swiperDetails, setSwiperDetails] = useState(undefined) + + const [apiSwiperActiveIndex, setApiSwiperActiveIndex] = useState(0) + + function handleApiSwiperNavChange(e: number) { + setApiSwiperActiveIndex(e) + // @ts-ignore + apiSwiper.slideTo(e) + // @ts-ignore + swiperDetails.slideTo(e) + } + + const details = ( +
+

+ Allow fetch something +

+

+

+ This would only allow the authenticated user access to a folder that is named after their + own account UID. This is useful for things like profile images. +

+

+

+ +

+
+ ) + + return ( +
+ handleApiSwiperNavChange(Number(id))} + type="pills" + > + {props.content.map((extension, i) => { + return ( + + + + ) + })} + + + + {props.content.map((extension, i) => { + return ( + + + {extension.code} + + + ) + })} + + +
+ + {props.content.map((extension, i) => { + return ( + +

+ + {extension.detail_title} + +

+

{extension.detail_text}

+ + {extension.url && ( + + + + + + )} +
+

{extension.badges_label}

+ {extension.badges && + extension.badges.map((badge, i) => { + return {badge} + })} +
+ + + ) + })} + +
+
+ ) +} + +export default SplitCodeBlockCarousel diff --git a/www/components/CaseStudies/benchmark.tsx b/www/components/CaseStudies/benchmark.tsx new file mode 100644 index 00000000000..4c97dc281fc --- /dev/null +++ b/www/components/CaseStudies/benchmark.tsx @@ -0,0 +1,44 @@ +import { Button } from '@supabase/ui' +import { useRouter } from 'next/router' + +const Benchmark = () => { + const { basePath } = useRouter() + return ( +
+
+
+ Benchmark illustration + Benchmark illustration +
+

+ Built for speed and reliability +

+

+ + Supabase outperforms equivalent systems by more than 300%. + + + Sign up for our public benchmark release and we'll send it to your inbox. + +

+
+
+ +
+
+ ) +} + +export default Benchmark diff --git a/www/components/CaseStudies/index.tsx b/www/components/CaseStudies/index.tsx new file mode 100644 index 00000000000..5093d3ecc36 --- /dev/null +++ b/www/components/CaseStudies/index.tsx @@ -0,0 +1,42 @@ +import SectionHeader from 'components/UI/SectionHeader' +import CaseStudiesData from 'data/CaseStudies.json' +import { useRouter } from 'next/router' +import BlogListItem from '../Blog/BlogListItem' +import SectionContainer from '../Layouts/SectionContainer' + +const CaseStudies = () => { + const { basePath } = useRouter() + + return ( + +
+ +
+
+ {CaseStudiesData.map((caseStudy, idx: number) => ( + + ))} +
+ + ) +} + +export default CaseStudies diff --git a/www/components/CodeBlock/CodeBlock.module.css b/www/components/CodeBlock/CodeBlock.module.css new file mode 100644 index 00000000000..364e15058e9 --- /dev/null +++ b/www/components/CodeBlock/CodeBlock.module.css @@ -0,0 +1,46 @@ +.code-block { + @apply overflow-hidden; +} + +.code-line { + @apply block; + transition: filter 500ms ease, opacity 500ms ease; + transition-delay: 200ms; +} + +.code-block .code-line:first-of-type { + @apply flex items-end h-8; +} + +.code-block .code-line:first-of-type :global(.linenumber) { + @apply items-end self-stretch; +} + +.code-block .code-line:first-of-type > :global(*:not(.linenumber)) { + @apply pb-1; +} + +.code-block .code-line:last-of-type { + @apply flex items-start h-8; +} + +.code-block .code-line:last-of-type :global(.linenumber) { + @apply items-start self-stretch; +} + +.code-block .code-line:last-of-type > :global(*:not(.linenumber)) { + @apply pt-1; +} + +.code-block code .linenumber { + margin-right: 4px; +} + +.code-block code::after, +.code-block code::before { + content: none !important; +} + +.code-line--flash { + @apply animate-flash-code-slow; +} diff --git a/www/components/CodeBlock/CodeBlock.tsx b/www/components/CodeBlock/CodeBlock.tsx new file mode 100644 index 00000000000..1058882e8bf --- /dev/null +++ b/www/components/CodeBlock/CodeBlock.tsx @@ -0,0 +1,129 @@ +import { useCallback, useMemo } from 'react' +import reactSyntaxHighlighter, { Light as SyntaxHighlighter } from 'react-syntax-highlighter' +import monokaiCustomTheme from 'data/CodeEditorTheme' +import CodeBlockStyles from './CodeBlock.module.css' +import { Button, IconCopy } from '@supabase/ui' +import CopyToClipboard from 'react-copy-to-clipboard' +import rangeParser from 'parse-numeric-range' + +import classNames from 'classnames' + +import js from 'react-syntax-highlighter/dist/cjs/languages/hljs/javascript' +import ts from 'react-syntax-highlighter/dist/cjs/languages/hljs/typescript' +import py from 'react-syntax-highlighter/dist/cjs/languages/hljs/python' +import sql from 'react-syntax-highlighter/dist/cjs/languages/hljs/sql' + +export interface CodeBlockProps { + lang: 'js' | 'ts' | 'sql' | 'py' + startingLineNumber?: number + hideCopy?: boolean + className?: string + children?: string + size?: 'small' | 'medium' | 'large' + /** + * Inline styling + * Supports CSS Properties in camelcase + */ + style?: React.CSSProperties | undefined + /** + * Lines to be highlighted. + * Supports individual lines: '14', multiple lines: '14,15', or a range of lines '14..19' + */ + highlightLines?: string + hideBorder?: boolean +} + +function CodeBlock(props: CodeBlockProps) { + let lang = props.lang + ? props.lang + : props.className + ? props.className.replace('language-', '') + : 'js' + // force jsx to be js highlighted + if (lang === 'jsx') lang = 'js' + if (lang === 'tsx') lang = 'ts' + + SyntaxHighlighter.registerLanguage('js', js) + SyntaxHighlighter.registerLanguage('ts', ts) + SyntaxHighlighter.registerLanguage('py', py) + SyntaxHighlighter.registerLanguage('sql', sql) + + // const large = props.size === 'large' ? true : false + const large = false + + const shouldHighlightLines = props.highlightLines !== undefined + const highlightLines = useMemo( + () => new Set(rangeParser(props.highlightLines ?? '')), + [props.highlightLines] + ) + + const lineProps = useCallback( + (lineNumber: number) => { + const shouldHighlightLine = !shouldHighlightLines || highlightLines.has(lineNumber) + + const style = shouldHighlightLine ? {} : { filter: 'grayscale(75%)', opacity: 0.5 } + + return { + class: classNames( + CodeBlockStyles['code-line'], + shouldHighlightLines && shouldHighlightLine && CodeBlockStyles['code-line--flash'] + ), + style, + } + }, + [highlightLines] + ) + + return ( +
+ + {props.children} + + + {!props.hideCopy && props.children ? ( +
+ + + +
+ ) : null} +
+ ) +} + +export default CodeBlock diff --git a/www/components/Container.tsx b/www/components/Container.tsx new file mode 100644 index 00000000000..f0bbb25c01e --- /dev/null +++ b/www/components/Container.tsx @@ -0,0 +1,11 @@ +import { ReactNode, FunctionComponent } from 'react' + +type Props = { + children?: ReactNode +} + +const Container: FunctionComponent = ({ children }: Props) => { + return
{children}
+} + +export default Container diff --git a/www/components/CountUp.tsx b/www/components/CountUp.tsx new file mode 100644 index 00000000000..16597982056 --- /dev/null +++ b/www/components/CountUp.tsx @@ -0,0 +1,61 @@ +import { useState, useEffect } from 'react' + +type Props = { + children: any + duration?: number + triggerAnimOnScroll?: boolean + referenceElId?: string +} + +const easeOutQuad = (t: number) => t * (2 - t) +const frameDuration = 1000 / 60 + +const CountUp = (props: Props) => { + const { children, duration = 2000, triggerAnimOnScroll = false, referenceElId = '' } = props + const countTo = parseInt(children, 10) + const [count, setCount] = useState(0) + const [animTriggered, setAnimTriggered] = useState(false) + + useEffect(() => { + let frame = 0 + const totalFrames = Math.round(duration / frameDuration) + + async function handleScroll() { + const reference = document.getElementById(referenceElId) + if (reference && !animTriggered) { + const yOffset = reference.getBoundingClientRect().top - window.innerHeight + 20 + if (yOffset <= 0) { + setAnimTriggered(true) + setCount(0) + const counter = setInterval(() => { + frame++ + const progress = easeOutQuad(frame / totalFrames) + setCount(countTo * progress) + + if (frame === totalFrames) clearInterval(counter) + }, frameDuration) + } + } + } + + if (triggerAnimOnScroll) { + window.addEventListener('scroll', handleScroll, { passive: true }) + } else { + const counter = setInterval(() => { + frame++ + const progress = easeOutQuad(frame / totalFrames) + setCount(countTo * progress) + + if (frame === totalFrames) clearInterval(counter) + }, frameDuration) + } + + return () => { + if (triggerAnimOnScroll) window.removeEventListener('scroll', handleScroll) + } + }, [animTriggered]) + + return {Math.floor(count)} +} + +export default CountUp diff --git a/www/components/DarkModeToggle.tsx b/www/components/DarkModeToggle.tsx new file mode 100644 index 00000000000..a36ab085c57 --- /dev/null +++ b/www/components/DarkModeToggle.tsx @@ -0,0 +1,45 @@ +import { useTheme } from '~/components/Providers' +import { IconSun, IconMoon } from '@supabase/ui' + +function DarkModeToggle() { + const { isDarkMode, toggleTheme } = useTheme() + + const toggleDarkMode = () => { + localStorage.setItem('supabaseDarkMode', (!isDarkMode).toString()) + toggleTheme() + + const key = localStorage.getItem('supabaseDarkMode') + document.documentElement.className = key === 'true' ? 'dark' : '' + } + + return ( +
+ + + +
+ ) +} + +export default DarkModeToggle diff --git a/www/components/EnterpriseContactForm.tsx b/www/components/EnterpriseContactForm.tsx new file mode 100644 index 00000000000..af4c80eda3a --- /dev/null +++ b/www/components/EnterpriseContactForm.tsx @@ -0,0 +1,163 @@ +import { Button, Form, Input, Select } from '@supabase/ui' +import { useState } from 'react' +import countries from '~/data/Countries.json' +import supabase from '~/lib/supabase' + +const INITIAL_VALUES = { + companyName: '', + contactName: '', + contactEmail: '', + contactPhone: '', + companySize: '', + details: '', + country: 'US', +} + +const validate = (values: any) => { + const errors: any = {} + + if (!values.companyName) { + errors.companyName = 'Required' + } + + if (!values.contactName) { + errors.contactName = 'Required' + } + + if (!values.contactEmail) { + errors.contactEmail = 'Required' + } else if (!/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i.test(values.contactEmail)) { + errors.contactEmail = 'Invalid email address' + } + + return errors +} + +const EnterpriseContactForm = () => { + const [formSubmitted, setFormSubmitted] = useState(false) + + const handleFormSubmit = async (values: typeof INITIAL_VALUES, { resetForm }: any) => { + const { error } = await supabase.from('enterprise_contacts').insert( + [ + { + company_name: values.companyName, + contact_name: values.contactName, + contact_email: values.contactEmail, + contact_phone: values.contactPhone, + company_size: values.companySize, + details: values.details, + country: values.country, + }, + ], + { returning: 'minimal' } + ) + + // TODO: handle error + console.log('error:', error) + if (!error) { + resetForm() + + setFormSubmitted(true) + } + } + + return ( +
+
+ {({ isSubmitting }: any) => ( +
+
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+
+ )} + + + {formSubmitted && ( +

Thanks, we'll reach out to you shortly.

+ )} +
+ ) +} + +export default EnterpriseContactForm diff --git a/www/components/ExampleCard.tsx b/www/components/ExampleCard.tsx new file mode 100644 index 00000000000..ffa7ed10284 --- /dev/null +++ b/www/components/ExampleCard.tsx @@ -0,0 +1,87 @@ +import { Button, Divider, IconArrowUpRight, IconGitHub, IconTriangle, Space } from '@supabase/ui' +import Link from 'next/link' + +function ExampleCard(props: any) { + return ( + <> +
+
+

{props.title}

+

{props.description}

+
+ {props.author + {props.author} +
+
+
+ +
+
+ + + {props.repo_name} + + + + + + +
+ {props.vercel_deploy_url && ( + + + + )} + {props.demo_url && ( + + + + + + )} + {!props.demo_url && ( + + + + + + )} +
+
+
+ + ) +} + +export default ExampleCard diff --git a/www/components/Favicons.tsx b/www/components/Favicons.tsx new file mode 100644 index 00000000000..5c65346f0fa --- /dev/null +++ b/www/components/Favicons.tsx @@ -0,0 +1,38 @@ +import Head from 'next/head' +import { useRouter } from 'next/router' + +const Favicons = () => { + const { basePath } = useRouter() + return ( + + + + + + {/* */} + + + + + + + + + ) +} + +export default Favicons diff --git a/www/components/FeatureColumn.tsx b/www/components/FeatureColumn.tsx new file mode 100644 index 00000000000..745f97561bc --- /dev/null +++ b/www/components/FeatureColumn.tsx @@ -0,0 +1,11 @@ +function FeatureColumn({ icon, title, text }: any) { + return ( + <> + {icon &&
{icon}
} +

{title}

+

{text}

+ + ) +} + +export default FeatureColumn diff --git a/www/components/Features/index.tsx b/www/components/Features/index.tsx new file mode 100644 index 00000000000..21dbc854381 --- /dev/null +++ b/www/components/Features/index.tsx @@ -0,0 +1,41 @@ +import { Button, Badge, IconArrowRight } from '@supabase/ui' +import SectionHeader from 'components/UI/SectionHeader' +import Solutions from 'data/Solutions.json' +import Link from 'next/link' +import SectionContainer from '../Layouts/SectionContainer' +import ProductIcon from '../ProductIcon' +import TextLink from '../TextLink' + +const Features = () => { + const IconSections = Object.values(Solutions).map((solution: any) => { + const { name, description, icon, label, url } = solution + return ( +
+
+ +
{name}
+
+ +

{description}

+ + {label && ( +
+ {label} +
+ )} + {url && } +
+ ) + }) + + return ( + +

Build faster and focus on your products

+
+ {IconSections} +
+ + ) +} + +export default Features diff --git a/www/components/FloatingIcons/FloatingIcons.module.css b/www/components/FloatingIcons/FloatingIcons.module.css new file mode 100644 index 00000000000..9c8c30e4398 --- /dev/null +++ b/www/components/FloatingIcons/FloatingIcons.module.css @@ -0,0 +1,36 @@ +.icon-react-one { + @apply absolute w-20 z-10; + right: 13%; + top: 8%; +} +.icon-electron { + @apply absolute w-16 z-0; + left: 17%; + top: 25%; +} +.icon-vue { + @apply absolute w-16 z-10; + right: 33%; + top: 3%; +} +.icon-angular { + @apply absolute w-12 z-10; + right: 21%; + top: 28%; +} +.icon-flutter { + @apply absolute w-16 z-10; + left: 5%; + top: 15%; +} +.icon-nuxt { + @apply absolute w-12 z-10; + right: 5%; + top: 28%; +} +.icon-redwood { + @apply absolute w-14 z-10; + /* background-color: yellow; */ + left: 15%; + top: 5%; +} diff --git a/www/components/FloatingIcons/FloatingIcons.tsx b/www/components/FloatingIcons/FloatingIcons.tsx new file mode 100644 index 00000000000..d5d95f60697 --- /dev/null +++ b/www/components/FloatingIcons/FloatingIcons.tsx @@ -0,0 +1,45 @@ +import { useRouter } from 'next/router' + +import Styles from './FloatingIcons.module.css' + +function FloatingIcons() { + // base path for images + const { basePath } = useRouter() + + return ( +
+
+ + + + + + + +
+
+ ) +} + +export default FloatingIcons diff --git a/www/components/FloatingIcons/index.tsx b/www/components/FloatingIcons/index.tsx new file mode 100644 index 00000000000..87ca7e9ea48 --- /dev/null +++ b/www/components/FloatingIcons/index.tsx @@ -0,0 +1,3 @@ +import FloatingIcons from './FloatingIcons' + +export default FloatingIcons diff --git a/www/components/Footer/index.tsx b/www/components/Footer/index.tsx new file mode 100644 index 00000000000..aa6cda77fe0 --- /dev/null +++ b/www/components/Footer/index.tsx @@ -0,0 +1,138 @@ +import { useRouter } from 'next/router' +import FooterLinks from 'data/Footer.json' +import SectionContainer from '../Layouts/SectionContainer' +import DarkModeToggle from '../DarkModeToggle' +import Link from 'next/link' +import { useTheme } from '../Providers' +import { Badge } from '@supabase/ui' +import Image from 'next/image' + +const Footer = () => { + const { basePath } = useRouter() + const { isDarkMode } = useTheme() + + return ( + + ) +} + +export default Footer diff --git a/www/components/Hero.tsx b/www/components/Hero.tsx new file mode 100644 index 00000000000..516d79c7c8d --- /dev/null +++ b/www/components/Hero.tsx @@ -0,0 +1,113 @@ +import { Button, IconBookOpen, Space } from '@supabase/ui' +import Link from 'next/link' +import { useRouter } from 'next/router' +import SectionContainer from './Layouts/SectionContainer' + +const Hero = () => { + const { basePath } = useRouter() + + return ( +
+ +
+
+
+
+
+
+
+

+ The Open Source + Firebase Alternative +

+
+

+ Create a backend in less than 2 minutes. Start your project with a + Postgres Database, Authentication, instant APIs, Realtime subscriptions + and Storage. +

+
+
+
+ + + + + + +
+
+ backed by +
+
+ Y Combinator + Mozilla + Coatue +
+
+
+
+
+
+
+
+
+
+
+
+
+