Enjoy the Vue

TBD

Picks of the week:

Resources mentioned:

Support Enjoy the Vue

Picks of the week:

Other resources mentioned:

Support Enjoy the Vue

[00:02:26] Before we get into Scoped Slots, Ari, Tessa, and Ben explain what Slots are first, for those who never used it before

[00:04:45] Tessa and Ari tell us what Scoped Slots are to them. Ben goes into the select drop down menu, uses a library book analogy, and explains the concept of slot props.

[00:10:00] Tessa poses a question to Ben about if the child can show the parents the child’s data, but the parents can’t mutate it or if the child has to specify which parts of its data the parents can access a mutate.

[00:16:56] Tessa asks Ben about how to restyle with a string and Ben tells her what to do.

[00:25:30] Tessa asks Ben if it’s possible or not possible to access the scoped plot data in the script tag. Also, Ben lets us know what kind of components he is in favor of.

[00:28:40] Tessa tells Ben her takeaway on a use case and wants Ben to tell her if it’s right or wrong.

[00:33:32] Ari tells us where she always gets tripped up and it has to do with the difference in mental model.

[00:38:51] Tessa wants to know if $slots and/or its children are not reactive and does it have to be observed in some kind of deep way? Also, what kind of caveat do we have to be aware of when we’re working with slots in the JavaScript part of the single file component?

[00:42:06] Tessa gives us an update on an old GitHub issue on $slots.

Picks of the week:

Sponsor:

Resources mentioned:

Support Enjoy the Vue

[00:01:15] Sam and Natalia give us a little background of themselves.

[00:03:21] There a lot of different kinds of documentation, so a few of the panelists tell us how they were drawn to write documentation and why it’s so important.

[00:18:03] We will talk about things that the panelists don’t like about documentation. So, we learn some mistakes they’ve made and regretted, and things they used to do that they’ve since learned this is a much better doing it this other way. Some great advice is given here. ☺

[00:28:14] Ari and Tessa tell us some of their pet peeves when it comes to encountering documentation.

[00:32:38] Sam talks about style guides being useful in documentation. Natalia tells us her favorite rules from their internal style guide.

[00:39:35] Ari tells us what of her greatest pet peeves when Chris talks about use cases, and then asks him how you land on the right amount of detail in a use case example.

[00:47:32] Tessa wants to know how to keep docs up to date, how to manage the really simple specific idea, and how to guide people between that liminal space.

[00:52:48] Speaking of automation, Chris tells us something he’s done in a pre-commit hook for project documentation and Natalia and Ben have something to add as well.

[00:56:50 ] Tessa asks what are some good practical tips that she can apply to a document more effectively and be advocate for documentation in a company. Great advice is given here by the panelists. ☺

[01:07:41] Natalia and Sam tell us where you can find them on the internet. Also, if you’re looking for a job as a technical writer, Sam gives a plug for their good friend who has a technical writing consulting business, called Good Words (link below).

Picks of the week:

Sponsor:

Resources mentioned:

Special Guests: Natalia Tepluhina and Sam Brandt.

Support Enjoy the Vue

[00:03:13] Amal tells us her background story and Tessa asks about her interests with debugging and why she is so passionate about it.

[00:07:22] Amal tells us her journey to debugging, how she got better at it, and if she was trying to teach somebody who’s new to debugging where they would start.

[00:11:26] Ari and Ben share debugging stories and Amal shares some advice.

[00:22:29] Tessa tells us experiences she’s had with Vue and getting bugs and it’s been a common experience across Vue, Angular, Angular JS, and React, so she wants to know when you get into this kind of situation what would you do there?

[00:26:48] Amal talks more about the profiling part.

[00:32:30] For all the beginners out there in terms of performance for the front end, Amal shares a tip for starting out.

[00:37:15] Ari asks Amal how do you break that habit in an organization of just assuming that because a bug manifests in the UI that it’s a UI problem?

