Skip to content

imankii01/squid-game

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

2 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

๐Ÿฆ‘ Squid Game Challenge - Red Light Green Light

Netlify Status License: MIT Made with React Powered by SnapStay

Think you can survive? Move on green. Freeze on red. Or get eliminated.

A thrilling browser-based survival game inspired by the iconic Netflix series "Squid Game". Test your reflexes and nerves in the deadly Red Light, Green Light challenge with immersive sound effects and stunning visuals.

๐ŸŽฎ PLAY NOW


๐Ÿ“– Table of Contents


๐ŸŽฏ About

Squid Game Challenge is a fan-made tribute to the Netflix phenomenon that took the world by storm. This browser game recreates the tension and excitement of the first game from the series - Red Light, Green Light - where players must navigate to the finish line while avoiding elimination.

๐ŸŽช Key Highlights

  • ๐ŸŽฎ Instant Play: No downloads, no sign-ups - just pure gaming fun
  • ๐ŸŽต Immersive Audio: Professional sound effects and background music
  • ๐Ÿ“ฑ Responsive Design: Perfect on desktop, tablet, and mobile
  • โšก Lightning Fast: Optimized for performance and smooth gameplay
  • ๐ŸŽจ Authentic Design: True to the Squid Game aesthetic
  • ๐Ÿ† Score System: Track your progress and beat your high score

โœจ Features

๐ŸŽฎ Gameplay Features

  • Dynamic Light System: Unpredictable red/green light timing
  • Smooth Controls: Keyboard (WASD/Arrow keys) and touch support
  • Progressive Difficulty: Increasingly challenging as you advance
  • Real-time Scoring: Points based on distance and time remaining
  • High Score Tracking: Local storage of your best performances

๐ŸŽจ Visual Features

  • Loading Screen: Animated Squid Game shapes with rotating quotes
  • Immersive UI: Dark theme with signature red/green color scheme
  • Responsive Design: Seamless experience across all devices
  • Smooth Animations: Fluid transitions and micro-interactions
  • Fullscreen Mode: Distraction-free gaming experience

๐ŸŽต Audio Features

  • Background Music: Atmospheric soundtrack during gameplay
  • Sound Effects: Distinct audio cues for light changes
  • Victory/Game Over: Celebratory and elimination sound effects
  • Mute Toggle: Complete audio control for users

๐ŸŒ Technical Features

  • SEO Optimized: Complete meta tags and structured data
  • PWA Ready: Installable as a web app
  • Performance Optimized: Fast loading and smooth gameplay
  • Cross-browser Compatible: Works on all modern browsers

๐ŸŽฎ How to Play

๐ŸŽฏ Objective

Reach the finish line before time runs out while following the light signals.

๐ŸŽฎ Controls

  • Desktop:
    • โ†‘ / W / Space - Move forward
    • โ†“ / S - Move backward
  • Mobile: Use the on-screen control buttons

๐Ÿ“‹ Rules

  1. ๐ŸŸข Green Light: Move forward quickly to gain distance
  2. ๐Ÿ”ด Red Light: Stop immediately - any movement = elimination
  3. โฐ Time Limit: Reach the finish line before time runs out
  4. ๐Ÿ Victory: Successfully reach 100% to win the round

๐Ÿ’ก Tips

  • Watch the light indicator at the top of the screen
  • Listen for audio cues to anticipate light changes
  • Move strategically - sometimes it's better to wait
  • Practice makes perfect - learn the timing patterns

๐Ÿ› ๏ธ Tech Stack

Frontend

  • โš›๏ธ React 18 - Modern UI library with hooks
  • ๐ŸŽจ Tailwind CSS - Utility-first CSS framework
  • ๐Ÿ“ฆ TypeScript - Type-safe JavaScript
  • โšก Vite - Next-generation build tool

Audio

  • ๐ŸŽต Howler.js - Web audio library for sound effects
  • ๐ŸŽถ Custom Hooks - React hooks for sound management

Deployment & Tools

  • ๐ŸŒ Netlify - Continuous deployment and hosting
  • ๐Ÿ“ฑ PWA - Progressive Web App capabilities
  • ๐Ÿ” SEO - Complete search engine optimization
  • ๐Ÿ“Š Analytics Ready - Google Analytics integration ready

Development

  • ๐Ÿ”ง ESLint - Code linting and formatting
  • ๐ŸŽฏ TypeScript - Static type checking
  • ๐Ÿ“ฑ Responsive Design - Mobile-first approach

๐Ÿš€ Getting Started

Prerequisites

  • Node.js 16+ and npm/yarn
  • Modern web browser
  • Git

