8000 GitHub - gobblegit44/connections-ai-edition: AI themed three.js connections
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

gobblegit44/connections-ai-edition

Folders and files

< 9179 td class="react-directory-row-name-cell-large-screen" colSpan="1">
NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Connections: AI Edition

A sleek, mobile-friendly web game inspired by NYT Connections, where players group words into categories—each representing an AI concept. Built with Three.js for neon visuals and particle effects.

Features

  • AI-Themed Categories: Each day, the game fetches 4 new AI-related categories, with 4 words in each group, generated by OpenAI. The words are shuffled for a fresh challenge daily.
  • Dynamic Daily Content: Uses a secure Netlify Function to generate and serve new AI word groups every day. No API keys are exposed to the frontend.
  • Drag-and-Drop Gameplay: Select and group tiles by dragging or tapping.
  • Sleek Neon UI: Futuristic, glowing tiles and subtle particle effects using Three.js.
  • Responsive Design: Fully mobile-friendly and text wraps inside tiles.

How It Works

  • On each visit, the game fetches a new set of 16 AI-related words (4 groups of 4) from a Netlify Function powered by OpenAI.
  • The 16 words are shuffled and displayed on the grid. Players must deduce the hidden categories and group the words correctly.
  • When a group is solved, its category name is revealed.
  • If the backend/API is unavailable, the game falls back to a static set of AI categories and words.

Local Development

  1. Clone the repo:
    git clone https://github.com/yourusername/connections-ai-edition.git
    cd connections-ai-edition
  2. Start a local server (Python 3):
    python3 -m http.server 8000
  3. Open http://localhost:8000 in your browser.

Deploying with Netlify

  • Add your OpenAI API key as an environment variable (OPENAI_API_KEY) in your Netlify site settings.
  • The Netlify Function at netlify/functions/generateWords.js handles all OpenAI requests securely.
  • The frontend fetches daily word groups from /.netlify/functions/generateWords.

Tech Stack

  • HTML/CSS/JS
  • Three.js for particle effects and visuals
  • Netlify Functions for secure backend logic
  • OpenAI API for daily AI word generation

Customization

  • To change fallback AI categories/words, edit the fallback groups in main.js.
  • To adjust prompt or word formatting, edit the Netlify Function generateWords.js.

Inspired by NYT Connections. Built for learning and fun!

About

AI themed three.js connections

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published
0