К содержимому
learnspaceYOUR NEXT CHAPTER
ПРОСТРАНСТВО ОБУЧЕНИЯ
ГлавнаяКаталог курсовМоё обучениеCoursera

Знания без границ

Учитесь у лучших университетов и компаний мира.

Открыть Coursera
Интеграция
Пространство университета
Моё пространствоСтраница курса
↵
ЯЛичный кабинетСтудент
© 2026 LearnSpaceКаждый день — возможность узнать больше.Помощь
Build a Memory Game in React · LearnSpace
Назад в каталог
courseraПрограммирование

Build a Memory Game in React

Курс от Scrimba
Средний≈ 5.4 чАнглийский
О курсеНавыкиПрограммаПреподаватели

О курсе

Discover how to build a fully interactive memory game in React, designed to enhance your development skills and with a focus on accessibility. This course guides you through each step, from fetching and managing API data to designing reusable components and implementing user interactions. You’ll work on challenges such as randomizing game elements, detecting matches, and handling errors. Along the way, you'll gain practical experience in solving common development problems. Accessibility is a key focus of the project, with detailed guidance on ARIA attributes, semantic HTML, and designing for inclusivity. This course is ideal for anyone looking to deepen their React knowledge while working on a meaningful, real-world project. By the end, you’ll have an accessible, polished memory game that demonstrates your skills and commitment to building user-friendly applications.

Навыки, которые вы освоите

React.jsApplication Programming Interface (API)Front-End Web DevelopmentWeb ApplicationsUsabilityEvent-Driven ProgrammingCode ReusabilityGame DesignWeb FrameworksWeb Development ToolsUI ComponentsWeb DevelopmentInteraction DesignJavaScript FrameworksWeb Content Accessibility Guidelines

Программа курса

4 модулей · 47 учебных материалов

01Building the Foundation12 материалов

Building the Foundation

IntroPLUGINWelcome to interactive lessons!PLUGINBoilerplate codePLUGINFetch data from APIPLUGINStore API data in state

Учитесь у экспертов

Ajo Borgvold

Преподаватель курса

Build a Memory Game in React
В каталоге вашей программы

Инвестируйте в себя

Новые знания — в удобное для вас время.

Начать на Coursera

Обучение откроется на Coursera
в новой вкладке

Обучение на Coursera

≈ 5.4 ч

4 модулей

Язык: Английский

Часть программы вашего университета
PLUGIN
Aside: HTML entitiesPLUGIN
Render memory cards with API dataPLUGIN
Issue with emojisDataPLUGIN
Get random emojis pt. 1PLUGIN
Get random emojis pt. 2PLUGIN
Duplicate and shuffle emojisPLUGIN
Building the Foundation QuizЗадание
02Core Game Functionality11 материалов

Core Game Functionality

Side note: Address future discrepanciesPLUGINSelect a memory card pt. 1PLUGINSelect a memory card pt. 2PLUGINSelect a memory card pt. 3PLUGINDetect matching cardsPLUGINAre all memory cards matched?PLUGINCreate EmojiButton componentPLUGINIdentify selected & matched cards in MemoryCardPLUGINConditional memory card contentPLUGINConditional memory card stylingPLUGINModule 2 QuizЗадание
03Accessibility Enhancements13 материалов

Accessibility Enhancements

Disabled attribute & conditional event handlerPLUGINAside: aria-label & aria-livePLUGINAdd aria-label to EmojiButtonPLUGINSide note: Renamed state variablePLUGINCreate AssistiveTechInfo componentPLUGINAside: aria-atomicPLUGINMake AssistiveTechInfo component accessiblePLUGINCreate GameOver componentPLUGINAdd button to GameOver componentPLUGINAccessibility issue in GameOver componentPLUGINAside: Focus as an accessibility toolPLUGINMake GameOver component accessiblePLUGINModule 3 QuizЗадание
04Advanced Features11 материалов

Playlist/section title

Identify error handling issuePLUGINHandle errors with useStatePLUGINCreate and render ErrorCard componentPLUGINRefactor App to use formDataPLUGINCreate form elementsPLUGINSave form selections in statePLUGINRefactor form pt. 1PLUGINRefactor form pt. 2PLUGINImprove accessibility of Form componentPLUGINOutroPLUGINModule 4 QuizЗадание