LiveView Course Update #2: New Releases
April 21, 2020
Hey again, we’re back with another update on our Phoenix LiveView course. 🔥
One Domain vs Many Domains
When we make our comprehensive language or framework courses, we build a single app from scratch. That means we have to select one domain in which to convey everything we want to teach. In our Rails course, for example, we explore all the ins and outs of Rails within the context of an event registration app. 📅 In our Elixir course the domain is an HTTP web server. ⚡️
Last year when we started work on our Phoenix course, we again had to settle on one domain. As LiveView then began to heat up we knew it would play a big role in the course. So a few months ago we immersed ourselves in LiveView and started building a dozen or so examples demonstrating different facets of LiveView. But we quickly realized that all these examples wouldn’t make sense in the domain we picked for the Phoenix course. Alas, some of them would end up on the cutting room floor. 😩
By creating a separate LiveView course, we have a lot more freedom with domains. And it’s been really fun! So far we have everything from 💡 light controllers to ⛵️ boat rentals to 🍓food banks.
This week we finished up work on 2 new examples…
Example #3: Sales Dashboard
In contrast to the first two LiveView examples which update in response to user-generated events (button clicks and form changes), this third example updates in response to internal messages. We create a live dashboard with three sales metrics:
👀 To help us keep a watchful eye on these stats, the LiveView automatically updates the stats on a periodic interval.
Example #4: Live Search
In the good ol’ days of 2019 (before 😷) when people went out shopping and dining, you probably used the feature that is our fourth example. It’s fairly common for a store or restaurant’s website to allow you to look up nearby locations, like so:
If you want to give this example a whirl, try the zip codes “80204” and “59602”.
LiveView and Phoenix 1.5 Updates
Now you might be thinking “Hey Mike and Nicole, two examples isn’t a lot of progress since last week’s update.” And that’s possibly true, but sometimes you have to go backwards to go forwards!
Case in point, Phoenix 1.5.0-rc.0 was released last week. 🥳 We’ve been awaiting this release because it has some cool new features including seamless integration with Phoenix LiveView as well as the new Phoenix LiveDashboard. That means out-of-the-box Phoenix apps generated with the
--live option have all the LiveView goodies included. In addition, a minor version of LiveView was released last week.
And we’re on top of it! We went back through all our examples and made the necessary updates for these releases.
A Bundle of Branches
Last week we also settled on how to organize the course code bundle. We had two concerns. First, we didn’t want each LiveView example to be a separate Phoenix app. That felt like overkill, and it makes updating to new versions a pain.
However, putting all the examples in one Phoenix app presented another problem. Some of the more involved examples have supporting files such as a Phoenix context module, an Ecto schema, a database migration file, and so on. And that’s a lot of code to wade through, especially when you’re getting started.
So we decided to use Git branches with one Phoenix app. For each example there are two branches, like so:
1-button-clicks-begin 1-button-clicks-end 2-dynamic-form-begin 2-dynamic-form-end 3-sales-dashboard-begin 3-sales-dashboard-end 4-search-begin 4-search-end
The naming convention isn’t too hard to figure out. 😉 The branches with “begin” are the starting points for each example. And the branches with “end” contain the corresponding example’s final code.
Using branches this way allows us to introduce the relevant files incrementally. It also makes it easy for you to get a diff of all the changes for a specific example.
How’s that sound to you?
New Studio Equipment
The other thing we worked on wasn’t what you see but what you hear. 🎧
We recently moved The Pragmatic Studio’s worldwide HQ (aka our home office) and the new location had a distinct echo, echo, echo. This actually turned out to be a good problem because we’d been looking for an excuse to upgrade our audio equipment. 😉
So we purchased two Shure SM7B microphones, two Heil PL2T microphone booms, and a Focusrite Scarlett 2i4 mixer.
While that setup helped reduce the echo, the SM7B notoriously needs more gain than most mics. We know many of you watch our videos on planes, trains, and subway cars (back before 🦠 kept us at home), and it’s important that you get good, clean audio at the right level. So we added two Triton Audio FetHead preamps to boost the gain.
Finally, Mike has owl-like ears 🦉and wasn’t 100% satisfied with the echo reduction, so we added EchoRemover 2 from CrumplePop to our Final Cut workflow. The audio is much better now in this new location, and we don’t have to hang padded moving blankets as noice-reducing decorations on our walls. 🤦🏼♀️
Yeah, So When Will It Be Done?
Depending on the needs of those around us and our continued health, we’re hoping to record a handful of modules this week. If we get on a roll without any hiccups, we might have the first round of videos ready for you next week. 🤞🎤
Finally, to all of you who have written back with suggestions, questions, and comments: Thank you! 🧡 Keep ‘em coming.