Views on Vue show

Views on Vue

Summary: A weekly discussion among Vue developers about Vue and it's ecosystem.

Join Now to Subscribe to this Podcast
  • Visit Website
  • RSS
  • Artist: Devchat.tv
  • Copyright: Intentional Excellence Productions, LLC

Podcasts:

 VoV 094: Head to Toe Development Set Up | File Type: audio/mpeg | Duration: 1:00:45

In this episode of Views on Vue the panel shares what their set-ups look like. They start by discussing IDE and text editors. Most of them use VScode for their setups but they like to use others when they need them. The panelist list some of their favorite plugins, Vetur, Prettier, Vue peeks, NPM, word counters, and spell checkers. They talk about Vue CLI and other CLIs they use.    Next, they talk about what machines they are all using. Most are currently using a Mac Book Pro. They discuss the pros and cons of using Mac products. Charles Max Wood talks about the desktop he built and how his next computer will be a PC. They consider Linux on Windows. They also compare Linux and Mac. Source code and deployment are discussed as well.    They finish by sharing the physical set-ups in their offices. They discuss furniture, how many monitors they use, how big their monitors are and the tools that make their day more comfortable. They discuss the merits of sitting and standing while working. Desk treadmills are considered. They also talk about working at home compared to working from the office.  Panelists Charles Max Wood Devlin Duldulao  Lindsay Wardell Steve Edwards Sponsors   Sentry– use the code “devchat” for two months free on Sentry’s small plan CacheFly Links https://system76.com/pop  https://desktop.github.com/  https://jfrog.com/artifactory/  https://about.gitlab.com/ https://www.sharemouse.com/  Conquer Under Desk Portable Electric Treadmill Walking Pad  Anti Fatigue Standing Desk Mat  https://vuetifyjs.com/en/ https://github.com/nuxt/create-nuxt-app https://nuxtjs.org/ https://github.com/vuejs/vetur https://www.facebook.com/ViewsonVue https://twitter.com/viewsonvue Picks Charles Max Wood: A Christmas Story Rudolf the Red-Nosed Reindeer The Little Drummer Boy Santa Claus Is Comin' to Town The Ultimate Gift Lindsay Wardell: https://thedangercrew.com/ Steve Edwards: https://laughingsquid.com/mouse-cleans-up-tool-shed/  Devlin Duldulao: Rhinos

 VoV 093: Vuetensils with Austin Gil | File Type: audio/mpeg | Duration: 47:07

In this episode, the panel interviews Austin Gil, author of Vuetensils. Austin begins by explaining that Vuetensils is and why he wrote it. Vuetensils is a UI library filled with naked components that make it easy to build accessible apps. The panel explains that it is not as opinionated as other libraries making it easy to style yourself.  The panel discusses the need for accessibility and how painful it can be to write accessible apps. Austin explains that developers are what make accessibility hard. The web was designed to be accessible but incorporating design and style complicates it. Austins shares some of the components in Vuetensil and what they do for your app.  Vuetensils, Austin explains is designed to be as out of the way as possible while still giving you what you need. He explains how it differs from libraries like Vuetify and Bootstrap, with these tools you get everything. Vuetensils makes you choose the components you want, forcing you to stay lightweight. Vuetensils is ideal for small projects where you don’t need a lot of UI components.  Finally, the panel discusses the testing of Vuetensils. Austin explains that the library is still young and that he is still working on testing. He explains his plans for the future of Vuetensils and what it will take to get to a version 1 release. The panel discusses how to get started with Vuetensils and how to support it.  Panelists Charles Max Wood Lindsay Wardell Steve Edwards Guest: Austin Gil Sponsors   Sentry– use the code “devchat” for two months free on Sentry’s small plan CacheFly ____________________________________________________________ "The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood is now available on Amazon. Get Your Copy Today! ___________________________________________________________   Links https://vuetensils.stegosource.com/  https://www.w3.org/ https://www.facebook.com/ViewsonVue https://twitter.com/viewsonvue Picks Charles Max Wood: White Christmas  Holiday Inn  The Court Jester  The MaxCoders Guide To Finding Your Dream Developer Job  Lindsay Wardell: https://typora.io/ Steve Edwards: Death Nut Challange 2.0  Austin Gil: Get involved in the Vue community

 VoV 092: Views on Vue at JAMstack Conf SF 2019 | File Type: audio/mpeg | Duration: 50:40

