Name: Designing Components for Fun, Profit and Sanity by Yishu See | JSConf.Asia 2019
Uploaded: 2020-03-28T18:45:03.000Z
Duration: 23 min 47 s
Description: Thousands of YouTube videos with English-Chinese subtitles! Now you can learn to understand native speakers, expand your vocabulary, and improve your pronunciation...

So I'm really glad that I'm sharing a stage prove to you need constant e.

Adverbs of frequency

She's gonna speak with, like, 1/2 British, half Singaporean accent, But I'm gonna go all out Singaporean accent.

So if you're from out, how we'll come to sing about Ah, it's the weather.

This is how our website look like it's actually a place where you get to buy and sell the relief from each other, So Ah, listen.

So what people do in Carousel is that they get to buy limited edition goods, usually, and then sometimes they buy a vengeance footage from other people before so that they can wash before their friends boys there.

So, um ah, I realize that that's only one bullet point, which is a bigger yet, so I'm gonna put a 2nd 1 I got myself electrical engineering degree before starting my career software engineer.

So usually when people ask me like, um, can you tell me something about electrical engineering and I'll tell them, Do you know how your keyboard works?

They are not individual, the eye individual weapons.

Yeah, so, um, I'm currently working on the web platform at Carousel.

Um, this is an hour ago that come out about half.

Okay, so this is, um this is Stacy, who is our web team?

Lee, He, uh he wrote down like how this project came about.

Like, if you have seen, like, Tweeter Light, we have a carousel like version, and then we only serve it to our mobile users.

And that's only one goal in this like version, which is to make it as performance as possible.

Okay, so I didn't plan for this, but then, um so to raise ago.

Ah, Alex Lakatos went toe our office for a meet up and then booms.

She tried to, like profile our website and Oh, hey, thank goodness he said it was Ah, good performing website.

Okay, So from, um, we head and buy on this project because of our previous code base was about five year old.

It was showing a lot of science off aging.

And so the decision wasn't the whole all new features and into concentrate.

So every singer engineers who was working away platform stop our normal work to move on to work on this and migration.

This is this is just great news because we got to work on completely a complete new coat base from scratch.

And then we make do may we gotta make design decision.

We And then because we were already working on the old court based me no other features that we have.

So we solve, have more, like a 2020 hindsight toe building this and then we get to try new AP eyes.

So, um, but, um, it's not redo it problems.

So today I'm gonna show about some of the lessons that I've learned and specifically pertaining to components.

When we have always been trying to break, I will court up into pieces.

So we try to break things up on the server.

We try to do it on Java screen with most ach handlebar.

Um, and they would move on to Angela react view today and also wept.

If you don't like, everything is due a component.

Oh, beauty ing patterns off front end from work today.

And depending on, like, the fremont they're using.

Oh, you are not using from Well, um, this schematics, it's a better friend.

So, um, my favorite description of it off.

What the component is is that it has data structure and yes, algorithm.

Date our structure and our algorithm so that I think this is ah, question for what we know.

Like, this is, um, what the information in this component contains, and you also have structure.

So, for wet to us, this is the Dom Ah, an algorithm.

That's sometimes called functions This out things that determine what this component can't do.

So a lot off the discussion about components usually bring up two concepts.

So first concept is that singer responsibly the principle, which is that every single class, every single value, or, in our case, everything component in the program should have responsibility for just a single piece off the program's functionality.

And the second concept, usual talk about is calm possible compostable, which is that the components can be selected and as ember in various combination to satisfy the user requirement.

Okay, so for the stuff, I would try to be s framework agnostic as possible.

If we can do everything we were, I would have done everything we react.

So, um, to this point of view, is gonna come from react.

But then, hopefully it can also apply to different different frameworks.

Also so far show hen over here who uses reac and like yet why do this.

Thank goodness I was I was so afraid that everybody is gonna save you view.

Um, so, uh, I'm sure everybody is familiar with the concept off atomic design.

I think asses industry is time for us to us, one of them to change the name because it's a bit confusing eso using In this concept of atomic design, we restart the smallest element and they are at those and they were used them as a building block us the buche bigger, larger building blocks.

And then this larger beauty boxes then used to make even larger building blocks and then an hour in where there's gotta pitch usually.

And this is, ah, really good concept that we can apply to start building a component library.

So we stopped by sussing out across the different pay tress and what kind of components that we will reuse them over and over again, and then we start by building them.

So, um, if I worked on a component Libby before, usually was that with, But then we will start with select.

Um, so this was this is great, because it's gonna give you the look at a few off site very, very quickly.

Um, sometimes the thing about like, Look at fewer think.

Look like, Oh, this is, um, how your any mission look like, but a long time since actually determined by your four incisors.

Subtitles ListPlay Video

Designing Components for Fun, Profit and Sanity by Yishu See | JSConf.Asia 2019

awkward

accent

concept

realize