[00:42:08] In regard to logging, Amal tells us her thoughts on the application monitoring tools, like Sentry.

[00:46:25] Having good Handshakes between the errors is discussed more in depth.

[00:53:48] Amal gives us a quick hit list of when, how, and why you would debug, and best practices for debugging. She mentions console.trace and minds are blown!

[00:00:00] Amal tells us where you can find her on the internet.

Picks of the week:

Resources mentioned:

Special Guest: Amal Hussein.

Support Enjoy the Vue

[00:00:45] Michael talks about his blog and how he got started with Vue, what his motivation was, and what his first blog post was about.

[00:03:21] Reusable components is discussed as well as the biggest pain points that people run into when creating reusable components and what people responded most to.

[00:08:16] Tessa asks Michael how would we know when you would reach for something like this inheritable slot in slot solution, since it his recent newsletters he talks about the idea of 6 levels of reusability and is this a tool that developers can use? He also tells us what the process was like to identify the architecture patterns and how he came up with that.

[00:10:02] Michael tells what it means it means to have a component that is clean versus a reusable component.

[00:14:50] Tessa wants to know how Michael comes up with his ideas and she refers to talk he did at VueConf Toronto 2019.

[00:16:38] Chris asks Michael what patterns he’s used in the past that he most regrets. He also tells us why middleware was such a headache after he implemented it.

[00:19:53] Michael tells us the component he’s been responsible for that he’s regretted the most. He mentions a blog post he wrote about this. He also mentions the gold plating syndrome.

[00:27:19] Tessa asks Michael if she was a developer coming into a project and thinking I want to build a library, how do I decide what works for me or how do I find a balance there?

[00:33:19] Chris gives us a really useful tip when he refactors components.

[00:42:24] Tessa wants to know when Michael’s blog post will come out about when to use provide and inject and how it’s different from dependency injection.

[00:46:02] We wrap up here by finding out where you can find Michael on the internet.

Picks of the week:

Resources mentioned:

Special Guest: Michael Thiessen.

Support Enjoy the Vue

[00:00:50] Ben tells us what VuePress is.

[00:01:43] Chris wants to know when he would use VuePress and if there’s some kind of enterprise boilerplate where someone could see an example of an integration with VuePress into a project.

[00:04:20] Chris wants to know how Vue Press started and what are its origins?

[00:06:17] Chris and Ben tell us what Hexo is.

[00:07:36] Ben tells us what the future of VuePress holds and where is it going.

[00:10:07] Tessa wonders how does flat structure work with scaffolding and the VuePress structure and she wonders how does VitePress come into play with regards to the future of VuePress?

[00:14:59] Tessa wonders if she wants to integrate VuePress into a React project or an Angular project, does she need to worry about having a certain file structure or will she be able to take advantage of that smart feature of Vue Press?

[00:16:13] Going back to the idea of being able to include snippets from the code base in VuePress, Tessa feels like there’s some potential for overlap with them, something like Storybooks. She is wondering how you divide the responsibilities between two tools like that.

[00:20:09] Chris wants to know if there’s anything else in the future of VuePress that Ben is thinking of or someone else is thinking of something that may or may not even make it into VuePress but it’s a twinkle in someone’s eye? ☺

[00:21:41] Chris has two final questions for Ben. Does VuePress use VuePress for its docs and if people want to learn more about VuePress where do they start?

Sponsor:

Picks of the week:

Resources mentioned:

Support Enjoy the Vue

[00:00:50] Ben starts things out by telling us he’s always trying to hack on new technology methods and trying to keep up with new libraries getting released, so he asks Ari and Tessa what would be their first instinct to learn about Vue 3 Teleport? Tessa’s answer is the BEST!

[00:04:31] The topics of comments, context, and conference talks are discussed here.

[00:11:00] Ben asks Ari when she starts getting into the deeper level things, the written piece, what are some things she finds that have been helpful or things that have not worked when she reads blog posts or those kinds of things? Tessa has some things to share as well.