In this episode of Views on Vue Charles Max Wood interviews speakers at JAMstack Conf SF His first interview is with Ire Aderinokun. Ire works for Buycoins, a cryptocurrency exchange for Africa. She gave a lightning talk, “Headless Chrome & Cloudinary for progressively enhanced dynamic content on the web”. After giving a brief overview of her talk to Charles, Ire defines progressive enhancement for the listeners.    Walking through how progressive enhancement works, she explains how Headless Chrome and Cloudinary helped her with the project she shared in the talk. Ire and Charles consider the blindspot that developers experience because they work on high-end devices and how using progressive enhancement helps those who use lower-end devices.   Ire shares her experience with JAMstack and explains how progressive enhancement works with JAMstack. Charles shares his experience using JAMstack. The episode ends with Ire giving advice and resources to help get started with progressive enhancement.    Next, Charles interviews Shawn Erquhart work runs the Netlify CMS project. Charles share his experience using Netlify and Shawn address some of the issues Charles has come across. Charles does say the using Netlify is simple, clean and nice. Shawn shares the origin story of Netlify. They discuss what it means to be a git-based content management system.    They discuss how to contribute to the Netlify CMS open source project. Charles mentions his book and they discuss how contributions to open source projects like these are a great way to get a job. Shawn explains how to get started implementing Netlify CMS and how they target different static site generators.  Finally, Charles interviews Tammy Everts. Tammy gives listeners a sneak peek into her talk about website performance, more specifically JavaScript performance. Charles discusses the performance of Devchat.tv and Google Lighthouse scores. Tammy explains that while Google Lighthouse is good it isn’t completely reliable and can miss chunks of time when your JavaScript is failing and you have unhappy users. Tammy shares ways to drill down and see how your JavaScript is behaving in the wild. She talks about blocking Javascript which every developer is familiar with and non-blocking JavaScript that has high blocking CPU time which makes for janky sites. Tammy and Charles discuss what CPU is and what it measures. Tammy names resources and tools to help avoid this problem.  Rules of thumb for avoiding these issues are explained by Tammy. First, Reduce, make sure all the JavaScript needs to be there. Next, Monitor, track your metrics. She also suggests working with vendors and maintaining a performance budget for metrics that matter. The interview ends with a little about Speedcurve and what they do. Tammy is the CXO of Speedcurve.  Panelists Charles Max Wood Guest Ire Aderinokun Shawn Erquhart Tammy Everts Sponsors   Sentry– use the code “devchat” for two months free on Sentry’s small plan CacheFly   Links https://jamstackconf.com/sf/ https://speedcurve.com/ https://twitter.com/tameverts? https://buycoins.africa/ https://www.netlify.com/ https://www.netlifycms.org/ https://twitter.com/erquhart Headless Chrome & Cloudinary for progressively enhanced dynamic content https://github.com/ireade/caniuse-embed https://ireaderinokun.com/ https://twitter.com/ireaderinokun https://github.com/ireade https://www.facebook.com/ViewsonVue https://twitter.com/viewsonvue

 VoV 091: Meet Our New Panel | File Type: audio/mpeg | Duration: 41:16

In this episode of Views on Vue the new panel is introduced. Lindsay Wardell is a full-stack developer from Portland, Oregon. Steve Edwards was in tech support for 20 years and is a self-taught programmer who is now working full time in Vue. Devlin was a registered nurse, who studied development by night. Charles Max Wood, CEO of Devchat.tv, got a degree from BYU and has been in development and podcasting for about 13 years.  Each of the panelists shares what they are using Vue for, work and personal projects. The panel gives Charles advice on his project. They give recommendations for learning Vue and consider how simple Vue is compared to other more intimidating languages. They share their preferred learning mediums and styles, giving advice for those still discovering how they learn. They also discuss their preferred methods for writing code and preferred text editors.  Panelists Charles Max Wood Steve Edwards Lindsay Wardell Devlin Duldulao Sponsors   Sentry– use the code “devchat” for two months free on Sentry’s small plan CacheFly Links https://quasar.dev/  https://vueschool.io/ https://www.vuemastery.com/ https://www.freecodecamp.org/news/vue-js-full-course/ https://www.programwitherik.com/ https://www.udemy.com/course/vuejs-2-the-complete-guide/ https://www.pluralsight.com/ How Data Modeling, Vuex, and APIs Work Together  https://www.facebook.com/ViewsonVue https://twitter.com/viewsonvue Picks Charles Max Wood: https://www.buymeacoffee.com/devchattv  Mr Krueger’s Christmas  It’s a Wonderful Life  Steve Edwards: Death Nut Challange 2.0  Lindsay Wardell: Vscode-dashboard Devlin Duldulao: Natural Selection

 VoV 090: Variable Fonts with Mandy Michael | File Type: audio/mpeg | Duration: 20:06

