next-proper

Easily compile NextJS props via composed methods for `getServerSideprops` and `getStaticProps`.

Usage no npm install needed!

<script type="module">
  import nextProper from 'https://cdn.skypack.dev/next-proper';
</script>

README

⛓ next-proper

npm NPM npm

Easily compile NextJS props via composed methods for getServerSideProps and getStaticProps.

Install

Via npm

npm install --save next-proper

Via Yarn

yarn add next-proper

How to use

The goal of this package is to make it easy to compose NextJS props logic for either getServerSideProps or getStaticProps, so that you don’t have to copy that same code through all your pages.

Depending on your needs, or your apps logic, as you compose your prop methods, you can internally either exit early with { notFound: true } or { redirect: ... }, or continue the chain by calling, next({ props: {...} });

Here’s a basic example using some simplified auth logic:

props/getAuthProps.js

export const getAuthProps = async (props, next, ctx) => {
  ...Do auth stuff...
  const user = getUser(...)

  if (!user) {
    return {
      redirect: {
        destination: '/login',
        permanent: false,
      }
    }
  }

  return next({
    ...props,
    props: {
      ...props.props,
      user,
    }
  })
}

pages/secure-page.js

import nextProps from 'next-proper'
import { getAuthProps } from 'props/getAuthProps'
import { getFetchPageProps } from 'props/getServerSideFetchPageProps'

export const getServerSideProps = (ctx) => nextProps([
  getAuthProps,
  getFetchPageProps,
])(ctx)

License

MIT © Ryan Hefner