What's new in v4: Rest and GraphQL APIs

another big part as mentioned before of v4 is the new rest and graphql apis both the response format and how we can access different attributes inside strappy so let's look at what that looks like if we go to our content manager at the moment we have a collection type called demo with some entries the content types builder shows up what type of fields we have inside demo we have a text field and a media field so if we go to our settings as usual roles public role and grant ourselves the permission to find find one so that we can make good requests to those endpoints we'll save that data and that role is edited we'll open localhost 1337 api from v4 to v3 the format has changed in v3 having a demos collection type meant we went to our url demos but with v4 we have api prepended to that collection type name and now it's a domain api demos for the rest api and then we get back all the data you notice something really cool at the end of our response we now have a meta tag where we've appended pagination information as well as changed how the data is presented in the response body we have an attribute section which has all the data that we enter when in the list view and content manager great so it's pretty much the same minus a few changes for the rest api let's get into the graphql api strategy v4 still has graphql accessible at localhost 1337 graphql but just like rest we've changed how the response format looks so we'll build out let's get rid of that we'll build out a query to get demos and inside this first we need to access the data entity and then attributes and at this point we can access the id of our data point and then we get into what exactly these attributes are and for our collection type that is name title rather text text and media and then we can make that request perfect error to get our media object has attributes and data as well so let's just clean that up oops that does not want to be cleaned up so we'll do it manually there we go okay and inside attributes then we can access the url of our media item and now our query works perfectly now this is all well and good for standard data a lot of times people in stratfor like to query relations or components or dynamic zones so let's go and create our dynamic zone and see how we can query that in strap ev4 so back into our content manager we go to content types builder and create a new component which we'll call call this seo we'll create a new category called core and then go ahead and add meta text add another field media called meta media we'll name this single finish and then save we go to our collection types build and edit i'll collect our demo collection type by adding a dynamic zone we'll call this body or seo let's call it seo seo body and then we'll add components to this um so we'll call this seo seo and use existing components we'll select all the core components finish and save this and now our content model is edited right we'll go to our content types manager we'll go to our content manager select our demo collection type and add a new entry called test test test we'll add a new component to seo body and select seo body we'll add meta that says testing v4 we want to add media for now and we'll save that and publish it so when we make a request again to demos we get test test test but we don't necessarily get the component data that we wanted from the dynamic zone if we want to do that we need to change our query format by saying question mark populate equals seo if we want to get everything we can just say start and that way we get back now where we don't have any dynamic zones but where we do we get the exact component name and the text and or media that is related to that component dynamic zones haven't necessarily changed in the way we access them in graphql what we need to do is say seo body and then we have the three dashes on component core seo then we can access id or meta text and meta media and make that request oh metamedia of course as usual needs to have data attributes and url and once we make that request we have exactly what we expected and we get it now because we did not add a media item but we do get back the dynamics zone content that we did populate we have documentation for how this works exactly for different types of population field population and if you want a more in-depth look we have that in the description so have a look at that thank you so much and enjoy v4

Channel: Strapi

Views: 1,310

Keywords: Strapi, headless CMS, gatsby, gatsbyjs, react, strapi blog, gatsby blog, headless, content management, node.js, react cms, blog tool

Id: jOSh2nogROg

Length: 7min 28sec (448 seconds)

Published: Sun Dec 05 2021