Skip to content

kang-marvin/matching-game

Repository files navigation

MATCHING GAME

How To Play

The board contains tiles in 2s that contain the same color and image. Try to match all the matching tiles in successive clicks as fast as possible.

The levels of difficulty are

  • 2 by 2 (Easy)
  • 4 by 4 (Standard)
  • 6 by 6 (Hard)

Stack Used

  1. Ruby on rails
  2. Stimulus JS docs
  3. ViewComponent docs
  4. Tailwind docs

What I learned

  1. Major / Core Lessons
-> Stimulus JS and how it works. How to create controllers, use targets and actions. Also how the Outlets API works

-> How to use ViewComponents to design standalone view `partials` or components. How to use render? to hide UI if condition fails among other benefits

-> Tailwind and its classes. How to support dynamic classes by adding them to `safelist` inside tailwind.config.js
  1. Minor Lessons / Reminders
-> Using ruby Array#product to create matrix
-> Using Stimulus JS to change URI params
-> Use redirect to have root path with `/url_path`
-> `private` functions inside Stimulus controllers

Hosted

The app can be found here

It is hosted on Fly.io