In this episode of Views on Vue Charles Max Wood joins Mandy Michael at JAMstack Conf SF, where she gives a talk about responsive typography and variable fonts. Mandy explains what variable fonts are and how they can be used to shrink, stretch and do some very fun and creative thing with them. They discuss how to use them and Mandy explains some of the demos from her talk.    Charles asks Mandy what some of the things were that she had to cut from her talk. She had to cut a few longer demos, details and performance improvements that can be made with responsive typography. Mandy shares what she is working on now with responsive typography and explains how much fun she has had expressing herself through variable fonts. To see more of Mandy’s demos and to learn more about responsive typography and variable fonts see the links below.  Panelists Charles Wood Guest: Mandy Michael Sponsors Sentry– use the code “devchat” for two months free on Sentry’s small plan CacheFly Links https://jamstackconf.com/sf/ https://variablefonts.dev/ https://codepen.io/collection/XqRLMb/ https://twitter.com/Mandy_Kerr? https://www.facebook.com/ViewsonVue https://twitter.com/viewsonvue

 VoV 089: 100 Days of Vue Challenge | File Type: audio/mpeg | Duration: 35:08

This episode of Views on Vue is coming to you live from Microsoft Ignite with Charles Max Wood. With the changes in Views on Vue show and its hosts, Charles has decided to learn more of the Vue language. In order to do this he will be enrolling himself and whoever else wants to learn the Vue language to a Vue challenge. He describes the #100daysofvuechallenge he will launching which was modeled after a fitness challenge he did earlier. The developer who wants to be a part of the #100daysofvuechallenge has to commit a piece of code everyday and read up on blogs articles and other resources on Vue developing everyday. Charles himself will commit an hour a day to this everyday. Charles also talks about another app he is working on for people who produced podcasts can use. There is a recording technique called the "Double Ender" where two people recording a podcast remotely essentially sound like they are in a studio together. Most often podcasts are recorded on the same sound wave and if there is a lawn mover or a dog barking or some other noise while the person is talking it is harder to remove that on a single sound wave. What Charles is working on will remove this inconvenience, because people will be recording on their own sound waves, if there are two people asking two questions while talking over each other will sound like there is only one person asking one question. Panelists Charles Max Wood Sponsors Sentry– use the code “devchat” for two months free on Sentry’s small plan Ruby Rogues Podcast CacheFly _______________________________________________________ "The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood is now available on Amazon. Get your copy today! _______________________________________________________ Picks Charles Max Wood: Microsoft Ignite Click here to win one of ten (10) prize packs as a listener of at least one of the Podcasts recorded at Microsoft Ignite 2019 https://www.kiwi.com Hyatt Regency Orlando www.doordash.com http://thedevrev.com/ https://maxcoders.io/ The MaxCoders Guide To Finding Your Dream Developer Job by Charles Max Wood  

 The MaxCoders Guide To Finding Your Dream Developer Job | File Type: audio/mpeg | Duration: 14:35

"The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood is available on Amazon. Get your copy here today only for $2.99!

 VoV 088: Switching From Native iOS to Vue with Christian Kienle | File Type: audio/mpeg | Duration: 47:44