Installation

  1. Clone the repository

    git clone https://github.com/imankii01/squid-game.git
    cd squid-game
  2. Install dependencies

    npm install
    # or
    yarn install
  3. Start development server

    npm run dev
    # or
    yarn dev
  4. Open in browser

    http://localhost:5173
    

Build for Production

npm run build
# or
yarn build

Deploy to Netlify

  1. Fork this repository
  2. Connect your GitHub account to Netlify
  3. Select the repository and deploy
  4. Your game will be live instantly!

๐Ÿ“ฑ Screenshots

๐ŸŽฌ Loading Screen

Loading Screen

๐Ÿ  Hero Section

Hero Section

๐ŸŽฎ Gameplay

Gameplay

๐Ÿ“ฑ Mobile View

Mobile View


๐ŸŽต Sound Effects

The game features a complete audio experience:

๐ŸŽถ Audio Files

  • background-music.mp3 - Atmospheric game music
  • green-light.mp3 - Green light signal sound
  • red-light.mp3 - Red light warning sound
  • victory.mp3 - Success celebration sound
  • game-over.mp3 - Elimination sound effect

๐Ÿ”Š Audio Features

  • Volume Control: Adjustable audio levels
  • Mute Toggle: Complete audio on/off control
  • Loop Management: Background music loops seamlessly
  • Sound Cues: Audio feedback for all game events

๐ŸŒ SEO & Performance

๐Ÿ” SEO Features

  • Meta Tags: Complete Open Graph and Twitter Card support
  • Structured Data: JSON-LD schema for search engines
  • Sitemap: XML sitemap for better indexing
  • Robots.txt: Search engine crawling instructions
  • Canonical URLs: Proper URL structure

โšก Performance

  • Lighthouse Score: 95+ performance rating
  • Image Optimization: Compressed and optimized assets
  • Code Splitting: Efficient bundle loading
  • Caching: Optimized caching strategies

๐Ÿค Contributing

We welcome contributions from the community! Here's how you can help:

๐Ÿ› Bug Reports

  • Use the GitHub Issues tab
  • Provide detailed reproduction steps
  • Include browser and device information

๐Ÿ’ก Feature Requests

  • Suggest new game modes or features
  • Propose UI/UX improvements
  • Share ideas for sound effects or visuals

๐Ÿ”ง Development

  1. Fork the repository
  2. Create a 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

๐Ÿ“ Guidelines

  • Follow the existing code style
  • Add comments for complex logic
  • Test your changes thoroughly
  • Update documentation as needed

๐Ÿ“„ License

This project is licensed under the MIT License - see the LICENSE file for details.

โš–๏ธ Legal Notice

This is a fan-made project created for educational and entertainment purposes. All rights to the "Squid Game" brand, characters, and concept belong to Netflix and the original creators. This project is not affiliated with or endorsed by Netflix.


๐Ÿ‘จโ€๐Ÿ’ป Credits

๐ŸŽจ Created By

Ankit (@imankii01)

  • Full-stack developer and gaming enthusiast
  • Passionate about creating immersive web experiences
  • Inspired by the global phenomenon of Squid Game

๐Ÿš€ Powered By

SnapStay - Innovative web solutions and hosting platform

๐ŸŽฌ Inspired By

  • Netflix's Squid Game - The original series that inspired this project
  • Hwang Dong-hyuk - Creator and director of Squid Game
  • The global Squid Game community - For the inspiration and enthusiasm

๐Ÿ› ๏ธ Built With

  • React ecosystem and amazing open-source libraries
  • Tailwind CSS for beautiful styling
  • Howler.js for immersive audio experience
  • Netlify for seamless deployment

๐ŸŽต Audio Credits

  • Sound effects created and optimized for web gaming
  • Background music composed for atmospheric gameplay
  • All audio assets are royalty-free and game-optimized

๐Ÿ”— Connect

๐Ÿ‘ค Follow Ankit (@imankii01)

๐ŸŒ Project Links

๐Ÿ’ฌ Community


๐ŸŽฏ Project Stats

GitHub stars GitHub forks GitHub watchers


๐Ÿฆ‘ Ready to Play?

๐ŸŽฎ ENTER THE GAME

Think you can survive the Red Light, Green Light challenge?


Made with โค๏ธ by Ankit (@imankii01) | Powered by SnapStay

โš ๏ธ Warning: This game requires quick reflexes and nerves of steel. One wrong move and you're eliminated.

# squid-game

About

A thrilling browser-based survival game inspired by the iconic Netflix series "Squid Game".

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors