Flashcard-o-matic

A React flashcard study app built for a local school: teachers create decks of flashcards for the subjects they teach, and students study them.

Features

• Home — browse all decks, with options to create a new deck, study, view, or delete an existing one
• Study — work through a deck's cards one at a time, flip to reveal the answer, and restart or return home at the end
• Create / Edit Deck — add a new deck or update an existing one's name and description
• Deck view — see a deck's full card list, with options to edit or delete individual cards
• Add / Edit Card — add new cards to a deck or update an existing card's front and back text

Tech stack

• React 18 with function components and hooks (useState, useEffect, useParams, useNavigate)
• React Router v6 for routing
• Bootstrap 4 for styling
• json-server as a mock REST API
• Jest + React Testing Library for tests

Getting started

Requires Node v18

npm install

Running the app

npm start

This runs two servers concurrently:

• The React app at http://localhost:3000
• A json-server API at http://localhost:8080

Running tests

npm test