
Ask HN: Any suggestions on tech stack for a React focused training course? - dsiegel2275
I&#x27;m developing a training course on React intended for delivery to other developers internal to my company.<p>For the course learning material, I do not want to simply put together powerpoint slides. I&#x27;d like a technology selection that would allow me to author the material in markdown or html, along with the ability to embed React examples - in runnable form - directly in the material, so that I can show example React code and right next to it show the running component.<p>For a smaller presentation where I first introduced React to the organization I had success using reveal.js and simply embedded React code directly in the presentation.  I fear though that this approach will become unwieldy with the size that I expect this curriculum to grow to. That is unless I simply break down the material into several separate reveal presentations.<p>I like the look and ergonomics of gitbook documentation (especially after reading the Redux docs), but alas, we cannot put company materials out on the public interwebs. And I don&#x27;t think that supports executable code as content anyways.<p>Anyone have any suggestions on a code friendly, easy to author, approach?
======
joshschreuder
I don't have anything to offer for your question but your approach sounds
interesting. Is your original Reveal.js presentation available anywhere to
view?

~~~
dsiegel2275
Unfortunately no, it isn't shareable given company policy.

The approach that I took was very low tech. I literally copy and pasted React
code into <pre><code> blocks so that reveal.js would render my example code
(and apply the nice source highlighting). In addition, I placed another,
identical copy of the code in a script tag and rendered the component into a
div on that same reveal slide. So the viewers of the presentation end up
seeing the nice highlighted source snippet and the resulting component running
live on the slide.

This double copy and paste approach worked fine when I was dealing only with
that one presentation, which had maybe six or seven live running examples. But
for the curriculum I expect there to be an order of magnitude more examples,
so I'm working now on creating a React component that encapsulates inline
examples. My idea is to have this React component async fetch the code to
display from a .js file on disk. It can then dynamically populate the <pre>
and <code> tags and also then babelify, eval, and then render the actual
instance of the example component into the dom.

~~~
joshschreuder
No worries, thanks for detailing it though. It sounds interesting, I might try
to do something similar where I work, or at least have a play around with
RevealJS as it sounds pretty cool!

------
dsiegel2275
I'm not sure how I didn't realize this before, but gitbook is certainly usable
locally, that is without having it served on the public Internet...

