YDKEN , A simple React app using the "You Don't Know JS" books

https://ydken.herokuapp.com/

Hi

I am writting this app as a way of learn Reactjs, JavaScript and English at the same time. I tried Duolingo, but the randomnes of the exercises make me lose my focus fast :confused: .

This is only the prototype, later I want to add a dictionary and videos (pronunciation of the words). Also I want to make it server-side rendering, but I need to learn how :laughing: .

I hope it will be helpful for others. The idea of the app is simple:

  • Use information that really interests me
  • Avoid context switching
  • Practice reading and the pronunciation of the words at the same time

###An example:

Use the pointer of the mouse for the IPA version (International Phonetic Alphabet )

Write a word in the box, press the search button and then click the arrow (play) to hear the word:


It’s a simple app, but for me is really usefull. The name was idea of
@mmhansen from the FCC Cohort so thanks for that :thumbsup: also thank to @tropicalchancer for all of his work organizing the cohort, the cohort has really helped me.

Cheers and happy coding :smile:

1 Like

Nice @Diego_Perez!

It’s progressing well! One thing I recommend is adding some kind of instructions in the app so the user knows how use the sound functionality :smile:

That is a great idea, thanks :thumbsup:

Cheers and happy coding :slight_smile:

1 Like

I like the idea of this, but I was kind of expecting that clicking a word would give me the spoken audio as well as the phonetic spelling tool-tip. That way you could get rid of the ‘search’ bar for playing individual words.

2 Likes

yeah, that was my original idea but I don’t know how to do it (maybe use the same <audio> element with autoplay + an <a> element + css :thinking: ) .

The app needs so much work, and now I need to learn how to make the rendering server-side (for the dictionary). Thanks for your feedback @JacksonBates :+1: .

Cheers and happy coding :slight_smile:

1 Like

You’re off to a good start! Good job :+1:

2 Likes

Thanks for your feedback @haiphi.

Cheers and happy coding :slight_smile: