Domain Models

[00:00:00]
>> Let's get tactical. We have spent a little bit of time talking about some high level concepts. But now we're going to start to see how these concepts apply to code. And so this is the progression that we're going to go through. When I think of application development, I think of it like a spreadsheet that you have your data and you take this data and you put it into a cell and the cell exists in a row.

[00:00:44]
And when you stack those cells up vertically, you have a column. And so, when I think of what am I building, where does it fit, well, I think of am I thinking about the data or the schema? Or am I thinking about the template, the cell, or the entire layer which is a row or stack, which is a column?

[00:01:16]
And so, I want to start with the first demo which is domain models. This is where we're gonna start, rad-domain-models-start, and we are going to work from there. So in the code, in this particular example, what we'll see here is that we have a form, super compelling. And I'm gonna put this in zen mode.

[00:01:53]
And this is what or this is where I want to start, that when we understand a domain entity, even subconsciously, we make all sorts of inferences about the rest of the app, including the form required to manage that entity. So, for instance, if I said, hey, what do you think a form for this album interface would look like?

[00:02:30]
Well, yes, I know it's sitting right over here. So this is pretty obvious, title description to text fields. Now, let's take a user. What do you think a user form would look like? So, again, I have to imagine that we're not having to exercise too much creative thought here.

[00:03:03]
That first name, text field, last name, text field, email, text field, password. It's a text field but it's of type password, in so much that if I made a change to this and I went active, And I said this is of type boolean, immediately I have to imagine that you have mentally said, well, that's gonna be a check box.

[00:03:38]
And so we can look at a domain model or, in this case, an interface. And so I use that word interchangeably, for the most part it is. It's that when I talk about a domain model, I'm talking about something that is in your domain that's been modeled and defined in some way.

[00:03:56]
In most cases, either an interface or, by extension, a schema will do. So, Within this interface, we can look at this and say, I know what this form is gonna look like. And all the interface is telling us is the type or the property that exists, what type that is.

[00:04:18]
But we can extend our ability to describe these properties using a schema. And so I'm borrowing from loosely off of something like JSON schema to where I am using a mechanism to describe what a property is. And so, this is information about this property. So model, modelPlural, and then props.

[00:04:48]
And so I want to describe the properties for whatever the schema is. And now I have an interface here and I'm saying this is just going to be a string. That's going to have really anything on the right side of this, but this is what this looks like.

[00:05:07]
So, here we have props which has a key, a type, and then I have some template options. So album title, placeholder required. And so I'm able to then take the schema and, using a tool like Formly, or there is another one, I think it's called React JSON schema, so there's an equivalent for React, I can take the schema and feed it right into a tool like Formly.

[00:05:44]
And it's going to generate the form for that entity based off of the schema. And so, as a starting point, we realize that when we have a domain definition, that there's a lot of things we can know about it. The most obvious and the most tangible is the form that we use to manage that entity.

[00:06:14]
So what I'm going to do is a challenge to myself, which I welcome everybody to follow along is I'm going to create a user schema and then update this forum to render it. So real quick, I'm gonna come out of zen mode so I have a little bit more spot space and let me move this over.

[00:06:38]
I don't know how that got in there. All right, so I'm out of zen mode, and I've moved the render pane over so that I have all the room I need to fly. So I'm going to create a user schema. So let's go ahead and try this. So const userSchema and we're gonna to type this as Schema.

[00:07:03]
And we have some things that we need to do to satisfy this. So the first thing is model, and so I always do a singular version of this, and then I have modelPlural for the plural version of this. Now the reason why I do this explicitly is because, guess what?

[00:07:25]
English is weird. So for instance, what is the plural of pony? Well, it's not this. So I can't just add an s to the end of it because then it becomes ponys. And so rather than having to rely on some third party library or try to figure this out, I think it's just easier to just type the plural version of it once and for all.

[00:07:52]
And then from here, we need to define our props. So we're gonna go props and we are going to add this in. Now, when I do this, what I'm hoping is you watch me do this. Pay attention to this process. I start an object, I go key, and we're going to go firstName.

[00:08:22]
We'll go type is going to be input, and we're going to go template options. And we're going to give this a label of First Name, not Frist Name, First Name, and a placeholder. Enter a first name, and we are going to set this to required, okay? Now, watch what I do here.

