title

Views on Vue

Devchat.tv

14
Followers
22
Plays
Views on Vue
Views on Vue

Views on Vue

Devchat.tv

14
Followers
22
Plays
OVERVIEWEPISODESYOU MAY ALSO LIKE

Details

About Us

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

Latest Episodes

VoV 084: Nuxt.JS With Sebastien Chopin

Episode Summary 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

54 MIN2 h ago
Comments
VoV 084: Nuxt.JS With Sebastien Chopin

VoV 083: CSS Tooling and Development Practices With Tracey Holinka

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.

61 MIN1 w ago
Comments
VoV 083: CSS Tooling and Development Practices With Tracey Holinka

VoV 082: Developer Tooling and Dev Setup for Working With Vue

Episode Summary 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

62 MIN2 w ago
Comments
VoV 082: Developer Tooling and Dev Setup for Working With Vue

VoV 081: Micro-Frontends with Luca Mezzalira

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 multi

55 MIN3 w ago
Comments
VoV 081: Micro-Frontends with Luca Mezzalira

VoV 080: Awesome Conf with Rahul Kadyan

In this episode of Views on Vue the panel interviews core team member Rahul Kadyan. They discuss his various contributions to the vue ecosystem and his recent conference, Awesome Conf. The panel starts by asking Rahul about rollup-plugin-vue. Rollup is a bundle like webpack. When Rahul got his start in Vue he wanted to use rollup so he created rollup-plugin-vue. This caught the eye of the core team and he received an invite to join the core team. Rahul spends most of his time in Vue working with compilers, the panel asks him about template compilation. He explains when template compilation happens and how knowing how it works can help you create better templates. Rahul shares all the awesome things that can be done with templates. The topic moves to stand alone and runtime only builds in Vue. Rahul explains how each of these builds. The panel considers possible use cases for both builds. The stand alone build being larger is good for only about 10% of cases. The runtime only build works well in cases where you already have a build process. On top of Vue being smaller, it can also make your website run faster. Rahul recently gave a talk about single file components or SFC in Vue. He explains the easiest ways to use SFC and what it is capable of. The panel compares SFC to an ordinary JavaScript file. Rahul lists the benefits of using and SFC over a regular JavaScript file, one being you get the best out of the box render function in Vue. The panel asks about the work Rahul is doing at work, building a design language system. He explains the difference between a design system and a design language system. A design language system defines what every interaction will look like, it has a larger scope than a regular design system. He explains how useful it is and what they use it for. Some of his other contributions to the Vue ecosystem include the vs code language plugin he is currently working on. In this project, he is exploring ways to find all your global components so that way he can provide completions for all the components. Also in this plugin, he is exploring using a compiler to get all the information about each component. He is hoping to include editing capabilities which gets the panel really excited. Rahul has a repo called vue-lazy-hydration, which allows you to hydrate components as you need them while doing server-side rendering. He explains what he means by hydration and how by using async hydration the long delay that normally comes with server-side rendering is no longer a problem. He is currently creating demos for the repo. The first Awesome Conf was held recently and Rahul shares his experience setting it up. Awesome Conf is different than other conferences in that the speakers were actually the attendees. Rahul explains how all this came about. At first, they were going for a normal conference but didn’t get enough speakers, so they reached out to the attendees and told them they would have to provide the talks. They provided topics for the attendees to choose from and chose 15 talks from the ones submitted. With such a small conference they let everyone bring a plus one. The conference was a success and everyone had a great time. Rahul is looking forward to doing another Awesome Conf this time for design. He is still working out the details but he wants a diverse group that can really learn from each other. The panel considers what they would do if they were asked to speak. They share their fears of speaking and Rahul shares some of the advice he gave to the speakers as he helped them prepare for their talks. To finish the episode, Chris Fritz asks Rahul why he chooses to work with compilation. Rahul shares his story about getting into computer science and eventually compilation. He explains why he loves working in compilation and how it helps him as a front end developer. Panelists Chris Fritz Elizabeth Fine Ari Clark Guest Rahul Kadyan Sponsors Adventures in DevOps Sentry– use the code “devchat” f

58 MINSEP 24
Comments
VoV 080: Awesome Conf with Rahul Kadyan

VoV 079: Why Vue.js is the Best Framework Ever with Gwendolyn Faraday

