Rename project from FrogStats to Rybbit and update related documentation and UI components accordingly. Adjusted code guidelines, modified organization setup prompts, and updated example HTML to reflect the new branding. Added usage documentation and improved self-hosting instructions for clarity.

CLAUDE.md

@@ -1,18 +1,22 @@
-# FrogStats Code Guidelines
+# Rybbit Code Guidelines
 
 ## Commands
+
 ### Client (Next.js)
+
 - Build: `npm run build`
 - Dev: `npm run dev` (port 3002 with turbopack)
 - Lint: `npm run lint`
 - Start: `npm run start` (port 3002)
 
 ### Server
+
 - Build: `npm run build`
 - Dev: `npm run dev` (builds and runs)
 - DB: `npm run db:generate|migrate|push|pull|check|drop`
 
 ## Code Style
+
 - **TypeScript**: Strict typing, interfaces for API/props
 - **React**: Functional components, Tanstack Query, Zustand
 - **Formatting**: Arrow functions, async/await, named exports
@@ -22,4 +26,4 @@
 - **Documentation**: JSDoc for utilities, descriptive function names
 - **Theme**: Dark mode by default
 
-FrogStats is a self-hostable open source Google Analytics alternative.
+Rybbit is a self-hostable open source Google Analytics alternative.

client/src/app/components/CreateOrganizationDialog.tsx

