https://github.com/natrontech/pocketbase-nextjs-template
This template repository contains the base structure of a nextjs app with a pocketbase backend.
https://github.com/natrontech/pocketbase-nextjs-template
golang nextjs pocketbase tailwindcss
Last synced: about 1 month ago
JSON representation
This template repository contains the base structure of a nextjs app with a pocketbase backend.
- Host: GitHub
- URL: https://github.com/natrontech/pocketbase-nextjs-template
- Owner: natrontech
- License: gpl-3.0
- Archived: true
- Created: 2022-09-19T18:33:24.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2024-03-16T21:32:59.000Z (over 1 year ago)
- Last Synced: 2025-04-14T11:21:48.718Z (6 months ago)
- Topics: golang, nextjs, pocketbase, tailwindcss
- Language: TypeScript
- Homepage:
- Size: 20.4 MB
- Stars: 28
- Watchers: 2
- Forks: 1
- Open Issues: 8
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Codeowners: CODEOWNERS
- Security: SECURITY.md
Awesome Lists containing this project
README
PocketBase Next.js Template
A
Template Repository
for Next.js apps with a PocketBase backend
pocketbase-nextjs-template allowes you to create a Next.js app with a PocketBase backend in seconds. :rocket:
Check out the company behind pocketbase-nextjs-template –
https://natron.io
## Everything you would expect
### Getting started
Search through all files/folders and replace all instances of `pocketbase-nextjs-template` with your project name.
There is a bash script that does this for you:
- [./scripts/getting-started.sh](./scripts/getting-started.sh)
Just run it and follow the instructions.
To deploy your app, you can containerize it with the included Dockerfile(s) under [./build/package/pocketbase](./build/package/pocketbase) and [./ui](./ui/).
Or simply execute the docker-compose file [docker-compose.yaml](docker-compose.yaml) to run the app locally.
### Open Source
Trust me, I'm open source.
You can find the source code on [Github](https://github.com/natrongmbh/pocketbase-nextjs-template).
The frontend is written in Next.js and the backend in GoLang (Pocketbase).
License: GPL 3
### Frontend
The frontend is written in TypeScript and uses Next.js.
It uses [Tailwind CSS](https://tailwindcss.com/) for styling with [Flowbite React](https://flowbite-react.com) as a design system.
There are also some self-written components in the `components` folder.
These are mostly inspired by the ui of [Pocketbase](https://pocketbase.io).
Just use them as you like. They are similar to the Pocketbase UI Components.
## Setup
You can deploy pocketbase-nextjs-template in your Kubernetes cluster, but you have to set all the env variables.
- [kubernetes-example](/deployments/kubernetes)
### Environment Variables
You need to set the following Environment
#### Pocketbase
- `POCKETBASE_DATA_DIR` - The directory where the Pocketbase data is stored. Default: `/pb_data`
- `POCKETBASE_ENCRYPTION_KEY` - The encryption key for the Pocketbase database. Must be 32 characters long.
#### UI
- `ENV_API_URL` - The URL of the API, e.g. `https://template.natron.io` (without trailing slash, but /api at the end, must be accessible from the webclient)
### Docker
You can also build and run pocketbase-nextjs-template with Docker.
```yaml
version: "3.9"
services:
pocketbase:
build:
context: ./
dockerfile: ./build/package/pocketbase/Dockerfile
ports:
- "8090:8090"
volumes:
- data:/data
ui:
build: ./ui
ports:
- "3000:3000"
environment:
- ENV_API_URL=http://template.natron.io:8090
volumes:
data: {}
```
### Production
You can deploy pocketbase-nextjs-template in your Kubernetes cluster, but you have to set all the env variables.
For backing up the database, you can consider using [Litestream](https://litestream.io).