Episode 121 / 2021.11.15
Andrew Welch
In this episode, we return Sanity.io and talk to Knut Melvær about how Sanity is re-thinking how a content authoring system should work.
Sanity is at its heart both a place and a methodology to use for storing the structured data that powers websites, mobile applications, services, and more.
We discuss in-depth what it’s like to set Sanity up to give it a whirl if you’ve never used it before.
We go on to talk about some of the major new additions to Sanity such as conditional fields, collaborate editing, GROQ-powered webhooks, and more!
- Knut on Twitter
- Sanity.io
- Sanity Studio
- Sanity Rich Text Editor
- Svalbard Global Seed Vault
- Sanity e-Commerce
- Spin up a Sanity site
- GROQ query language
- Next.js
- Nuxt.js
- Gatsby.js
- Scully for Angular.js
- Elm Pages
- Statiq for DotNet
- Sanity Condition Fields
- StackBit
- Portable Text
- Slate.js
- Sanity Live Preview
- Sanity UI
- GROQ-powered webhooks
- Project Xanadu
Andrew: Welcome to devmo fm a podcast dedicated to the tools techniques and technologies used in modern web development I'm andrew weltch from and ny studio 1 zero seven and today we have on a special guest. We have on canute melvar. From sanity io how you doing kadu I'm doing all right and I understand like I looked up your title. We've had you on here before so we did a podcast back in 2018 when was that I was yeah I'd like december twenty eighteen yeah.
Knut : I'm good. How are you. Um, run. Um, yeah I think it was yeah.
Andrew: And where we talked about sanity and and back then I think you had a different title now your title is so long that I'm just going to read it. But it's really long so you're the assistant to the regional head of developer relations at Sanity io. Okay, yeah, clearly.
Knut : Um, yeah, and I'm I'm very particular about my title. So I'm glad you didn't screw it up. Yeah.
Andrew: Now if this is regional does that mean that you're just overseeing like 1 of the little fjords in Norway like a little kind of place there or what kind of region are we talking about? okay all right? Okay, fair enough. Well we have you on here because we want to talk about sanity that I o we want to give.
Knut : Yeah, pretty much. Yeah, it's It's a small Norwegian Ford You haven't heard about it. Yeah.
Andrew: An overview to people who may or may not have heard of it or used it before but also we want to find out you know it's been going on 3 years we want to find out if anything has changed so canute if you were out skinny dipping I I started over so canute if you were out. At guava berry spring bay on virgin gorda in the British virgin islands and you were skinny dipping with some girls that you just Met. You're having fun. You know you're swimming around in the ocean and everything and then your brother sneaks up and he grabs everyone's clothes and he steals them off the rock and he says I'm only going to give these back to you. If you tell me what sanity that I owe is how would you answer.
Knut : So I think I will roll for christmas ah, and let's see okay, that's a 2 So yeah I guess I'm not getting those clothes back, but it's has something to do with content and software.
Andrew: That's not good.
Andrew: All right? So is it is it a cms. What is it.
Knut : Yeah, yeah, so yeah, is it a cms that that is an interesting question because if you ask if you ask someone at Silent io is it like a head of cms or a cms and we was it now. It's no, it's it's ah it's a platform for structured content that is kind of like our.
Andrew: Yeah.
Knut : Way of framing it and yeah so I guess you can could go into semantics and and so on but we we are actually trying to say something with that. Um, because we made.
Andrew: Isn't a cms a platform for structured content though. Wait a minute. What's going on here.
Andrew: Yeah.
Knut : Have kind of tried to think about things from the ground up and not just recreate kind of like the cms that you know, Ah so we made a real time document store that's hosted. Um, um, put on cdns and all of that's good stuff and we made an asset pipeline and we. Spent a lot of time making a fully real time Collaborative. Ah Management management ah content Management interface. Um, that's open source you can customize it and and so on.
Andrew: M.
Knut : And we also make a bunch of like specifications and tooling and so on around the idea of creating content this data and that's why we call it a platform I guess because it's like a lot of things surrounding and there. Yeah.
Andrew: So let's say I'm let's say I'm used to a traditional cms where you know let's say what I do is I go somewhere and I I downloads a zip archive from somewhere and that that gives me you know, maybe it's in php. Maybe it's in Ruby maybe it's in python you know that gives me. My cms that I'm going to use and then I jump through a lot of hoops to get that up and running in a local dev environment and now I've got my cms and I would then deploy that to some kind of a server somewhere. Maybe it's a vps you know whatever how does the experience differ. That's how I would get started with some of these traditional cmses. How would the experience differ with Sanity. How would I get started in that kind of scenario.
Knut : Yes I like that's kind of like the framing of like bringing it down to the practicals. Ah so I would say ah like there's a bunch of things you don't have to do like everything that has to do with kind of like putting a database somewhere and and locally um even getting a database running. You don't have to do that. It's.
Andrew: And then you get an incompatible version of Myusql and then you got to set this config t tweak the p the ph h p the ph p I and I and etc, etc, etc. And you've spent the entire day just getting the stupid thing up and running and you still haven't even deployed it anywhere. But.
Knut : It's us. Yeah, tell me about it and there's a docker thing and you have the M 1 um Docker doesn't work Kim yeah, but. Yeah, and meanwhile there's the postgres 14 that you have to upgrade to and yeah tell me about it. But but yeah, ah so the whole data store thing. That's just fixed that that's in the cloud.
Andrew: Tell me how the experience with sanity is different. Yeah, right right.
Andrew: So.
Knut : And I guess some some people find that kind of like oh I want to have my own database I want to see the the locks and all the nitty grited things. But if you don't need to do that. It can be as well hosted and available everywhere. Um and done. Ah. More similar thing like the sanitity studio. We call it. That's kind of like your cms that's a cms part of this platform and that is kind of like a bunch of Javascript files that you download with the with the the npm command and then you have kind like this single page application that you can spin up locally. Um, configure and once you are your place with it. We can deploy it to our cloud or netify or verell or wherever post hosting hosts http hml js stuff. It's it's only on web location. So yeah.
Andrew: So just to make sure that I have this clear is what would my first step be though in this process would it be going to sanity io and signing up for an account first. Or yeah I mean you're.
Knut : So it let's let's do it. Yeah am I still in the water by the way.
Knut : So I have my waterproof I have my waterproof keyboard. Ah.
Andrew: Kind of getting a little wrinkly. You know what I mean and it's kind of gonna get a little embarrassing. It's gonna yeah but it's gonna be a little bit embarrassing and awkward as you try and exit the water. You know what I'm saying it.
Knut : No, that that's just a frame of mind like I'm dedicated to the job. Ah, it's good for performance. You don't want to have too much stuff what right? But anyway this is getting racy and.
Andrew: Shrinkage Shrinkage is real though. I mean you just met these girl all right, all right? whatever. Now All right.
Knut : Mpm Install globally sanity cli if you want it? ah or you can push npm in its sanity and that will kind like launch a script in your command line to set up a project download the studio and that's it. Oh you kind of sign up.
Andrew: And that's step 1 I don't need to sign up for an account yet I don't need to do anything.
Knut : Ah, in ah in an account during that process so they ask you to log in to your github or Google Um, and um, then you go.
Andrew: Ok, got it got it So Sanity Studio is going to be I'm trying to make sure I'm framing this right? So Sanity Studio is going to be my local Dev environment and.
Knut : Yeah.
Andrew: The actual data store is what Sanity io is providing for me kind of off in the cloud somewhere. Okay.
Knut : Yeah, you will like this because we we don't call it a data store or it is a there so we call it the content Lake So that's the Lake your skinny dipping in I Guess Ah, it's yeah, that's a great title and you yeah so so.
Andrew: Oh my God we're skinny dipping in the content Lake Oh my goodness.
Knut : Send the Studio. It's just a react application. Um, and you don't know that download' that and that's set up to connect to the hosted database through con like apis um, and and that's it really and we we like to see that as just another. Application connected to your content lake ah you will probably have a website maybe or an app and maybe you have some back office systems you want to sync and augment the content with and so on. so' we try to kind of think ah think about this as just another client that had.
Andrew: So I'm a little confused though if the cms is local and I have to pull it down via Npm does that mean that my content authors are going to have to pull they're going to have to run some npm commands before they can edit any of their content.
Knut : Yeah, yeah.
Knut : Um, yeah.
Knut : Hopefully not. So um, this is like it's it's like when you have ah 1 of those good old cmss you download a php you set it up and then you push it over an ftp or something and then it's it will be available for your.
Andrew: Um I see yep So the same thing I'm running locally I would have that same flow where that could then be hosted is is that something that you are.
Knut : Content people. So it's is kind of the same thing here. You just upload the bundle to somewhere that can serve it on there. You go? yeah.
Andrew: Potentially doing or care to announce today that you're going to have sanity hosting where either there's a 1 Yep.
Knut : From the let go you could write sanity deploy and that would compile and bundle the studio and upload it to the sanity Dot Studio domain and you can choose kind like your own subdomain to to host it and that's it. Yeah.
Andrew: So if so if I want my hosting is just baked in I don't have to do any devops and to do that at all. But if I decide that I want it hosted somewhere else. Maybe the client has requirements. It has to be on their cluster I could then also just take.
Knut : Exactly.
Andrew: This project and deploy it there and they could log in and edit it there and it doesn't matter. Yeah.
Knut : Absolutely and you could make different configurations of the studio and upload them and have them connect to the same content like and so on because again it's it's just a small spa or not that small I guess but it's a spa a single page application.
Andrew: Mm. Interesting.
Andrew: All right? So that tells me about the Cp but now what do I do about the frontend like the actual site that is going to be displayed for visitors when they come in like like how does that work is there anything built into it or do I Just do whatever I want and treat.
Knut : Yeah.
Knut : Yeah, so it's the ladder. So it's all about Apis right? Ah so we have a bunch of ways of getting your content out of the content lake. Ah so there's a query api using your favorite query language Groc with or without the al so grockel or a groc.
Andrew: Sanity as an api. Yeah.
Andrew: Yep.
Andrew: Brocco. Yep.
Knut : Yeah, for yeah, ah, there's a graphql api and we have like an export api and listener Api and so on and so forth. Ah so if your web site can do stuff from an api. You can pretty much use sanity.
Andrew: So you're providing the Cp both for developers and for content authors and you're providing the I know you don't like this term but the data store or the content Lake where all the content lives.
Knut : So yeah.
Andrew: And you're also ah, potentially providing hosting if people want it if they just want to type sanity to deploy up it goes. They can stand suming up real quickly that people can check it out but the front end is a blank canvas that it is do whatever you want here's the Apis to pull in the data. It's up to you to do what you want.
Knut : Yeah.
Knut : Exactly yeah.
Andrew: So right? Yeah, so what are popular front ends that people are then using for this.
Knut : Yeah I bet you have discussed a bunch of these already on this podcast. But ah, the first that comes to mind for many I think it's next next as it's huge in the react world and then you have ah gatsby you have next? ah.
Andrew: Yep yep.
Knut : Ah, scally if you're doing angular. Ah some are using weird stuff like Elm and dot net. Yeah, we have pretty much everything. Yeah.
Andrew: But because this is just an api I could do something really weird like I could I could run Ph P somewhere that would then call your apis to pull it in and then render it in php and spit out the result because it doesn't matter right? It's just an api.
Knut : Yeah. Absolutely yeah, Um, in fact, ah if you if you ask ah the the official City of Las Vegas something on alexa that content comes from sanity so you can even come like connect the voice assistant to it.
Andrew: Button.
Andrew: That's really interesting. So essentially you it sounds like you started with the um, the lake. Okay so you you you got the the content Lake Yeah, all right.
Knut : You will say that in an ironic way. Ah at the end of this podcast.
Andrew: So you started with um I'm going to call it a data store you you basically started with a place to store everything and you think of it as analogous to postgres running in the cloud but it's a lot more advanced than that you know I'm sure go ahead. Okay.
Knut : Sure yeah.
Knut : It's It's basically a bunch of Json documents that you can query and that can reference to each other for interesting things. Yeah.
Andrew: Oh interesting, Interesting. So you started with that and you said okay this is Great. We got a place to store stuff but we need some way for developers to interact with it and for people adding the content to interact with it. So then you built the the Cp but now you said okay, but. Whatever you want to do on the front end like that's up to you because it may be a website but it may be something entirely different. It could be anything Yeah mobile Apps. For instance, there's no no reason any of these things couldn't just communicate with the data store. Yeah yeah.
Knut : Exactly. If it if it can do a http request. It can fetch some data from from Sandy. Yeah.
Andrew: Now this data store or content lake that you have or is it kind of is it analogous to the svalbard global seed vault that you have up in Norway. It's like this kind of.
Knut : Um.
Andrew: Concrete vault that's in the in the depths of a fjord somewhere in the in a cave in Norway or or where is this thing.
Knut : Yeah I want as home I so want to say yes, ah it's it's it's actually Google or for a moment. It's google it's mostly google the Google google cloud network we're actually working on making it any cloud network that your.
Andrew: And right. Right.
Knut : Corporation might might want to have it in but ah, but yeah, it's It's pretty much the cloud. Yeah.
Andrew: But it makes sense that it could be anything because you've provided an abstraction layer. So if you switched out the infra you know it from other other people's points of view assuming everything went. Well it should just work regardless of where it is yeah.
Knut : Yeah, yeah. Yeah, yeah, that's the value proposition right? You shouldn't have to worry about that stuff that that's for us to worry about.
Andrew: Right now I think 1 of the big reasons why developers use a cms to begin with because there there are plenty of solutions out there laravelle nodes any number of solutions that if you want to build something truly custom. You can do that. But I think 1 of the big reasons. Why.
Knut : Yeah.
Andrew: A lot of for a lot of projects people use a cms or cms-like system is it's very common that you have experts in a particular sphere that may not know a whole lot about computers. But they know their area and so you want it to be easy for them to be able to edit and enter the content and and do all that kind of good stuff. Remember when we originally talked the marketing line for sanity was structured content done right? and now that has morphed to content is data. But what I really want to hear about is what is this content authoring experience like for.
Knut : Yeah.
Andrew: The average user that comes in there to enter data because 1 of the things that I have noticed with a decent number of node-based cmses is that they seem very programmer oriented in that they're really cool for oh sweet the cms can generate my graphql schema for me and my typescript types and all that but sometimes the. Actual content authoring part of it is not quite what you would hand off to the average person. So What is the experience like insanity.
Knut : I Can tell you how many hours we have spent making sure that if you copy paste from Google Docs into our rich text editor that will actually work and that says something about the dedication here. Yeah, we have spent a lot of time making sure that send this studio like it's responsive.
Andrew: Ah, okay.
Andrew: Um.
Knut : But you can kind like put it up on your cell and actually do something right? Ah, we spent a lot of time figuring out how because like when you do structured content. It's kind of in its nature that you'll end up with a lot of fields that's kind of like the deal and that can be a bit is like.
Andrew: Yep, yeah, that's the structure right.
Knut : People who are really into kind of content strategy and kind of content as a discipline like that. But it can be kind of like a bit tedious kind of versus just having all the all of it in a blob. Um, so like doing doing kind like how how should you kind of show.
Andrew: Right.
Knut : Ah, diffs between documented versions because we are saving almost all of your like keystrokes. This is a real-time system right? So we have kind this super ref finegrained history of your document. How do you actually show that in a good way that isn't a git diff because that's horrible. No 1 wants to deal with a git divf right.
Andrew: Mm.
Andrew: Right.
Knut : Ah, so we spent a lot of time actually figuring that out so you can go into the studio and um have custom diffs for what content type it is so if if it's an image that has been changed. You will actually see the image before and after if they've changed the hotspot. There will be an overlay showing how the hotspots changed.
Andrew: Yeah, ah.
Knut : And if you're not satisfied with that way of doing it. You can put in your own diff component. So yeah, no, and if they have it's crappy.
Andrew: So that's something that a lot of cms systems I use they don't even have that they don't even have a revision tracking from or yeah or if they have it as crappy and it's from revision to revision and it may not show.
Knut : Yeah, yeah.
Andrew: Fine grain changes. So that's actually really interesting because I do know I have done some custom work for some clients that they wanted kind of like what you're talking about they had they wanted final editorial approval of any changes that were made to their long-term documents for I can't get into the specifics of why.
Knut : Um, yeah.
Andrew: But they they needed that for very valid reasons so they needed a flow where they could see exactly who changed and what they changed before they would publish this thing live it sounds like you've got that nailed.
Knut : I Think so and this also means that our content Lake that is kind of like a document store or data store that has a full attribution history. So it had a full audit log of the document and that that isn't important for everyone. But for some that's really important and it's nice to have that.
Andrew: Um, oh wow.
Knut : So I can I can go in and say that oh andrew changed the deep the punctuation inside of the rich like inside of the custom object type inside of the rich text last year and I want to revert exactly that change. So it's interesting. How was you can do with that and.
Andrew: So it's like get blame but it's sanity blame you can find out exactly who did it.
Knut : Yeah, or Git Brace I Like to stay positive but ah yeah, it's like exactly that like that and that is also interesting because that that should kind of remove the the huge need for permissions because then you can have like trust baed in you can actually see what people did so.
Andrew: Right? right.
Knut : People can be accountable, but that's another story. Yeah, oh yeah, yeah.
Andrew: But but do you have a permission system but let's say I'm a horribly distrustful person and I hear what you're saying but I don't I don't trust people is there a permission system baked in though. Okay.
Knut : Oh yeah, So what's what's what what? I like with this product that I'm kind of like working for is that we try to think deeply about things So when we make a permission system. Ah we want to be like that to be. Flexible. You wanted you to be able to express what you need so you can use this croc ah query language for example to to make expressions for what documents exactly what documents a certain group should have access to so you can say like oh this group should only have access to update.
Andrew: Yep.
Knut : Ah, documents of the type post or product that has a main image defined but doesn't have a a match of ah sales in the title That's a conker. Super random example, but it tells us you something about the granularity you can go for.
Andrew: Yes.
Andrew: It sounds like if it is that granular it sounds like there must be some code in here somewhere to allow you to express that.
Knut : Yeah, so this is this is the opinionated part of sanity I think because in other cmss and so on you're used to going in and drag and drop the content model and fields and setting that up.
Andrew: Right? yeah.
Knut : Can't do that with Sandy you have to go into code. You have to go in and write is fairly simple javascript objects that kind of describe the fields so it it all. It's almost like as simple as json but it's still javascript so you can do interesting programmatic things. Um.
Andrew: M.
Knut : And the reason we did like did it because the content model or the data model that should be in the hands of developers because if you change that you change the api and if you change the api bad things can happen if if someone assumes certain shape of that api and then you can version control your.
Andrew: So.
Andrew: Yeah, that is very true.
Knut : Content model and you can do interesting things with automation and so on. Um, yeah.
Andrew: So I have questions so but 1 of the things I want to note is so for instance, ah Krefcms has a thing called project config which is kind of like the opposite of what you're talking about in that you lay it out manually and then the project config. It sounds like it's almost. It's not Json it's yaml. But it.
Knut : Um, yeah, yeah.
Andrew: Describes the fields and you're saying I know we we have something like that. But it's the other way around you write it in a simple javascript object I would imagine it's you know, key value pairs with the type and any other restrictions or you know decorations that you decide you want to add to it and then that defines your schema.
Knut : Exactly.
Knut : Yeah.
Andrew: You mentioned something about versioning is it possible to version the schema. The way you can with rest where it's like this is v 1 This is v 2 and that type of thing.
Knut : Yeah, this is this is an interesting aspect because since you are making the schemas in the studio you are kind of like just only controlling the forms. So the studio is kind of like um like a content mosque. It kind of like shapes the content coming in from the humans.
Andrew: Sir. Yep.
Knut : Into the content like the content like the that's a collection of Json documents. So it's basically schemaless which is interesting because you can just import any Json document into it. Um, it will be queryable and you don't even have to express it in the studio If you don't want to. So yeah, that's kind of like the gist bit.
Andrew: Um, interesting.
Andrew: Okay, that's pretty cool that is pretty cool I like that but I want to get back to the cms experience a little bit so I understand that we need to if we want to build our various fields. We need to create a file that defines our schema.
Knut : Yeah.
Knut : Sure.
Andrew: And as you mentioned the the reason we got to talking about this was talking about the various permission systems. It sounds like intermingled in that object somehow there can be javascript code that will do things like if this then that or does whatever the heck it wants to and that allows you to write infinitely flexible.
Knut : Um, yeah.
Knut : Yeah.
Andrew: Permissions or a visibility and access and all that kind of stuff right? Yep sure.
Knut : Yeah, recently we launched something we call conditional fields. It's probably the most requested feature we had um and it's interesting how we did it ah because we had a hidden property for the field config and it.
Andrew: Yep, wait, let me guess let me guess don't say it don't say it now it takes a function. Nice.
Knut : It used to take a boolean ah, but now it takes a yeah yes exactly and that function. Ah, the callback function has it has some arguments. It has has a document. So. It has all of the values in the document at the current time. It has the current user and if also have the parent so you can kind of make these pretty elaborate nested content models in objects with Sanity. So. It's nice to just have the parent object that this field is in. Ah, um, yeah, we are also thinking about making that async. So if you wanted to show or hide fields based on something from an api or another document that should also be possible but that's kind of like you have to do some performance considerations here since it's the real time. So.
Andrew: Yeah, and you would need some kind of a suspense or waiting state as it waited to know whether it could be shown or not yeah yeah, but I.
Knut : Yeah, exactly So there's some like again we care about offering experience so we want to like make sure that the Ui makes sense. But ah yeah.
Andrew: I Still want to get back to a little bit more basics about the content authoring. So do you have basic fields right? So what are the major field types that you are have. We're used to dealing with I've got a text field I've got a rich text field I've got an asset field I Assuming you have all of these.
Knut : Yeah.
Knut : I we have I think we have most of them we have ah ah we have some friends over at stackbit I don't know if you have heard about that Stackbit is kind of like ah a visual page builder for the Jamstack so they kind of they they stitched together kind of like you said I I want a hugo frontend with.
Andrew: Okay.
Knut : Sanity as a backend or some unnamed competitors. Ah and they told us that we had to kind of look at the content content modeling opportunities in all the cmss and you have the superset you can express all of the other cms's content models but not the other way around.
Andrew: Yep.
Andrew: M. Right? right.
Knut : And I think that's probably because we have something called the object type and that that is similar to the matrix ah field in incraft and then we have yeah so so it's the object type lets you come like make collections of fields. Ah as kind of.
Andrew: So it's like a repeating.
Andrew: So it's a container. Yeah.
Knut : Container and then we also have the array type which is kind of like the repeated thing and you can kind of like nest them and interchange and so on so you can get pretty wild with this and you can also do the same for blog content the rich text. Ah which is an interesting topic. But ah, you can you can have.
Andrew: No no, we need to get into that because you mentioned earlier you spent an incredible amount of time allowing you to paste in Google Docs and word Docs and everyone as content authors have dealt with this conundrum and developers I should say have dealt with this conundrum that you want to give the content authors what they want.
Knut : Yeah, yeah.
Knut : Yeah.
Andrew: But a lot of times what they think they want is just a rich text field that they can dump everything into but then it ends up being this horrendous soup because it's really hard. There's no structure then to it. You have a little bit different of a take on how a rich text field.
Knut : Um, yeah, yeah, yeah.
Knut : Yeah, so um, an early decision was that we we will. We never want hml in the in in the data in the in the content. Yeah, that sucks hml.
Andrew: Works right? How does that What how is that different insanity.
Andrew: Thank you.
Knut : Super great for browsers. Not so great in databases and through Apis Exactly yeah, exactly and um, so we made a specification called portable text and what that specification does is to express like block.
Andrew: Ah, plus it also ties your content to the output and it may not be html. Output yeah.
Knut : Content which has become a thing I think with notion and gutenberg and all of those things. Um, as like a Json format also in a way that makes it possible for it to be collaborative. Um, so it doesn't try to make sense of all your.
Andrew: Oh yeah.
Knut : Characters positions and so on like some of these specification does it kind of like it's a bit ah simpler. Um, but we have that um and then we have ah kind like you don't want people to write Jason it's horrible.
Andrew: No yes.
Knut : So then we need a user interface right? And that's the portable text editor which is kind of like it's built on something called Slate which is a common rich text editors. That's a hard problem. That's so hard. It's yeah ah yeah, don't get this started. But.
Andrew: Yep I'm familiar. Um, yeah I know I know because I remember back in the day I'm not going to you know.
Knut : Yeah.
Andrew: Talk about back of my day we had to walk you know, uphill in the snow and for miles. But I remember trying to write a word processor a long time ago and man it is actually a really hard problem to solve well that scales. It is not easy. It is not easy. Yeah, oh.
Knut : And yeah.
Knut : Yeah, it's not easy and making it real time. Not easy easier. Yeah yeah, yeah, imagine imagine wanting to open a document.
Andrew: Hold on you said real time and collaboration are you telling me that 2 people can be editing the same rich text field at the same time and there'll be some kind of an indication.
Knut : But someone else is working in and being able to just open it and work alongside them like Google logs yeah, exactly you you have that in all of sanity. Yeah.
Andrew: Like Google Doc will kind of show you someone else is there. That's really cool. That's really cool and it's It's nice that these are the basic building blocks because then any other field types or whatever that you build. They're going to.
Knut : Yeah, yeah, and just mentioning quicklyckly. You can also make your own custom inputs and we also provide you with kind of like components and apis that like takes the hard parts out so you can like get presence all of that stuff and diffing and so on without having to write a bunch of code for it.
Andrew: Have the same kind of functionality available to them I would imagine. Yeah.
Knut : So so yeah, but ah yeah.
Andrew: Now that leads to my next question something I've been wondering about this. All sounds amazing. But I'm a little okay, not only does it sound amazing. It is amazing. But what if I'm only passingly familiar with.
Knut : It is amazing.
Andrew: Yeah, like I'm okay at Javascript maybe I don't know react and some of these fancy front end frameworks am I actually going to be able to set up sanity and do anything meaningful with it.
Knut : Um, yeah.
Knut : Yes, yes, so you you don't ever have to touch any react code to be productive you you you get a pretty long way with Ka like the built in stuff. So if you're able.
Andrew: Okay. Just like if you're using a traditional cms you can get pretty far without rip ever writing your own Ph P Probably you know? Yeah okay I get it I get it? yes.
Knut : Yeah, yeah I Wonder can you with wordpress I Guess you can. Yeah, yeah yeah, and then it breaks.
Andrew: You You can for a lot of these things you know you just you install a bunch of plugins and you do this set and the other thing and you can get pretty far without doing any custom php. But you're right that wordpress is probably the worst case for that. But I just wanted to to make it clear where I just wanted to understand how much.
Knut : Yeah, sure.
Andrew: Skill am I going to need at Javascript to be able to do something with this.
Knut : It's It's basically if if you can if you can write a javascript object and if you can tag along with ah you don't strictly have to you can like do import and export of kind of javascript object between files. But.
Andrew: And.
Knut : It's it's it's useful to to be able to do that if you can do those things you can get started. Yeah.
Andrew: Okay, and writing a javascript object basically amounts to squiggly bracket key value and squiggly bracket like that's a javascript object right? yeah.
Knut : Exactly? Yeah yeah, and um, the not to trivi I said kind like it's It's useful to know a bit more of course, but ah, but ah, that is the amount of knowledge and it's it's kind of like that is kind of like the excuse me ethos of of this product right.
Andrew: And.
Knut : It should. You should be able to bring your front end skills and do all of this fancy backend stuff right? and keep within the same language which is probably likely to be javascript for a lot of people at least. So yeah.
Andrew: Right.
Andrew: Right? But there's no templating language that comes with this right I have to pick my own but but there you know there are existing. So for instance, let's say yeah, right? So let's say I know twig for instance.
Knut : Um, Nope yeah you get you get to pick your own. Yeah.
Andrew: There are twig javascript packages out there that you can start writing twig code in in ah in Javascript in yeah yeah.
Knut : Um, yeah I think we even have some silas twigs package going and you can hear in my voice I don't use it. But.
Andrew: Yeah, yeah.
Knut : Yeah, there's there's Ph P stuff and so on helpers and that's the case and so on. Yeah.
Andrew: Well, it sounds really cool. What ah 1 other feature that a lot of content authors seem to absolutely love is being able to preview their content being able to say this is what it's going to look like so they'll especially with the front end being so divorced from the backend.
Knut : Um, yeah, that's the big 1
Knut : Yeah.
Andrew: May be entering something but I have no idea how it really looks or is there is there a way insanity to preview the stuff while you're working on it.
Knut : There is it I think like the the whole preview thing is a super interesting topic because it seems to be kind of like the holy Grail of Faadless Css nowadays like a lot of people spending a lot of time kind of like figuring out how to make that happen.
Andrew: So. Right? Well gatsby built a whole service around it. They've got gatsby preview. Yeah yeah.
Knut : Um, yeah, yeah, um, and until they can like made it a bit Simpler. We had ah the best in in town when it comes to the previous experience. But anyways, so um. This is the tradeoff I think when you don't control both the presentation layer and kind like the backend as you do with something like pro and so on you have to figure out the preview mechanisms yourself. Um, and there's different approaches. Ah some of the most popular ah Javascript frameworks tend start to have kind of like.
Andrew: Right.
Andrew: Right.
Knut : Stuff that helps you along. Ah for next we made a next toolkit which does something interesting it. It basically imports the whole content lake into the browser cache which which it works if you have ten thousand documents it starts to break.
Andrew: Oh my God Okay sure right.
Knut : But we have to figure that out but it it kind of it makes a representation of your content like in the browser and then it can just switch out and rehydrate the the next react frontend So you can kind kind of get a true real time preview and when I say real time I mean real time not kind of like the pretend real time that a lot of vendors.
Andrew: Right? right.
Andrew: Where it reloads the page and etc. Yeah.
Knut : Yeah, what 5 seconds real Time. It's kind of like almost to the teas tea work. Um, and then we have affordances in the studio to to We have a system called Pains. So Basically you have document list that goes on ah horizontally and then you have the form and you can spit the form up. As much as you want and you can have different views so you can have like different previews alongside your form. It's it's similar to the live preview thing in craft just more flexible of course. Um, So then you can have the bad preview for example and you can make ah.
Andrew: Sure yep.
Knut : Custom Seo serp preview if you want that kind of preview you can make ah so accessibility preview. Whatever that is like anything. So yeah.
Andrew: Right.
Andrew: So you can sort of bake your own preview into it even though it might not be exactly what they're going to be seeing. It'll be close enough that it's good for content authors or.
Knut : Yeah, ah or like with something like gatsby or next you can actually just irame the preview site and get the actual thing right? But ah yeah, yeah.
Andrew: Right? Yeah, yeah because I was going to say a lot of these services gatsby is not alone. They're vercell netlify and a bunch of other places have preview functionality baked in and I would imagine you integrate with those.
Knut : Exactly yeah, it's it's basically basically just putting out I frame alongside the form. That's that's what Kroft does. So yeah and.
Andrew: Yeah, yeah, that's what that's what? well it's the same see what I did there. It's the same thing to do because you really it is a separate document and you really do want that then isolated in a separate iframe you really? That's really how you would want it to be done.
Knut : Um, yeah. The the nice thing with next though is that you don't need any servers. It happens in the client. So it's It's kind of like super so it it only looks are you authenticated. Okay then I kick into preview mode if you want to then you are in preview mode. Super neat.
Andrew: Um, right.
Andrew: That is really neat I like that because that in addition to a nice logical layout and honestly I think 1 of the best things you can do for content authors is present to them in context only what they need and that's why the conditional fields are so important because.
Knut : Yeah.
Andrew: If they pick a particular block or something I should only see the fields that are relevant to that block and that they should be entering if they see all of the fields then they they get lost. They're not really sure what should be entered and what shouldn't and that kind of thing.
Knut : Yeah.
Knut : Yeah, and and another thing with preview I think like like the industry the industry is so page like oriented but think like a modern website like your content is spread out all over a place like preview cards kind of inside of the endus experience and so on.
Andrew: Yeah, yep, yeah.
Knut : So what's nice about kind like the pattern where you can like have a data layer data like in-memory data layer that just rent like hydrates ah to the frontend is that you can have previews across the whole site doesn't need to be the artal page or whatever you cant like ah that's.
Andrew: Right.
Knut : See how this title works on the file lost blog post widget thing right? that actual preview right.
Andrew: Right? And in the real world. Yeah, and in the real world. We don't always get to start with a clean slate. So maybe we're working with a client that has an existing website existing Infra and for whatever reason that can't change. We can't start with a clean slate. But maybe there's this cool react.
Knut : Um, yeah.
Andrew: Widget that we want to add to the page just that could be powered by sanity in terms of the api and we could have a preview of just that widget in the Cp right.
Knut : Yeah, yeah, and it's interesting when we when we so so the sanity is now used by pretty huge corporations like yeah unilever just launched like 26 websites
Andrew: Irish Spring Irish Spring Soap right? That's them.
Knut : Using Sanity. Ah yeah, um, and the interesting thing is that? Ah ah, what a lot of these does is to start small. They start in a corner like let's start with the legal legal stuff and then they get a feel for it and then.
Andrew: Yep, right.
Knut : They just kind of like switch out part by part. Um, so it's brilliant string. Yeah.
Andrew: And then when they develop their own mobile app. The api is there. The data is there they can pull it into their mobile app and use it I can definitely see how that would be a pretty compelling thing to do.
Knut : Yeah, and and this is also like this this seems to be kind of like a trend now in the helasema space where they try to be more like make page builders and be more visual and so on and I think that is they're kind of going back.
Andrew: Ok.
Knut : Where we're trying to get from and big because you end up baking in presentation concerns into the content model like as we talked about with Hml Ah, and then next time you want to redesign your site or whatever or add that app then it gets hard.
Andrew: Right? right? yep.
Knut : Um, icky. Ah so we we try to be a bit opinionated about that you you can't totally make kind of like a wix page builder thing with sanity that that you shouldn't and you shouldn't You shouldn't kind of like your editor's time like content now is so valuable.
Andrew: Yep.
Andrew: Yep.
Andrew: Right.
Knut : Why should you spend their time like tweaking if this should be a green or a yellow thing hex code. Whatever like you should have a design system that kind of like just decides that right? and then they can focus on content. Yeah.
Andrew: Ah, ah, can youe you I'm I'm resisting the urgerds to go off on a rant I'm just gonna keep it like super sweet I I see this all the time in a variety of cms systems where.
Knut : And I did. Yeah.
Andrew: People try to recreate like a little mini wis in the background where they they get to choose you know and I agree with you like really what should be happening and I realize this can't happen for every project because there are budgetary concerns, etc, etc. But really yeah, there should be a design system.
Knut : Um, yeah.
Knut : Sure.
Andrew: And if they're given things to choose from. They should be macro things that have gone through a whole design loop where developers designers product marketing have all decided. You know what is going to be available. You know I agree man I see the and the thing is sometimes clients request this.
Knut : Yeah.
Knut : I know.
Andrew: You know they're they, they're saying we really want to be able to tweak this exactly and it's hard to just tell them Well honestly what you should be doing is changing your process because you can still have all of that control but it should be part of a design loop is really what should be happening as opposed to just.
Knut : Um, yeah.
Knut : Um, yeah.
Andrew: You know betty sue gets to go in and to make this headline green seventy 2 pixels. You know what? I mean.
Knut : I'm I'm super empathetic to the our client wants thing. But I also think ah as web professionals. It's kind of like our duty to to ah to ah promote best practices and save our clients money and time.
Andrew: Right? right? I Also think that if they're hiring you if they're hiring you as a as a professional who presumably knows something about information architecture and design and that kind of thing.
Knut : And kind of like dont lead lead them astray doing stuff. They shouldn't be doing. Yeah.
Andrew: If you're just taking all of that and you're giving them a bunch of controls you're punting a part of your job. You know you're just saying I don't know how to design this you know, do you just go do whatever you want to? do you know? yeah.
Knut : Um, yeah.
Knut : And if if if if that is truly what they want to be doing. You should be ah, probably recommending webflow or something that does an actual tool actually built for that actual things but people you actually trying to solve that problem. So yeah.
Andrew: Agreed.
Andrew: And I've I've seen that happen and I actually recommend webflow for a number of projects I mean again, this is the old saw of the right tool for the job right? But I have seen a number of sites that have gone through that where they had some kind of a content builder made for them and.
Knut : Um, yeah, yeah.
Andrew: They didn't adopt the kind of design circle Flow I'm talking about they wanted to go in there and directly change stuff and they were constantly frustrated by it so they switched over to a tool that allowed them to do what they thought they wanted to do but in a number of instances that I've seen that this has happened canute. It's ended up being a nightmare.
Knut : Ah, yeah, yeah, it's hard. Yeah, um, shirt. Nice 1
Andrew: In terms of the results I'm just saying all right? Let's get back to Sanity. Let's return to sanity. Okay, let go. Let's let my I apologize for my my tangent there. So the other question I had for you is. And first of all is it called a cp insanity or what do you call the back of the studio you call it? okay okay I apologize for saying cp earlier. It's showing my editorial environment. Okay I'm just going to call it the studio from now on I'm going to try to anyway.
Knut : Yeah time this video? Yeah we we're saying editorial environmental out for some reason? Yeah, yeah, that's.
Andrew: So let's say I'm editing stuff in the studio but I'm doing something like a form builder on the front end and it would be really neat if I was able to take some of the existing widgets or and components that sanity uses in the Cp and throw them on the front end is that a thing that I could do.
Knut : Yeah, yeah, yeah, actually since since last time you spoke we have done a lot of work. Ah and 1 of the the things we have done is to make a whole new component system. Because that's what you do right? So we have something called sany ui Sani I o slash ui so that's a whole component system and we yeah they but almost finished kind of refactoring the whole studio to it and you can use that wherever wherever.
Andrew: M.
Knut : Ah, so if you want to to have kind like an easy going form going then you can use that or anything else. But I guess kind like forms than you. It's It's also a matter of like describing that content model. It gets a bit meta but it's.
Andrew: Right? right? So in Theory I might be able to take your rich text editor and throw it on the front end and I would I would see the collaborative stuff going on there or is it. We not quite there yet.
Knut : Possible.
Knut : Yeah, ah, not quite there but ah, this refactoring is part of the that that thing. Yeah.
Andrew: But the interesting thing to me is that these are react components that assuming you're done refactoring and they're abstracted enough. It doesn't care whether it's rendered in the studio or it's rendered somewhere else. You can just take the thing and you can just stick it where you want it.
Knut : Yeah.
Knut : Exactly yeah.
Andrew: And that's actually another I can sympathize with the refactoring. You must be doing because that is a difficult thing to make I know ah tailwin called them headless components or something like that I hate that name something like we we already have styled components. Why don't we just call them styleless components you know like.
Knut : M.
Knut : Um, yeah, yeah.
Andrew: No styles. But it's got to be a difficult task to be able to write these components in a way that someone can bring their own css and styling and and fit that in right? That's got to be a difficult task.
Knut : Yeah, it is I'm I'm all struckck by our design team and the fourth that went into that like they've they've used algorithms to kind like make sure the baseline are like wrecked and so on they went to design school. Ah and I made like they also made kind of like a figma.
Andrew: Oh wow.
Knut : Library that corresponds directly to the rad components. So if you build something in figma you can expect it to work exactly the same way which is kind of like yeah, it's ah it's It's pretty amazing. Yeah.
Andrew: Mm.
Andrew: Oh Wow So that brings the designers right into the loop.
Andrew: Well you mentioned it so we talked about almost 2 years almost 3 years ago my goodness. So what have you folks been up to in the last 3 years have you done nothing. You just been sitting out there on in your fjoorred out in Norway or have you guys been busy working away.
Knut : Yeah, and flies.
Knut : Absolutely not? Yeah, we have? yeah ah so um, I mentioned a bunch of things that happened to the product. Ah yes on Wednesday that's 2 days ago. We we launched something called groc powered webhooks which is pretty interesting. Can then return to out. Ah we also raise a bunch of money ah in in in the Silicon valley and yeah yeah, might the cool. Yeah yeah, assistance. Yeah, it's it's great, but ah, but yeah.
Andrew: Yeah, and for those of you who can't see canute is actually sitting out. He's in a mansion. Essentially he's sitting there and I see so I see servants walking back and forth behind him bringing him grapes and yeah, yeah.
Knut : When when and and when you raise money it's it is because you want to pay salaries to a lot of people because you want a lot of people to work for you because there's a lot of things to to do when you're trying to become the platform for for content I guess but ah.
Andrew: Right? right? yep.
Andrew: Yeah, good a good way I've heard it described is that money is like throwing gasoline on a fire it accelerates what you're doing you know? yeah.
Knut : Yeah, exactly yeah, so we just actually leased an office in San francisco down on mission street I'm going in remember I think finally um, and yeah, we hired so when I spoke to you I think we were.
Andrew: Oh wow.
Andrew: Um, Wow. Wow.
Knut : Ah, under 20 now we are closer to 60 people. Ah, and yeah and we have done a lot of things to the product. Ah like the whole real-time presence review changes thing santi ui yeah.
Andrew: Yeah, so if you're worse, you're still sitting there skinny dipping in the ocean and your brother is like okay give me 3 things 3 major additions in the last 3 years your top 3 and I'll give you your clothes so you can get out without shame.
Knut : Yeah.
Knut : Top free all right I think open sourcing grock don't think I had done that no 1 has spoke you. That's a big 1 Ah, the whole edition of ah.
Andrew: M.
Knut : Real time collaboration to the studio. There was some of it when we spoke. But now there's a lot of it and I think who this it's this is hard. But I think Sandy ui is going to be super interesting. Well.
Andrew: Oh yeah.
Andrew: And then these are the components that you were talking about? Nice Yeah, no for sure and I can see that having something like that would allow you to stand up a whole lot of really interesting things really quickly. You know.
Knut : Yeah.
Knut : Yeah, we we refactored the whole kind of like project management interface. It was pretty crappy when we spoke um in almost no time that you sent to you I just rebuild the whole thing instead of next actually, but ah, but but yeah that that was kind of like a proof for us that this is.
Andrew: Um.
Andrew: M.
Andrew: Well that is the Grand Irony of software development and it's been the case ever since I can remember is that essentially in software development. You're solving a problem but the irony is in some of these very complicated things that you're building. You actually don't fully understand the problem.
Knut : This is sensible.
Knut : Yeah.
Andrew: Until you have built the thing and that's why it is so common that you will then go back because you'll you'll build the thing and you're not even taking shortcuts. It's not even an Mvp. You're building the thing but you really don't fully understand the problem until you've built it. So then you're like okay we're going to go back now that we know. What the actual problem is now we can go back and rebuild it and that's why there's this endless cycle of of rebuilding stuff.
Knut : Now that I have my clothes back and I kind of kind of speak to you about grog powered web bookss. Yeah, that's kind of like you know what people come on talk shows because they have a movie this Dis kind like that situation right? because you just released that. Yeah, so.
Andrew: Do it, Let's hear it.
Andrew: All right? Do your plug do your plug canute. Yep so webhooks are essentially a way that you can tie a variety of services together so something happens somewhere you ping something else. So it can do something.
Knut : Do you know bad hooks.
Knut : Yeah, yeah, some call them http callbacks So it's basically when something happens in your system. There should be a request going somewhere. Um, so.
Andrew: Um, I've also heard them called ah Rsn's really stupid notifications. You know, just say a way to you know I meaning in a denigrating way. Webbooks are actually awesome because they allow you.
Knut : Um, yeah, or right? that's fair, but ah yeah, they are.
Andrew: There are services that are proliferating the internet now that do a wide variety of things and web hooks are a simple way that you can tie these things all together and instead of writing everything yourself, you just have this nice simple way to interconnect all of them.
Knut : Yeah, exactly and we always had webhooks but those we had were pretty basic. It just gave you a list of the id of the documents that had changed and then you had to go fetch them and all of that stuff. But now we we ah build that from the ground up and.
Andrew: Right.
Andrew: M.
Knut : Now you can use a groc expression to kind like decide exactly when a web hook should fire and you can even use Groc to compare the document before and after the changed happen and you can use scroc to project the data payload that the webbook should have.
Andrew: M.
Andrew: Um, oh interesting, interesting.
Knut : Attached to it and you can also customize the Htp method and add headers and all of that stuff and you have secrets and and so on so forth, but that kind of yeah and that's super interesting because that means ah if you have.
Andrew: So you kind of have groc middleware that will sit in between oh interesting.
Knut : If you're on the Jamstack if you have like a static site on netlify and something changes in your api. Ah, you need to trigger a rebuild right? You need to build your site up again. Now you can say that okay, when a post like when a document of the type.
Andrew: Oh.
Knut : Post or product has changed then you can tell notify to trigger a rebuild if anything else changes like forget about it or you can say if this is ah maybe not the best example again. But since you can compare the document before and after the change you can say if the price of the product.
Andrew: So.
Knut : Decreased then you should go and fire the webbook. Um, and this also lets you can like lose a lot of like the middle steps that you have to do before so you can actually attach a webook directly to slack and you can say like when this happens.
Andrew: Interesting.
Knut : Tell slack that this happened and you can call all 3 d the notification inside of grock as well. So it's kind like a super interesting thing we haven't kind of like fully understood what you can use it for yet. But I look forward to to seeing what people are going to make of it.
Andrew: Interesting. So.
Andrew: So 2 things real quick 1 we we talked about grock without saying exactly what it is which you know some people may be familiar with it already but just real quick. What is grock so people know what this groc web hook layer is.
Knut : Yeah, yeah, what it is yeah. Yeah, so like like people people often compares to a helessims and as I know it's not ah is like people often compare Groc to graphql and and as I know it's It's not exactly with that. Ah, so. But I tend to say that you can think of graphql as a replacement for your like old Trusty Restful Api Pattern Ah Groc is more like Sql. It's kind of like a query language for a data store. So It's much more versatile ah than graphql and it doesn't require awareness of a schema because.
Andrew: Right? yes.
Knut : Graphql is typed right? It's kind like it requires a schema croc can take any Jasonson and query it. So in fact, our Graphvql api are it's powered by rock. It's translated to groc queries under hood. Yeah yeah, yeah, ah.
Andrew: Right.
Andrew: And in end you said you open source this. So if I wanted to grab Groc and add it to my project I could.
Knut : We even open source the parser compiler for rock. So if you want to compile your own parser. You can do that as well. Yeah.
Andrew: Oh Wow So if I wanted to start up a competitor if I wanted to start up Insanity Io I could just grab your grock and I could start building it. Interesting.
Knut : Totally yeah and you can change it in weird ways in incosistent ways. Yeah, but ah, but yeah, totally I Even seen someone that replaced the whole graphql layer of gatsby with croc. So so yeah.
Andrew: Oh my goodness. Ah.
Knut : I Think that's kind of like yeah, ah then you know it's open source I guess.
Andrew: But I'm going to guess that this is very similar to react in that I don't have to know Groc to be able to do anything meaningful with sanity. It's sort of like a when I start to get to a certain level of things then I might start engaging with it is that kind of how it is.
Knut : Yeah, ah so if if you know graphql you can of course use that but I would say it's it's you don't need to but it certainly helps and it's not super like it. It's easy to I don't like the word easy when it comes to.
Andrew: Right.
Knut : Technical stuff and development but it is kind of easy to get going because it has it only consists of 3 parts. You have the star that represents and represents your whole content Lake and then you have some square brackets that is a filter so you can like filter in the documents you want and then we have the. Curly brackets or whatever you call them? Um, which is the projection where you shape the data you want out of the result. Ah, um, we have a bunch of videos on it. You will be up and going with meaningful graph queries within the hour I think that that's a promise if if you.
Andrew: Are you guaranteeing that is that the canute guarantee.
Knut : That's a news guarantee if you're not ah come to our slack community and Dm me and I will give you a personal introduction to Groc will I regret this? no.
Andrew: Yeah, well so you I just want to an articanal that introductions that's great. So you mentioned before about how these groc web filters can help in a situation. For instance, if you're using a Jamstack. But I just want to reiterate that you do not have to adopt I just want to reiterate that you do not have to adopt a jamstack approach to be using sanity right? You could you could use any anything you wanted to pull the data in and render it and you could even be using like um.
Knut : Um, no, not at all. Yeah.
Andrew: Serverless pre-render from vercell where you actually have an app that is is running so you don't have to build a site that is going to regenerate the entire site every time right? yeah.
Knut : No, not at all we back in the days we used to have a next application at Run on an express server that made made the api calls whenever someone requested some some content and built the market.
Andrew: Yeah, right? And first of all when you say back in the day and you talk about next cup come on next is not that old is the we're not talking about you know.
Knut : You know I got hold of the beat of sanity in May Twenty seventeen and the first thing I did was to build a site with that and next js yeah yeah, that's that's 50 years in start of time.
Andrew: Yeah. Um, but that's only 4 years man that's not back in the day come on all right? Yeah, fair enough it is but so I would imagine there are a couple other features I wanted to make sure that we covered because something that is also important to a.
Knut : Sure that.
Andrew: Content author and and workflow situation is not just the diff that you're talking about and being able to see the changes which I think is fantastic but also being able to write drafts of something is that a thing that you have built into sanity.
Knut : Yeah, yeah, there's there's a draft system. Um, it's it's 1 of those decisions that kind of like oh we should have done that.
Andrew: Um.
Knut : Differently maybe because how it basically works is that it makes a copy of your document and prepends the Id with drafts and then we have a whole bunch of logic in the studio to can like reason about it. Um, and it it works fairly well but it could have been better and it makes some interesting problems because. You know what we are working on now I think Kraft already has this So. It's not that impressive but like create references in place right? when you have connected content when you can make reference between documents you kind of want to make be able to make a new document of the document you want to reference.
Andrew: Right? right.
Andrew: Right? yeah.
Knut : Within the same editorial context right? So we are making that and that shows proves to be complex when you have drafts. Yeah.
Andrew: Yeah, that that's project xanadu level stuff I don't know if you've ever heard of that. But if you haven't Google project zanna do that's the that that's not it. Yeah.
Knut : So I've seen some pretty impressive flow charts from from the engineering but they have corrected so they are making the the interface for it now and I think it will be fairly cool. So so yeah.
Andrew: And that now because you're working with large multinationals like Unilever I would assume that localization is a thing.
Knut : Yeah, yeah, um, it is and like localization night internal station that is a hard problem that that is just hard. Um, we have tried to so look at it as kind of like this. It's.
Andrew: Yeah, it is yep.
Knut : It's kind of like a concern of the content model really and there's no 1 way to it. Ah some of customers they can like do ah document most a document level localization thing some of them do a field level.
Andrew: Um.
Andrew: M.
Knut : Localization thing and some of them both and some of them even do kind of like a data set version and they have and we have con like integrations with smartling and Trans fa kind like this translation services and so on and it's.
Andrew: Yep.
Knut : It's not a huge engineering feat to also set up kind like synchronization scripts between things and so on if you want to kind of like float content back and forth and so on. But but yeah.
Andrew: So walk me through it. Maybe this will help So let's say I'm defining my content model insanity. So I'm created I'm doing ah um, a mustache or an antler or curly bracket or whatever you want to call this thing and I'm putting so key value pairs in there that are defining my fields.
Knut : Yeah.
Knut : Yeah.
Andrew: Site is up and running the client loves it. Everything is fantastic and then we did such a good job making this website that they're expanding into new markets and new territories and they say look we need to now have this in german I'm sorry we we need to have this in Norwegian I'm very sorry. That's what we need to have it in.
Knut : Oh yeah, yeah, yeah, oh.
Andrew: How do I What changes would I have to make to this little simple object that I made to then allow it to accept an additional language. How does that work and what does it look like in the Cp or sorry in the studio. Yeah.
Knut : Thank you? Ah yeah, so now we have to kind of do a bit of like Neo in the matrix style imagination of json documents. So you have this kind of like key value thing. Ah you have simple key values now and.
Andrew: Yep.
Knut : If we are going for field translations. You want to ah translate those into ah nested field values under language key. For example, so you have e n and and no this 1 would work. Yeah or an ah.
Andrew: Got it so would become an array of objects where it's before it was resist an object. Okay, yeah, same same.
Knut : Like or a nestset object so it can be Ah yeah, whatever. Yeah you can do both I guess but yeah, so that's not that hard to it's not that hard to collect translate the the form into that shape. But then the then you have the data. And since we can assume that this is fairly kind of like from a to B thing. It's a matter of writing that script that takes the 1 shape and makes it into the other shape and you can run this this migration live on the content Lake and and so On. But ah, but yeah, Or you can just copy the datasets and do their migration and put that into production Once you're ready. So yeah.
Andrew: And I could also probably as a developer it sounds like my job would be to go in there. Edit the content models add the appropriate sub objectts you know english here's this you know spanish this etc etc but it could potentially be someone else's problem to do the content migration.
Knut : Yeah.
Andrew: Maybe or is that still my problem. Ah right.
Knut : It's it's mostly it's probably your problem but hopefully we made it not that hard. It's it's not like you have to oh I have to go into the joint table and think it's it's Jasonson objects. So it's if like migrations are like sucks anyways. But it's it sucks the least 1 It's like.
Andrew: Right.
Andrew: Um, and I don't want to spend too much time on this relatively obscure case and maybe it's not that obscure actually made. Yeah, it depends on where you are but let's let's say there are certain certain fields that I always want them in English but if there is a translation in.
Knut : And this format I would say.
Knut : It's not that it's real. It's a very real case I would say yeah, ah.
Knut : Yeah, yeah, it can be a concern for the query you are doing so can you use kind of like a coalesce thing that that falls back if there's ah like not not a value on the first field and so on ah or you can even do it out in the frontend code like.
Andrew: Ah, specific language I can use that I'm assuming that that is something that is pretty easy to do.
Andrew: Um.
Andrew: Because you kind of want sometimes you want a priority system right? where okay if they have it in Norwegian we're gonna take that and if they don't let's have it fall back on this English. So yeah, that's the folding part take.
Knut : That's up to you better. But yeah, yeah.
Knut : Yeah,, but but but this is what we mean with content is Data. So We we try to bring like database affordances to your content so you don't have to do like make all of this kind like Casta Magic sims stuff. That you often have oh we have to have another new method to reason about language. Ah so yeah, and then you can use Common Patterns Common ah data Manipulation Patterns and Algorithms instead.
Andrew: Alright.
Andrew: All right? So let's say I've heard all this I'm excited I Want to try it out. Is there a way that I can just try sanity out via a web interface or do I What? what steps do I need to do if I'm like all right This sounds cool but I want to see it for myself where do I go and what do I do.
Knut : Yeah, there are 2 ways to do it per now. Um, 1 way is to go to sanity I o slash create. And there you have a point click thing where you can choose a template on frontend thing and like ah like a ecommerce or event site or something um you log into Github you log into versal or netlify and it will kind just set everything up for you put the code in Github. Um, um. You have the studio hosted on you can call get the feel for the editorial experience and you can go and tweak it and the other way that most people use ah is to run the command line. Ah so that is npm in Itsality. Um.
Andrew: M.
Knut : That will walk you through on like ah like a wizard and you can choose a sample project or just a clean slate and get going.
Andrew: I know a lot of Javascript developers if they hear this they're going to cringe but I have a sanity setup that runs inside of a docker container. So when I spin it up it spins it up exactly the way they want it inside of the docker container and and does it that way not not saying I recommend it but that's just.
Knut : Um, yeah, yeah, yeah, yeah, yeah, it should work. Yeah yeah I can respect that.
Andrew: That's just my thing that's just how I like doing stuff. well well canute it was fantastic. Having you on here I really appreciate you coming on and talking to us about sanity and our little return to sanity. You're out man you're out you answered those top 3 you got your clothes back. Everything's good to go your your dignity.
Knut : Thank you am I still in the water by the way. Oh yeah, yeah I just forgot to put a mom I was too eager right? Thank you.
Andrew: Your dignity is intact.
Andrew: And but that about wraps it up for another episode the demo dot fm podcast if you enjoy the show make sure you to subscribe tell a friend drop us of review on itunes. We really appreciate it for the demo dot fm podcast I'm Andrew Welch and thank you for coming on Cannue melvar.
Knut : Thanks for having me ah you can? Yeah oh I have a sucky Twitter handle k mel there on Twitter go to the show notes. Yeah.
Andrew: Or something that I can't pronounce so pronounce your name for me.
Andrew: Nice, nice.
Andrew: All right? That was great I was was trying to do as I was trying to kind of like paint a picture for someone who's first starting this thing up like what are the steps and what does it look like you know.
Knut : Yeah, yeah I realized um and then I get excited. Yeah I think so yeah.
Andrew: Ah, all right? Well, it's good to get excited man. That means you're working at the right place. All right? Let me stop the recording.