@@ -107,7 +107,7 @@ export function CreateOrganizationDialog({
             Create Your Organization
           </DialogTitle>
           <DialogDescription>
-            Set up your organization to get started with Frogstats
+            Set up your organization to get started with Rybbit
           </DialogDescription>
         </DialogHeader>
         <form onSubmit={handleSubmit} className="space-y-6">
@@ -147,7 +147,7 @@ export function CreateOrganizationDialog({
                 required
               />
               <p className="text-xs text-muted-foreground">
-                This will be used in your URL: frogstats.io/{slug}
+                This will be used in your URL: rybbit.io/{slug}
               </p>
             </div>
 

client/src/app/layout.tsx

@@ -13,10 +13,6 @@ import "./globals.css";
 
 const inter = Inter({ subsets: ["latin"] });
 
-const metadata: Metadata = {
-  title: "Frogstats Analytics",
-  description: "Analytics dashboard for your web applications",
-};
 const publicRoutes = ["/login", "/signup"];
 
 // Helper function to check if a site is public

client/src/components/MobileSidebar.tsx

@@ -29,7 +29,7 @@ export function MobileSidebar() {
         </SheetTrigger>
         <VisuallyHidden.Root>
           <SheetHeader>
-            <SheetTitle>Frogstats Sidebar</SheetTitle>
+            <SheetTitle>Rybbit Sidebar</SheetTitle>
           </SheetHeader>
         </VisuallyHidden.Root>
         <SheetContent side="left" className="p-0 w-[223px]" showClose={false}>

client/src/components/TopBar.tsx

@@ -23,7 +23,7 @@ export function TopBar() {
       <div className="flex items-center justify-between flex-1">
         <div className="flex items-center space-x-4">
           <Link href="/" className="text-base font-semibold">
-            🐸 Frogstats
+            🐸 Rybbit
           </Link>
         </div>
         {session.data ? (

docs/src/content/_meta.js

@@ -4,4 +4,5 @@ export default {
   features: "",
   themes: "",
   advanced: "",
+  usage: "",
 };

docs/src/content/index.mdx

@@ -2,7 +2,7 @@ import { Bleed } from 'nextra/components'
 
 # Introduction
 
-**Frogstats** is an open source web and products analytics platform. Check out our [live demo](https://tracking.tomato.gg) using a real production site that sends over **10,000,000** events a month.
+**Rybbit** is an open source web and products analytics platform. Check out our [live demo](https://tracking.tomato.gg) using a real production site that sends over **10,000,000** events a month.
 
 ### Key Features
 
@@ -12,6 +12,11 @@ import { Bleed } from 'nextra/components'
 - Support for organizations
 - Advanced product analytics like funnels, user retention, user journeys, and custom reports
 
-You can either self-host Frogstats, or use our hosted cloud version.
+## Getting Started
+
+Choose the option that's right for you:
+
+-   **Cloud Version:** Sign up for the hosted version at [rybbit.io/signup](https://rybbit.io/signup). Get up and running in minutes.
+-   **Self-Host:** Follow our [Self-Hosting Guide](./self-hosting) to set up Rybbit on your own server.
 
 <Bleed>![Nextra Example](/demo.png)</Bleed>

docs/src/content/self-hosting.mdx

@@ -1,9 +1,9 @@
 import { Steps } from 'nextra/components'
 import { Callout } from 'nextra/components'
 
-# Self Hosting Frogstats
+# Self Hosting 
 
-This guide will walk you through setting up your own instance of Frogstats.
+This guide will walk you through setting up your own instance of Rybbit.
 
 ## Prerequisites
 
@@ -21,29 +21,35 @@ Before you begin, ensure you have the following:
 ## Setup Steps
 
 <Steps>
-### 1. Install Docker and Git
+### 1. Point Your Domain to Your VPS
 
-First, connect to your VPS via SSH.
+Configure your domain's DNS settings to point to your VPS's public IP address. This usually involves:
 
-**Install Docker Engine:** Follow the official instructions for your Linux distribution:
+1.  Finding your VPS's public IPv4 address (from your hosting provider, e.g., Hetzner).
+2.  Logging into your domain registrar or DNS provider (e.g., GoDaddy, Namecheap, Cloudflare).
+3.  Adding an `A` record:
+    *   **Host/Name:** Your desired subdomain (e.g., `tracking`) or `@` for the root domain.
+    *   **Value:** Your VPS's IPv4 address.
+    *   **TTL:** Default or a low value (e.g., 300 seconds) for faster updates.
+
+DNS changes might take some time to propagate globally. Use [DNS Checker](https://dnschecker.org/) to verify.
+
+### 2. Install Docker Engine
+
+Connect to your VPS via SSH.
+
+Follow the official Docker Engine installation instructions for your Linux distribution:
 [https://docs.docker.com/engine/install/](https://docs.docker.com/engine/install/)
 
-Make sure to complete the [post-installation steps for Linux](https://docs.docker.com/engine/install/linux-postinstall/) as well, particularly adding your user to the `docker` group so you don't have to use `sudo` for every Docker command.
+### 3. Clone the Rybbit Repository
 
-**Install Git:** If Git is not already installed, install it using your distribution's package manager. For Debian/Ubuntu:
+Clone the project repository from GitHub (Git is usually pre-installed on most server distributions):
 ```bash
-sudo apt update && sudo apt install -y git
+git clone https://github.com/goldflag/rybbit.git
+cd Rybbit
 ```
 
-### 2. Clone the Frogstats Repository
-
-Clone the project repository from GitHub:
-```bash
-git clone https://github.com/goldflag/frogstats.git
-cd frogstats
-```
-
-### 3. Run the Setup Script
+### 4. Run the Setup Script
 
 The repository includes a setup script that configures the necessary environment variables (including generating a secure secret) and starts the application using Docker Compose.
 
@@ -55,9 +61,9 @@ chmod +x setup.sh
 
 The script will create a `.env` file and then build and start the containers. This might take a few minutes the first time.
 
-### 4. Sign Up
+### 5. Sign Up
 
-Once the services are running, Caddy (the webserver) will automatically obtain an SSL certificate for your domain.
+Once the services are running and DNS has propagated, Caddy (the webserver) will automatically obtain an SSL certificate for your domain.
 
 Open your browser and navigate to `https://your.domain.name/signup` (using the domain you provided to the setup script).
 
@@ -65,4 +71,6 @@ Create your admin account. You can then log in and start adding your websites!
 
 </Steps>
 
-Congratulations! You have successfully self-hosted Frogstats.
+Congratulations! You have successfully self-hosted Rybbit.
+
+If you run into any issues or need help, feel free to join our Discord community!

mockdata/README.md

@@ -1,6 +1,6 @@
-# E-commerce Mock Data Generator for Frogstats
+# E-commerce Mock Data Generator for Rybbit
 
-This script generates realistic mock analytics data for Frogstats, simulating user behavior on an e-commerce website called ShopEase.
+This script generates realistic mock analytics data for Rybbit, simulating user behavior on an e-commerce website called ShopEase.
 
 ## Features
 

server/public/example.html

@@ -3,12 +3,12 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Frogstats Analytics Example</title>
+    <title>Rybbit Analytics Example</title>
 </head>
 <body>
-    <h1>Frogstats Analytics Example</h1>
+    <h1>Rybbit Analytics Example</h1>
     
-    <button onclick="frogstats.trackEvent('button_click', { buttonId: 'test-button' })">
+    <button onclick="Rybbit.trackEvent('button_click', { buttonId: 'test-button' })">
         Track Button Click
     </button>
 
@@ -19,7 +19,7 @@
     <script>
         // Track a custom event
         document.addEventListener('DOMContentLoaded', () => {
-            frogstats.trackEvent('page_ready', {
+            Rybbit.trackEvent('page_ready', {
                 loadTime: performance.now()
             });
         });