Coding Garden Recap for May / June 2023
Tags: javascript, react, webdev, testing
Published: 2023-06-19 22:37:18

Well hello there,

It's been a while since my last update. A lot has happened in the Coding Garden since then, so I'll do my best to summarize everything here. Hopefully you find something interesting you missed.

If you're new to [Coding Garden](https://coding.garden/), Hello! I'm CJ. I stream myself coding, teaching, talking and walking on [Twitch](https://www.twitch.tv/codinggarden) and [YouTube](https://www.youtube.com/@CodingGarden).

This was originally sent as a newsletter. If you'd like to receive this in your inbox, [sign up here](https://list.coding.garden/subscription/form).

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->

- [Discord Updates](#discord-updates)
- [Content Coding Stream and YouTube Videos](#content-coding-stream-and-youtube-videos)
- [Auto-complete UI Series](#autocomplete-ui-series)
- [Listd Streams](#listd-streams)
- [Colorado IRL Walking Streams](#colorado-irl-walking-streams)
- [Amsterdam Streams](#amsterdam-streams)
- [Fun Tweets](#fun-tweets)
- [Community Time Stamp Contributions](#community-time-stamp-contributions)
- [What's next for Coding Garden?](#whats-next-for-coding-garden)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## Discord Updates

I am no longer using `@everyone` [on discord](https://coding.garden/discord/) to alert you when I go live. There is now a "Channels & Roles" section in the side bar of the server where you can choose which channels you'd like to see and self select roles which are used for go live notifications. Be sure to self select your roles if you'd like to continue getting go live notifications on Discord.

## Content Coding Stream and YouTube Videos

I started off last month with the plan to stream every Monday and then break that stream down into YouTube videos. There was only 1 live stream where that successfully happened... BUT the videos that came from it were well received, and I hope to replicate this at least once this coming month.

[2023-05-08 - Exploring ES2023 Array Methods, 16 Ways to Copy an Array, Deploy Express API to Vercel](https://www.youtube.com/watch?v=Kyh6J1kekRk)

{% embed https://www.youtube.com/watch?v=Kyh6J1kekRk %}

The following videos were recorded during this stream:

[6 NEW ES2023 Array Methods with React + TypeScript Examples](https://www.youtube.com/watch?v=_4M46HRHoIw)

{% embed https://www.youtube.com/watch?v=_4M46HRHoIw %}

[Deploy an Express API to Vercel](https://www.youtube.com/watch?v=B-T69_VP2Ls)

{% embed https://www.youtube.com/watch?v=B-T69_VP2Ls %}

[Solving Coding Problems as Fast as Possible](https://www.youtube.com/watch?v=GZM2u6QtIV8)

{% embed https://www.youtube.com/watch?v=GZM2u6QtIV8 %}

## Auto-complete UI Series

This is a series where I built the same Auto-complete UI (inspired by [Mewtru's interview video](https://www.youtube.com/watch?v=Ju6VSLKXrJg)), with multiple front-end frameworks. My plan is to take the code I've written and the things I've learned and turn it into a YouTube video and conference talk. You can view all of the code [here](https://github.com/CodingGarden/autocomplete-ui-showdown).

[2023-05-15 - Part 1 - Building an Auto-complete UI with React, Svelte, Vue and Solid](https://www.youtube.com/watch?v=0CDRIRMPOZU)

{% embed https://www.youtube.com/watch?v=0CDRIRMPOZU %}

[2023-05-23 - Part 2 - Building an Auto-complete UI with SolidJS createResource, Angular and RxJS](https://www.youtube.com/watch?v=lLG30Wz-vIo)

This was a long one, but we also did some other stuff during the stream like a [last dab hot sauce code kata challenge 🔥](https://youtu.be/lLG30Wz-vIo?t=10240)

{% embed https://www.youtube.com/watch?v=lLG30Wz-vIo %}

[2023-06-14 - Part 3 - Building an Auto-complete UI with Preact + Signals and Vanilla TS](https://www.youtube.com/watch?v=pwlwDVKXO9E)

I started this stream off trying to use Qwik... only to realize it seemed to require a server side process. All of the other examples we coded up were completely client side, so we skipped Qwik for now.

{% embed https://www.youtube.com/watch?v=pwlwDVKXO9E %}

## Listd Streams

If you haven't heard of it yet, listd is a full stack app built with SvelteKit that allows users to create, share and watch lists of YouTube channels. We've been working on it for 21 days total now. View the full playlist of listd streams and devlogs [here](https://www.youtube.com/playlist?list=PLM_i0obccy3ujNeSo0EoVppCYDr8YwjSQ).

The most recent run of listd streams were all about setting up e2e tests that could be run repeatedly and consistently with no side effects outside of the test containers.

[2023-05-12 - listd - SvelteKit | Setting up E2E tests with Playwright and Docker | Day 17](https://www.youtube.com/watch?v=e5dsy8Va1kE)

{% embed https://www.youtube.com/watch?v=e5dsy8Va1kE %}

[2023-05-19 - listd - SvelteKit | Setting up E2E Test Code Coverage Reports with Instanbul | Day 18](https://www.youtube.com/watch?v=DkzKXpru-rs)

{% embed https://www.youtube.com/watch?v=DkzKXpru-rs %}

[2023-05-26 - listd - SvelteKit | Setting up Docker Container for Playwright Tests | Day 19](https://www.youtube.com/watch?v=-LVehXlgKOI)

{% embed https://www.youtube.com/watch?v=-LVehXlgKOI %}

[2023-06-09 - listd - SvelteKit | Seeding DB with Test Users and Writing E2E Tests | Day 20](https://www.youtube.com/watch?v=G-iBS4qBKNo)

{% embed https://www.youtube.com/watch?v=G-iBS4qBKNo %}

## Colorado IRL Walking Streams

Last month I setup a cloud based OBS server for my IRL (in real life) streams in anticipation for IRL streaming while in Amsterdam. The first few streams here in Denver where to test out the cloud server and get some walking in.

These streams are typically very chill and have much lower viewership. Sometimes there are just 1 or 2 active people in the chat, but that's okay! I've had some good conversations with a few of you while walking around. If this kind of thing interests you, be sure to tune into the next one.

[2023-05-24 - IRL Walking Barnum Park in Denver Colorado](https://www.twitch.tv/videos/1844407977)

During this walk I also [took a](https://www.twitch.tv/videos/1844407977?t=0h56m59s) couple [of breaks](https://www.twitch.tv/videos/1844407977?t=1h22m6s) to answer some questions and chat about coding.

{% embed https://www.twitch.tv/videos/1844407977 %}

[2023-05-25 - IRL Exploring Bear Creek Lake Park and Colorado Mills Mall in Lakewood Colorado](https://www.twitch.tv/videos/1844409735)

At one point while exploring the mall, we found ourselves [in a book store looking at old programming books](https://www.twitch.tv/videos/1844409735?t=2h33m27s)

{% embed https://www.twitch.tv/videos/1844409735 %}

[2023-06-08 - IRL Exploring Parks along the South Platte River in Denver, Colorado](https://www.twitch.tv/videos/1844420929)

After I got back from Amsterdam, I felt like doing some walking, so I walked over 15 miles (24 km) in this one stream! I explored [parks along the South Platte River Trail](https://goo.gl/maps/VJTSg1gdAThe4Gex8) here in Denver.

{% embed https://www.twitch.tv/videos/1844420929 %}

[2023-06-11 - IRL Exploring the Denver Chalk Art Festival and Downtown Denver](https://www.twitch.tv/videos/1844423466)

In this one, I explored a Chalk Art Festival. It was super cool to see such talented artists show case their skills with chalk on the street!

{% embed https://www.twitch.tv/videos/1844423466 %}

[2023-06-18 - Exploring the Cherry Blossom Festival in Sakura Square, Denver Colorado](https://www.twitch.tv/videos/1849718599)

In this one, I explored Sakura Square in Downtown Denver, saw a [Taiko drum performance](https://www.twitch.tv/videos/1849718599?t=0h12m0s), walked [through the vendors](https://www.twitch.tv/videos/1849718599?t=0h31m8s) and also [took a train ride](https://www.twitch.tv/videos/1849718599?t=1h50m28s).

{% embed https://www.twitch.tv/videos/1849718599 %}

## Amsterdam Streams

I was in Amsterdam for 1 week to MC the JSNation conference and Live Tweet the React Summit conference. I did a lot of walking and exploring while I was there as well.

[2023-05-31 - IRL in Amsterdam and Coding Garden Meetup](https://www.twitch.tv/videos/1844413113)

This was my first attempt to IRL stream while in Amsterdam. I had just purchased a new phone to use for it but the quality and stabilization was not as good as the phone I usually use. Also, I [met up](https://www.twitch.tv/videos/1844413113?t=0h7m51s) with 2 twitch viewers and we [played some games in the park](https://www.twitch.tv/videos/1844413113?t=0h56m36s).

{% embed https://www.twitch.tv/videos/1844413113 %}

[2023-06-02 - Exploring the Expo Floor at React Summit in Amsterdam Netherlands | React Coding Improv](https://www.youtube.com/watch?v=iE4_bjwafJ4)

During React Summit, I took some time to IRL stream the expo floor! I was using my normal phone during this, so the quality and stabilization is much better. I also did some [coding improv on the balcony](https://youtu.be/iE4_bjwafJ4?t=3049).

{% embed https://www.youtube.com/watch?v=iE4_bjwafJ4 %}

[2023-06-02 - Exploring Amsterdam Central Station, Damrak and Amsterdam Central](https://www.twitch.tv/videos/1844416692)

After React Summit was the after party... but I showed up too late to IRL stream it, so we walked around instead. We took the [underground Metro (with no loss of signal!)](https://www.twitch.tv/videos/1844416692?t=0h32m59s), explored [Amsterdam Central Station](https://www.twitch.tv/videos/1844416692?t=0h39m36s), explored around [Dam Square](https://www.twitch.tv/videos/1844416692?t=1h15m18s) and caught [the last ferry](https://www.twitch.tv/videos/1844416692?t=1h49m1s) to Amsterdam Noord. 

{% embed https://www.twitch.tv/videos/1844416692 %}

[2023-06-03 - IRL exploring Amsterdam, Netherlands](https://www.twitch.tv/videos/1844417924)

This was my last full day in Amsterdam and I walked around a bit more.

{% embed https://www.twitch.tv/videos/1844417924 %}

[2023-06-06 - Amsterdam Trip Recap | International Snack Tasting (Cool American Doritos)](https://www.youtube.com/watch?v=1X_a1_5WDjs)

After I got back I gave a recap of the whole trip and did some blind taste tests of international snacks vs US snacks

{% embed https://www.youtube.com/watch?v=1X_a1_5WDjs %}

## Fun Tweets

* [Copy an array with JS in 16+ ways](https://twitter.com/coding_garden/status/1655657079976108045)
* [Some new array methods in ES2023 will be really nice to use with React](https://twitter.com/coding_garden/status/1656000739175731205)
* [A thread of all the Open Source Awards winners from React Summit](https://twitter.com/coding_garden/status/1664659579580342273)
* [I got to meet Mewtru and VapeJuiceJordan while in Amsterdam](https://twitter.com/coding_garden/status/1665112199977750536)
* [I brought home all kinds of international snacks from Amsterdam](https://twitter.com/coding_garden/status/1665316611069181952)
* [My commentary on the Apple Vision Pro Announcement](https://twitter.com/coding_garden/status/1665808330273746944)
* [The aftermath of rain falling near the end of the Denver Chalk Art Festival](https://twitter.com/coding_garden/status/1668015060776546305)
* [I'm part of the organizing committee for DenverScript - a Denver based JS/TS meetup](https://twitter.com/coding_garden/status/1669013659828523008)
* [Checkout my cyber punk cyborg outfit from being an MC at JSNation](https://twitter.com/coding_garden/status/1669750585258840064)
* [I drew a trash comic version of @trashh_dev's tweet](https://twitter.com/coding_garden/status/1669760715778035713)
* [I taught middle school and high school students how to build and program Robots with an Arduino and C++](https://twitter.com/coding_garden/status/1670238034191843329)

## Community Time Stamp Contributions

If any of you find yourself with some free time while watching some of the past live streams, I'm always looking for time stamp contributions. More info on that [here](https://github.com/CodingGarden/community-contributions/tree/master/outlines-timestamps#readme).

## What's next for Coding Garden?

I'll keep streaming if you keep watching. I know more people are starting to go back to the office, so it can be hard to catch the streams during the work day, but if you can put my stream on in the background, that helps a ton. View my stream schedule [here](https://coding.garden/schedule/).

I will continue to do IRL walking streams as well. It helps me stay in shape and I've been exploring lots of new places I have not been before. Like I mentioned earlier, these IRL streams are very chill, so if you're looking to chat or for something to put on in the background while you are working or cleaning the house, I think these streams are a good fit for that.

I'm going to do my best to do more streams that can be turned into YouTube videos. These seem to get the most traction when live and are a good way for new people to find me on YouTube.

I'll also continue to Tweet when the inspiration strikes. My tweets have gained me some new followers and viewers as well.

Thanks for reading this far down. I couldn't do Coding Garden without you. Use code CGUPDATES on [https://merch.coding.garden/](https://merch.coding.garden/) until June 30th for 10% off.

See you [in the chat](https://www.twitch.tv/codinggarden/).

-CJ