Vue Conf US Day 2 Summary

Vue Conf US day 2 has come to and end and with it the close of the conference. Checkout these summaries of the days talks to get some quick insight into the valuable topics shared.

How we migrated our HUGE app to Vue 3 - Alex Van Liew

To kick off day 2 of the conference, Alex Van Liew shared his experience migrating a full-featured Vue 2 SPA to Vue 3. He walked us through the three phases his development team went through: prepare, upgrade, deploy.

Key Takeaways

• @vue/compat is a great tool for migration providing the ability to opt-in to backwards compatibility down to the component level
• ESLInt is a vital tool for the process
• Changes to look out for: filters, slot syntax, v-if/v-for priority, emits
• 1 change can fix a bunch of issues

Dissecting the Pinia Source Code - Daniel Kelly

Next up, I had the privilege of browsing through the source code for the official Vue.js state management solution: Pinia. During the talk we covered a random assortment of info for those who are interested in using Pinia, building their own libraries, using the composition API, or using TypeScript.

Key Takeaways

• Source code can be an excellent educational tool
• There a lots of tools available for helping maintain open source libraries
• The composition API is a great tool for abstracting stateful logic

Debugging Vue Applications - Cecelia Martinez

While developers spend up to half their time debugging, it is often a frustrating process because we aren't taught how to effectively debug or use debugging tools. During this talk, Cecelia Martinez walks through using the Vue Devtools and Replay to debug a real world Vue.js issue. She also demonstrates how we can identify patterns of common bugs and to use debugging tools for a better understanding of the relationship between Vue and our application.

Key Takeaways

• Debugging is hard, but we all have to do it!
• Debugging gets easier the more you know and can identify patterns of bugs
• Tools designed for framework debugging like Vue DevTools and Replay demonstrate the relationship between Vue and your code
• Embrace bugs by practicing and pairing to share knowledge

Modern Mobile Development - Mike Hartington

Before lunch, Mike Hartington live codes a real time map application using Vue.js and Capacitor. In doing so, he covered cross platform development as a concept, and looked at various approaches to compare how each one tries to solve the same problem. He continued by looking at how native iOS development works and showed how a much easier solution would be to use Capacitor, which abstracts everything into a unified JavaScript API.

Key Takeaways

• iOS development is very verbose
• Capacitor can provide a more approachable API
• Cross Platform development is everywhere

Maintainable & Resilient Projects Through Internal UI Libraries - Austin Gil

Following an hour of lightning talks, Austin Gil leaves the crowds laughing out loud with his 90’s pop music puns and a healthy dose Vue knowledge.

Key Takeaways

• Use prop validation
• Use slots for flexible components
• Use components to encapsulate logic

Deploy, Release, CI/CD, oh my! DevOps for the rest of us - Jeremy Meiss

After Austin, Jeremy Meiss takes the stage and dishes out some dev-ops know how, defining many of the buzzwords around the industry and how they relate to you.

Key Takeaways

• AI Ops combines big data and machine learning to automate IT operations processes
• GitOps keeps up infrastructure as code inside of git repositories to provide a single source of truth for infrastructure and application code
• DevSec Ops is an augmentation of DevOps that integrates security as a shared responsibility throughout the entire IT lifecycle
• Progressive delivery is continuous delivery with fine grained control
• Continuous Deployment makes for faster release cycles, low-risk releases, higher quality applications, and lower costs.

Animating Vue with GSAP - J.D. Hillen

Bringing the conference to a close, J.D. Hillen, from Garmin, gave a talk about animating Vue.js with the Greensock Animation Platform. He covered what it takes to integrate GSAP into Vue, as well as basic tutorials on getting up and running with this powerful animation
platform. As a former Flash developer, J.D. encouraged everyone to think outside the box on ways to bring your projects to life and have the tools to break out of the rigid and structured sites that dominate the modern web.

Key Takeaways

• Using GSAP allows more control over your animations
• Be creative
• Go back to building things for fun

Conclusion

Vue Conf US 2022 was filled with great opportunities to network with other Vue developers and the awesome line-up of speakers made the event one to remember. For those who did not have the opportunity to attend, I hope these summaries gave you a bit of insight and for those talks that have peaked your interest, definitely reach out to speakers on Twitter to find more valuable resources.