Really good explanation! For those who want to use plain functions, you can do it this way const builder = () => { let output = "" const methods = { add: (str: string) => { output += `${str} ` return methods }, get: () => output, } return methods } const test = builder().add("hello").add("world").add("!").get()

@WebDevCody

11 ай бұрын

Good old closure

@armandsalle8447

11 ай бұрын

​@@WebDevCody And if you want to have the control on what you import from you builder if it's a package to use only methods you will need, you can do it that way. Modular Forms and Valibot do this. const builder = () => { let output = "" const methods = { set(str: string) { output = str }, getOutput() { return output }, } return methods } type Builder = ReturnType const add = (builder: Builder, str: string) => { return builder.set(builder.getOutput().concat(str + " ")) } const get = (builder: Builder) => { return builder.getOutput() } const myBuilder = builder() add(myBuilder, "hello") add(myBuilder, "world") add(myBuilder, "!") const text = get(myBuilder)

@BakriHmouda

11 ай бұрын

The class keyword in JS is actually just syntactic sugar and under the hood do stuff similar to your example.

The Builder Design Pattern... Super cool and useful 🔥

to be completely honest I have brushed over classes and constructors and OOP in js, thanks for this demonstration

Hey Cody, it indeed just feels nice to use chaining config like that :) You can use html tag to render preformatted text. Like if you need to render a space character or newlines. Very useful for localization!

A video or a series on a bunch of design patterns would be a awesome. It’s been a while since I’ve studied them, seeing them again in context would be neat

here for multiple vids on design patterns too!

My feed is full of Design patterns this week. KZread's algorithm is finally getting better. Definitely more of those.

I would love to learn more patterns like this, its so interesting to see.

I would love to see you talking about different design patterns cody ♥

@FrontendSquad

11 ай бұрын

*Sure* _!_

Hey Cody, you'd like to try out Remix v2 pre-release? They just announced it on 29th August

Good job babe!!!! Also 150k?!?!? Gahhhhj congrats love

@WebDevCody

11 ай бұрын

Thanks babe! 😘

Hi Cody, thank you for changing my life with this video. Jared Palmer said this about method chaining topic: please.stop.using.builder.patterns.for.your.javascript.sdk() bundlers.cannot.treeshake.them(). I guess this is only an issue on larger codebases / libraries.

@WebDevCody

11 ай бұрын

Just doing my job. Yeah, I guess saving 1kb of code is worth completely changing your api interface 🙄

Ah yes when I first learn the joy of method chaining. though sometimes it can be dangerous

can you do this in javascript?

Could you please create a video explaining genetics? It's a complex topic, especially for beginners learning this language, and your expertise would make it incredibly understandable and engaging for your audience

@snivels

11 ай бұрын

I'm afraid Cody will need to go get a biology degree before he can do that

@WebDevCody

11 ай бұрын

Genetics lol?? Nah man, I’m not bill nye the science guy

@atemrandyasong5710

11 ай бұрын

We all know he's talking about Generics and we're just playing with him right? 😂😂

@alasassi5889

11 ай бұрын

@@WebDevCody i meant generics in ts 🥲maybe i miss spell it to genetics because you remind me of Richard Dawkins both in your speaking style and appearance

We actually use this in automation testinf for chaining the interaction in a web page, it is good but be carefull about using it for everything, there are some issues now and then. sometimes is ok not to use the builder pattern, seems some people learn how to use a hammer and see everything as a nail.

Do you think learning all of gof pattern are still useful?

@WebDevCody

11 ай бұрын

I think at least learning them once through can help expand your knowledge. You might not necessary need many of them, but they help you see different ways to structure your code

You could have used 'whitespace-pre-line' class from tailwind. Example - {value} // Don't format the line

@buza_me

11 ай бұрын

Nice one

@kamikazeslammer

11 ай бұрын

Came to post this solution.

Fluent API is even better!

What about just pipe()?

@demian.succs0

11 ай бұрын

Wym with pipe()? I know what the pipe concept means but like observers or what?

This is neat

Zod is one example

nice

Did i just get flexed on oh noooooooooo,

"Obviously this example is not going to help you succeed in life" 😂

zod does this pattern

This is the most useless builder pattern video I've seen.

@buza_me

11 ай бұрын

Aren't all the pattern videos are like "Here we have a Car class, so we need to use dependency injection to add our Wheel class in order to make or engine() method work properly"? xD I think his explanation of the pattern is good enough for people who maybe were curious how libs like Yup do this, idk.

@zeehart

11 ай бұрын

Yeah good enough for try-hard developers trying to be smart on KZread making them feel great putting "content". It's not practical. There are much more better ways of teaching this pattern.

@WebDevCody

11 ай бұрын

😂 I never said it would change your life.

@zeehart

11 ай бұрын

@@WebDevCody It wouldn't hurt to at least make it useful and practical.

@buza_me

11 ай бұрын

I imagine if he made his implementation of Promise in this video it would be more impressive. In the end the conclusion would still be: Return "this" at the end of a method to enable method chaining. I respect your opinion. But it is better in general if you don't use very hostile phrases and if you explain what you dislike or what irritates you.