Skip to content

Ayoazeez26/vue-rock-paper-scissors

Repository files navigation

Frontend Mentor - Rock, Paper, Scissors solution

This is a solution to the Rock, Paper, Scissors challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

Overview

The challenge

Users should be able to:

  • View the optimal layout for the game depending on their device's screen size
  • Play Rock, Paper, Scissors against the computer
  • Maintain the state of the score after refreshing the browser (optional)
  • Bonus: Play Rock, Paper, Scissors, Lizard, Spock against the computer (optional)

Screenshot

Links

My process

Built with

  • Semantic HTML5 markup
  • CSS custom properties
  • Flexbox
  • Vuex
  • TailwindCSS - CSS library
  • Vue - JS library

What I learned

I learned more practical use of Vuex, using TailwindCSS with Vue, I made use of slots in a project for the first time. I also made use of the transition component for the first time

Continued development

In future projects, I would love to focus on Vuex, animations, comsuming API, using slots, all with Vue js.

Useful resources

  • Stack Overflow - This helped me with issues I had using slots and I got answers to my problems.
  • Tailwind CSS Docs - I used this for checking out class names and their functions in Tailwind.

Author

Acknowledgments

Quite a number of people I ran to when I was having issues on this project helped me. I would like to say thank you to Abdulqudus Abubakre, Nyior Clement and Mubarak Sanusi.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published