gatsby-plugin-netlify-identity-gotrue

    0.3.5 • Public • Published

    gatsby-plugin-netlify-identity-gotrue

    See the demo! https://gatsby-identity-demo.jonsully.net

    See the demo code 🤖 here! 🤖


    A simple Gatsby plugin for enabling a comprehensive and fully-featured Netlify Identity implementation into your Gatsby site. This plugin is a simplistic wrapper around react-netlify-identity-gotrue. See that repository for the full API documentation available within Gatsby.

    NPM

    Install

    npm i gatsby-plugin-netlify-identity-gotrue
    # or
    yarn add gatsby-plugin-netlify-identity-gotrue

    Then, in gatsby-config.js, add an entry to plugins:

    // In your gatsby-config.js
    module.exports = {
      plugins: [
        {
          resolve: `gatsby-plugin-netlify-identity-gotrue`,
          options: {
            url: `https://your-unique-site.netlify.app` // ❗REQUIRED❗
            // Do _not_ include any path (/.netlify/identity, etc.) and
            // leave the trailing slash off.
          }
        }
      ]
    }

    PLEASE NOTE - This plugin will fail if Netlify Identity isn't enabled for your live Netlify site. Local development uses the same Netlify Identity instance as your live / 'prod' site.

    Usage

    Once you've installed the plugin into your Gatsby site and added the plugin options to your gatsby-config.js file, you can pull in the useIdentityContext hook anywhere in your site. Just add import { useIdentityContext } from 'react-netlify-identity-gotrue' to your file's import statements (NOTE: this plugin pulls in react-netlify-identity-gotrue so the import should work just fine and you don't need to manually install react-netlify-identity-gotrue) then anywhere you need it, call the hook: const identity = useIdentityContext()

    In context, this looks like:

    // my-account.js
    import React from 'react'
    import { useIdentityContext } from 'react-netlify-identity-gotrue'
    
    export default () => {
      const identity = useIdentityContext()
      
      return {
        identity.user
          ? <p>Welcome to your account, {identity.user.email}</p>
          : <p>Please log in</p>
      }
    }

    To learn more about the identity object and the full API available to you when using this plugin, please see react-netlify-identity-gotrue.

    To see a fully working, implemented demo using this plugin (for ideas or in-context references), please see gatsby-plugin-netlify-identity-gotrue-demo


    Note

    This repository, the underlying react-netlify-identity-gotrue repository, and the gatsby-plugin-netlify-identity-gotrue-demo repository that consumes this one are not related to Netlify's netlify-identity-widget stack or @sw-yx's react-netlify-identity stack, both of which ultimately sit on gotrue-js. This stack is written in pure React and interfaces with Netlify Identity directly without any dependencies. You can read some history about the three stacks here: https://jonsully.net/blog/announcing-react-netlify-identity-gotrue.

    Install

    npm i gatsby-plugin-netlify-identity-gotrue

    DownloadsWeekly Downloads

    21

    Version

    0.3.5

    License

    MIT

    Unpacked Size

    5.92 kB

    Total Files

    8

    Last publish

    Collaborators

    • jonsully