Episode Summary In this week’s episode of Views one Vue, the panel interviews Vue’s biggest fan, Gwendolyn Faraday. Gwen shares her story of getting into vue. How she was a little reluctant at first but ended up being so impressed with everything Vue has to offer. Gwen is a Vue educator and loves how easy it is to teach Vue, with its great docs and human-focused design. Gwen explains why she is such a big fan of Vue. It is easy to use. It is intuitive to use. The documentation is wonderfully written. She loves that Vuex and Vue Router are actual Vue products that work seamlessly with the framework, making a cohesive ecosystem. She declares that Vue is not just for beginners, it is a production-ready, battle-tested language with a human-driven design. The panel asks Gwen what makes learning and teaching Vue easier. Gwen explains that Redux is complex and hard to understand while Vuex is much simpler to understand. She tells the panel that Vue is much easier to learn because it has ...

49 MINSEP 17
Comments
VoV 079: Why Vue.js is the Best Framework Ever with Gwendolyn Faraday

VoV 078: Waxing Philosophical with Christoffer Noring

Episode Summary In this episode of Views on Vue, the panel waxes philosophical while talking with Microsoft advocate Chris Noring. Chris is also the senior cloud developer at Microsoft and has experience in a variety of frameworks including, .NET, Angular, React and Vue. The first topic the panel discusses is Chris’s work with VuePress. Chris shares why he chose VuePress and what his experience has been with using it. Chris describes the absolute simplicity of using VuePress. Chris goes on to explain that though VuePress may not come with all the bells and whistles, it is easy to add the features he wants with his opensource GitHub repo. The panel takes a minute to discuss the VuePress blog plugin. Remembering a talk that Chris gave, the panel discusses imposter syndrome. The panel all shares the feelings of inadequacy they have all felt at some time or another. Chris explains how he overcame imposter syndrome and share tips for others to overcome it as well. The panel then discuss...

65 MINSEP 10
Comments
VoV 078: Waxing Philosophical with Christoffer Noring

VoV 077: Tackling Tedious Testing

Sponsors Adventures inBlockchain Sentry– use the code “devchat” for two months free on Sentry’s small plan GitLab | Get 30% off tickets with the promo code: DEVCHATCOMMIT CacheFly Panel Elizabeth Fine Ben Hong Ari Clark Summary Joined by their newest member, Elizabeth Fine, the panel discusses testing. The share their approaches to testing and consider which approaches are best. The panel shares their experiences and testing mishaps. They share their favorite tools and libraries for testing. The different types of testing are defined and discussed, including unit testing, integration testing, cross-browser testing, accessibility testing, and snapshot testing. Links VoV 072: Cedar with Elizabeth Fine https://github.com/chrisvfritz/vue-enterprise-boilerplate https://vue-test-utils.vuejs.org/ Testing Vue.js Applications https://www.cypress.io/ https://vuetifyjs.com/en/ https://accessibilitycampseattle.org/ https://www.facebook.com/ViewsonVue https://twitter.com/viewsonvue Picks Ben Hong: Supernatural Ari Clark: Top of the Lake Elizabeth Fine: Victor-mono

56 MINSEP 3
Comments
VoV 077: Tackling Tedious Testing

VoV 076: Typescript Tell All with Jack Koppa

Sponsors The Freelancers Show Sentry– use the code “devchat” for two months free on Sentry’s small plan GitLab | Get 30% off tickets with the promo code: DEVCHATCOMMIT CacheFly Panel Chris Fritz Ben Hong Ari Clark Joined by Special Guest: Jack Koppa Summary Jack Koppa, a frontend developer at Politico, joins the panel to discuss the adoption of Typescript atPolitico. Having a background in Angular, React and Vue, Jack compares the onboarding process for all 3 frameworks. Jack Koppa explains why Politico decided to switch to Typescript and shares his experiences during the change. The panel discusses the reactions of the other developers at Politico and Jack explains the learning curve and eventual acceptance of Typescript among the Politico developers. Typescript can solve many problems and the panel expounds on those while also addressing the drawbacks of using Typescript. While Typescript has a learning curve, can take up time to write and the need to be meticulous is very hig...

60 MINAUG 27
Comments
VoV 076: Typescript Tell All with Jack Koppa

