Workshop Notes: Intro to React and Typescript
In February, 2021 I led a fun little workshop introducing React and Typescript via the Interactive Media and Design program at North Island College. The target audience was pretty broad: students, faculty looking to do some continuing education and members of the community.
I’ve always enjoyed presenting but haven’t done much lately essentially due to time restrictions. I’m hoping to do more. These are some notes to myself for the future.
Ingenuity on the Edge React with Alex Dunae - Compressed from NIC School of Fine Art + Design on Vimeo.
Notes on Presenting
- Regular commits to source control during the presentation worked great, so people did not need to stay up to date with live coding.
- Live-ish coding worked suprisingly well. I had the entire app written in steps and could cut and paste large chunks from my second monitor, but typing and talk was the most natural since it showed the true development flow. This was especially true when talking about Typescript and autocomplete.
- Having intro slides was vital. I had planned to talk for about 20 minutes in the beginning about high-level concepts but didn’t plan on having slides until a few days before. I quickly made some up and they were really beneficial. Part of that benefit was that creating the slides was an additional editing step, forcing me to be even more concise and organized.
- carbon.now.sh is amazing for creating minimal code screenshots
- Talking slowly was well received. I left huge gaps at the end of “paragraphs”, spoke slowly and repeated my concluding sentences. I thought that this would be annoying, but it seemed to work well with the diverse audience.
- I left a few areas that could be cut out entirely (e.g. adding Sparklines) if time got tight. It was helpful to have escape hatches since we ended up running long.
- The college recorded the workshop and managed Q&A, which let me just focus on the workshop.
The workshop was virtual due to Covid, and I was pretty concerned about not getting any visual feedback. In the end it was fine, but next time I would like to find a way to get a little bit more interaction with the attendees.
Source Control as Handout Material
I created a bare source repository that participants could clone as their starting point and posted the live project on Netlify. While I live coded I pushed all the changes to their own branch, keeping the original bare repo clean.