Giter VIP home page Giter VIP logo

flipnmatch's Introduction

Flip and Match Game

I built this game as a Udacity Front End Dev. course project. The purpose of the project is to demonstrate use of HTML, CSS, and JavaScript as learned in class. I studied an additional Udacity Object-Oriented Javascript, and also a React course for more information and understanding about how best to code this project.

Game sequence:

*Player can choose between 3 deck levels with 12, 16 and 24 cards each.
*A timer displays play time and total minutes taken to complete matches.
*There is an initial 3 star rating which drops as more time and moves are taken.

On each turn:

*The player flips one card over to reveal its underlying symbol.
*Then turns over a second card, trying to find a matching card.
*If a match, both cards stay flipped.
*If the cards do not match, cards are flipped back to hide unmatched symbols.

The game ends once all cards have been matched. A pop-up appears with the elapsed time, final star rating and a restart button.

Resources used to research and/or create the game:

 * Udacity Forums, Udacity Git Hubs, MDN, CSS Tricks, Scotch, Kahn Academy, and Python Tutor.
 * My Udacity Mentor, Mofid, and my Udacity Project Reviewer.
 * Card Flip CSS: https://3dtransforms.desandro.com/card-flip
 * Game Icons: @gameicons (Creative commons) 
 * Game Icons authors:Lorc, Delapouite and contributors
 * Adobe CC (Illustrator, PhotoShop, Dreamweaver).
 * Atom, GitHub.

I looked at a lot of different approaches to code this game...thanks to all for inspiration and education!

flipnmatch's People

Contributors

ciaomarian avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.