Skip to content
master
Switch branches/tags
Code
This branch is up to date with master.
Contribute

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 
 
 

Gatsby Theme Cognito with Amplify

A wrapper theme to use Cognito (Amplify AWS) with your Gatsby website.

Installation

To use this theme in your Gatsby sites, follow these instructions:

  1. Install the theme

    npm install --save gatsby-theme-amplify-cognito
  2. Set up a Cognito User Pool in AWS and create an App Client. Ensure that the 'App client secret' setting is set to '(no secret key)'

  3. Add the theme to your gatsby-config.js:

    module.exports = {
      plugins: [{
        resolve: `gatsby-theme-amplify-cognito`,
        options: {
            region: '',
            userPoolId: '',
            identityPoolId: '',
            userPoolWebClientId: '',
    
            // optional, array of paths that won't be authenticated
            doNotAuthenticate: ['/foo', '/bar/baz'],
        },
    }]
    }
  4. Populate the userPoolId with the Pool Id found under 'General Settings', and userPoolWebClientId with the 'App client id' found under 'App clients'

  5. Populate the identityPoolId with the Id of the identity pool associated with your user pool. IF YOU WANT TO USE AWS SERVICE OBJECTS YOU WILL NEED TO SETUP AN IDENTITY POOL AND CONFIGURE THIS SETTING

  6. (Optional) Configure any paths that don't require authentication by populating doNotAuthenticate with an array of paths

  7. Each page is passed a prop of authState and authData which contain the details of the user session

  8. Use the components to create your page:

    import { SignIn, SignOut } from 'gatsby-theme-amplify-cognito';
    
    const Homepage = ({authState, authData}) => {
        return <section>
            {(authState !== "signedIn") ?
                <SignIn authState={authState} /> :
                <>
                    <h1>Hello {authData.username}</h1>
                    <SignOut />
                </>
            }
        </section>
    }
  9. Start your site

    gatsby develop

About

Straightforward integration with AWS Amplify and Cognito

Resources

Releases

No releases published

Packages

No packages published