https://github.com/fredygerman/next-js-directus-starter
A Next Js 13 with App router starter web app with Directus as a headless Cms and tailwind css for styling. This will include examples for common uses like authentication, data fetching, web sockets, file uploads, and more. Follow along on Twitter for updates.
https://github.com/fredygerman/next-js-directus-starter
cms cms-frontend directus directus-cms directus-custom-interface hacktoberfest hacktoberfest2023 next-js-13 next-js-starter-template nextjs starter tailwindcss
Last synced: about 1 year ago
JSON representation
A Next Js 13 with App router starter web app with Directus as a headless Cms and tailwind css for styling. This will include examples for common uses like authentication, data fetching, web sockets, file uploads, and more. Follow along on Twitter for updates.
- Host: GitHub
- URL: https://github.com/fredygerman/next-js-directus-starter
- Owner: fredygerman
- Created: 2023-08-25T20:51:00.000Z (almost 3 years ago)
- Default Branch: main
- Last Pushed: 2023-10-06T17:26:42.000Z (over 2 years ago)
- Last Synced: 2024-04-24T12:28:19.562Z (about 2 years ago)
- Topics: cms, cms-frontend, directus, directus-cms, directus-custom-interface, hacktoberfest, hacktoberfest2023, next-js-13, next-js-starter-template, nextjs, starter, tailwindcss
- Language: TypeScript
- Homepage: https://next-js-directus-starter-femmcn5zj-fdagreat.vercel.app/
- Size: 685 KB
- Stars: 7
- Watchers: 2
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Next js Directus Starter
Next.js 13 starter for building apps with Directus CMS Radix UI and Tailwind CSS.
## Usage
```bash
git clone https://github.com/fredygerman/next-js-directus-starter.git
```
### Change directory
```bash
cd next-js-directus-starter
```
### Install Dependencies
```bash
pnpm install
```
### Start Directus CMS
Make sure your Directus CMS is running and you have created a project.
### Define Environment Variables
```bash
cp .env.example .env
```
Note : Make sure all the environment variables are defined in your .env file.
For the DIRECTUS_DEFAULT_ROLE_ID you can use the default role id from your directus project.
For DIRECTUS_USER_CREATOR_TOKEN you need to create a user and a static token in your directus project.
### Start the development server
```bash
pnpm run dev
```
### You can now view the app in your browser at http://localhost:3000 🚀
## Features
- Next.js 13 App Directory
- Directus CMS
- Radix UI Primitives
- Tailwind CSS
- Icons from [Lucide](https://lucide.dev)
- Themes with next-themes and Tailwind CSS
- Tailwind CSS class sorting, merging and linting.
- Next js Server Side Components (SSC) & Client Side Components (CSC)
- Next js Form Actions
- Analytics with Posthog
## Roadmap
- [✅] Add Login and Register
- [✅] Add Analytics
- [ ] Add Installation Instructions Documentation
- [ ] Add Dashboard Page
- [ ] Add Simple Blog
- [ ] Add SEO
- [ ] Add Auth Guard
- [ ] Add Password Reset and Forgot Password
- [ ] Add User Profile
- [ ] Add User Settings
## Customizations and configurations.
- Site Config (site.ts) for Site Information configuration (i.e Name, Title, Nav Bar items, Links etc).
- Response Messages Config (messages.ts) for Creating user friendly response messages.
- [@t3-oss/env-nextjs](https://create.t3.gg/en/usage/env-variables) For Environment Variables configuration. (env.mjs)
- and other config files. (tailwind.config.js, postcss.config.js, next.config, prettier.config.js)
## License
Licensed under the [MIT license](https://github.com/shadcn/ui/blob/main/LICENSE.md).