https://github.com/code4mk/nextjs-friend
nextjs friend will be your nextjs boilerplate friend.
https://github.com/code4mk/nextjs-friend
nextjs nextjs-boilerplate
Last synced: 10 months ago
JSON representation
nextjs friend will be your nextjs boilerplate friend.
- Host: GitHub
- URL: https://github.com/code4mk/nextjs-friend
- Owner: code4mk
- Created: 2022-03-22T05:23:32.000Z (almost 4 years ago)
- Default Branch: master
- Last Pushed: 2022-09-07T10:02:56.000Z (over 3 years ago)
- Last Synced: 2025-02-19T12:55:25.807Z (10 months ago)
- Topics: nextjs, nextjs-boilerplate
- Language: TypeScript
- Homepage:
- Size: 67.4 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 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`
```tsx
let LayoutEnum: any = {
'base': Base,
}
```
* usages of layout
```tsx
import type { NextPage } from 'next'
import FriendHoc from '@utils/nextjs-friend'
const YourPageName: NextPage = () => {
return (
// your code
)
}
export default FriendHoc(YourPageName, {
layout: 'base',
})
```
# middleware
Auth middleware.
```tsx
export default FriendHoc(YourPageName, {
middleware: ['auth'],
})
```
# redux
redux (redux-toolkit) code will live inside `store` folder
* how to use redux toolkit with nextjs-friend.
```tsx
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.
```bash
yarn install
yarn dev
# with ssr
yarn dev-server
```