# Project export: CampusMatch This document was generated by HackStack to give an AI agent context about a hackathon project. Sections are labeled with their provenance; content marked as truncated was cut to keep this document small. ## Project metadata - Hackathon: Cal Hacks 12.0 - Tagline: CampusMatch — AI-powered campus dating and networking. From voice intros to venue suggestions, it helps students connect through shared interests and real experiences. - Devpost: https://devpost.com/software/campus-connect-6rt35k - GitHub: https://github.com/headlesz/campus-chat-sync - Video: https://www.youtube.com/embed/MK7UvLG8mW0?enablejsapi=1&hl=en_US&rel=0&start=&version=3&wmode=transparent - Team: 2 GitHub contributor(s) — gpt-engineer-app[bot] (2 commits), bhavya6828 (1 commits) ## Devpost submission (written by the team) No Devpost description available. ## README (from the GitHub repository) ````markdown # 🌐 CampusMatch — AI-Powered Campus Connection Platform **Tagline:** Turn voice intros and chat into real, meaningful campus meetups — verified, contextual, and scheduled. --- ## 💡 Inspiration Campus life is full of opportunities, yet it’s often hard to meet people who share your interests. We wanted to make finding genuine connections — romantic, social, or professional — easier and more natural. That’s why we built **CampusMatch**, an AI-powered, campus-verified platform that connects students through shared experiences, conversations, and real-world meetups. --- ## 💬 What It Does CampusMatch verifies students through university email and voice-based onboarding. The AI transcribes and understands a student’s self-introduction to automatically generate a personalized profile. - **Phase 1:** Recommends campus clubs, events, and venues based on the profile. - **Phase 2:** Analyzes chat topics to suggest shared activities or nearby meet-up spots — for example, recommending a bubble tea café when two users chat about boba. - Syncs with **Google Calendar** to help users find mutual availability and schedule meetups effortlessly. --- ## 🛠️ How We Built It - **Frontend:** React with responsive design for web and mobile. - **Backend:** Node.js + Express APIs with PostgreSQL for structured data. - **AI Integration:** Claude API for chat analysis and icebreaker generation. - **Voice Onboarding:** Speech-to-text using the Web Speech API to capture introductions. - **Recommendations:** Context-aware engine powered by Google Places API and interest matching. - **Calendar Scheduling:** Google Calendar API for automatic time slot suggestions. - **Collaboration:** Managed through Git with coordinated branching and merging. --- ## ⚡ Challenges We Ran Into - Managing real-time AI chat analysis while maintaining low latency. - Achieving accurate voice transcription from varied accents and noisy environments. - Handling secure OAuth flows for Google Calendar without complicating UX. - Synchronizing backend updates with a rapidly evolving React frontend. --- ## 🏆 Accomplishments We’re Proud Of - Built a fully functional AI-driven matching and recommendation system. - Successfully integrated Claude for contextual conversation support. - Created voice-based onboarding that turns spoken intros into structured profiles. - Implemented calendar scheduling that respects privacy and consent. --- ## 📚 What We Learned - How to build AI features that **enhance** human connection rather than replace it. - The importance of team collaboration and Git discipline during a hackathon. - Balancing privacy, usability, and intelligence in personal-data-heavy apps. - The power of combining LLMs with real-world APIs to create personalized experiences. --- ## 🚀 What’s Next - Launching a personalized event feed powered by embeddings and interest clustering. - Introducing AI safety assistants to promote secure meetups and verify venues. - Expanding beyond campuses to alumni networks and city-based communities. - Refining recommendation models with real user feedback to improve match quality. --- ## 🧠 Tech Stack **Frontend** - React (responsive web + mobile-friendly UI) - Web Speech API for speech capture **Backend** - Node.js + Express - PostgreSQL for structured data **AI & Services** - Claude API (chat analysis + icebreaker generation) - Google Places API (venue suggestions) - Google Calendar API (scheduling) **Collaboration & Tools** - Git for version control - Postman for API testing **Built With** > claude · coderabbit · elastic · google · groq · node.js · postman · react · vapi · y-combinator --- ## ⚙️ Getting Started This project was bootstrapped with **Create React App**. ### Prerequisites - Node.js (v16+) - npm or yarn - PostgreSQL - Google API credentials (Places + Calendar) - Claude API Key ### 1. Clone the Repo ```bash git clone https://github.com/headlesz/campus-chat-sync.git cd campus-chat-sync ```` ### 2. Install Dependencies Frontend: ```bash cd frontend npm install ``` Backend: ```bash cd ../backend npm install ``` ### 3. Set Up Environment Variables Create `.env` files for frontend and backend. **Backend (`/backend/.env`):** ``` PORT=4000 DATABASE_URL=postgres://user:password@localhost:5432/campusmatch CLAUDE_API_KEY=your_claude_api_key GOOGLE_CLIENT_ID=your_google_client_id GOOGLE_CLIENT_SECRET=your_google_client_secret GOOGLE_PLACES_API_KEY=your_google_places_api_key SESSION_SECRET=your_secret ``` **Frontend (`/frontend/.env`):** ``` REACT_APP_API_BASE_URL=http://localhost:4000 REACT_APP_GOOGLE_CLIENT_ID=your_google_client_id REACT_APP_PLACES_API_KEY=your_google_places_api_key ``` ### 4. Run Locally Frontend: ```bash cd frontend npm start ``` Backend: ```bash cd backend npm run dev ``` Frontend: [http://localhost:8080](http://localhost:8080) Backend: [http://localhost:4000](http://localhost:4000) --- ## 🧩 Available Scripts In the frontend project directory, you can run: ### `npm start` Runs the app in development mode. Open [http://localhost:8080](http://localhost:8080) to view it in the browser. ### `npm test` Launches the test runner in interactive watch mode. ### `npm run build` Builds the app for production to the `build` folder. Optimizes React in production mode and minifies the build. ### `npm run eject` **Note:** This is a one-way operation. Once you eject, you can’t go back! --- ## 💡 Challenges & Learnings (Condensed) * Real-time AI chat analysis without latency spikes * Accurate voice-to-text for diverse accents * Smooth and secure Google OAuth integration * Balancing privacy and contextual intelligence --- ## 🗺️ Roadmap * [ ] Personalized event feed using embeddings * [ ] AI safety assistant for secure meetups * [ ] Alumni and community expansion * [ ] Improved recommendation feedback loop --- ## 🤝 Contributing Contributions are welcome! 1. Fork the repo 2. Create your feature branch (`git checkout -b feature/amazing-feature`) 3. Commit your changes (`git commit -m 'Add amazing feature'`) 4. Push to the branch (`git push origin feature/amazing-feature`) 5. Open a Pull Request --- ## 🧾 License This project is licensed under the **MIT License** — you’re free to use, modify, and distribute this software for any purpose, provided that the original copyright and license notice appear in all copies or substantial portions of the Software. ``` MIT License Copyright (c) 2025 CampusMatch Team Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. ``` --- ## 🙏 Acknowledgments * **Claude API** for chat understanding and icebreaker generation * **Google APIs** (Places + Calendar) for venue discovery and scheduling * **Web Speech API** for speech onboarding * **Hackathon mentors, Y Combinator, and team collaboration** for inspiration --- --- > *“Connecting students through voice, context, and conversation — one chat at a time.”* ## Detected evidence (automated analysis) Indexed codebase: 75 recognized source files, 232 KB. - CSS (language) — detected in the code - HTML (language) — detected in the code - JavaScript (language) — detected in the code - React (technology) — detected in the code - Tailwind CSS (technology) — detected in the code - TypeScript (language) — detected in the code - Node.js (technology) — claimed on Devpost, not found in the code ## Codebase structure (from repository index) ### Files (83 of 83) ``` .gitignore bun.lockb components.json eslint.config.js index.html package.json postcss.config.js public/robots.txt README.md src/App.css src/App.tsx src/components/MatchModal.tsx src/components/SwipeCard.tsx src/components/ui/accordion.tsx src/components/ui/alert-dialog.tsx src/components/ui/alert.tsx src/components/ui/aspect-ratio.tsx src/components/ui/avatar.tsx src/components/ui/badge.tsx src/components/ui/breadcrumb.tsx src/components/ui/button.tsx src/components/ui/calendar.tsx src/components/ui/card.tsx src/components/ui/carousel.tsx src/components/ui/chart.tsx src/components/ui/checkbox.tsx src/components/ui/collapsible.tsx src/components/ui/command.tsx src/components/ui/context-menu.tsx src/components/ui/dialog.tsx src/components/ui/drawer.tsx src/components/ui/dropdown-menu.tsx src/components/ui/form.tsx src/components/ui/hover-card.tsx src/components/ui/input-otp.tsx src/components/ui/input.tsx src/components/ui/label.tsx src/components/ui/menubar.tsx src/components/ui/navigation-menu.tsx src/components/ui/pagination.tsx src/components/ui/popover.tsx src/components/ui/progress.tsx src/components/ui/radio-group.tsx src/components/ui/resizable.tsx src/components/ui/scroll-area.tsx src/components/ui/select.tsx src/components/ui/separator.tsx src/components/ui/sheet.tsx src/components/ui/sidebar.tsx src/components/ui/skeleton.tsx src/components/ui/slider.tsx src/components/ui/sonner.tsx src/components/ui/switch.tsx src/components/ui/table.tsx src/components/ui/tabs.tsx src/components/ui/textarea.tsx src/components/ui/toast.tsx src/components/ui/toaster.tsx src/components/ui/toggle-group.tsx src/components/ui/toggle.tsx src/components/ui/tooltip.tsx src/components/ui/use-toast.ts src/hooks/use-mobile.tsx src/hooks/use-toast.ts src/index.css src/lib/utils.ts src/main.tsx src/pages/Auth.tsx src/pages/Chat.tsx src/pages/Discover.tsx src/pages/Index.tsx src/pages/Matches.tsx src/pages/NotFound.tsx src/pages/Profile.tsx src/pages/ProfileSettings.tsx src/pages/ProfileSetup.tsx src/pages/VoiceOnboarding.tsx src/vite-env.d.ts tailwind.config.ts tsconfig.app.json tsconfig.json tsconfig.node.json vite.config.ts ``` ### Dependencies - package.json: @eslint/js@^9.32.0, @hookform/resolvers@^3.10.0, @radix-ui/react-accordion@^1.2.11, @radix-ui/react-alert-dialog@^1.1.14, @radix-ui/react-aspect-ratio@^1.1.7, @radix-ui/react-avatar@^1.1.10, @radix-ui/react-checkbox@^1.3.2, @radix-ui/react-collapsible@^1.1.11, @radix-ui/react-context-menu@^2.2.15, @radix-ui/react-dialog@^1.1.14, @radix-ui/react-dropdown-menu@^2.1.15, @radix-ui/react-hover-card@^1.1.14, @radix-ui/react-label@^2.1.7, @radix-ui/react-menubar@^1.1.15, @radix-ui/react-navigation-menu@^1.2.13, @radix-ui/react-popover@^1.1.14, @radix-ui/react-progress@^1.1.7, @radix-ui/react-radio-group@^1.3.7, @radix-ui/react-scroll-area@^1.2.9, @radix-ui/react-select@^2.2.5, @radix-ui/react-separator@^1.1.7, @radix-ui/react-slider@^1.3.5, @radix-ui/react-slot@^1.2.3, @radix-ui/react-switch@^1.2.5, @radix-ui/react-tabs@^1.1.12, @radix-ui/react-toast@^1.2.14, @radix-ui/react-toggle@^1.1.9, @radix-ui/react-toggle-group@^1.1.10, @radix-ui/react-tooltip@^1.2.7, @tailwindcss/typography@^0.5.16, @tanstack/react-query@^5.83.0, @types/node@^22.16.5, @types/react@^18.3.23, @types/react-dom@^18.3.7, @vitejs/plugin-react-swc@^3.11.0, autoprefixer@^10.4.21, class-variance-authority@^0.7.1, clsx@^2.1.1, cmdk@^1.1.1, date-fns@^3.6.0, embla-carousel-react@^8.6.0, eslint@^9.32.0, eslint-plugin-react-hooks@^5.2.0, eslint-plugin-react-refresh@^0.4.20, globals@^15.15.0, input-otp@^1.4.2, lovable-tagger@^1.1.11, lucide-react@^0.462.0, next-themes@^0.3.0, postcss@^8.5.6, react@^18.3.1, react-day-picker@^8.10.1, react-dom@^18.3.1, react-hook-form@^7.61.1, react-resizable-panels@^2.1.9, react-router-dom@^6.30.1, recharts@^2.15.4, sonner@^1.7.4, tailwind-merge@^2.6.0, tailwindcss@^3.4.17, tailwindcss-animate@^1.0.7, typescript@^5.8.3, typescript-eslint@^8.38.0, vaul@^0.9.9, vite@^5.4.19, zod@^3.25.76 ### Recent commits (newest first) - Update README.md - Update README.md - Update README.md - Update README.md - Update README.md - initial commit - added functional user buttons - Refactor: Implement UI and core features - [skip lovable] Use tech stack vite_react_shadcn_ts_20250728_minor ## Key source files (fetched from GitHub, selected and truncated for size) ### package.json ``` { "name": "vite_react_shadcn_ts", "private": true, "version": "0.0.0", "type": "module", "scripts": { "dev": "vite", "build": "vite build", "build:dev": "vite build --mode development", "lint": "eslint .", "preview": "vite preview" }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "^1.2.11", "@radix-ui/react-alert-dialog": "^1.1.14", "@radix-ui/react-aspect-ratio": "^1.1.7", "@radix-ui/react-avatar": "^1.1.10", "@radix-ui/react-checkbox": "^1.3.2", "@radix-ui/react-collapsible": "^1.1.11", "@radix-ui/react-context-menu": "^2.2.15", "@radix-ui/react-dialog": "^1.1.14", "@radix-ui/react-dropdown-menu": "^2.1.15", "@radix-ui/react-hover-card": "^1.1.14", "@radix-ui/react-label": "^2.1.7", "@radix-ui/react-menubar": "^1.1.15", "@radix-ui/react-navigation-menu": "^1.2.13", "@radix-ui/react-popover": "^1.1.14", "@radix-ui/react-progress": "^1.1.7", "@radix-ui/react-radio-group": "^1.3.7", "@radix-ui/react-scroll-area": "^1.2.9", "@radix-ui/react-select": "^2.2.5", "@radix-ui/react-separator": "^1.1.7", "@radix-ui/react-slider": "^1.3.5", "@radix-ui/react-slot": "^1.2.3", "@radix-ui/react-switch": "^1.2.5", "@radix-ui/react-tabs": "^1.1.12", "@radix-ui/react-toast": "^1.2.14", "@radix-ui/react-toggle": "^1.1.9", "@radix-ui/react-toggle-group": "^1.1.10", "@radix-ui/react-tooltip": "^1.2.7", "@tanstack/react-query": "^5.83.0", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "^1.1.1", "date-fns": "^3.6.0", "embla-carousel-react": "^8.6.0", "input-otp": "^1.4.2", "lucide-react": "^0.462.0", "next-themes": "^0.3.0", "react": "^18.3.1", "react-day-picker": "^8.10.1", "react-dom": "^18.3.1", "react-hook-form": "^7.61.1", "react-resizable-panels": "^2.1.9", "react-router-dom": "^6.30.1", "recharts": "^2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^2.6.0", "tailwindcss-animate": "^1.0.7", "vaul": "^0.9.9", "zod": "^3.25.76" }, "devDependencies": { "@eslint/js": "^9.32.0", "@tailwindcss/typography": "^0.5.16", "@types/node": "^22.16.5", "@types/react": "^18.3.23", "@types/react-dom": "^18.3.7", "@vitejs/plugin-react-swc": "^3.11.0", "autoprefixer": "^10.4.21", "eslint": "^9.32.0", "eslint-plugin-react-hooks": "^5.2.0", "eslint-plugin-react-refresh": "^0.4.20", "globals": "^15.15.0", "lovable-tagger": "^1.1.11", "postcss": "^8.5.6", "tailwindcss": "^3.4.17", "typescript": "^5.8.3", "typescript-eslint": "^8.38.0", "vite": "^5.4.19" } } ``` ### src/main.tsx ```typescript import { createRoot } from "react-dom/client"; import App from "./App.tsx"; import "./index.css"; createRoot(document.getElementById("root")!).render(); ``` ### src/App.tsx ```typescript import { Toaster } from "@/components/ui/toaster"; import { Toaster as Sonner } from "@/components/ui/sonner"; import { TooltipProvider } from "@/components/ui/tooltip"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { BrowserRouter, Routes, Route } from "react-router-dom"; import Index from "./pages/Index"; import Auth from "./pages/Auth"; import VoiceOnboarding from "./pages/VoiceOnboarding"; import ProfileSetup from "./pages/ProfileSetup"; import Discover from "./pages/Discover"; import Matches from "./pages/Matches"; import Chat from "./pages/Chat"; import Profile from "./pages/Profile"; import ProfileSettings from "./pages/ProfileSettings"; import NotFound from "./pages/NotFound"; const queryClient = new QueryClient(); const App = () => ( } /> } /> } /> } /> } /> } /> } /> } /> } /> {/* ADD ALL CUSTOM ROUTES ABOVE THE CATCH-ALL "*" ROUTE */} } /> ); export default App; ``` ### src/pages/Index.tsx ```typescript import { Button } from "@/components/ui/button"; import { Heart, Users, MessageCircle, Sparkles } from "lucide-react"; import { useNavigate } from "react-router-dom"; const Index = () => { const navigate = useNavigate(); return (
{/* Hero Section */}
CampusMatch
AI-Powered Campus Connections

