[V0_FILE]typescriptreact:file="app/components/FeatureSection.tsx" "use client" import { motion } from "framer-motion" import { Bot, Zap, Shield, Sparkles, Cpu, Globe } from "lucide-react" const features = [ { icon: Bot, title: "Easy Bot Creation", description: "Build complex bots with a simple interface" }, { icon: Zap, title: "Lightning Fast", description: "Deploy your bots in seconds, not hours" }, { icon: Shield, title: "Secure & Reliable", description: "Bank-grade security for your Discord community" }, { icon: Sparkles, title: "AI-Powered", description: "Leverage cutting-edge AI for smarter bots" }, { icon: Cpu, title: "Advanced Automation", description: "Automate tasks with powerful workflows" }, { icon: Globe, title: "Global Scaling", description: "Scale your bots to millions of users effortlessly" }, ] export default function FeatureSection() { return (

Powerful Features

{features.map((feature, index) => ( ))}

) } function FeatureCard({ icon: Icon, title, description }) { return (

{title}

{description}

) } [V0_FILE]typescriptreact:file="app/components/Layout.tsx" isFixed="true" isQuickEdit="true" import type React from "react" import Header from "./Header" import Footer from "./Footer" export default function Layout({ children }: { children: React.ReactNode }) { return (

{children}

) } [V0_FILE]typescriptreact:file="app/components/Header.tsx" import Link from "next/link" export default function Header() { return (

Quinx

) } [V0_FILE]typescriptreact:file="app/components/Hero.tsx" import { motion } from "framer-motion" export default function Hero() { return (

Build Discord Bots{" "} With No Code

Quinx empowers you to create powerful Discord bots easily and quickly, without writing a single line of code.

Get Started

) } [V0_FILE]typescriptreact:file="app/components/Features.tsx" import { motion } from "framer-motion" import { Bot, Zap, Shield, Sparkles, Cpu, Globe } from "lucide-react" const features = [ { icon: Bot, title: "Easy Bot Creation", description: "Build complex bots with a simple interface" }, { icon: Zap, title: "Lightning Fast", description: "Deploy your bots in seconds, not hours" }, { icon: Shield, title: "Secure & Reliable", description: "Bank-grade security for your Discord community" }, { icon: Sparkles, title: "AI-Powered", description: "Leverage cutting-edge AI for smarter bots" }, { icon: Cpu, title: "Advanced Automation", description: "Automate tasks with powerful workflows" }, { icon: Globe, title: "Global Scaling", description: "Scale your bots to millions of users effortlessly" }, ] export default function Features() { return (

Powerful Features

{features.map((feature, index) => ( ))}

) } function FeatureCard({ icon: Icon, title, description }) { return (

{title}

{description}

) } [V0_FILE]typescriptreact:file="app/components/Pricing.tsx" import { Check } from "lucide-react" const plans = [ { name: "Basic", price: "$9", features: ["1 Bot", "100 Users", "Basic Commands", "Email Support"], }, { name: "Pro", price: "$29", features: ["5 Bots", "Unlimited Users", "Advanced Commands", "Priority Support"], }, { name: "Enterprise", price: "Custom", features: ["Unlimited Bots", "Unlimited Users", "Custom Features", "Dedicated Support"], }, ] export default function Pricing() { return (

Simple, Transparent Pricing

{plans.map((plan, index) => (

{plan.name}

{plan.price} /mo

{feature}

))}

) } [V0_FILE]typescriptreact:file="app/components/About.tsx" export default function About() { return (

About Quinx

Quinx was founded with a simple mission: to democratize Discord bot creation. We believe that everyone should have the power to enhance their Discord communities, regardless of their coding skills.

Our platform combines cutting-edge technology with an intuitive interface, allowing you to build sophisticated bots that would typically require extensive programming knowledge. With Quinx, you're limited only by your imagination.

) } [V0_FILE]typescriptreact:file="app/components/Contact.tsx" export default function Contact() { return (

Get in Touch

) } [V0_FILE]typescriptreact:file="app/components/Footer.tsx" import Link from "next/link" export default function Footer() { return ( ) } [V0_FILE]typescriptreact:file="app/providers.tsx" isFixed="true" isQuickEdit="true" "use client" import { ThemeProvider as NextThemesProvider } from "next-themes" import type React from "react" export function Providers({ children }: { children: React.ReactNode }) { return ( {children} ) } [V0_FILE]typescriptreact:file="app/layout.tsx" isFixed="true" isQuickEdit="true" import { Mona_Sans as FontSans } from "next/font/google" import { cn } from "@/lib/utils" import { Providers } from "./providers" import "./globals.css" import type React from "react" // Import React const fontSans = FontSans({ subsets: ["latin"], variable: "--font-sans", }) export default function RootLayout({ children, }: { children: React.ReactNode }) { return ( {children} ) } [V0_FILE]typescriptreact:file="app/components/icons.tsx" import type { LightbulbIcon as LucideProps } from "lucide-react" export function Zap(props: LucideProps) { return ( ) } export function Command(props: LucideProps) { return ( ) } export function Scale(props: LucideProps) { return ( ) } [V0_FILE]typescriptreact:file="components/icons.tsx" isQuickEdit="true" import type { LightbulbIcon as LucideProps } from "lucide-react" export function Zap(props: LucideProps) { return ( ) } export function Command(props: LucideProps) { return ( ) } export function Scale(props: LucideProps) { return ( ) } [V0_FILE]typescriptreact:file="app/components/footer.tsx" import { Separator } from "@/components/ui/separator" import Link from "next/link" export function Footer() { return ( ) } [V0_FILE]typescriptreact:file="app/page.tsx" isQuickEdit="true" "use client" import { SiteHeader } from "./components/site-header" import { Button } from "@/components/ui/button" import { Separator } from "@/components/ui/separator" import { motion } from "framer-motion" import { Footer } from "./components/footer" import { Zap, Command, Scale, Bot, Shield, Sparkles, Check } from "lucide-react" export default function Home() { return (

🎉 Introducing Quinx Build Discord Bots
Without Code Create, deploy, and scale Discord bots without writing a single line of code.

Features built for scale

Quinx provides all the tools you need to create powerful Discord bots that can scale to millions of users.

{features.map((feature, index) => (

{feature.name}

{feature.description}

))}

Simple, transparent pricing

Choose the plan that's right for you and start building amazing Discord bots today.

{pricingPlans.map((plan, index) => (

{plan.name}

${plan.price} /month

{plan.description}

{feature}

))}

Ready to get started?

Create your first Discord bot in minutes. No credit card required.

) } const features = [ { name: "Easy Setup", description: "Get your bot up and running in minutes with our intuitive interface.", icon: Zap, }, { name: "Powerful Commands", description: "Create complex commands with our visual command builder.", icon: Command, }, { name: "Scale Infinitely", description: "Built to handle millions of users and messages.", icon: Scale, }, { name: "AI-Powered", description: "Leverage artificial intelligence to create smarter responses.", icon: Bot, }, { name: "Enterprise Security", description: "Bank-grade security to protect your bot and users.", icon: Shield, }, { name: "Custom Features", description: "Build custom features without touching any code.", icon: Sparkles, }, ] as const const pricingPlans = [ { name: "Free", price: 0, description: "Perfect for small communities and hobbyists.", features: ["1 bot", "Up to 100 users", "Basic command set", "Community support"], buttonText: "Start for Free", }, { name: "Pro", price: 8, description: "Ideal for growing communities and businesses.", features: [ "Unlimited bots", "Unlimited users", "Advanced commands", "Priority support", "Custom branding", "Analytics dashboard", ], buttonText: "Upgrade to Pro", }, ] as const [V0_FILE]typescriptreact:file="app/components/site-header.tsx" isQuickEdit="true" "use client" import Link from "next/link" import { usePathname } from "next/navigation" import { motion } from "framer-motion" import { NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, } from "@/components/ui/navigation-menu" import { Button } from "@/components/ui/button" export function SiteHeader() { const pathname = usePathname() const isAuthPage = pathname === "/signin" || pathname === "/register" return (

Quinx Products

Bot Builder

Create powerful Discord bots without code

Resources

Documentation

Learn how to build and customize your bots

Pricing {!isAuthPage && (

)}

) } [V0_FILE]typescriptreact:file="app/signin/page.tsx" isFixed="true" isQuickEdit="true" "use client" import { useState } from "react" import { motion } from "framer-motion" import { SiteHeader } from "../components/site-header" import { Footer } from "../components/footer" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { Label } from "@/components/ui/label" import Link from "next/link" export default function SignIn() { const [email, setEmail] = useState("") const [password, setPassword] = useState("") const handleSubmit = (e: React.FormEvent) => { e.preventDefault() // Handle sign in logic here console.log("Sign in with:", email, password) } return (

Sign in to your account

Or{" "} create a new account

) } [V0_FILE]typescriptreact:file="app/register/page.tsx" isFixed="true" isQuickEdit="true" "use client" import { useState } from "react" import { motion } from "framer-motion" import { SiteHeader } from "../components/site-header" import { Footer } from "../components/footer" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { Label } from "@/components/ui/label" import Link from "next/link" export default function Register() { const [name, setName] = useState("") const [email, setEmail] = useState("") const [password, setPassword] = useState("") const handleSubmit = (e: React.FormEvent) => { e.preventDefault() // Handle registration logic here console.log("Register with:", name, email, password) } return (

Create a new account

Or{" "} sign in to your existing account

) } [V0_FILE]typescriptreact:file="app/globals.css" isQuickEdit="true" @tailwind base; @tailwind components; @tailwind utilities; @layer base { :root { --background: 0 0% 100%; --foreground: 240 10% 3.9%; --card: 0 0% 100%; --card-foreground: 240 10% 3.9%; --popover: 0 0% 100%; --popover-foreground: 240 10% 3.9%; --primary: 240 5.9% 10%; --primary-foreground: 0 0% 98%; --secondary: 240 4.8% 95.9%; --secondary-foreground: 240 5.9% 10%; --muted: 240 4.8% 95.9%; --muted-foreground: 240 3.8% 46.1%; --accent: 240 4.8% 95.9%; --accent-foreground: 240 5.9% 10%; --destructive: 0 84.2% 60.2%; --destructive-foreground: 0 0% 98%; --border: 240 5.9% 90%; --input: 240 5.9% 90%; --ring: 240 5.9% 10%; --radius: 0.5rem; } .dark { --background: 240 10% 3.9%; --foreground: 0 0% 98%; --card: 240 10% 3.9%; --card-foreground: 0 0% 98%; --popover: 240 10% 3.9%; --popover-foreground: 0 0% 98%; --primary: 0 0% 98%; --primary-foreground: 240 5.9% 10%; --secondary: 240 3.7% 15.9%; --secondary-foreground: 0 0% 98%; --muted: 240 3.7% 15.9%; --muted-foreground: 240 5% 64.9%; --accent: 240 3.7% 15.9%; --accent-foreground: 0 0% 98%; --destructive: 0 62.8% 30.6%; --destructive-foreground: 0 0% 98%; --border: 240 3.7% 15.9%; --input: 240 3.7% 15.9%; --ring: 240 4.9% 83.9%; } } @layer base { * { @apply border-border; } body { @apply bg-background text-foreground; } } [V0_FILE]javascript:file="next.config.js" /** @type {import('next').NextConfig} */ const nextConfig = { reactStrictMode: true, swcMinify: true, } module.exports = nextConfig