Working with Strings
So far, we've worked with String. Let's add a title to our Blog Post:
..., fields: [ { name: 'title', type: 'string', title: 'Title', }, ],}
A big part about how we design our schemas is that we take into consideration on how the Studio will be used. Like, what happens if:
- The editor doesn't give the Blog Post a title?
- The title contains characters we don't want?
- The title is too short?
- The title is too long?
Luckily, we can take all of these problems and solve them, with not that much more code.
Validation
To solve all of these problems, we can use something called Validation.
With validation, we can validate fields and their contents by setting up rules. These rules could block publishing, and even throw alerts for the user to see why the content they filled or didn't wasn't acceptable.
We can set up field and document level validation:
- Field-level validation is specific, looking at the contents of the field when checking the validation rules
- Document-level validation looks at the document as a whole when checking the validation rules
Each schema type has it's own set of custom validation methods, but there are a few that are common to all of them.
Required
To ensure that the title field is filled, we can add the Required Rule to the validation, like so:
...,{ name: 'title', type: 'string', title: 'Title', validation: (Rule) => Rule.required(),},...And immediately, we can see the alerts from Sanity:
Maximum and Minimum Lengths
Now, let's set up our max and min lengths for our title. I'm thinking greater than 10 characters, but no more than 50. We can add that like this:
...,{ name: 'title', type: 'string', title: 'Title', validation: (Rule) => Rule.required().max(50).min(10),},...And you'll see we get some errors from Sanity:
Regex
Regex, or Regular expression is a sequence of characters that specifies a search pattern in text, or in our case, String. In the Regex used in validation, it allows:
- A-Z Range
- a-z Range
- 0-9 Range
- (_) Space Characters
This ensures that our blog posts have titles that are alphanumeric, and include spaces. Feel free to learn more about Regex and use this validation for your own needs.
...,{ name: 'title', type: 'string', title: 'Title', validation: (Rule) => Rule.required() .max(50) .min(10) .regex(/^[A-Za-z0-9 ]*$/),},...Text!
So far, we've seen Strings as our best friend for text-related fields in our schemas - so why do we need Text schema types?
Well, String schema types only focus on one line strings, whereas Text schema types focus on multi-line strings. This makes Text perfect for bios, summaries, etc.
Keep in mind, this is all in plain-text - for non-plain-text, (i.e. bolding, links, etc.), we'll talk about block content soon.
Let's add a description field to our Blog Post schema with this Text schema type, placing it right after our title field:
fields: [ ..., { name: 'description', type: 'text', title: 'Description', rows: 5, validation: (Rule) => Rule.required() .max(100) .min(10) },],As you can see, I've used the same validation rules as before, but removed the regex and increased the maximum length. I also added a row field, which you can use to change the height of the description box. And if we go check out our Studio, we can see the updates:
Well, that's it with the String and Text schema types, along with Validation! You can do a lot more, and I encourage going to the Sanity Reference Documentation to learn more - there are a few links below to get started.