Thanks to visit codestin.com
Credit goes to github.com

Skip to content

chill-czar/pingpanda

 
 

Repository files navigation

Real-time Event Monitoring and Notification SaaS

This project is a Real-time Event Monitoring and Notification SaaS designed to provide instant notifications for critical events directly to Discord. It leverages a modern tech stack to ensure efficient event tracking, real-time notifications, and robust user management.

Key Features

  • Real-time Notifications: Alerts for critical events via Discord.
  • User Management: Authentication and quota management using Clerk.
  • Event Tracking: Log and monitor events like sales and user sign-ups.
  • Dashboard and Insights: Real-time analytics on tracked events.
  • API Integration: RESTful API for event logging and management.
  • Caching: Enhanced performance with Upstash Redis.
  • Serverless Architecture: Uses Neon for PostgreSQL and Cloudflare Workers for backend operations.
  • Data Validation: Ensured with TypeScript and Zod.
  • Responsive UI: Built with Next.js, React, and Tailwind CSS.

Tech Stack

  • Frontend: Next.js, React, Tailwind CSS, Framer Motion, Lucide React, React Hook Form, Radix UI.

  • Backend: Prisma, Neon, Upstash Redis, Hono, SuperJSON, Zod.

  • Authentication: Clerk.

  • API: Discord.js, NextResponse.

  • DevOps: Wrangler.

  • Database: @neondatabase/serverless, @prisma/adapter-neon.

  • Caching: @upstash/redis.

  • Utilities: clsx, date-fns, class-variance-authority.

  • Layout page

Screenshot 2024-11-21 095303

Discord ui demo

Screenshot 2024-11-21 095316 Screenshot 2024-11-21 095327

Customeer review

Screenshot 2024-11-21 095338

Clerk auth

Screenshot 2024-11-21 095353

Dashboard

Screenshot 2024-11-21 095419

Events page

Screenshot 2024-11-21 095439

api end point testing

Screenshot 2024-11-21 095516

Sale event update instantly

Screenshot 2024-11-21 095529

Prisma studio updated

Screenshot 2024-11-21 095543

Creating new Category

Screenshot 2024-11-21 095622

New category in dashborad instantly

Screenshot 2024-11-21 095633

Category Deletion

Screenshot 2024-11-21 095642

Category Deleted from Dashboard and database neon

Screenshot 2024-11-21 095653

Signout

image

Signout Successful

image

Clerk account management

image

Installation

  1. Clone the repository:

    git clone https://github.com/your-username/your-repo-name.git
    cd your-repo-name
  2. Install dependencies:

    npm install
  3. Set up environment variables:

    • Copy

.env.example

to Screenshot 2024-11-21 095653

.env

and fill in the required values.

  1. Generate Prisma client:

    npx prisma generate
  2. Run the development server:

    npm run dev

Usage

API Endpoints

  • POST /api/v1/events: Log a new event.
    {
      "category": "sale",
      "fields": {
        "plan": "PRO",
        "email": "[email protected]",
        "amount": 49.00
      }
    }

Example Code Snippet

const quotaLimit =
  user.plan === "FREE"
    ? FREE_QUOTA.maxEventsPerMonth
    : PAID_QUOTA.maxEventsPerMonth

if (quota && quota.count >= quotaLimit) {
  return NextResponse.json(
    {
      message: `You have reached your monthly limit of ${quotaLimit} events. Please upgrade your plan to create more events.`,
    },
    { status: 429 }
  )
}

const discord = new DiscordClient(process.env.DISCORD_BOT_TOKEN)
const dmChannel = await discord.createDM(user.discordId)
await discord.sendEmbed(dmChannel.id, {
  title: "hello world",
})

return NextResponse.json({ message: "Event logged and notification sent." })

Contributing

Contributions are welcome! Please open an issue or submit a pull request for any changes.

License

This project is licensed under the MIT License. See the

LICENSE

file for details.

Contact

For any inquiries, please contact [email protected].


Star the repo if you find it useful!


This `README.md` file provides a comprehensive overview of your project, including key features, tech stack, installation instructions, usage examples, and contribution guidelines.
This `README.md` file provides a comprehensive overview of your project, including key features, tech stack, installation instructions, usage examples, and contribution guidelines.

About

Confidently ship high-performance, low-cost Next.js apps

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 97.4%
  • CSS 2.4%
  • JavaScript 0.2%