Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/simonapiz/flashcards

challange project from Codecademy
https://github.com/simonapiz/flashcards

Last synced: 5 days ago
JSON representation

challange project from Codecademy

Host: GitHub
URL: https://github.com/simonapiz/flashcards
Owner: SimonaPiz
Created: 2022-04-08T09:27:18.000Z (over 2 years ago)
Default Branch: main
Last Pushed: 2022-04-13T08:54:21.000Z (over 2 years ago)
Last Synced: 2023-03-06T05:57:30.793Z (almost 2 years ago)
Language: JavaScript
Size: 778 KB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

        # Flashcards

> challange project from Codecademy - React - Redux

## Project Goals

In this project, you will practice using **Redux** and **Redux Toolkit** to manage the complex state of a flashcard-style quiz app. 

- Users will be able to create their own topics, 

- quizzes for those topics, 

- and flashcards for those quizzes. 

- Users will also be able to interact with their quizzes by flipping flashcards over.

## Prerequisites

- To complete this project, you should have completed **React** and **Redux** courses.

- This app uses `uuidv4()` function from the [`uuid`](https://www.npmjs.com/package/uuid) package to create unique identifiers for topics/quizzes/cards. Below, you can see an example of how this function is used:  

![example code](https://user-images.githubusercontent.com/91121660/162409787-a42c6292-a2bb-458f-b602-7f3d65c54485.png)  

Though not required, if you would like to learn more about this function, check out its [documentation](https://www.codecademy.com/paths/front-end-engineer-career-path/tracks/fecp-22-redux/modules/wdcp-22-flashcards/projects/react-redux-flashcards#:~:text=Though%20not%20required%2C%20if%20you%20would%20like%20to%20learn%20more%20about%20this%20function%2C%20check%20out%20its%20documentation).

- This app uses `react-router` to handle routing between different pages. Since `react-router` is outside the scope of this project, we’ve written the routing code for you. Though not required, if you’re curious about how it works, you can explore `App.js` (where the routes for this app are defined), read the `react-router` [docs](https://reactrouter.com/), or take our Learn React Router course!