/nextjs-friend

nextjs friend will be your nextjs boilerplate friend.

Primary LanguageTypeScript

Nextjs-Friend

nextjs friend is a nextjs boilerplate.

Features

  • layout system
  • middleware (hoc)
  • redux
  • organize folder structure

layout

All layouts will live inside layout folder. Then register your layout ./utils/nextjs-friend.tsx

let LayoutEnum: any = {
  'base': Base,
}
  • usages of layout
import type { NextPage } from 'next'
import FriendHoc from '@utils/nextjs-friend'

const YourPageName: NextPage = () => {
  return (
    <div>
      // your code 
    </div>
  )
}

export default FriendHoc(YourPageName, {
  layout: 'base',
})

middleware

Auth middleware.

export default FriendHoc(YourPageName, {
  middleware: ['auth'],
})

redux

redux (redux-toolkit) code will live inside store folder

  • how to use redux toolkit with nextjs-friend.
import { useAppSelector, useAppDispatch } from '@utils/redux-friend'

function YourPage() {
  const dispatch = useAppDispatch()
  const getReduxState = useAppSelector((state: any) => state.name.data)
}
export default YourPage

Run project

  • clone the project.
yarn install 
yarn dev
# with ssr
yarn dev-server