In this episode of Views on Vue Elizabeth Fine interviews Christian Kienle about his switch from native iOS development to Vue development. Chris starts by sharing his history as a developer and why he started using Vue. He shares his fascinating story. He nearly died which turned his life upside down. After going on a cruise that brought him back to his life, Chris wanted to build a cruise app. This made him looking into making a web app this all brought him to Vue.  Chris explains why he chose Vue. He didn’t know anything about web development and was very impressed by Vue’s description.  Elizabeth asks Chris about learning Vue. Chris explains that he soaked up the knowledge in the Vue docs like a sponge. He tells Elizabeth what he loves about Vue. Elizabeth asks Chris about his yearly code retrospection. Chris explains that every year he looks back at the code he wrote that year to see the progress he has made. They consider the benefits of this practice and Chris shares what it was like looking over his first year of using Vue.  Chris shares a project, MiniPress. He was impressed with VuePress and wanted to know how it worked. It took him a few months and a lot of research but he was able to build this mini version of VuePress. He and Elizabeth consider what he learned and the value of this learning method. Chris works for SAP. He and Elizabeth discuss the SAP component library and compare how their teams approach the libraries for both of their companies. Panelists Elizabeth Fine Guest: Christian Kienle Sponsors   Sentry– use the code “devchat” for two months free on Sentry’s small plan CacheFly Links https://github.com/ChristianKienle/minipress https://www.staticgen.com/saber https://www.vuemastery.com/ https://github.com/SAP/fundamental-vue https://www.facebook.com/ViewsonVue https://twitter.com/viewsonvue Picks Christian Kienle: Compositional API Elizabeth Fine: A Brief History of Time

 VoV 087: There is No Shame in Mental Illness | File Type: audio/mpeg | Duration: 1:06:53

In this episode of Views on Vue panel discusses mental health. They start by sharing what they do in their free time and consider the value of having a balanced life with hobbies and time spent doing non-code related things. They discuss the importance of respecting your mental health and being aware of where you stand. It is possible to stay aware of things going on in the coding community and to be successful without coding in all your free time. The panel shares strategies and techniques they use to alleviate burn out. Taking breaks and days off. They stress the truth that a mental health day is a sick day. Focusing on the reason you are coding, the people. The panel warns against obligations that trap you in a toxic environment.  Inspiration is the next topic the panel discusses. Some of the things to keep their fire burning are considered. Ari explains how Views on Vue helps her stay inspired. Listening to other podcasts and connecting to people. They consider the value in building stupid and crazy tutorials. They discuss how relationships affect mental health.  Diagnoses and labels and how they affect us are considered. The panelists open up and explain how being diagnosed affected their mental health. Ways to support those around us with mental illness are explored. Ben explains three things to remember when dealing with anyone not just those with mental illness; be empathetic, ask questions and do not make assumptions.  When discussing ways to recognize when a coworker is struggling, Ben introduces red, yellow, green check-ins. He explains that at his work they all share where they are red, yellow or green. This way their team can be aware of their mental state. The panel explains how this activity could benefit them and their teams.  Panelists Ben Hong Elizabeth Fine Ari Clark Sponsors   Dev Ed Podcast Sentry– use the code “devchat” for two months free on Sentry’s small plan My Ruby Story CacheFly ________________________________________________________________________________________________________________________ "The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood will be out on November 20th on Amazon.  Get your copy on that date only for $1. ________________________________________________________________________________________________________________________ Links Radical Acceptance https://www.facebook.com/ViewsonVue https://twitter.com/viewsonvue Picks Ben Hong: Cream City Code Steve Aoki Abstract Elizabeth Fine: https://github.com/Domenicobrz https://www.vuemastery.com/vue-cheat-sheet/ Ari Clark: Unbelievable

 VoV 086: Prototyping and The Design Cycle With Michele Cynowicz | File Type: audio/mpeg | Duration: 1:04:33