VoV 075: Terrific Talk Tips

Sponsors Adventures in DevOps Sentry– use the code “devchat” for two months free on Sentry’s small plan The Freelancers Show CacheFly Panel Chris Fritz Ben Hong Ari Clark Summary In this episode, the panel has a fun time as they discuss what makes a good talk and how to get started as a speaker. The panel lists attributes they love in a talk that makes them want to jump onto their computers and code: having an easy call to action with resources, start the talk with why the audience should listen and what they stand to gain from the talk, and authentic humor are only a few. Amazing example talks and speakers are given as resources to study these attributes. The panel also discusses cringe-worthy mistakes made by speakers that can kill an interesting talk: too many words on your slides or reading from your slides, rambling personal anecdotes, tangents, and jokes, or being overly professional and talking down to your audience and many more. Advice is given on how to correct these problems The panel discusses how to get started speaking at conferences and gives advice for submitting conference proposals (CFP). The benefits of starting small by speaking at local meetups are considered. Local meetup organizers are always looking for willing speakers and by giving talks here first speakers can receive friendly and honest feedback. Chris Fritz gives instructions on how to get useful feedback instead of polite compliments from the audience. The panel gives advice on writing talks, most importantly to have an objective for your talk. Ben Hong explains why it is important to submit more than one CFPand more than one type of talk. The panel discusses the different types of talks and reminds listeners not to undervalue case studies because each experience is unique and valuable. Chris and Ben share what organizers look for in CFP’s and why they may be rejected. The panel ends the discussion with an explanation of speaker accommodation packages and how to ask for them. Links Agile Design Systems in Vue - Miriam Suzanne at VueConf.US Callum Macrae - Accessibility with Vue Advanced Animations with Vue.js Vue in Motion - Rachel Nabors - VueConf US 2018 https://slides.com/ Back to the Vueture: Stuck in the Event Loop http://www.sarahmei.com/blog/2014/04/07/what-your-conference-proposal-is-missing/ https://www.facebook.com/ViewsonVue https://twitter.com/viewsonvue Picks Ben Hong: Paris, France Ari Clark: After Life Derek Chris Fritz: Nanette TIS100

60 MINAUG 20
Comments
VoV 075: Terrific Talk Tips

Latest Episodes

VoV 084: Nuxt.JS With Sebastien Chopin

Episode Summary 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

54 MIN2 h ago
Comments
VoV 084: Nuxt.JS With Sebastien Chopin

VoV 083: CSS Tooling and Development Practices With Tracey Holinka

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.

61 MIN1 w ago
Comments
VoV 083: CSS Tooling and Development Practices With Tracey Holinka

VoV 082: Developer Tooling and Dev Setup for Working With Vue

Episode Summary 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

62 MIN2 w ago
Comments
VoV 082: Developer Tooling and Dev Setup for Working With Vue

VoV 081: Micro-Frontends with Luca Mezzalira

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 multi

55 MIN3 w ago
Comments
VoV 081: Micro-Frontends with Luca Mezzalira

VoV 080: Awesome Conf with Rahul Kadyan

