Skip to content

RhodesPeter/whack-a-mole-react

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

44 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Whack-A-Mole Game

You can whack a mole here.

Built in React.
Animation with Anime.js.
Illustration designed in Adobe Illustrator.
Created with the create-react-app npm module.
Hosted on Heroku.

Key learnings:

Calling functions in a component from a different component by passing onClick() in the props:
(I am not 100% sure yet that this is best practice)

App.js:

The timeOut function is defined in App.js.

<StartButton context={ this.state } onClick={ this.timeOut.bind(this) }/>

StartButton.js:

The timeOut function in App.js is called via the onClick on the component in StartButton.js

render(){
  return (
    <button className="game__start-button" type="button"
      onClick={ this.props.onClick } style={{ display: this.props.context.buttonDisplay }}>
      { this.props.context.buttonMessage }
    </button>
  )
};

About

Whack-a-mole game built with React

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published