The guest panelist for this episode of Views on Vue is Michele Cynowicz. Michele is a senior front-end engineer at Vox Media. The discussion opens up with Ari asking Michele to share her background of how she got into development. She started in design in the late 1990’s and early 2000’s and transitioned into being a front end developer working with basic HTML and CSS and moved up into working with JavaScript, frameworks, and back end technologies. She has also worked with templating systems for Python and PHP. She is currently working on projects with Ruby on Rails and has recently worked on a project where she put a VueJS front end on top of a Ruby on Rails back-end. This project was the beginning of her forray into VueJS and this leads her into the topic for this episode, prototyping and the design cycle.  Ari asks Michele to elaborate more on what design means in this context and she shares a story of a time she was looking at a resume that was poorly designed, and the candidates’ attached portfolio had a poor user experience. Michele points out why the combination of these two factors made it challenging for the candidate to get job offers. Michele brings out the conclusion that it is possible to have a lifetime of front end user experience and have little to no exposure to user experience and design. She shares an overview of how the development process operates where she works and how design is involved in that process. Ari and Michele then have a discussion on usability testing, how they came to use it in their respective organizations, and how they put these concepts into practical application. The next topic covered by the Vue experts is functional prototyping. Michele explains what she defines a functional prototype, how they work with components, and shares an example. She also details what she calls a prototype wrapper and how it works. Michele explains how the process they go through for user testing helps to improve the usability of the application. Michele also explains some differences between agile and waterfall development methodologies. Elizabeth then asks Michele to share more detail on how she implements these ideas in production without exposing half finished code to the world. Michele shares that she uses these concepts in applications that require sign-in and in this way she is able to control who sees them. Michele shares how logistics can be an issue with her method of user testing. If users are in multiple locations, it can be difficult to work together. She details how she overcomes these types of challenges to build prototypes and keep them in production. Elizabeth then shifts the discussion to a more technical explanation of how this prototype scaffold works and the panelists discuss this in more detail as well as how to overcome some of the challenges presented. Michele is on twitter and can be reached in the vue vixens slack community. Panelists Ari Clark Elizabeth Fine Ben Hong   Guest Michele Cynowicz Sponsors Tidelift Sentry use the code “devchat” for 2 months free on Sentry’s small plan My JavaScript Story Links Vox Media Views on Vue Redesigning For State Management Agile Waterfall @michelecynowicz on twitter   Picks Elizabeth Fine Her Applesauce Recipe Webpack Bundle Analyzer Ben Hong Lucifer Netflix Series Super Pumped: The Battle For Uber Michele Cynowicz The Good Place Series Resilient Management Ari Clark Hello, Privilege, It’s me, Chelsea  

 VoV 085: The Good, the Bad, and the Ugly with Filipa Lacerda | File Type: audio/mpeg | Duration: 55:05

On this episode of Views on Vue the panelists are joined by Filipa Lacerda. Filipa is a senior front-end engineer at Gitlab where they have been using Vue. The topic for this episode of Views on Vue is “the good, the bad, and the ugly” where the panelists discuss some of the positives of their experience with Vue as well as some of the struggles they’ve had.  Filipa starts the discussion with sharing that Vue comes with a great deal of power to deliver to the end user as well as an example of this that she has experienced. She also shares some of the bad, such as how when she started using Vue many of the standards that exist today did not exist then. Filipa shares a story from a time in the early stages Vue when she was able to kill a browser. The panelists also highlight some Vue worst practices.  Next, Filipa explains how it was difficult in the beginning to know which pipeline to use. She details how some of the linting rules and documentation she created came about. She also talks about the changes that came from adding Vuex to her environment. Ben then asks Filipa to detail how their architecture differs from Vuex. She shares the technical details of how they work with APIs differently and how this process helps to improve testing. Most of the repositories they use are open source. The Vue podcasters then move to discussing the style guide used at gitlab. Filipa shares that they use something called gitlab-ui where they keep all of their front end components. She also shares how they are migrating their shared components.  Ari then asks Filipa to share her story of how she came to be a developer. She shares how she started her time at university in communications and quickly learned that she wanted to change and received a degree in multimedia. When she started working she was a user experience designer and because she struggled with the design aspect of this job she learned how to code. She shares the technologies she used and how she became a proficient coder. Filipa shares some of the differences between working in React and working with Vue. The next topic covered by the Vue experts is Vue 3. Filipa explains that at Gitlab they always try to keep their dependencies as up to date as possible. The biggest obstacle to this goal is being able to deal with breaking changes that come in. When these breaking changes are introduced they are always able to resolve them and get their dependencies back up to date. At Gitlab they don’t like to retrofit old code with new technologies but they do like to use new technologies with new code moving forward. The Vue developers share their opinions on why refactoring old code with new features can provide challenges. Filipa presents the idea that it’s hard to make a case for refactoring old code with a new feature if the customer isn’t going to see a difference. Ari shares an example of when a refactor provided an opportunity to improve their product.   Panelists Ben Hong Ari Clark Erik Hanchett   Guest Filipa Lacerda Sponsors Tidelift  Sentry.io use code “devchat” for 2 months free My Angular Story Links Gitlab Vuex React gitlab-ui Meltano Filipa’s Website Filipa Lacerda Twitter Filipa Lacerda Github Filipa Lacerda Gitlab Picks Erik Hanchett Nuxt GraphQL TypeScript Ari Clark Explosions in the Sky - The Earth Is Not a Cold Dead Place Radical Acceptance Filipa Lacerda Remote Shift System of a Down Ben Hong Landslide by Dagny Anxiety Is The Dizziness of Freedom by Ted Chiang

 VoV 084: Nuxt.JS With Sebastien Chopin | File Type: audio/mpeg | Duration: 54:07

