6 ms·

Show HN: I built a browser based interactive React course

24 points by jadjoubran 7y ago

jadjoubran 7y ago
Hey HN, I would love to get your feedback on my new course for React. It's an interactive platform (built on top of learnjavascript.online) that teaches React in the browser by explaining concepts step by step. The lessons are byte-sized and are followed up by practice challenges as well as flashcards that help you persist your knowledge. I also made it work on mobile so that students can read some lessons or even solve challenges while taking the train/metro. The whole platform is custom built (the text editors are open source projects).
- PascalPrecht 7y ago
  Hey Jad, I just took a look at your course platform and it looks really interesting! I like the interactive editor and also the fact that it comes with an integrated test runner. Well done! You might want to look into how to make landing pages a bit more attractive though as it's not selling your platform "strongly" enough. Anyways, best of luck!
  - jadjoubran 7y ago
    good point, this is still an MVP so had to make a quick landing page thanks for the feedback!
- __app_dev__ 7y ago
  Great site jadjoubran! This one and your JavaScript site look very nice. I would recommend allowing one or two pages for free without a login so anyone can try without the need for signing up. Then if they want more than a few pages they can sign up.
  - jadjoubran 7y ago
    thanks for the feedback! Funny that this was a feature I had before deploying but the designer told me it's a bad idea I should have kept it Working on adding it soon
brennanbl 7y ago
What editor are you embedding?
- jadjoubran 7y ago
  On desktop this is [monaco-editor](https://github.com/microsoft/monaco-editor https://github.com/microsoft/monaco-editor) It's actually the same editor behind VSCode but this is a version that runs in the browser rather than Electron
datene 7y ago
Just got started and I particularly like the flashcards, seems like a nice and simple way to practice regularly. The free tier of the app is also a nice and complete way to get to know the ecosystem, I'm surprised with the amount of content
- jadjoubran 7y ago
  Thanks! I was actually debating how much of the content should be free but then I realised that the First Project (Project I) has to be part of the free content to show a feel of the entire platform
quickthrower2 7y ago
I’ll take a look. I have just finished courses on scrimba.com which sounds like a similar idea.
- jadjoubran 7y ago
  cool, let me know if you've got any comments/suggestions
  - mc3 7y ago
    looks very sweet! I like the UI more then Scrimba. One suggestion is the ability to skip forward to future lessons using the navigation on the left. I wanted to do that to see what the React stuff was like.
mc3 7y ago
Can I ask is compilation happening inside the browser, or does it talk to a backend. I like the idea that it happens in the browser and it is served from a static page.
- jadjoubran 7y ago
  Yep, it's pretty much in the browser!

24 points by jadjoubran 7y ago

Hey HN, I would love to get your feedback on my new course for React. It's an interactive platform (built on top of learnjavascript.online) that teaches React in the browser by explaining concepts step by step. The lessons are byte-sized and are followed up by practice challenges as well as flashcards that help you persist your knowledge. I also made it work on mobile so that students can read some lessons or even solve challenges while taking the train/metro. The whole platform is custom built (the text editors are open source projects).

PascalPrecht 7y ago
Hey Jad, I just took a look at your course platform and it looks really interesting! I like the interactive editor and also the fact that it comes with an integrated test runner. Well done! You might want to look into how to make landing pages a bit more attractive though as it's not selling your platform "strongly" enough. Anyways, best of luck!
- jadjoubran 7y ago
  good point, this is still an MVP so had to make a quick landing page thanks for the feedback!
__app_dev__ 7y ago
Great site jadjoubran! This one and your JavaScript site look very nice. I would recommend allowing one or two pages for free without a login so anyone can try without the need for signing up. Then if they want more than a few pages they can sign up.
- jadjoubran 7y ago
  thanks for the feedback! Funny that this was a feature I had before deploying but the designer told me it's a bad idea I should have kept it Working on adding it soon

brennanbl 7y ago

What editor are you embedding?

jadjoubran 7y ago
On desktop this is [monaco-editor](https://github.com/microsoft/monaco-editor https://github.com/microsoft/monaco-editor) It's actually the same editor behind VSCode but this is a version that runs in the browser rather than Electron

datene 7y ago

Just got started and I particularly like the flashcards, seems like a nice and simple way to practice regularly. The free tier of the app is also a nice and complete way to get to know the ecosystem, I'm surprised with the amount of content

jadjoubran 7y ago
Thanks! I was actually debating how much of the content should be free but then I realised that the First Project (Project I) has to be part of the free content to show a feel of the entire platform

quickthrower2 7y ago

I’ll take a look. I have just finished courses on scrimba.com which sounds like a similar idea.

jadjoubran 7y ago
cool, let me know if you've got any comments/suggestions
- mc3 7y ago
  looks very sweet! I like the UI more then Scrimba. One suggestion is the ability to skip forward to future lessons using the navigation on the left. I wanted to do that to see what the React stuff was like.

mc3 7y ago

Can I ask is compilation happening inside the browser, or does it talk to a backend. I like the idea that it happens in the browser and it is served from a static page.

jadjoubran 7y ago
Yep, it's pretty much in the browser!