Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

SunnyD33/WordleWizard

Repository files navigation

Wordle Wizard ๐Ÿ”ฎ

Expo SDK Platforms TypeScript

A React Native multiplatform helper app for solving Wordle puzzles faster! Built with Expo, this app analyzes your guesses and provides real-time word suggestions.


โœจ Features

  • Interactive Virtual Keyboard: Tap letters and assign status colors (green/yellow/gray)
  • Smart Word Filtering: Real-time suggestions based on your guess history
  • Wordle-Style Interface: 6 guess rows with 5 letter tiles each
  • Smooth Animations: Color transitions and scale effects using Reanimated
  • Haptic Feedback: Tactile responses for better user experience
  • Hard Mode Support: Enforces use of revealed hints in subsequent guesses
  • Dark Mode: Automatic system theme detection
  • Multiplatform: Works on iOS, Android, and Web

๐Ÿ“ฒ Try It Now

Web version availble here

Expo Go (Quickest Way) [Coming Soon]

  1. Install Expo Go on your iOS or Android device
  2. Scan the QR code below (available after first EAS build is published)

๐Ÿ”ฒ QR code will appear here after the first production build is published to Expo.


๐ŸŽฎ How to Use

  1. Tap a letter from the virtual keyboard
  2. Select the status of that letter:
    • โœ“ Green (Correct): Letter is in the word and in the correct position
    • ? Yellow (Wrong Spot): Letter is in the word but in the wrong position
    • โœ— Gray (Not In Word): Letter is not in the word at all
  3. Continue entering letters until you fill a row
  4. View suggestions - The app shows up to 20 possible words that match your clues
  5. Tap any filled tile to cycle through status colors
  6. Reset to start a new puzzle

๐Ÿš€ Local Development

Prerequisites

Setup

  1. Install dependencies:

    npm install
  2. Start the app:

    npx expo start
  3. Run on your preferred platform:

    • Press i for iOS simulator
    • Press a for Android emulator
    • Press w for web browser
    • Scan QR code with Expo Go app

๐Ÿ—๏ธ Building & Deploying with EAS

This project uses EAS Build for production builds and EAS Update for OTA updates.

Prerequisites

npm install -g eas-cli
eas login

Build Profiles

Profile Purpose Distribution
development Local dev client (iOS Simulator) Internal
preview Shareable test build (.apk) Internal
production App Store / Play Store build Store

Running Builds

# Build for both platforms (production)
npm run build:all
# Build for a specific platform
npm run build:ios
npm run build:android
# Build development client
eas build --profile development --platform ios

Submitting to App Stores

Before submitting, fill in the credentials in eas.json:

  • iOS: appleId, ascAppId, appleTeamId
  • Android: path to your google-services-key.json
npm run submit:ios
npm run submit:android

OTA Updates (EAS Update)

Push a JavaScript update to users without a full build:

npm run update

๐Ÿ› ๏ธ Tech Stack

Technology Purpose
Expo SDK 54 React Native framework
TypeScript Type safety
Expo Router File-based navigation
React Native Reanimated 60fps animations
Expo Haptics Tactile feedback
Async Storage Persistent settings
EAS Build Cloud builds & deployment

๐Ÿ“ฑ Project Structure

WordleWizard/
โ”œโ”€โ”€ app/ # Expo Router screens
โ”‚ โ”œโ”€โ”€ _layout.tsx # Root navigation layout
โ”‚ โ”œโ”€โ”€ modal.tsx # Modal screen
โ”‚ โ””โ”€โ”€ (tabs)/
โ”‚ โ”œโ”€โ”€ _layout.tsx # Tab bar configuration
โ”‚ โ”œโ”€โ”€ index.tsx # ๐Ÿ  Main game screen
โ”‚ โ”œโ”€โ”€ explore.tsx # i๏ธ Instructions screen
โ”‚ โ””โ”€โ”€ settings.tsx # โš™๏ธ Settings (theme, hard mode)
โ”œโ”€โ”€ src/
โ”‚ โ”œโ”€โ”€ components/
โ”‚ โ”‚ โ”œโ”€โ”€ LetterTile.tsx # Animated letter tile
โ”‚ โ”‚ โ”œโ”€โ”€ GuessRow.tsx # Row of 5 letter tiles
โ”‚ โ”‚ โ”œโ”€โ”€ VirtualKeyboard.tsx # QWERTY keyboard with status selector
โ”‚ โ”‚ โ””โ”€โ”€ WordSuggestionsList.tsx # Scrollable word suggestions
โ”‚ โ”œโ”€โ”€ types/
โ”‚ โ”‚ โ””โ”€โ”€ wordle.ts # TypeScript interfaces
โ”‚ โ”œโ”€โ”€ utils/
โ”‚ โ”‚ โ”œโ”€โ”€ wordFilter.ts # Word filtering algorithm
โ”‚ โ”‚ โ””โ”€โ”€ hardModeValidator.ts # Hard mode validation logic
โ”‚ โ””โ”€โ”€ data/
โ”‚ โ””โ”€โ”€ wordList.ts # 2300+ valid Wordle words
โ”œโ”€โ”€ assets/ # Images, icons, fonts
โ”œโ”€โ”€ app.json # Expo configuration
โ”œโ”€โ”€ eas.json # EAS Build & Submit configuration
โ””โ”€โ”€ package.json # Dependencies & scripts

๐ŸŽจ Color Scheme

Color Hex Meaning
๐ŸŸฉ Green #6aaa64 Correct position
๐ŸŸจ Yellow #c9b458 Wrong position
โฌ› Gray #787c7e Not in word
โฌœ Light Gray #d3d6da Empty / unused

๐Ÿค Contributing

Contributions are welcome! Here's how to get started:

  1. Fork this repository
  2. Create a branch: git checkout -b feature/your-feature-name
  3. Make your changes and ensure the app runs correctly
  4. Lint your code: npm run lint
  5. Commit: git commit -m "Add your feature"
  6. Push: git push origin feature/your-feature-name
  7. Open a Pull Request

Please keep PRs focused on a single feature or fix.


๐Ÿ“„ License

This project is open source and available for personal use.

About

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

Contributors

AltStyle ใซใ‚ˆใฃใฆๅค‰ๆ›ใ•ใ‚ŒใŸใƒšใƒผใ‚ธ (->ใ‚ชใƒชใ‚ธใƒŠใƒซ) /