Sebastien Chopin is a front end developer who works mostly in JavaScript and is the creator of Nuxt.JS, a framework based off of Vue. Nuxt started as a JavaScript framework for application rendering and today it can be used to create any kind of application. One advantage of using Nuxt with Vue comes in with server side rendering. Even though a user can use Vue for server side rendering, they will need the use of outside modules where using Nuxt will help them to get started quicker.  After the Views on Vue panelists discuss the usage of Nuxt in server side rendering, Ari asks Sebastien to elaborate on how Nuxt can be used outside of server side rendering. Sebastien describes how Nuxt has a pages system that helps streamline the directory and folder structure of an application or web page. Nuxt also has features to help with navigation among other usages described by Sebastien. He also goes into further detail about the features of the pages system. The panel then covers Vuex and using Vuex to perform asynchronous operations, as well as how Nuxt streamlines this process. The next topic covered by the panelists is vue page transitions and how they work in Nuxt. Sebastien talks about how Nuxt uses components and modes to manage transitions and how to modify the page’s CSS appropriately. Ari then asks Sebastien what other features come with Nuxt out of the box in addition to transitions. Sebastien goes on to share these features that include the following: transitions, pages transition, templating, app customization, and browser comments. The panelists discuss the plugin ecosystem included with Nuxt.  The next topic covered by the Vue experts is the use of plugins and modules as well as some of the markdown centered authoring in Nuxt. Ben asks Sebastien if a markdown compiler would need to be a plugin or a module and how it would work. Sebastien explains that a user could use markdown by using a webpack loader and how to use modules to support it. Ari ask Sebastien to expound upon how Nuxt enables a quality developer experience when building static sites on a JAMstack. In response to this, Sebastien shares a story about when his brother joined him to work on the first edition of Nuxt. Together they used a generator command to read the pages directory and Sebastien shares the effect that had.  The panelists then move on to discussing the future of Nuxt and upcoming releases. Sebastien talks about his plans for the upcoming changes to NuxtJS.org and full static mode as well as other upcoming features. The panelists also discuss CircleCI and GitlabCI as well as other git tooling. Ari asks Sebastien what he does when he has spare time. Sebastien likes to browse twitter which he uses as his feed to keep up on what’s happening in open source. He also likes to keep current on the Javascript and Vue worlds. They also talk about the upcoming Nuxt projects that Sebastien is excited about. They wrap up with talking about social media in the community and how to get involved with NuxtJs.   Panelists Ben Hong Ari Clark   Guest Sebastien Chopin Sponsors Tidelift Sentry use code “devchat” for two months free JavaScript Jabber Links Nuxt.JS NuxtPress Vuex Webpack Loaders Nuxt + Markdown blog starter JAMstack Chuck Norris Database CircleCI NuxtJS Instagram NuxtJS Discord Server NuxtJS Github Sebastien Chopin Twitter Atinux github Atinux.com Vue.js Conference Amsterdam Picks Ari Clark Grace and Frankie Sebastien Chopin Thylacine Friends Vuepress 1.1 Gridsome 0.7 Ben Hong Gurenge by LiSA Demon Slayer: Kimetsu no Yaiba Super Pumped

 VoV 083: CSS Tooling and Development Practices With Tracey Holinka | File Type: audio/mpeg | Duration: 1:01:13

