使用React / Redux构建Simons Says游戏

我一直很喜欢使用javascript编写小型游戏。 我之前 ,…… 之前也都做过,而且我也已经做到了。 😅

好吧,我确实相信通过执行此类项目,您可以从中学到很多东西,而且令人惊讶的事实是,使用几行(很多)代码,您可以构建自己喜欢的童年游戏并花费数小时(再次)玩的开心!

无论如何,几周前我在假期中花了很多时间,然后我决定真的需要尝试一下这个令人敬畏的库,在过去的几天里,它吸引了越来越多的关注,称为样式组件!

首先,我需要一个与之合作的项目。

我只是用Google搜索“编写有趣的游戏来编写代码”,这导致我撰写了这篇文章,那是一个Simon游戏!

因此,基本上游戏的想法是4个彩色垫,每个垫都会变亮并发出特定的音符。 您作为玩家应该重现之前播放的序列,依此类推。

动手! 风格化

我很快设计了一些样式化组件。 我可以在JS中使用CSS看到很多好处,例如组成,可读性……,最重要的是, 使用您喜欢的样式的props组件非常方便 。 而不是一个。 例如,在活动类中,我可以根据自己的道具在我的组件中合并活动样式 ,这太神奇了! (感谢Max Stoiber)

链接和参考

  • [可玩游戏] http://weslleyaraujo.github.io/react-simon-says/
  • [存放区] http://github.com/weslleyaraujo/react-simon-says/
  • [样式化组件] https://github.com/styled-components/styled-components

我玩过的过去的东西

  • [React Flux Puzzle] https://github.com/weslleyaraujo/react-flux-puzzle
  • [Memory Match] http://weslleyaraujo.github.io/memory-match
  • [Ekans JS] http://weslleyaraujo.github.io/ekans-js
  • [MineField] http://weslleyaraujo.github.io/minefield