diff --git a/apps/www/_blog/2022-08-16-supabase-js-v2.mdx b/apps/www/_blog/2022-08-16-supabase-js-v2.mdx new file mode 100644 index 00000000000..7e7143d7652 --- /dev/null +++ b/apps/www/_blog/2022-08-16-supabase-js-v2.mdx @@ -0,0 +1,150 @@ +--- +title: 'Supabase.js v2' +description: 'Today we're releasing supabase-js v2, which focuses on “quality-of-life” improvements for developers.' +author: inian +image: lw5-cli/thumbnail.jpg +thumb: lw5-cli/thumbnail.jpg +tags: + - launch-week +date: '2022-08-16' +toc_depth: 3 +--- + +Today we're releasing [supabase-js v2](https://github.com/supabase/supabase-js), which focuses on “quality-of-life” improvements for developers. + +Update your library by running `npm i @supabase/supabase-js@latest`. + +Nearly 2 years ago we [released supabase-js v1](https://supabase.com/blog/improved-dx). +Since then it has been used in over [17K repositories](https://github.com/supabase/supabase-js/network/dependents?package_id=UGFja2FnZS04MjM3OTUyMDU%3D) and has grown +to [50K weekly downloads](https://www.npmjs.com/package/@supabase/supabase-js). Supabase users give a lot of great feedback and we've +learned some of the largest pain-points as a result. + +This release focuses on solving these pain-points. At the same time we want to make the upgrade path for supabase-js as easy as possible, +so we've been strategic about the changes we're making. We plan to follow this model going forward: incremental changes over huge rewrites. + +## Major Updates + +### Type support + +If you followed yesterday's announcement, you will have noticed that we added +[type generators](https://supabase.com/docs/reference/cli/usage#supabase-gen-types-typescript) to the CLI. + +```bash +supabase start +supabase gen types typescript --local > DatabaseDefinitions.ts +``` + +These types can now be used to enrich your development experience: + +```tsx +import Definitions from './DatabaseDefinitions' + +const supabase = createClient(SUPABASE_URL, ANON_KEY) + +const { data } = await supabase.from('messages').select().match({ id: 1 }) +``` + +
+ +ℹ️ Differences from v1 + +

+ v1 also supported types, but the types were generated from the API rather than the database, so it + lost a lot of detailed information. The library also required you to specify the definition in + every function call, rather than at the client level. +

+ +

+ supabase.from('messages').select('*') +

+ +
+ +### Async Auth overhaul + +We've rebuilt the Auth library, making it async for almost all functions. + +```ts +// v2 +const { data } = await supabase.auth.getSession() + +// v1 +const { data } = supabase.auth.session() +``` + +This solves the “getting logged out” issue, which has been a recurring issue in our GitHub Discussions. + +### New Auth methods + +We're removing the `signIn()` method in favor of more explicit function signatures: +`signInWithPassword()`, `signInWithPasswordless()`, and `signInWithOtp()`. + +```ts +// v2 +const { data } = await supabase.auth.signInWithPassword({ + email: 'hello@example', + password: 'pass', +}) + +// v1 +const { data } = await supabase.auth.signIn({ + email: 'hello@example', + password: 'pass', +}) +``` + +This helps with type hinting. Previously it was difficult for developers to know what they were missing. +A lot of developers didn't even realize they could use passwordless magic links. + +### Data functions return minimal by default + +The `insert()`, `update()`, and `upsert()` functions now require you to explicitly append `select()` if you want the data to be returned. + +```tsx +// v2 +const { data } = await supabase.from('messages').insert({ id: 1, message: 'Hello world' }).select() // select is now explicitly required + +// v1 +const { data } = await supabase.from('messages').insert({ id: 1, message: 'Hello world' }) // insert would also "select()" +``` + +This was another common question in our GitHub Discussions. While the idea of automatically returning data is great, +developers often turn on Row Level Security (which is great), and then they forget to add a `select` Policy. +It is a bit surprising that you need to add a `select` policy to do an `insert`, so we opted for the “principle of least surprise”. +If you don't append `select()`, the `data` value will be an empty object: `{}`. + +
+ +ℹ️ Differences from v1 + +

+ Previously you could pass a `returning: 'minimal'` option to the `insert()`, `update()`, and + `upsert()` statements. We've now made this the default behaviour. +

+ +
+ +## Community + +Version 2.0 is the result of the combined work of over 100 contributors to our libraries, and over 450 contributors to our docs and websites. +If you're one of those contributors, thank you. + +- [functions-js](https://github.com/supabase/functions-js/graphs/contributors) (4) +- [gotrue-js](https://github.com/supabase/gotrue-js/graphs/contributors) (47) +- [postgrest-js](https://github.com/supabase/postgrest-js/graphs/contributors) (30) +- [realtime-js](https://github.com/supabase/realtime-js/graphs/contributors) (16) +- [storage-js](https://github.com/supabase/storage-js/graphs/contributors) (17) +- [supabase-js](https://github.com/supabase/supabase-js/graphs/contributors) (39) + +## Migrating to v2 + +Update today by running `npm i @supabase/supabase-js@latest`. + +You can find a full list of updates, breaking changes, and a migration guide in our [Release Notes](https://supabase.com/docs/reference/javascript/release-notes). + +We'll continuing merging security fixes to v1, with maintenance patches for the next three months. + +## Links + +- v2 [Documentation](https://supabase.com/docs/reference/javascript) +- [Release Notes & Migration Guide](https://supabase.com/docs/reference/javascript/release-notes)