Introducing spatie/laravel-data

hello everybody and welcome to this stream in this stream i'm going to demo a new package that we released yesterday it's called larval data and yeah i think it's a very nice way to handle data objects in a larval application let me share my screen so you know what is going on now before we start i should say i'm a little bit nervous because i'm doing this on a new mac and i hope that everything is set up right so if there are any mistakes or maybe uh yeah if if there's something wrong with the audio let me let me know and hopefully everything will go well so let's talk a little bit about this data package this isn't going to be a very deep presentation because i didn't have too much time to prepare it but i just want to drive some points home there is some echo here i see in the comments does anybody else hear an echo because otherwise i need to fix that first echo sound all around let me check this is my mic hello everybody [Music] there isn't another mick active welcome echo is anybody else also hearing echo can somebody confirm that that it's a problem let me maybe do this a little bit higher no echo okay i think if there's like uh only an echo for one person yeah maybe sagar maybe try to maybe refresh the page or something it's good for uh for the rest okay okay let's uh let's continue then um okay so this is a package that is born in one of the larger projects that we we made at spacey and in that project we have like a lot of things going on we have a lot of data that's coming coming in there's an api on the project so the data is also coming out and um one of the things that we that we need to do all the time is to write things like form requests api transformers uh also uh typescript definitions because that applications you use inertia we use typescript on the front and we were basically seeing like hey we need to describe this data three times so we must create like a form request with all the fields of uh of an entity uh then the same for uh for the api and then again the same for uh for a typescript definition and my colleague ruben he thought let's uh let's solve this problem so this package wasn't mainly made by me i just did a code review of this this is all excellent work by my colleague reuben and we're actually already using this package in in our big project okay um [Music] let's maybe start off with a demo so you can find the package itself the documentation that's basically the e-docs larval data and i got here a project which is used in our testing course and this is basically like a little small blogging application and it has a little api to fetch all the blog posts and it also has an admin section where you can administer those blog posts so it's a very very simple application probably if your application is of this size i wouldn't recommend using something like larval data in it i think that larval data is really good for for bigger applications but let's let's just try it out so how can you get started with this well you can just yeah first require the package of course i haven't done that here require laravel data and with the package installed you can create data objects so i'm going to create a directory data here but of course you can put it anywhere that you want and i'm going to create a new class called blog post data like that and we are going to let it extend the data class provided by our package now i should check my notes i'm going to put my notes here i already prepared this bit a little bit so what you can do is uh add properties on here i should import this as carbon carbon and now we have created our first data object so if i go to the blog post admin controller and i've got here the methods to create and store a blog post so in normal circumstances i have like a form request here but my data object can take over that role so instead of injecting a request here you can just inject your blog post data here and you get all the attributes of a data object with data all so what happens here is that if blog post data detects like yeah i'm being injected in a controller it will be filled in will with the values of the request and there will be even some validation uh going on i'm going to talk about that in a bit let's check the questions first yeah so my mic is an mb is an mb7 that's correct um and that's it nothing on the content just yet okay let's take a look and see if if that works so i should see a post created here so uh let's go over to the blog let's create a test here i'm going to test i'm going to test and i see a little problem here that i already knew is is going to come up so i'm going to fix that first um in create this should i think i'm going to uh remove this type for now this is something we need to clear a little bit up so i'm going to pass in the full date here and let's do test test let's create it uh oh i already have a test two it seems let's do this three i hope i don't have a test tree okay and this is a problem that's caused by me not having installed note just yet let me solve this real quick so this stream is uh more of a showcase of how i fix problems i think it's probably this thing here okay let's do it again with test 4 create it yeah now it is created and if i go to block you actually see that we have our little test going on there now everything now is required here i think if i try to create something without a title then we have a validation error and yeah in this minimal blocking application we didn't uh display the errors here but if i go to create here and if we see take a look at the errors here then you're going to see the validation error right there like that so you can see the title must be string title field is uh is required and why is that required because it is a required property of this data object if you want to make something optional the way that that you do this is yeah make this optional and then the rule is that it is also optional so let's try try it out so now i can create things without a body aya and you can see that we passed the controller but we have some validation on the on the database site but our validation at the laravel site it actually passed because we made this optional if i do this again and if i create it then we're going to see that uh laravel didn't didn't validate it so that is how you can make things required and optional you can just make it optional but in [Music] the package there are also some validation attributes that you can use to validate your stuff so if you uh want to limit like the size of uh of a boss string here then you can just add an attribute here you should also import that attribute and then you're saying like uh this should always uh be have a maximum of of 15 if you go to 16 characters in linked then the validation will fail we actually have like a lot of attributes here that you can put on them i think we match almost every attribute that is provided by laravel and if i'm not mistaken then there's also a rule attribute and there in you can just pass anything that laravel provides so you can do any validation you want with with putting attributes in front of it okay let's start using this data object for for something else um let's also use it for our api so this block application also has a very simple api so if i go to i think api yeah post one then we already see a post and normally i have like this extension uh installed where json is formatted a little bit nicer but i didn't install it yet on my mac just yet sorry about that but you can see here that we get a uh a post okay let's go to our api controller so and right now we're using um just an api resource here and in this particular api resource we just uh going to defer what is being used in the model but uh i think if you have like a larger application you're going to describe exactly what is being returned for your api here and mostly that description will likely match yeah what you got got for your request so let's start using our blog post data object instead of an api resource now how you do that is instead of using blog post resource you can just to block posts data and i don't know why i don't get all the completion here let's import it first and you can just call collection on that and give it your blog post and then it will do just the same thing so let's go to uh post here oh that went wrong let's do it very explicitly so uh sapphire doesn't think that it's a query and yeah you can see that i still got my answers here if i uh don't want to have a title in there i can just remove it and then the title is also removed there so it's really it's really in sync like that and of course we can do this with um with a detail as well then you do blog post data like that from then you give it a payload which can be an eloquent model and then if i visit the detail here then you can see that we use that definition as well and if i remove something like this now you can see it's being removed there as well so now we're using this blog post data both for validation and for returning stuff via our our api um let's maybe do a third thing um and that is the typescript handling so i've said that in our project our client site is being rendered using inertia and on the client side we use typescript because we really want to be type safe and we want a good way to communicate to the front end like this is what's available here's a good question what about if you want to show values on an api only i think the right way to do that now would be to use i think a transformer i don't think there's now a way to just filter out these things i don't know if my colleague reuben is here on the comments otherwise he can make a comment on that let's continue with the typescript thing so [Music] if i go back to our documentation site and take a look at which packages that we have then you see that we also have a typescript transform here and this can just convert yeah about any structure to a typescript definition and this package is also made by my colleague ruben and he made sure that those packages work well together so let's let's let's try that as well so there's a larvale specific version of the package which we are going to do here composer require larval typescript transformer let's do that let's also publish its config file because we need to add the transformer of the data package to the config of the transformer package so it's aware of data objects so let's publish this and we should get a typescript transformer here yeah um here you can configure that typescript transformer package i'm not going to go through it all but the most important thing is here the transformers and these are classes that are aware how things can be transformed to a typescript representation and there's one transformer that ships with the data package and that is the data typescript transformer that's it cool so this is now registered and i forgot the command to transform the the classes to typescript so um i think it's something typescript transform yeah it's right but it transformed zero types to typescript because yeah it it doesn't know what it should transform and how you can hint uh transformable things is also with a php8 attribute and the one that we want is typescript and you can see that this is also an attribute that is provided by our typescript transformer package so if i transform this now then we've made our transformation and i think the definitions are in resources types that's where they are saved by default but you can configure to put this anywhere you want and here you can see the typescript definition of the same object so now we use one definition in three places and again if i uh make a modification here uh then uh the generated file will also be different so i don't have a description anymore uh the validation is gone and the thing in the api is gone and this is for things that must be kept in sync it's uh much more maintainable than having to maintain three three different uh classes so um yeah attributes i know prince you love them you would want to use them for routes as uh as well i know jokes aside i also think that uh attributes are pretty are pretty good uh thing and this is like the perfect use case for them [Music] now i know why it's not supported below php eight yeah types attributes are php8 only and above um and my colleague huben is here as well so if you don't want to have something there you can use lazy for api only things i don't have that example in my fingers maybe next time when i package when i demo a package from somebody else that other person can also join into to show that yeah those are all the questions i think so yeah i think that uh huben did uh a very uh good job on uh on that data package um let's go to it one uh more time there are a lot of things here that i uh didn't mention yet you can configure about everything uh that uh that you want here there's yeah support for lazy attributes as well you can have data objects inside of of data objects i don't want to go this far in the stream i just want to give you like a basic example of why a package like this can be uh can be useful and yeah that's everything that i wanted to say about it if you want to read a little bit more on it you can go to my blog and my colleague huben also wrote a guest post here with some more information so that's about it it's a little bit of a shorter stream as usual but i hoped that you liked it and i hope you like the idea that laravel data offers take care and i'll see you at the next stream bye-bye thanks for watching you

Channel: Freek Van der Herten

Views: 9,417

Keywords:

Id: TWnhj8WA1HI

Length: 21min 17sec (1277 seconds)

Published: Thu Oct 28 2021