https://github.com/iampearceman/add-inbox
A CLI command to easily add Novu's notification inbox component to your React or Next.js project.
https://github.com/iampearceman/add-inbox
cli component in-app inbox nextjs notifications novu react
Last synced: 5 months ago
JSON representation
A CLI command to easily add Novu's notification inbox component to your React or Next.js project.
- Host: GitHub
- URL: https://github.com/iampearceman/add-inbox
- Owner: iampearceman
- Created: 2025-05-08T15:21:48.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2025-05-12T08:50:40.000Z (5 months ago)
- Last Synced: 2025-05-13T00:58:28.618Z (5 months ago)
- Topics: cli, component, in-app, inbox, nextjs, notifications, novu, react
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/add-inbox
- Size: 51.8 KB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Add Inbox
A CLI command to easily add Novu's notification inbox component to your React or Next.js project.
## Installation & Usage
You can use this tool without installing it by running:
```bash
npx add-inbox@latest init
```
This will guide you through an interactive process to add the Novu Inbox component to your project.
## Features
- ✅ Interactive CLI prompts for selecting framework and TypeScript options
- ✅ Support for React and Next.js
- ✅ Support for Tailwind CSS styling
- ✅ Automatic dependency installation
- ✅ Component creation in your project's component directory
- ✅ Environment variable setup for Novu configuration
## Demo
```
$ npx add-inbox@latest init
🔔 Novu Inbox Component Installer
? What framework are you using? ›
❯ React
Next.js
? Are you using TypeScript? › (Y/n)
```
## Example Usage in Your App
```jsx
import NovuInbox from '@/components/ui/inbox/novuInbox';
// Inside your component
return (
My App
);
```
## Configuration
Make sure to set up your Novu application ID:
For React:
```
NOVU_APP_ID=your_app_id_here
NOVU_SUBSCRIBER_ID=your_subscriber_id_here
```
For Next.js:
```
NEXT_PUBLIC_NOVU_APP_ID=your_novu_app_id_here
NEXT_PUBLIC_NOVU_SUBSCRIBER_ID=your_subscriber_id_here
```
## License
MIT