Skip to main content

← All videos

Data modelling best practises for visual builders

January 30, 20257:04
ContentstackComposable architectureCMSContent opsCloud & infraFrontend

In this video, @timbenniks shows how to data model for visual experiences in Contentstack. Design data and domain data are meant to be used in a different way. In this video we dive into the differences.

Learn more in our academy: https://contentstack.com/academy Talk to us on Discord: https://community.contentstack.com/ Try Contentstack for free: https://www.contentstack.com/try-for-free

Transcript

this is Tim from content stack and so recently we've been getting a bunch of questions about how data modeling works when you have a hatl CMS that's more of a platform nowadays where you have visual building you have data modeling you have all these other extras like how do you deal with your data modeling where does what live and how do things interact and so let's just dive into it because there's a few basic things that you should know to make yourself more successful in the long run [Music] look at my website this is I think the simplest and nicest way to explain what I'm going to be talking about because I've tried to explain this stuff with like super fancy like buzzwordy terms and nomenclature and that it's really hard to land how what all these you know um abstract things so let's just look at it if you can see here this is my website right and everything is like lovely and visual editing and for example when I open the form here I have a bunch of like design related things I can say well make the text smaller or put it on the right stuff like that right and so then there's some rich text component and then there's a component that lists my videos on and on this one lists my articles there's my some some talks and so there are two different types of content on this page and you really need to start to understand the difference between these two two types of content to know how to data model your site so this one is my hero component this is a movable block right I can just move this down and it kind of just I can change this kind of every week just for like putting a new picture in it or slightly changing the title or changing the links this is quite volatile this is fully my landing page this is the first thing you see I won't be using this next year or even next week I could completely change this all the time but then the other type of content that you see here is this list of videos well the fact that this is a latest videos list with a little bit of text that is again this more design related like this lives on my landing page but these videos themselves these are actually data that I will reuse across my different channels maybe I make an app on my phone maybe I get so famous for my YouTube that I build you know a list of all my videos on a different place on a different website this is my domain data the same goes for my blog posts right these blog posts might live on my website but they will also live on def. two they will leave on medium they might live on the content stack blog right so these are again pieces of writing that I have created that I want to show in different places and reuse across the years or you know and the same things for my my blog like my my conference talks so the fact that I have two of those things here together one is live streams one is talks that is actually a design choice I made but the fact what these talks are that's not a design choice and so the content or data for these talks or these live streams or these articles doesn't contain anything design related right for example this is a good example here so this is my list of Articles which is a design component CU in design I can say you know what feature the first one and make the rest small like these things are design related and only and they they are contained to my component that I have on this page on my landing page but if I just go to one of those articles I can also edit these in here you see this data model has nothing to do with how it looks it's just the data so when we look at these data models you really get different things going on right so I have an article that is very specific and I will use this in like 5 years it's exactly like this I might enrich it a little bit but it lives with me and this also makes sure that if I have this there's no other place where I show this where it has to look differently I'm not going to have have to add this because what you see over time with when systems get bigger and let's say in this article data model I would have said um image has to be bigger so you can check the check box and on the website the image looks bigger but then in 2 years you're building an iPhone app and you realize I don't even use that checkbox let me just remove it and then suddenly the website across the world dies because it doesn't have the checkbox anymore right separate how it looks from your actual data and the fancy terms for that are volatile data which is how it looks and then you have domain data which is what you know that's your core of what you might reuse to the Future and so as you can see I have all these things like talks timelines um videos but then there's the page and the page is really just not that much it's just SEO data basically and a whole bunch of components and these are all about how it looks and these are reusable across different pages and they might point to other things that are more domain driven that you don't change but they themselves make sure it looks a certain way and so if you can separate those two out it becomes very simple to build your site you have your core domain data that that you just reference to things and you have your creative work and so when you separate those things out it's also a lot easier for Content editors to kind of understand where they are allowed to touch stuff and where they are not allowed and yeah this is kind of what I wanted to say and I've been trying to talk about this for quite a long time because you have all these people that say I have this amazing figma design I'm going to grab every component that I have and I'm going to make a data model for all of this stuff and just going to fill out my website but what happens if you then want a list of your videos and then on another page you also want a list of your videos are you going to just reconnect these videos every time or are you going to build one component that points to three videos um and these videos you don't have to touch because they exist already right there's a difference in how this works and so I hope this helps and I know this is kind of still quite abstract um but this really will help you um if you grow your content over the years if you have like we have a lovely customers that do this to the max they would have nine tenants with different brands that that use this approach and it works incredibly well and so feel free to watch all our content on our Academy because we talk about this kind of data modeling related stuff quite a lot and so you can also come to our Discord Link in the description or you can just reach out to me personally and I can show you how this all works anyways happy coding cheers