In this episode of Views on Vue the panel interviews core team member Rahul Kadyan. They discuss his various contributions to the vue ecosystem and his recent conference, Awesome Conf. The panel starts by asking Rahul about rollup-plugin-vue. Rollup is a bundle like webpack. When Rahul got his start in Vue he wanted to use rollup so he created rollup-plugin-vue. This caught the eye of the core team and he received an invite to join the core team. Rahul spends most of his time in Vue working with compilers, the panel asks him about template compilation. He explains when template compilation happens and how knowing how it works can help you create better templates. Rahul shares all the awesome things that can be done with templates. The topic moves to stand alone and runtime only builds in Vue. Rahul explains how each of these builds. The panel considers possible use cases for both builds. The stand alone build being larger is good for only about 10% of cases. The runtime only build works well in cases where you already have a build process. On top of Vue being smaller, it can also make your website run faster. Rahul recently gave a talk about single file components or SFC in Vue. He explains the easiest ways to use SFC and what it is capable of. The panel compares SFC to an ordinary JavaScript file. Rahul lists the benefits of using and SFC over a regular JavaScript file, one being you get the best out of the box render function in Vue. The panel asks about the work Rahul is doing at work, building a design language system. He explains the difference between a design system and a design language system. A design language system defines what every interaction will look like, it has a larger scope than a regular design system. He explains how useful it is and what they use it for. Some of his other contributions to the Vue ecosystem include the vs code language plugin he is currently working on. In this project, he is exploring ways to find all your global components so that way he can provide completions for all the components. Also in this plugin, he is exploring using a compiler to get all the information about each component. He is hoping to include editing capabilities which gets the panel really excited. Rahul has a repo called vue-lazy-hydration, which allows you to hydrate components as you need them while doing server-side rendering. He explains what he means by hydration and how by using async hydration the long delay that normally comes with server-side rendering is no longer a problem. He is currently creating demos for the repo. The first Awesome Conf was held recently and Rahul shares his experience setting it up. Awesome Conf is different than other conferences in that the speakers were actually the attendees. Rahul explains how all this came about. At first, they were going for a normal conference but didn’t get enough speakers, so they reached out to the attendees and told them they would have to provide the talks. They provided topics for the attendees to choose from and chose 15 talks from the ones submitted. With such a small conference they let everyone bring a plus one. The conference was a success and everyone had a great time. Rahul is looking forward to doing another Awesome Conf this time for design. He is still working out the details but he wants a diverse group that can really learn from each other. The panel considers what they would do if they were asked to speak. They share their fears of speaking and Rahul shares some of the advice he gave to the speakers as he helped them prepare for their talks. To finish the episode, Chris Fritz asks Rahul why he chooses to work with compilation. Rahul shares his story about getting into computer science and eventually compilation. He explains why he loves working in compilation and how it helps him as a front end developer. Panelists Chris Fritz Elizabeth Fine Ari Clark Guest Rahul Kadyan Sponsors Adventures in DevOps Sentry– use the code “devchat” f

58 MINSEP 24
Comments
VoV 080: Awesome Conf with Rahul Kadyan

VoV 079: Why Vue.js is the Best Framework Ever with Gwendolyn Faraday

Episode Summary In this week’s episode of Views one Vue, the panel interviews Vue’s biggest fan, Gwendolyn Faraday. Gwen shares her story of getting into vue. How she was a little reluctant at first but ended up being so impressed with everything Vue has to offer. Gwen is a Vue educator and loves how easy it is to teach Vue, with its great docs and human-focused design. Gwen explains why she is such a big fan of Vue. It is easy to use. It is intuitive to use. The documentation is wonderfully written. She loves that Vuex and Vue Router are actual Vue products that work seamlessly with the framework, making a cohesive ecosystem. She declares that Vue is not just for beginners, it is a production-ready, battle-tested language with a human-driven design. The panel asks Gwen what makes learning and teaching Vue easier. Gwen explains that Redux is complex and hard to understand while Vuex is much simpler to understand. She tells the panel that Vue is much easier to learn because it has ...

49 MINSEP 17
Comments
VoV 079: Why Vue.js is the Best Framework Ever with Gwendolyn Faraday

VoV 078: Waxing Philosophical with Christoffer Noring

Episode Summary In this episode of Views on Vue, the panel waxes philosophical while talking with Microsoft advocate Chris Noring. Chris is also the senior cloud developer at Microsoft and has experience in a variety of frameworks including, .NET, Angular, React and Vue. The first topic the panel discusses is Chris’s work with VuePress. Chris shares why he chose VuePress and what his experience has been with using it. Chris describes the absolute simplicity of using VuePress. Chris goes on to explain that though VuePress may not come with all the bells and whistles, it is easy to add the features he wants with his opensource GitHub repo. The panel takes a minute to discuss the VuePress blog plugin. Remembering a talk that Chris gave, the panel discusses imposter syndrome. The panel all shares the feelings of inadequacy they have all felt at some time or another. Chris explains how he overcame imposter syndrome and share tips for others to overcome it as well. The panel then discuss...

65 MINSEP 10
Comments
VoV 078: Waxing Philosophical with Christoffer Noring

VoV 077: Tackling Tedious Testing