Find Your Match.
Build Your Network.

CampusMatch uses voice AI to help you create meaningful connections. Whether you're looking for dating or networking, we've got you covered.

{/* Features Section */}

Voice Onboarding

Skip the boring forms. Just talk to our AI assistant and create your profile naturally.

Smart Matching

Swipe through profiles tailored to your interests in dating or professional networking modes.

Easy Scheduling

Coordinate meetups effortlessly with built-in calendar integration for real connections.

{/* CTA Section */}

Ready to connect?

Join thousands of students making meaningful connections on campus

); }; export default Index; ``` ### postcss.config.js ```javascript export default { plugins: { tailwindcss: {}, autoprefixer: {}, }, }; ``` ### vite.config.ts ```typescript import { defineConfig } from "vite"; import react from "@vitejs/plugin-react-swc"; import path from "path"; import { componentTagger } from "lovable-tagger"; // https://vitejs.dev/config/ export default defineConfig(({ mode }) => ({ server: { host: "::", port: 8080, }, plugins: [react(), mode === "development" && componentTagger()].filter(Boolean), resolve: { alias: { "@": path.resolve(__dirname, "./src"), }, }, })); ``` ### eslint.config.js ```javascript import js from "@eslint/js"; import globals from "globals"; import reactHooks from "eslint-plugin-react-hooks"; import reactRefresh from "eslint-plugin-react-refresh"; import tseslint from "typescript-eslint"; export default tseslint.config( { ignores: ["dist"] }, { extends: [js.configs.recommended, ...tseslint.configs.recommended], files: ["**/*.{ts,tsx}"], languageOptions: { ecmaVersion: 2020, globals: globals.browser, }, plugins: { "react-hooks": reactHooks, "react-refresh": reactRefresh, }, rules: { ...reactHooks.configs.recommended.rules, "react-refresh/only-export-components": ["warn", { allowConstantExport: true }], "@typescript-eslint/no-unused-vars": "off", }, }, ); ``` ### index.html ```html CampusMatch - Connect, Network, and Find Your Match
``` ### tailwind.config.ts ```typescript import type { Config } from "tailwindcss"; export default { darkMode: ["class"], content: ["./pages/**/*.{ts,tsx}", "./components/**/*.{ts,tsx}", "./app/**/*.{ts,tsx}", "./src/**/*.{ts,tsx}"], prefix: "", theme: { container: { center: true, padding: "2rem", screens: { "2xl": "1400px", }, }, extend: { colors: { border: "hsl(var(--border))", input: "hsl(var(--input))", ring: "hsl(var(--ring))", background: "hsl(var(--background))", foreground: "hsl(var(--foreground))", primary: { DEFAULT: "hsl(var(--primary))", foreground: "hsl(var(--primary-foreground))", hover: "hsl(var(--primary-hover))", }, secondary: { DEFAULT: "hsl(var(--secondary))", foreground: "hsl(var(--secondary-foreground))", }, destructive: { DEFAULT: "hsl(var(--destructive))", foreground: "hsl(var(--destructive-foreground))", }, success: { DEFAULT: "hsl(var(--success))", foreground: "hsl(var(--success-foreground))", }, muted: { DEFAULT: "hsl(var(--muted))", foreground: "hsl(var(--muted-foreground))", }, accent: { DEFAULT: "hsl(var(--accent))", foreground: "hsl(var(--accent-foreground))", }, popover: { DEFAULT: "hsl(var(--popover))", foreground: "hsl(var(--popover-foreground))", }, card: { DEFAULT: "hsl(var(--card))", foreground: "hsl(var(--card-foreground))", }, // Campus Chat Sync brand colors "smitten-pink": "#C13D88", "jonquil-yellow": "#F2C20E", "electric-blue": "#005294", "banana-mania": "#F8E7B4", "verdigris": "#4CB6AC", }, borderRadius: { lg: "var(--radius)", md: "calc(var(--radius) - 2px)", sm: "calc(var(--radius) - 4px)", }, keyframes: { "accordion-down": { from: { height: "0", }, to: { height: "var(--radix-accordion-content-height)", }, }, "accordion-up": { from: { height: "var(--radix-accordion-content-height)", }, to: { height: "0", }, }, }, animation: { "accordion-down": "accordion-down 0.2s ease-out", "accordion-up": "accordion-up 0.2s ease-out", }, }, }, plugins: [require("tailwindcss-animate")], } satisfies Config; ``` ### src/vite-env.d.ts ```typescript /// ``` [65 more indexed source files omitted to keep this export small. The full file list is in the Codebase structure section above.]