Skip to content

Latest commit

 

History

History
56 lines (45 loc) · 1.73 KB

README.md

File metadata and controls

56 lines (45 loc) · 1.73 KB

Gyul! Hap! Match 3

Gyul! Hap! is based on a game from the Korean Show The Genius.

A Gyul! Hap! puzzle consists of a grid of nine tiles, where each tile is defined by a shape color, shape, and background color. A "Hap" is a set of three tiles where each property (shape color, shape, background color) is either all the same or all different between the three tiles. For example, a red triangle on a blue background, a blue triangle on a blue background, and a yellow triangle on a blue background form a "Hap" because the shape colors are all different, and the shapes and background colors are all the same. A correct "Hap" earns 1 point, and an incorrect "Hap" loses 1 point. Points cannot decrease below 0.

A "Gyul" can be called when all matches have been found (or in a rare instance, there were no matches initially), ending the game. A correct "Gyul" earns 3 points, and an incorrect "Gyul" loses 2 points.

Tech

  • Vue.js
  • Tailwind CSS
  • Headless UI
  • ESLint
  • Prettier
  • Husky
  • Lint-Staged
  • Vitest
  • Cypress
  • Vite
  • Vercel

Installation and Setup

  1. Clone the project
git clone https://github.com/macho-catt/gyul-hap.git
  1. Install dependencies
npm install
  1. Run locally
npm run dev

Todo

  • Add help screen modal
  • Homepage to select play, help screen, or 1v1 (future feature)
  • Animations
  • Finish unit testing
  • Add e2e testing with cypress
  • Automatic testing on push/pull with Github Actions
  • Backend
    • Login for additional features like (see below)
    • Personal best
    • Match history
    • Global high score
  • 1v1 functionality using web sockets
  • Finish Readme