🔍 Fact Checking Website

A modern, AI-powered fact-checking web application built with Next.js 16, TypeScript, and Google's Generative AI. This application helps users verify information and check facts in real-time using advanced machine learning models.

✨ Features

🤖 AI-Powered Fact Checking: Leverages Google's Generative AI for accurate fact verification
⚡ Real-time Analysis: Instant fact-checking results with detailed explanations
🎨 Modern UI: Built with Radix UI components and Tailwind CSS for a sleek, responsive design
🌙 Dark Mode Support: Automatic theme switching with next-themes
📊 Data Visualization: Interactive charts and graphs using Recharts
🔐 Type-Safe: Fully typed with TypeScript and validated with Zod schemas
📱 Responsive Design: Mobile-first approach for all device sizes

🚀 Live Demo

Production: https://vercel.com/ronaks-projects-c39a60e7/v0-fact-checking-website

Continue Building: https://v0.app/chat/vqmmEtThDQv

🛠️ Tech Stack

Core

Framework: Next.js 16.1 - React framework for production
Language: TypeScript 5.9 - Type-safe JavaScript
Runtime: React 19.2 - UI library

Styling

CSS Framework: Tailwind CSS 4.1 - Utility-first CSS
Components: Radix UI - Accessible component primitives
Animations: tailwindcss-animate, tw-animate-css
Class Management: clsx, tailwind-merge, class-variance-authority

AI & Data

AI Integration: @google/generative-ai - Google's Generative AI SDK
Charts: Recharts - Composable charting library
Date Handling: date-fns - Modern date utility library

Forms & Validation

Form Management: React Hook Form - Performant forms
Validation: Zod - TypeScript-first schema validation
Resolvers: @hookform/resolvers - Form validation resolvers

UI Components

Accordion, Alert Dialog, Avatar, Checkbox, Dialog, Dropdown Menu
Hover Card, Navigation Menu, Popover, Progress, Radio Group
Scroll Area, Select, Slider, Switch, Tabs, Toast, Tooltip
Carousel (embla-carousel-react), Command Palette (cmdk)
OTP Input (input-otp), Drawer (vaul)

📦 Installation

Prerequisites

Node.js 18+
npm, yarn, or pnpm

Setup

Clone the repository

git clone https://github.com/Ronak501/fact-checking-website.git
cd fact-checking-website

Install dependencies

npm install
# or
yarn install
# or
pnpm install

Set up environment variables Create a .env.local file in the root directory:
```
NEXT_PUBLIC_GOOGLE_AI_API_KEY=your_google_ai_api_key_here
```

Run the development server

npm run dev
# or
yarn dev
# or
pnpm dev

Open your browser Navigate to http://localhost:3000

📜 Available Scripts

npm run dev      # Start development server on http://localhost:3000
npm run build    # Build the application for production
npm run start    # Start production server
npm run lint     # Run ESLint to check code quality

📁 Project Structure

fact-checking-website/
├── app/                  # Next.js 16 App Router pages
├── components/           # Reusable React components
│   └── ui/              # Radix UI component wrappers
├── lib/                 # Utility functions and helpers
├── public/              # Static assets
├── styles/              # Global styles and Tailwind config
├── components.json      # Shadcn UI configuration
├── next.config.mjs      # Next.js configuration
├── tailwind.config.js   # Tailwind CSS configuration
├── tsconfig.json        # TypeScript configuration
└── package.json         # Project dependencies