Show HN: Flashcards for Frontend Developers | Hacker News Reader

Show HN: Flashcards for Frontend Developers

nlaz.github.io

20 pointsnlazaris11 comments

Hi HN, I've been collecting flashcard decks around some of the harder topics in frontend development and recently built a site around it. The site is built with `create-react-app` and uses Airtable's API so the app itself is actually pretty small. Hope you enjoy it. Let me know which topics you would like to see in the future. Thanks!

I'm also happy to answer any questions you might have or answer any issues you might have with it :)

I'm looking at your repo as well, can you provide a high level overview of the _src_ folder?

I'm learning react at the moment, about halfway done through a 40hr course. Am interested in how you organized things and what each file does if you don't mind providing an overview

And where the API airtable calls are at (which file is it?)

Glad you are taking a peek at the repo. The `src` folder holds the app pages, common components, a scheduling utility and various other setup files. The API calls come from a file called `apiActions`. You might be interested in the `create-react-app` project to learn more about how the overall project is structured: https://github.com/facebook/create-react-app/blob/master/pac...

it loads kind of slow

by the way someone who is reviewing flashcards should both have the options of using

- 1. only the keyboard

- 2. only the mouse

Keyboard input has delay but you should really consider a mouse only approach the way anki works

This sounds really interesting though, do you have screenshots of what your airtable table looks like. I want to see the API calls as well to it, can you link and share the airtable view here?

how does report a card issue work? https://airtable.com/shrUv34My1n7HQSwd

have you also looked into sirupsen's airtable anki integrator?

https://github.com/sirupsen/anki-airtable

Sorry if you are still experiencing load times. It might be worth it to build a cache layer for the API so that the responses are quicker. Will look into how to improve that :/

It should already support both mouse and keyboard options for reviewing flashcards. Is one of those methods not working for you?

The Airtable sheet is pretty simple. It is simply a Card table with Front, Back, and Deck columns and the Deck table contains all the other information you might see on the site. I also have a table for reporting issues through that report form you included.

That's really cool. I hadn't seen that before. I've bookmarked it for future ideas :D

mousing over things with the way you setup your flashcard site seems inefficient

Picking "I got it" or "No I didn't answer correctly" should be right next to the "show answer" button

Because your constantly reviewing cards constantly it gets super tedious

Is the reporting feature just an airtable form?

I would love to know how to improve that experience. I don't think I'm understanding the exact issue though. The buttons should be right next to each other already. Are you suggesting the buttons should replace each other when toggling the answer so the mouse has to move less distance?

Happy to work out this issue individually if you would like and address other questions/feedback you might have. My email is niko@pensieve.space. Thanks!

You are right. The reporting feature is just an Airtable form.

example, bottom of my anki app

https://i.imgur.com/zv2lEY7.gif

my email btw is in my username if you click it

I like that it works well on mobile. I would use this to pass time while on public transit etc.

Can I make my own deck?

You cannot create your own deck at the moment. Hoping to add more features soon :)

Reply on news.ycombinator.com