[00:09:03]
I have three more properties to go. And so what's funny about this, what I'm proposing, we kinda do this already without realizing it. I think copy and paste might be probably the most inelegant code generator that exists, but it's still a code generator. So now I'm just gonna go here, lastName.

[00:09:34]
Enter a last name, and I'm being very intentional about this particular ceremony that I am participating in. So, email, We're gonna go email. And let's just go ahead and operate under the assumption that everything that I need, or everything I've defined here, that we need it. So I need an email and I need a password or you cannot log in, sorry.

[00:10:17]
So we'll go here password and enter a password. And I believe if my memory serves me correctly, I think I can go just type here and type in password. Hopefully this works. Now notice, all I've done is taken the interface and I've converted it into a schema. So let me bring this code back here.

[00:10:50]
And I'm actually gonna give this a hard refresh. We'll put this to the side. And now let's go ahead and we're going to replace albumSchema with userSchema. First Name, last name, email, password. And let's go ahead and see if this ended up. Now, what's interesting, and I think what's really cool about this particular example and why I chose it is that notice when I put in my email here that, Notice this interface here, or this object that's generated off the form is pretty much identical to this interface definition over here, this would pass.

[00:11:50]
And so, just as code is strings that, Or characters that we use to essentially expand out to infinity, that that next layer that if code is strings is atoms, then I consider this to be maybe a molecule. That you'll notice here that what is being generated off of this matches the interface.

[00:12:19]
And so, this leads me to one example that I wasn't for sure, or at least a point that I wanted to make, I wasn't for sure where it was going to end up in the workshop, but this is, I think, a good place. When I was a teenager, I had a friend that lived in Missouri and I went and stayed with him and his father.

[00:12:46]
They lived out in the middle of nowhere, little, tiny house, and on the property, they had a double wide trailer, and this is where his father worked out of. And what his father did is that he made molds and, but more importantly is that he made molds for molds.

[00:13:10]
So, if you imagine that we need to make a bunch of molds for a manufacturing plant, this is what he did. And I had the opportunity to sit and watch him build a bunch of these molds. And in a way, he's building these metal molds. But what was really interesting about it is that the molds that he would make looked very, very close to the original artifact with some additional tooling around it so that to accommodate the work flow.

[00:13:51]
And so this is where, when you think about molds, how do you build a mold? Well, you start with the real thing or at least a version of it, and then you make a mold around that, and then what that outputs is essentially almost equivalent to what you use to make the mold.

[00:14:16]
And so, when we think of co-generation and templates specifically, I think of templates as the mold with some additional tooling that you'll start to realize that the thing that I'm generating looks very close to the mold that I'm using to define the generator. And so, just as much is, if we look at and we're like I need to build 1,000 forms, or I have this Christmas ornament and I need to build 1,000 of them, well, what we don't want to do is be like, well, let me get out the whittling knife and let's get started.

[00:15:01]
Absolutely not, this is where plastic injection molding or whatever comes in, is that we are starting with something that looks as close to the original as possible. I think interfaces are pretty good at this. And then we're building some tooling around it so that we can stamp out versions of what we've defined.

[00:15:21]
So I think a lot of times an interface to an actual concrete instance is kind of that transition. When I think of molds and building molds, this is where this comes in.
>> I use Formly extensively at my job, but I hadn't thought about abstracting the fields props to a different model.

[00:15:38]
What would you do if they needed dynamic properties? Wrap the props inside a function that returns the formal lay field config?
>> The person who asked this question, if I had a t shirt gun, and we were at a game, I would shoot you a t shirt. That is the best question ever, is extracting out the props and generating off of that, the question is what would you do if you needed to dynamically generate props?

[00:16:06]
Would you create a function that would then generate the props and then output that, then you would then feed in to Formly? And the answer is yes. That's the point. Things are starting to click. We are programmers. And a lot of times, it's a lot faster to write the code that writes the code instead of doing a one off, I'm just gonna write this here and I'm going to do it.

[00:16:42]
And so that is a great question. And if you needed to dynamically generate props to feed into Formly, this is exactly what you would do. You would write little bit of code to write the real code that you feed in as a schema. So very good question. [LAUGH] This is, essentially, you have arrived at the entire essence of this is that let's use code to solve code problems.