[00:18:40] Ben asks Ari and Tessa when it comes to learning new things, are there things that they have come across, whether it’s writing styles or talks and are there things that get in the way of your learning?

[00:24:00] Tessa brings up something in animation called “Onion skinning” and she explains what it does. Ben talks about writing and how it’s a difficult skill which most people don’t have a lot of training in.

[00:27:57] The panelists all discuss language in writing code and how the intent is to make something less intimidating, but it frustrates people sometimes.

[00:33:01] Tessa tells us a great story here about some advice she got from a product manager she met. Ben also has a great story and advice to share.

[00:38:35] Tessa mentions Linux and included language and how it is hard to figure out how to sign up for it, but there is a website that will help you which is linked below.

[00:39:15] Tessa talks about learning journeys and how everybody’s situation is slightly different. Ari mentions how it’s a very important skill being able to teach a concept as well as to be able to give constructive feedback.

Sponsor:

Picks of the week:

Resources mentioned:

Support Enjoy the Vue

[00:01:11] Ari tells us what nextTick is and Tessa tells us about the differences between local and global versions.

[00:03:43] Ari and Tessa tell us scenarios they’ve run into as far as needing nextTick.

[00:08:26] Ben is curious about “chaining” in nextTick. Tessa explains this and she also mentions her talk she did at VueConf US 2019, where she broke down a bunch of different ways to nest nextTick.

[00:13:06] As far as nextTick goes, Ben wants to know if this is something that Ari and Tessa would recommend people only reach out to when things start to be inconsistent or when should someone use this?

[00:18:55] Ben wants to know if nextTick is used improperly can it cause performance issues or not quite?

[00:23:54] Tessa wonders if Vue3 comes out, if she follows the style where her JS is at the top of her single file component and open it, she will see at the top what props it accepts and also what events that she has decided this component will emit?

[00:26:20] Ari and Tessa give some final tips about nextTick stuff.

Sponsor:

Picks of the week:

Resources mentioned:

Support Enjoy the Vue

[00:01:32] Tessa heard in the Vue world, the pattern that you want to follow is props down events up, but a lot of pieces are a bit vague when it comes to abstractions. Tessa wants to learn more about the specific mechanics behind the approach versus something else like passing callbacks? Chris gives his thoughts on this.

[00:07:53] Chris explains what .native does. He also gives some great recommendations. ☺

[00:10:36] Tessa wants Chris to expand more on what problems he has seen people trying to solve with .native.

[00:13:40] Chris recommends some ways for communicating how a component is intended to be used in a way that’s more in keeping with props down events up versus passing callbacks.

[00:16:43] V-bind attrs is explained as well as $attrs object. And Ben talks about concerns when people are justifying desire to document the callbacks.

[00:19:55] Tessa explains an issue with passing down data you need via props and trying to build some kind of structure around that communication. Also, having several series of several generations of components and how does she get around this issue. Chris clarifies and Ben names it “The Prop Train Pattern.” Ari tells us what she does.

[00:24:55] Chris talks about using Guillaume’s excellent v-tool tip component.

[00:26:03] Tessa goes back to Chris’s example of Font Awesome and wants to confirm if she has some grandparent that has the Font Awesome data, then it’s going through a couple of other component layers to get to the icon component layer, can she just put v-bind attrs on the icon component or does she have to put that on every component in between as well? Chris explains.

[00:30:01] Ben asks Chris to speak a little bit about the caveats when it comes to the reactivity part of refactoring everything to reply and inject.

[00:33:24] Ben talks about one of the drawbacks of provide/inject. Chris shares some good naming tips and patterns that help developers when they’re looking at components.

[00:48:00] Tessa brings up the EventBus and if anyone has any thoughts or experiences with it.

Sponsor:

Picks of the week:

Resources mentioned:

Support Enjoy the Vue