This episode of Views on Vue features Tracey Holinka, a web application architect with the role of front-end lead for Bloomberg industry group. The Views on Vue podcaster begin by asking Tracey how she got into Vue. Her Vue experience starts at work where she didn’t like the technologies they were using so she and a colleague decided to switch over to GraphQL, Apollo Client, and Vue. One of the many things that she appreciates about Vue is its diverse array of applications.   Ari begins a discussion on Vue and CSS by asking Tracey if she has found any notable differences, in terms of developer experience, between doing single file components or using Vue by including a script tag. Tracey responds to this by sharing her preference for single file components because she appreciates the division of the languages, or in other words she likes HTML files only having HTML, her CSS files only having CSS, and so on. She feels that with this separation of languages she can work faster and understand the code easier.   The Views on Vue panelists then ask Tracey how she handles CSS in her Vue development environment. She shares her opinion on how she used to prefer manual scoping, particularly for smaller projects and push CSS modules for larger projects. She then goes on to share why she now prefers CSS modules for projects of all sizes. She then goes on to share some of her best practices with the other Vue developers for writing proper CSS including ways to prevent collisions and when she uses CSS preprocessor. The panelists then asked Tracey how she knows when to modularize or componentize an element of a page or other functionality. In response to this question Tracey shares how she came up with her best practices and why she likes to componentize when she does.   Next the Vue experts discuss tools they use to help support the use of component libraries and ways to help other developers figure out what components are available. Tracey shares how she went to a Vue conference and heard about the component library Storybook as well as storyshot which is a plugin for Storybook that is used in regression testing. Storyshot works by taking an image of a component and uses it to check the CSS of a page. Since Tracy had been using Vue for about a year before using Storybook and storyshot, Ari asks how difficult it is to retroactively fit an application with these tools. Tracey shares that this retrofitting is easy, particularly more so if the user is familiar with unit testing already. The Vue experts also discuss different technologies that they use for unit testing such as Jest, Vue Util, Cucumber, and Webdriver.io. They discuss the benefits of using GraphQL and Apollo instead of the more common Rest API solution.   The final topics discussed by the Vue panelists are community building and women in the technology community. Tracey’s shares her observation that the Vue community is growing but she wants to focus on having more women involved. The panel holds a discussion about women in tech and some of the challenges facing them. They discuss some of the support that is out there for women to help them succeed in technology. The Vue community is a very inclusive community that is proactive about including everybody.  

 VoV 082: Developer Tooling and Dev Setup for Working With Vue | File Type: audio/mpeg | Duration: 1:02:26

On this episode of Views on Vue the panelists discuss their preferences for their development environments and tools. They begin with their preferences for text editor, font, and theme in their Vue development environments. All three currently use Visual Studio Code as their main text editor. Ari Clark switched to VS Code from Atom because she prefers the support that it has for Vue and Ben Hong switched from Sublime. Ben prefers the night owl theme and the operator mono font. On the other hand, Ari prefers the one dark pro theme for its syntax highlighting and prefers dank mono as her font. The Views on Vue panelists then go on to discuss their preferences on using the terminal. They weigh the pros and cons of using the integrated terminal and when they turn to other shells. The other potential shells that the Vue panelists discuss are Bash, Zsh, and Fish. The panelists focus on the speed and performance of the shells, and make an important note that not all shell commands are valid on other shells and the user will have to be familiar with the shell they are using. The Vue experts discuss whether they use the command line interface (CLI) or VS Code version control to manage their git version control. The panelists then weigh the pros and cons of different terminal shells they like to use. The panelists also briefly discuss how open they are to changing their development environment setup.  The topic then shifts to extensions for VS Code. The Views on Vue podcasters mention their preferences for a bracket colorizer, extension packs, code snippets and other tools. They talk specifically about the following extensions: Vue VS Code Extension Pack and Vue VS Code Snippets by Sarah Drasner, and Vetur created by Pine Wu, the latter of which the panelists identify as a quintessential extension for writing Vue. They discuss the merits of code snippet extensions as reusable code and creating them in VS Code.  They also discuss some of the different types of snippets that exist and how to use them. The Views on Vue panelists discuss ways to enforce best practices in addition to code snippets. They talk about using code generators like Hygen to automatically fill out the template for specific types of files. They share that creating unit tests helps to ensure best practices and that the code works as intended, as well as the differences between unit tests and end to end tests. They go over the strengths of an end to end testing tool called cypress. Tools like Husky or Yorkie allow you to add pre commit hooks to the package.json file that will automatically manage all the linting for a project.  Finally the panelists share their preferences browser tooling for Vue projects in addition to browser developer tools and their browsers of choice. Ari says that she prefers the previous version (version 4) of Vue devtools than the current version (version 5) and her reasons why. Chris Fritz shares that he likes Vimium for setting up quick navigation and Ben shares that he likes to use Keyboard Maestro. Panelists Ben Hong  Ari Clark  Chris Fritz Sponsors Tidelift Sentry.io use code “devchat” for 2 months free React Round Up  Elixir Mix Links Atom  Sublime Vue VS Code Extension Pack by Sarah Drasner Vetur by Pine wu  Vue VS Code Snippets by Sarah Drasner  Hygen  Cypress  VoV 007: Testing Vue.js with Cypress with Gleb Bahmutov Husky Vimium Keyboard Maestro Vue devtools Picks Ari Clark Gris  Ben Hong Ralph Breaks the Internet Chris Fritz Spiderman: Into The Spiderverse Children of Ruin

 VoV 081: Micro-Frontends with Luca Mezzalira | File Type: audio/mpeg | Duration: 55:19

