Flashcards Challenge Project (Redux)

Hi everyone,

Just finished the project. Please take a look at my code, will be grateful for any kind of feedback. It was quite a challenge for me to be honest.

GitHub: GitHub - josefhlava/flashcards

I seem to be having some issues with this one, which unless I’m doing something really daft, I’m wondering if there are some technical issues with the project files?
I first tried following the instructions to install it, so I could work off-platform but it installed a lot of out of date and deprecated packages. Because I have a newer version of the eslint package higher up the tree, I have run into some critical dependency issues which won’t allow the app to run at all. I tried following the advice in the error messages but it didn’t work.
So I then tried doing the project on-platform and I have got to step 9. Nothing gets added on the topic form and the console is giving the message of: Store does not have a valid reducer. Make sure the argument passed to combineReducers is an object whose values are reducers.
I have checked and rechecked my code many times and have even tried copying/pasting the solution code directly and it always gives exactly the same error message.
I would be grateful for any advice on this.
Many thanks!
P.S. Although not related to this particular issue, I noticed that the Quiz component function has been given the name ‘Topic’. So there appear to be two topic components. This is in both starter and solution files.

I had the same issue, you need to change the quiz file to have the name quiz. If you are still working on this commit it to git and post a link to get help

I completed the project in Typescript, here’s my github repo: GitHub - ajhausdorf/flashcards: Typescript rendition of Codecademy's Redux challenge project

Hello everyone!
This is my solution for the Flashcards project.
Good experience of debugging because none of the features worked the first time I tested it!
Happy coding! Keep struggling!

hey guys
here is my solution:

github: GitHub - amanc1248/flashcardcodecademy

This project was awesome. but I wish this was involved with react topics too. That way it would be more challenging. by the way, thank you.


please, can someone explain me why in TopicsSlice.js:

export const selectTopics = state => state.topics.topics;
and not
export const selectTopics = state => state.topics;

? why state.topics.topics?

The state has the following structure according to its instructions:
topics: {
topics: {
‘123’: {
id: ‘123’,
name: ‘example topic’,
icon: ‘icon url’,
quizIds: [‘456’]
so we need to use state.topics.topics

Hi all,
sharing my solution here. Any feedback is much appreciated.

I just finished the Flashcard Challenge which I enjoyed. On going into it, I was a bit intimidated. I found this great multi-part tutorial on Youtube and spent a couple of days going through it - slowly.

Redux Toolkit Tutorial from Codevolution

After completing the project requirements, I made some enhancements:

  • Added Header component.
  • Added Error component.
  • Added “New Topic” as header link.
  • Made header links conditional on existing topics/quizzes.
  • Added checks for duplicate topic and quiz names, cards within a given quiz.
  • Require icon to be entered for topic
  • Require at least 1 card per quiz.
  • Pass topic id as param when clicking on “add quiz” from topic page.

Please check it out, comments aoppreciated.

My Github Repo

Here is my solution for the project:

LIVE: flashcards-sultanby.surge.sh/

good luck))

This is my project:

GitHub: https://github.com/after909/Flashcards-Challenge-Project-Redux-

Live site: https://edu-flashcards.netlify.app/

Note: The thunk section and the card loop, I had to see in others’ solutions because I had a lot of doubts there. I feel so guilty :frowning:


For anyone trying to run this project in 2022 and you find it outdated, with a deprecated react-router-dom config, I made a boilerplate on my github. This is the project ready to start, with the fixes provided to make it compatible with react-router-dom v6 onwards, so you can start this exercise without having to do the same i just did.

You can download that, fork it, or whatever. The readme has a short explanation for getting started and troubleshooting.

1 Like


Here is my Flashcards Project (not optimized for different screen sizes).
Got caught up on a few things but got there in the end and feel confident enough I could now bodge Redux into a project.
Filtering objects for the delete functionality was one, but learnt to use Object.entries() and Object.fromEntries() from MDN. (may have covered this on Codecademy but have the memory of a sieve lol)

GitHub Pages - Live Site

GitHub repo - GitHub repository

After finishing the base project I added:

  • Actions to delete individual quizzes and associated cards
  • Action to delete a topic and all liked quizzes/cards
  • Pop up warning when deleting a topic
  • Quizzes in quiz list display what topic they belong too and how many cards they have
  • Quiz list when a topic is clicked show number of cards

Thanks for any advice

Here’s my solution: GitHub - mendelgordon/flashcards: Basic Flashcards App
I made the state stay even after you refresh by saving it to the browsers localstorage.
(I also used react-router v6 instead of v5 like the starting code has)