NewCode with Beto MCP

React Native Memory Match App | Beginner Tutorial

Beto, July 17, 2023 · 3,097 views

The fastest way to learn state in React Native is to build a game with it. This memory match game is small enough to finish in one sitting, and it covers the fundamentals you'll reuse in every app after it: state, pressables, lists, and layout.

I build the whole thing step by step in the video, starting from an empty Expo project.

What's inside

  • Scaffolding the project with
  • A Card component built with Pressable and emoji
  • Rendering the deck dynamically with map and keys
  • A shuffle function so every round plays different
  • useState driving flips, matches, and score
  • Flexbox rows and columns that adapt to any screen

Resources

CourseReact Native course

Let's connect!

Had a win? Get featured on Code with Beto.Share your story