https://github.com/mr-addict/playground
Personal Next.js Playground
https://github.com/mr-addict/playground
next-auth nextjs tailwindcss
Last synced: 3 months ago
JSON representation
Personal Next.js Playground
- Host: GitHub
- URL: https://github.com/mr-addict/playground
- Owner: MR-Addict
- Created: 2023-01-17T07:18:55.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2024-11-28T04:32:11.000Z (over 1 year ago)
- Last Synced: 2024-11-28T05:20:04.674Z (over 1 year ago)
- Topics: next-auth, nextjs, tailwindcss
- Language: TypeScript
- Homepage: https://playground-mraddict.vercel.app
- Size: 3.12 MB
- Stars: 1
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Next.js Playground
## 1. Packages
- [x] Zod
- [x] Sass
- [x] Sharp
- [x] Sanity
- [x] Nextauth
- [x] Typescript
- [ ] Turbopack
- [x] Codemirror
- [x] Nodemailer
- [x] Tailwindcss
- [x] Gray Matter
- [x] React Icons
- [x] Mongodb Altas
- [x] Framer Motion
- [x] Next MDX Remote
- [x] Bcrypt(Replaced by bcryptjs, only used on server side)
## 2. Components
- [x] Popup
- [x] Error
- [x] Footer
- [x] Loading
- [x] Tooltip
- [x] Youtube
- [x] Codepen
- [x] Markdown
- [x] Cronitor
- [x] ScrollToTop
## 3. Features
- [x] `src` folder
- [x] Blog
- [x] Login
- [x] Tools
- [x] Mongodb
- [x] Feedback
- [x] Add Moments
- [x] Live timeago
- [x] Login user group
- [x] Online HTMl playground
- [x] Capture website from url
- [x] Playground(Hidden interactive eggs)
## 4. Bugs
- [x] Cannot use bcrypt(Replaced by bcryptjs, only used on server side)
- [x] Only root `loading.tsx` usable(Seems that the bug has been fixed after 13.1.6)
- [x] Cannot generate static pages using force-cache(Solved because of Nextauth unstabl_getServerSession at root navbar)
## 5. Traps
- [x] Server side cannot access client-side api route
- [x] Client side cannot access server-side environment(env in next config accessible globally)
- [x] `dns not found` error mostly you put server component in client component. They even cannot be in the same `index.ts`.
## 6. TODOs
- [x] Add page loading progress bar(2023.4.1 Tricky way to solve it)
- [ ] Better way to update user session whenever a user first opens page
- [x] Gist page add add and delete button(2023.4.12 Solved by using sanity studio)
## 7. Tailwindcss Rules
| Key | Value |
| :---------- | :-------- |
| Max width | sm |
| Break point | md |
| Duration | 300 |
| Light | gray-500 |
| Dark | gray-700 |
| Theme | green-600 |
## 8. Deploy
Add `.env` file:
```env
MAILFROM="your_email"
MAILPASS="your_email_pass"
OPENAI_TOKEN="create_a_openai_token"
GITHUB_TOKEN="create_a_github_token"
NEXTAUTH_SECRET="create_a_nextauth_secret"
SANITY_PROJECT_ID="create_a_sanity_project_id"
NEXTAUTH_URL="https://your.website.domain.com/"
MONGODB_URI="mongodb://username:password@mongodb0.example.com:27017/"
```
Build project:
```bash
npm run build
```
Start project:
```bash
npm start
```