https://github.com/impfundev/impblog
Fullstack blog build with Next js 13 App Router and Payload CMS
https://github.com/impfundev/impblog
collaborate github javascript learn mongodb mongodb-atlas nextjs nextjs13 payload payloadcms react
Last synced: 7 months ago
JSON representation
Fullstack blog build with Next js 13 App Router and Payload CMS
- Host: GitHub
- URL: https://github.com/impfundev/impblog
- Owner: impfundev
- License: mit
- Created: 2023-08-15T09:17:23.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-10-18T05:19:00.000Z (over 2 years ago)
- Last Synced: 2025-03-29T12:11:12.203Z (about 1 year ago)
- Topics: collaborate, github, javascript, learn, mongodb, mongodb-atlas, nextjs, nextjs13, payload, payloadcms, react
- Language: TypeScript
- Homepage:
- Size: 1.71 MB
- Stars: 4
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
# IMPBLOG
Fullstack blog build with Next js 13 App Router and Payload CMS
This is a fullstack blog built using the React js framework, Next js version 13 with App Router, and Payload headless CMS that uses MongoDB as the database.
Prerequired:
- [Node.Js 16.14 or later](https://nodejs.org/id)
- [Next.Js 13](https://nextjs.org/docs/getting-started/installation)
- [Payload CMS](https://payloadcms.com/docs/getting-started/installation)
- [MongoDB](https://www.mongodb.com/) (Running localy or using [MongoDB Atlas](https://www.mongodb.com/atlas/database))
To start try it, you can clone this repository to your local computer
```
git clone https://github.com/impfundev/MyBlog.git
```
## Start running the Payload CMS
Open the payload directory
```
cd payload
```
Fill in the ```.env``` file and customize it to yours. You can see more details in the ```.env.example``` file
```env
NODE_ENV= # development || production
MONGO_URL= # your mongodb uri
MONGO_USERNAME= # your mongodb username
MONGO_PASSWORD= # your mongodb password
PAYLOAD_PUBLIC_SERVER_URL= # your payload public url e.g http://localhost:8000
PAYLOAD_SECRET_KEY= # your payload secret key
PAYLOAD_CONFIG_PATH= # your payload.config.ts file path
PAYLOAD_SEED= # true || false
PORT= # your payload port e.g 8000
WHITELIST_ORIGINS= # your whitelist port e.g http://localhost:3000
```
Run the payload in development mode by:
```
npm run dev
```
Run the payload in production mode by:
```
npm run build
```
and
```
npm run start
```
## Start running Next js
To run Next js, you can go to the blog directory.
```
cd blog
```
Fill in the .env file, as we have done before.
To run in development mode
```
npx next dev
```
To run in production mode.
```
npx next build
```
and
```
npm next start
```
Help me improve this project or just improve the doc. Feel free to create some Issues or Pull Requests.