Sponsors Adventures inBlockchain Sentry– use the code “devchat” for two months free on Sentry’s small plan GitLab | Get 30% off tickets with the promo code: DEVCHATCOMMIT CacheFly Panel Elizabeth Fine Ben Hong Ari Clark Summary Joined by their newest member, Elizabeth Fine, the panel discusses testing. The share their approaches to testing and consider which approaches are best. The panel shares their experiences and testing mishaps. They share their favorite tools and libraries for testing. The different types of testing are defined and discussed, including unit testing, integration testing, cross-browser testing, accessibility testing, and snapshot testing. Links VoV 072: Cedar with Elizabeth Fine https://github.com/chrisvfritz/vue-enterprise-boilerplate https://vue-test-utils.vuejs.org/ Testing Vue.js Applications https://www.cypress.io/ https://vuetifyjs.com/en/ https://accessibilitycampseattle.org/ https://www.facebook.com/ViewsonVue https://twitter.com/viewsonvue Picks Ben Hong: Supernatural Ari Clark: Top of the Lake Elizabeth Fine: Victor-mono

56 MINSEP 3
Comments
VoV 077: Tackling Tedious Testing

VoV 076: Typescript Tell All with Jack Koppa

Sponsors The Freelancers Show Sentry– use the code “devchat” for two months free on Sentry’s small plan GitLab | Get 30% off tickets with the promo code: DEVCHATCOMMIT CacheFly Panel Chris Fritz Ben Hong Ari Clark Joined by Special Guest: Jack Koppa Summary Jack Koppa, a frontend developer at Politico, joins the panel to discuss the adoption of Typescript atPolitico. Having a background in Angular, React and Vue, Jack compares the onboarding process for all 3 frameworks. Jack Koppa explains why Politico decided to switch to Typescript and shares his experiences during the change. The panel discusses the reactions of the other developers at Politico and Jack explains the learning curve and eventual acceptance of Typescript among the Politico developers. Typescript can solve many problems and the panel expounds on those while also addressing the drawbacks of using Typescript. While Typescript has a learning curve, can take up time to write and the need to be meticulous is very hig...

60 MINAUG 27
Comments
VoV 076: Typescript Tell All with Jack Koppa

VoV 075: Terrific Talk Tips

Sponsors Adventures in DevOps Sentry– use the code “devchat” for two months free on Sentry’s small plan The Freelancers Show CacheFly Panel Chris Fritz Ben Hong Ari Clark Summary In this episode, the panel has a fun time as they discuss what makes a good talk and how to get started as a speaker. The panel lists attributes they love in a talk that makes them want to jump onto their computers and code: having an easy call to action with resources, start the talk with why the audience should listen and what they stand to gain from the talk, and authentic humor are only a few. Amazing example talks and speakers are given as resources to study these attributes. The panel also discusses cringe-worthy mistakes made by speakers that can kill an interesting talk: too many words on your slides or reading from your slides, rambling personal anecdotes, tangents, and jokes, or being overly professional and talking down to your audience and many more. Advice is given on how to correct these problems The panel discusses how to get started speaking at conferences and gives advice for submitting conference proposals (CFP). The benefits of starting small by speaking at local meetups are considered. Local meetup organizers are always looking for willing speakers and by giving talks here first speakers can receive friendly and honest feedback. Chris Fritz gives instructions on how to get useful feedback instead of polite compliments from the audience. The panel gives advice on writing talks, most importantly to have an objective for your talk. Ben Hong explains why it is important to submit more than one CFPand more than one type of talk. The panel discusses the different types of talks and reminds listeners not to undervalue case studies because each experience is unique and valuable. Chris and Ben share what organizers look for in CFP’s and why they may be rejected. The panel ends the discussion with an explanation of speaker accommodation packages and how to ask for them. Links Agile Design Systems in Vue - Miriam Suzanne at VueConf.US Callum Macrae - Accessibility with Vue Advanced Animations with Vue.js Vue in Motion - Rachel Nabors - VueConf US 2018 https://slides.com/ Back to the Vueture: Stuck in the Event Loop http://www.sarahmei.com/blog/2014/04/07/what-your-conference-proposal-is-missing/ https://www.facebook.com/ViewsonVue https://twitter.com/viewsonvue Picks Ben Hong: Paris, France Ari Clark: After Life Derek Chris Fritz: Nanette TIS100

60 MINAUG 20
Comments
VoV 075: Terrific Talk Tips