Luca Mezzalira is an Italian developer. He is the VP of architecture at DAZN, a multi-country live streaming platform for sports, Google developer expert, and London JavaScript community manager. Luca got his start in programming 16 years ago when a friend told him about it and gave him a book. He was very intrigued and went on to learn multiple languages and travel the world for his job. For the last 4-5 years he’s been working in architecture, and is now the leader on thoughts on micro-frontends.  Luca first defines what he means by a micro-frontend. He advises that when designing a new application one should consider how to make it scalable from the beginning. His passion for micro-frontends came from working with DAZN, where they need to enable hundreds of people to work on the same project in different time zones and locations. This problem was solved by microservices.A microservice is a self contained, autonomous, independent service that can be deployed inside a system responding to an API you can consume. It only does one job, and when you have a backend that has multiple microservices you can move away from the old monolith, and scale one API at a time and apply an independent release of a service. Microservices are often applied to the backend, but Luca talks about how the same principles can be applied to the frontend. This is similar to the way that Netflix works. His advice is to think about how you can slice your frontend into individual pieces. Micro-frontends can work with both regular and micro-backends. Luca talks about how DAZN has developed, from a monolith front and back to utilizing microservices. He has found that using microservices has decreased the amount of code they release, increased their speed because decisions happen locally and independently from the rest of the program, and enables teams to work in parallel. Using microservices on both the front and backend has given this large organization greater agility overall.   Luca addresses some risks with using micro-frontends. It is important to identify your business model before implementing a micro-frontend. They are more effective when you know where your site traffic goes and you can slice your frontend properly. When applied correctly, microservices can enable your app to get more elaborate because it will only load the code that it needs.  Ari Clark wonders if having a micro-frontend helps you create autonomous teams with expertise that benefit your company or if the specialization affects your operational readiness if something goes wrong. One of the main challenges DAZN has had is knowledge sharing between teams, and he shares practices the company has implemented to help spread the information around to keep people from feeling isolated. He talks about how developer teams are set up in his company, with some temporary roles and some people in rotation. Developers are encouraged to change their team if they want to try another challenge. Luca has found that this set up causes people to stick around longer, but notes that it is important that your location be pretty stable in the number of people there before implementing this method. He also talks about how people other than developers are divided in the company.  Luca talks about some of the challenges they’ve had with this organization and the tools they’ve employed that are conducive to this business structure. Some of their management methods are working in small iterations, creating bridges between teams, and centralizing some teams. They are currently working on creating a structure where developers at any stage can chip in. The panel discusses the value of this business setup.  The panel asks Luca his feelings on code reuse. He believes it to be important, but not essential. He talks about how resing code is implemented in his company and how they are working on a way to make it better. Luca notes that if you have a unique framework you’re using, you need to have try to have multiple libraries of the same framework for different versions. He also talks about situations where he found duplicating code helpful. The show finishes with the panel discussing his article on micro-frontends on Medium.  Panelists Ari Clark Chris Fritz Elizabeth Fine Ben Hong With special guest: Luca Mezzalira Sponsors Sustain Our Software Sentry use the code “devchat” for 2 months free on Sentry’s small plan Elixir Mix Links DAZN Microservice  Amazon style dictionary I Don't Understand Micro Frontends by Luca Mezzalira Follow DevChatTV on Facebook and Twitter Picks Ari Clark: What We Do in the Shadows on Netflix and Hulu Chris Fritz: VoiceAttack Lover by Taylor Swift Elizabeth Fine: CookBook app Ben Hong: Exhalation by Ted Chang Perplexus Epic Luca Mezzalira: The Phoenix Project Building Micro-Frontends Webinar September 30, 2019 Follow Luca @lucamezzalira and at https://lucamezzalira.com

Comments

Login or signup comment.