Jamstack & Headless CMS Sites Using Strapi

Captions provided by White Coat Captioning (https://whitecoatcaptioning.com/). Communication Access Realtime Translation (CART) is provided in order to facilitate communication accessibility and may not be a totally verbatim record of the proceedings.

JASON: Hello, everyone. And welcome to another episode of Learn with Jason! Today on the show, we've got Daniel Phiri, Daniel, thank you so much for being here. How are you doing today?

DANIEL: I'm doing okay. First time I've had coffee in a while. I'm very anxious for the show.

JASON: You're raring to go! So, I'm super-excited to have you on. I think this is going to be a lot of fun. We had a chance -- we were on some podcasts, some panels together. I'm excited to learn from you today. For those not familiar with your work, do you want to give us a little bit of a background on yourself?

DANIEL: Yeah, like, back room, you told me I had to do this and I was prepared. But now it's like, ah! You put me on the spot. Gosh. What do I do? I do Dev stuff here and there. I like to build silly, funky things that I share, very rarely do. And I got into developer, I like working with communities. I really enjoy working with developer tools and just like going really into how the software industry works, at least from the developer standpoint. That's really nice. That's a lot of what I do. I do DevRel at Strapi now and still build things here and there. So --

JASON: Nice, nice.

DANIEL: And people tell me not to be too coy about this or so. I do music production, I DJ techno.

JASON: I love that stuff! Nice! I keep telling myself I'm going to get back to making music again. And it just never -- it just never happens. Someday I'll have spare time. Who gets spare time? How does that work? I have seen this joke a few times, adulthood is just repeating the phrase, things are gonna calm down and then you die.

DANIEL: Yeah. It gets better. It's like a mix of it gets better and it is what it is, to be honest. So, I'm just learning that also. Like I'm new to this whole adult thing.

JASON: Cool. So, today, what we're gonna talk about is headless CMSs in general and Strapi in specific. But so, let's start with a little bit of like the high-level, right? So, headless CMSs, I think that a lot of folks who have seen the show are probably at least passingly familiar with the concept of a headless CMS. We have new coming in today, if you are one of the lucky 10,000 learning about a CMS, what's the concept? What's the benefit of using one?

DANIEL: I think I'll go over the concept before I get into the benefits.

JASON: Sure.

DANIEL: Oooo... what are these?

JASON: We're getting booped.

DANIEL: Nice. The whole concept of headless CMS came from evolving tools. We changed the way we build on the frontend. And so, you had to sort of improvise and adapt to the way we collect and store data. Multiple platforms, multiple like, you know, devices and just make sure that that's more like a seamless and better developer experience. And just in general, a better experience. And that's sort of like where the whole idea of headless came up. So, it's like, there's -- I mean, headless means there's a head, right? Or there was a head at some point. So, the frontend is usually what's used in this analogy as the head. And then like headless is like, okay, it's frontend agnostic in short. Meaning don't really rely on a specific frontend to display your content. And that's sort of where headless CMS content management system comes from. In the past, you had a content management system, what you served a specific platform, right? Like I said, we evolved. We got new tools. New toys to play with as developers and we sort of had to make things work.

And that's -- that's what it is. It's like exposing your content management system, your admin backend to a bunch of different frontends via an API. And that's -- JASON: Yeah. The part that I get really excited about it with it is this idea that -- I come from an agency background. Back in the day, I ran an agency, we did a lot of WordPress work. And what I always struggled with was somebody would come in and say, hey, we've got a forum. We've got a store. We've got whatever. And we want to put all of these things together. And I would end up -- like a lot of times you just -- you just suffered through. Like you're trying to shoe horn e-commerce data into WordPress, or you're trying to make a blog work on Magento. Something that the tool wasn't really built to do because the frontend of the site had to be tied to the way the data was stored on the backend of the CMS. And the thing that I got really excited about was, when headless started to catch on, we didn't have to do that anymore. So, I was able to say, oh, you've got a blog on WordPress and you're managing your page content, but then you've got a store in Shopify and you manage your products there? And you've got a forum in, you know, whatever? Cool. Let's use the headless versions. We can build you a custom website and we'll just pull that data in from the platform where it makes sense to keep that data. And you get to use the best-in-class CMS. But I, as a developer, don't have to figure out how to fit together four different bespoke templating languages for four different CMSs. So, that to me was really exciting and it started to make me feel like, okay, we can start to treat the frontend of the web as a product and not an outgrowth of managing backends.

DANIEL: I love the way you said that, you know? The frontend is like a product. Like, yeah. Because that's exactly where it came from. Everything was sort of fixed together. And one managed backend meant a single frontend. That's usually the web, right? But now more platforms are becoming like really important. I was using my smartwatch and headless CMSs can send things there. I have my mobile phone, which is practically an extension of me and I use it more than I use my laptop. There's all that headless enables. And it's a pretty cool thing to have.

And one thing I like about it now, it's growing beyond that. I think this is something that happens with technologies that its initial benefits -- it outgrows its initial benefits and it sort of starts to create its own -- oh, someone is using it for this really weird, obscure thing. But it's also awesome. Oh! This is another really cool thing that it brings to the table. And now we're sort of seeing it being integrated into other systems that existed before and people are sort of asking themselves, hey, okay, we've got rid of like the whole idea of like the monolith CMS, which is what I liked pre-headless. JASON: Right.

DANIEL: We got rid of that, but then we lost some of the efficiency that came with having a system like that. Or the features that sort of got developed because of a system like that. And headless is sort of right now, I wouldn't say playing catch-up, but innovating in its own right and building out new workflows for modern teams. Which is cool.

JASON: Yeah. Absolutely. I think -- I like seeing that, you know, it feels less like there's contention between how you want to manage your content and how you want to build your website. You can make choices and you don't have to, like, accept the downsides of the frontend management of one CMS platform. Because you really like the upsides of the content management part. And, you know, so actually that brings us to what you're doing over at Strapi, right? So, Strapi is I would say kind of a unique -- a unique approach to headless CMSs, or it's one of a kind of a unique class of headless CMSs. And Edward in the chat -- Edward in the chat is working overtime for you today. He says Strapi is the most flexible and extensible open source CMS out there. When you talk about that, okay, so, open source in and of itself is very cool. But when we talk about flexibility and extensibility, what is it that Strapi is doing -- let's start with what is Strapi and then what does flexibility and extensibility mean?

DANIEL: Yeah. That's a good place to start. As Edward says, Strapi is the most flexible and extensible -- yeah. I'll get his copy. It's open sourced, it's known for customization, extensibility and flexibility. To understand it, you have to go to Strapi's roots. Where did Strapi come from? It has its background in like an API framework, which could be a bit confusing for a lot of people because like now that was sort of evolving as a CMS. People are like, hey, I should be able to do this with Strapi. Okay. We've had to sort of tighten some certain things in certain places. It's still pretty flexible. And I should probably talk about how it's flexible now.

So, there's so many places. I'm trying to figure out the best place to start to be honest. I think, one, the fact that it's open source, means its code is customizable. We see a lot of people doing a lot of really interesting things. Particularly with how we do APIs. And I'm sure once we get to demoing that, it sort of makes sense. You sort of work through content modeling and then that's sort of how you build your endpoints, you build your APIs and then that's what's accessible. And once you do that, you sort of have this code which you can open up in like VSCode and change a bunch of things. You add like hooks, you can tweak what we call these? We call them like controllers and you can build services and change how you interact with your database. And it's built on CoA. It's got a really interesting response flow. At any point you can sort of tweak how data goes into your database or how you client receives a response. And that's super under-rated. I think a lot of people use that. And I think just going a step back and talking about databases. We support a lot of SQL databases. Which is really cool. And being self-hosted means it's also super-flexible where you deploy it. I know that's not everyone's cup of tea. But at the moment, that's something like a lot of people really like about Strapi. And then even when you talk about like how you access your database, sorry, your API, we've got like RESTful APIs and GraphQL APIs and something I like about GraphQL is like, it's... it's not super-hard to get into like customizing your schema and building custom resolvers. It's so fun. Even like building like, you know, your own custom endpoints that are independent of your database schema is just like, it's really cool. And there's like a lot of really cool resources. I see Richard is in the chat. He's saying bootstrap your APIs on the user success team. And, yeah, they've done a really great job with like resources for the community and like making sure that documentation has all holes plugged. So, I don't think I've done it justice. But I don't want to talk too much on that. But it's super, super customizable. JASON: Yeah, no, I mean, I've done a little bit with Strapi. Like, we've got a couple episodes in the archive of doing different projects with Strapi. But what I think is exciting about it, just from the outside looking in, what I find compelling about tools like Strapi, is that they are -- there's no magic box to them. One of the things that strikes me a little bit with certain tools is when you log in, you're through a UI and you start like clicking buttons to make things happen. And then like you don't really know what's going on under the hood. And then if you break something, you're -- you're helpless, right? You just feel struck. What I've found to be really powerful about tools like Strapi, when you're configuring Strapi, you still get that really nice UI experience, but it's configuring code under the hood. You can see what changed. What's the schema? What does my data actually connect with? A few like Strapi, a few others, Sanity does it really well. You get code as the source of truth. As a developer, that's what I want. And I think that for developers out there looking for a really flexible CMS, being able to actually look at here is how your CMS is defined, these are how the fields are defined and how they relate to each other. It helps me reason and feel more confident that I've done something correctly as opposed to just hoping that like I understood the way that this UI was put together and the way that these things are actually talking. So, you know, it's a nice little --

DANIEL: Exactly, yeah.

JASON: Power-up that way. I think we could sit here and talk about it in the abstract all day. But it's probably easier to show people. So, how about we switch over and do a little pair programming? What do you think?

DANIEL: Absolutely. Let's get into it. Let's do it.

JASON: What we'll do first and foremost, a quick shoutout. We've got Amanda here with us today, writing down all the things we're saying, doing the live captioning. Is she is from White Coat Captioning, thank you so much, Amanda, for being here. Made possible through Netlify, Fauna, Hasura and Auth0, making this more accessible to more people. Which means a lot to me, I hope it means a lot to you. Check that out on the home page. While you're on the home page, maybe take a peek at the store because I made a corgi duck. It's a little rubber duck that looks like a corgi. It's a party corgi that you can talk to. It helps listen to your problems and help you rubber duck your code and makes you a better developer. Check that out. I need to sell a lot of them because I have so many. Please get these corgis out of here. While you're looking at things on the Internet, please go and check out Daniel's Twitter. It is private, so, you can apply to follow Daniel on Twitter. And he'll do some filtering later on. We are talking specifically about --

DANIEL: Very rigorous.

JASON: Rigorous screen. Please, with your Twitter follow, submit two forms of ID and references. [ Laughter ] Thank you very much for the sub, I really appreciate that. And, yeah, we're gonna be talking about Strapi today. So, drop the link in the chat for that. With that, I think, we can start writing some code. So, if I want to do that, what's my -- what's my step zero? What should I do first?

DANIEL: Great. I would suggest going to docs and resources. Click docs and resources.

JASON: Docs and resources. Here we are.

DANIEL: Yeah, I wanted to show off our resource center. I think it's really pretty.

JASON: S that really nice. I like it. It's good looking.

DANIEL: Thank you. Yeah. So, there is sort of like a good place to start. And just like look at a bunch of really cool resources, change log and all that stuff. So, I was just going into the developer documentation. That's always where I start my projects. And we have the purple card for that.

JASON: Purple card, here we go.

DANIEL: Yep.

JASON: All right. So, I -- I'm assuming I want to go to the quickstart guide?

DANIEL: Very correct.

JASON: All right.

DANIEL: Quick start guide.

JASON: Should we talk a little bit about what we're actually going to do today? So, we're gonna put together a site. What's our site for? What are we -- what are we talking about today? Is this a -- is this a blog? Is this a marketing site? Chat, weigh in if you've got something that you have been trying to learn that you want to -- that you want to see. Daniel, do you got any ideas of a good use case?

DANIEL: Lots of wild ideas. I don't know if the scope is right, though. I would say a thought -- a sort of app. This is like, you know, the corgi rubber duck just like CRM for thoughts and --

JASON: CRM. Okay. All right. Yeah. Let's build a little -- yeah, a dashboard. We'll build a CRM dashboard for corgi thoughts.

DANIEL: Yeah.

JASON: All right. So, if we're gonna do that, I want -- am I just going straight through on the Gatsby blog? Or do we want a different setup here?

DANIEL: Oh, no. So, at the top you see two tab there is where it says starters or hands-on. Starters give you pre-configured apps with a frontend and a backend for different use cases. We don't want that. So, you want to go hands-on.

JASON: Okay. So, I'm in hands-on. I'm gonna run this quick start.

DANIEL: Exactly that command.

JASON: All right. So, I'm gonna call this one... Strapi-corgi-duck-crm.

DANIEL: Yep. Need to trademark that.

JASON: [Laughs] -- it's created a folder for us. It's installing dependencies now.

DANIEL: Right. To do that for a bit, we are going to use the quick start flag. Usually it would ask us what database we want to use and you have to go in and set up or add the credentials for different databases.

JASON: Okay.

DANIEL: Yeah. So, we can just wait for the dependencies to install.

JASON: So -- what did we choose by using quick start? Is it SQLite?

DANIEL: Yeah. We chose SQLite.

JASON: Great. Okay.

DANIEL: That's a nice, temporary database on our local machine.

JASON: Nice.

DANIEL: There's not much setup to be honest. It's a really nice way to get up and running really quick.

JASON: Yeah. SQLite is great for local Dev. It's a great way to get things just kind of proved out. It's a little -- it's a little trickier if we want to get this thing live. So, we probably won't deploy Strapi today. We can talk about how you would deploy Strapi today I think would be a good thing to cover. Let's see how far we get, right? If we've got plenty of time, maybe we'll just go ahead and deploy it.

DANIEL: Yeah. So, that's actually something we see a lot. Once you get started in SQLite, how do we take this to production? Or if you want to use something like postgres. And we have this really cool workflow where you can work locally with SQLite and then deploy and sort of use the same content models on like a postgres database in like Heroku or Digital Ocean or other platforms.

JASON: Cool.

DANIEL: Let's see how that goes.

JASON: It fired up the Dev server here and this popped open in my other browser so I just moved it over. And so, if I want to put in my information.

DANIEL: Yes.

JASON: All right. And then we'll put in a...

DANIEL: A password.

JASON: A really, really, really secure password. No one's ever gonna get that one.

DANIEL: That one's really long.

JASON: Come on. Okay. Fine. What we're gonna do... what? Oh, boy. We're playing this game, huh?

DANIEL: So, upper case letter and more than eight --

JASON: You hackers! You dirty hackers! Okay. So, I'm in, I'll never remember that password now. So, we're in. And I'm looking at this is what I assume is the, like, the Strapi getting started dashboard experience. I see a few things going on. There's a create your first content. There's some videos. And I'm gonna ignore all of it because you're gonna help me -- today you are my onboarding wizard.

DANIEL: No worries. That's exactly what I'm here for.

JASON: I need to get a hat. I need to send you like the onboarding wizard hat so that when we do this -- [laughing]

DANIEL: That would be epic. We need to do that.

JASON: Okay. So, we are -- I think we're ready to roll here. We've got... what should we do next? We want to get some data in here, right?

DANIEL: Yeah. But first we have to create a content type which is like, you know, a content model is have like a logical representation of the data that we want. So, yeah. Create a collection type. And --

JASON: Okay.

DANIEL: What are we making again? A CRM?

JASON: We are gonna make a corgi duck CRM.

DANIEL: What are we storing in the CRM? I like to have logical thoughts around this.

JASON: So, maybe what we should do -- so, one of the best uses of a corgi duck, right, is to talk through your coding problems. I can grab my little corgi duck and say, hey, corgi duck, my code doesn't work. Let me explain this to you. Maybe we can keep track of developers and the problems they have explained to the corgi duck and whether or not those problems have been resolved. That's two data types. That should be okay, right?

DANIEL: Problems and developers. That is perfect.

JASON: Okay. I'll start by doing developers. And let's -- do I need to do any of the advanced settings?

DANIEL: No. That's fine. But we can look at them if you want to.

JASON: Lets open them up, let's poke. We have a draft/publish system. I can work on something and save it without necessarily taking it live.

DANIEL: Yeah.

JASON: Content type and table name, we don't care about that. Localization. Localization is very cool, we don't have time to do that today. So, we'll leave that off for now. I'm going to continue. This part is nice and intuitive. So, let's think about this a little bit. So, for a title like somebody's name, I am going to say we do want that. We want the developer's name. And short text. It says names right there. Let's save that. Now, I'm not done yet. So, I want to add another field. And let's see... what else do we need in here? I don't know if we need too much more. Maybe we can -- maybe we can just add --

DANIEL: I think we just need a name for now.

JASON: You want to go with just the name? Okay. Let me -- we have just the name. Got developer's name. And we save?

DANIEL: Yes, let's save.

JASON: All right. Uh-oh. What don't you like?

DANIEL: Oh, yeah. See, that's the thing. This happens every time I'm live. I feel like it's a me problem. Just like refresh your browser tab.

JASON: Okay. Refreshing. And it did the -- okay. So, we have our developer's type. Now I'm going to create a new one, and we'll have problems. Okay.

DANIEL: Yeah.

JASON: And so, this one -- let's just -- we'll say you can...

DANIEL: This is -- so, that will give you an error because of the spacing.

JASON: Oh. So, just like problem?

DANIEL: Yeah. So, it's like maybe problem name, I don't know, is that too verbose?

JASON: We could call it problem description. Is that okay? Or no space is allowed for the name of the attribute?

DANIEL: Yeah, no space.

JASON: Problem description.

DANIEL: Yes, problem description.

JASON: Okay. Now I want to add another field because I want to connect these. I want -- each developer should be able to own many problems.

DANIEL: Exactly.

JASON: Maybe in a future version of this, we would have problems cross-mapped if people have the same problem. But I think for this one, let's just say that each -- even if it's a duplicate, developers have can multiple problems, but problems can only have one developer.

DANIEL: Yeah. That's exactly it. I want to create the developer one. Go to the creation type down there and we'll be able to do that really well. Before we do anything, we have the problems field. When we look at problems, what do we want that field to be called? So, I think we can name that developer so that it attributes that to a developer. And then on your right side -- it's right for you also, right? Okay. Yeah. Okay. We have developers. That's right. We have to name this field now.

And -- but we sort of have to define the relationship first. And this follows like usual web mail-type relationships or database relationships. JASON: Got it. So, with this one, there is no cross-reference. Like, it would just be a problem has a developer, but developers don't need to be aware of problems. Here... has and belongs to one. So, they would cross-reference. But each developer could only have one problem and we all know that's a lie.

DANIEL: Yep.

JASON: Problem belongs to many developers, while true, is not what we're looking for today. A developer has many problems. Truer words have never been spoken. We're just gonna go ahead and screenshot that one. Yeah. And so, we could be -- a problem has and belongs to many. Or a problem could be tied to many developers. But I think developer has many problems is both philosophically and practically what we're trying to accomplish today.

DANIEL: Absolutely. I couldn't agree more.

JASON: So, I'm gonna finish that. And then let's save it.

DANIEL: Yep.

JASON: Okay. It's restarting. There it goes. And so, now we've got problem description and a developer. But then if we go to developer, we should see problem as well, right?

DANIEL: Yep.

JASON: Name, problems. Got 99 problems, but my Strapi schema ain't one.

DANIEL: Not at all.

JASON: One of these days I'm gonna make a joke so bad that my guest just quits. [ Laughter ]

DANIEL: I doubt that. I feel like I would give you like a sub just for that. That's what I feel like.

JASON: Okay. So, now we've got -- we've got developers, we've got problems. And so, we can start creating some of these, I think. So, let's -- I'm just going over to the left-hand side. I can see my things now. So, I'm gonna go in and create a developer. And first one's gonna be me. All right. So, and so, I saved this, but it's a draft. So, if I actually wanted this to be live, I need to publish it, right?

DANIEL: Exactly. And you can turn that off in the advanced settings like we saw earlier.

JASON: Okay. Then let's add another one. All right. So, now you and I, both developers, both in the system. Let's start adding problems. So, for my problems...

DANIEL: What problems do you have? This is like developer therapy.

JASON: So, there's one. And then for my developer, I'm gonna choose me. And let's save it. All right. And then I want to create another one for me. And I'm gonna say, I have so many. It's hard to choose. I can't get this silly thing to do the thing. That's a thing that I've said many times. So, let's -- that'll be one of my problems. And then let's add one for you. So, what's -- what's code problem that you want to tell to the duck?

DANIEL: I want to tell the duck that most times my code only works on my machine.

JASON: That's a good one. All right. So, let's save that. Do you have any others? Or do you think this is good enough to start?

DANIEL: I think I have one more. This is like so much to learn. That's like problem.

JASON: Okay. Publish that. All right. So, now we've got two developers, we've got four problems and if I go back into developers and look at one of these, we can see our problems here. Now, this is something that I would love to fix. How -- what if I want that to display a little more like human-readably? This is showing me IDs. Could I choose a different field to show?

DANIEL: You could. I know how to do this, I know how to do this. Go to your collections type builder.

JASON: Content-types builder.

DANIEL: No, I think that's right.

JASON: Oh, I was in the right thing?

DANIEL: You were in the right thing. Either way, it's configure the view.

JASON: Configure the view.

DANIEL: And then there should be -- yes, exactly.

JASON: You know what it is? I use richtext which is gonna break us here.

DANIEL: Oh! You can change that.

JASON: Oh, should we change it? We can. I've barely used any of the setup. So, let's go into content types builder. We'll go into problems. Nope. Not that one. Let's go to problems, here. And then I can just change this to be a...

DANIEL: Can you? I was just gonna create another one and then delete that.

JASON: Oh, that's okay. We don't need to worry about that. We can let that be.

DANIEL: All right.

JASON: Now we've got developers, we've got problems. And I mean, I feel like, oh, and we have one more thing we need to do. And that's whether telling the problem to the duck solved the problem. We need to add a Boolean field. Let's get into our problems. And let's add another field. And I want a...

DANIEL: Boolean.

JASON: Yeah. We'll say solved. And I want a default value of false. And we want this to be required. Look at that. Okay. So, now we have whether or not the problem is solved. And on these ones, the problem is definitely not solved yet. Right? Sob with these should all be set as unsolved. Oh, but you know what? I bet now if we go in here... we could --

DANIEL: We could change...

JASON: We could reconfigure the view and show me whether or not that -- oh, nope. True and false also don't work. That's okay. That's all good. That went so fast. We've -- I mean, in the span of --

DANIEL: We have done so much.

JASON: In a solid 15 minutes of effort here, we put together a new Strapi instance. We were able to go in and configure a relational database. We were able to, you know, modify our schema a little bit. Get some data entry done. And it's all done in a way that, you know, kind of makes sense to me. So, if I click in here and I look at my problems, I can see like, hey, here's a problem. Here's who owns it. This is all pretty good. And then I can -- oh, wait, we need to change that one from off/on to like true/false. So, let's edit the fields.

DANIEL: Yeah.

JASON: Go in here.

DANIEL: Could you? I don't think you can. I feel like that's a Strapi thing.

JASON: Oh, okay.

DANIEL: Which I have been very adamant about on and off is a bit confusing for Boolean value. And I feel like I just need to open a PR and fix it.

JASON: [Laughs] -- yes. Eddy Sims, thank you for ordering a corgi duck. I hope it solves all your problem. I need a web hook to show whenever a corgi duck is purchase sod we can have a celebration on the show whenever it happens. A million things to build, and no time. Someday, someday. Okay. So, now that we've got -- hopefully. Yeah, please hopefully soon. But, yeah, we've got developers, we've got problems. And now we can start kind of interacting with this. So, it feels like there's a few ways that we could go here. If I want to access this data to start -- well, two things. I'm gonna want to manipulate it because I want to click a button and change the solve status. But also, if I want to show the dashboard, maybe latest questions or something like that. How do we start to -- what's our next step if we want to do that?

DANIEL: So, what we need to do now is sort of set permissions for what type of access that end users have to the API. You mentioned you, one, want to make requests and see that data. And read that data. You want to make changes, do you want to create? Or do you want to update? What we need to do now is get to settings and tweak those end user permissions.

JASON: Go into settings... and --

DANIEL: Yes, bottom left. And roles.

JASON: Roles.

DANIEL: Yes. So, public -- because I think this is a public site. We don't need to authenticate.

JASON: I think so. We can show a feed of the latest questions.

DANIEL: Yeah. Let's do that. Yeah. This is the public, generally anyone goes to URL/that endpoint, these are the sort of provisions that I was giving it. And what I like to do here is just click any box under any of the collection types. So, let's say find. And then you see on your right, the route that's related to that plus the type of request you have been making.

JASON: Wow! Okay. So, I want to find problems.

DANIEL: Yeah.

JASON: That's cool. Okay.

DANIEL: Yeah.

JASON: And if they create problems, they could post. We don't want someone to do that. Let look up a single problem. And the problem ID. Maybe find one developer and find all of their problems. All right. This is cool. I'm into it. And it looks like a bunch of other stuff that we could do that we probably don't have a lot of time to get into today.

DANIEL: Yeah, exactly.

JASON: But this puts us in pretty solid shape today, I think. Make this a little bit bigger so the text doesn't wrap on me. So, if I save this then, what I should be able to do, if I understand correctly, is I should be able to go to -- whoops. I should be able to go to what? Just local host 1337 --

DANIEL: Exactly.

JASON: You. Okay. So, let's do that. So, I'm going to go to /developers. There we go. And I want to look up a single developer. Let's look up Daniel. And now we've got --

DANIEL: And my IDs too.

JASON: Yep, Daniel. And here's a list of problems. And these are the ones linked specifically to Daniel. And same thing for problems because we added that. If I can spell it. Problems, good. And then let's set like one problem here. And it shows us the problem. Shows us who the developer is. We get, you know, my name, whether or not it's solved, although this one says null. Probably because we created that before we did the required field. But we can fix that really fast. And can I change all of them at once? No, that would have been cool, though.

DANIEL: Not just yet.

JASON: Not solved. So, we're gonna save that one. Not solved. And then... say not solved here either. And...

DANIEL: There we go.

JASON: Cool. All right. And then this one, actually, we can say, I need a place to share my problems. And that one's gonna go to me. And this one is solved because we have a corgi duck.

DANIEL: Yes.

JASON: So, then, if I get back out here and look at my -- at my problems, we can see now it's solved, false. I have way too many corgi ducks. That one's not solved. Can't get it to work, right? Oh, I think I forgot to actually publish that problem. That one's drafted.

DANIEL: Oh, yeah, still a draft.

JASON: There it is. I need a place to solve my problems. This one is solved.

DANIEL: There we go.

JASON: We made an API. That happened faster than I expected.

DANIEL: I hear that a lot. But, yeah, it's something a lot of people really like about Strapi. In terms of building MVPs really quick.

JASON: Absolutely.

DANIEL: Oh, we got into like a planning meeting and then we just sort of opened up Strapi and started putting a bunch of fields together and at the end of the meeting, we had this MVP all right. And we were like, what? Yeah.

JASON: There's a question in chat about doing this with GraphQL. Sounds like there's a plugin. If we wanted to show that, what's the process of adding that?

DANIEL: Right. So, we have a marketplace under general in your left menu.

JASON: Okay. Here it is.

DANIEL: And we could either... oooo... that's new. Yeah. So, we could either just press download and that would install the plugin, or we could use the CLI. I like to use the CLI because I get to see doing everything, like installing and rebuilding the admin and then, yeah.

JASON: Okay. Let's -- so, let's do that one with this documentation thing because I'm also pretty curious about this. Because open API docs are really cool. And very, very powerful. So, let's see. Installing GraphQL.

DANIEL: Yeah.

JASON: Still going.

DANIEL: It will take some time. We have a v4 coming out. And GraphQL will sort of be default.

JASON: Oh, nice.

DANIEL: That's something a lot of people will enjoy. Or not default, really, installed by default. You won't have to --

JASON: Oh, I gotcha. Yeah. So, I mean, what I -- but what I like about this is, you know, we clicked a button, but then we know what's happening because we can kind of see here that things are being changed. It's getting inserted into the package JSON. So, we would actually be able to track that. It's pretty slick to be able to do that.

DANIEL: Yes.

JASON: So, we will -- and my computer's about to take off. I can feel it trying to escape. It's trying to hover.

DANIEL: Yeah. I think because we used like the marketplace to install GraphQL, we could use the CLI to install the documentation plugin.

JASON: Oh, wait, here we go. Restarted.

DANIEL: Yep.

JASON: Here we go...

DANIEL: Is it still loading?

JASON: There it is. There it is.

DANIEL: There we go.

JASON: So now we have --

DANIEL: It's installed.

JASON: It's already installed. So, what should I do now?

DANIEL: If you want to use this, you should go to localhost 1337/graphQL and then we'll get like the GraphQL playground. And we can start messing around with GraphQL operations.

JASON: Beauty. Okay. So, let's write a query and we'll get developers. And I'm using control space to autocomplete here. So, let's get a name. And... problems. And let's get the problem description.

DANIEL: This is always --

JASON: Look at that.

DANIEL: I always marvel at GraphQL.

JASON: It's so nice, so fast. And then we can pull whether or not it's solved.

DANIEL: Yeah.

JASON: Excellent. So, I mean, this is great. It's so nice. We clicked one button, got it to work. Next I want to add this documentation plugin. But let's use the CLI for that. Do I need to stop the server to do that?

DANIEL: Yes, you do.

JASON: Okay.

DANIEL: And then you have to see, you have to like get into that --

JASON: What did I call this? Strapi something? There we go. All right.

DANIEL: Yeah. There we go. And now you should use -- what are you using, npm?

JASON: Yes.

DANIEL: Or Yarn? Yes. So, npm run Strapi install documentation.

JASON: Nice.

DANIEL: Oh, I've never had someone use Hasura and Strapi on the same database. That's pretty cool.

JASON: That's a cool idea. Hasura, if you're not familiar with it, has got some good episodes on Hasura. You should check these out. They're a lot of fun. So, here's one with Vue. Here's one -- this is Tanmai, one of the creators of Hasura. And here's one with Christian Nwamba. And all of these are super-fun. There's a lot of -- a lot of cool information in here. I'm a big fan of Hasura. I think it's great. Let's get this into the chat. So, y'all can play with it. I'll make sure these show up in the show notes as well. And while we're doing that, we're rebuilding the admin UI.

DANIEL: Yeah.

JASON: I know there's no search to be put on the website. We built -- we built a whole thing in this episode -- where is it? Where is Sarah? Here it is. Sarah taught me to build this and it was amazing. And it's sitting on a branch. I have a compatibility problem. My site is build on all of the ESM. And the Algolia stuff will work with ESM. And there's fixes to do it, but someday, look how cool this is. It would be amazing if I could make this work. Because we would be able to go, Hasura. Hey, look at all of these Hasura things. But I am definitely not there yet. So, yeah. Eventually this will be part of the site experience. We're not quite there yet. In the meantime, if you want to go search for stuff on Learn with Jason, you can do it on that episode's demo.

DANIEL: Building that must have been so fun.

JASON: It was amazing -- Sarah is a great teacher. Algolia is a great tool. And it was surprisingly approachable. Like, I feel like you like autocomplete in general. But then search indexing and stuff like that, it's -- it's a lot. And the indexing part took like one click. It was -- it was amazing. But, okay. So, we've got documentation installed. And if I want to restart -- can you remind me of the command? Was it Dev? Develop?

DANIEL: It is develop. So, npm run develop.

JASON: All right. Here we go.

DANIEL: Yeah! There we go.

JASON: Getting back into it. So, we've got our site here. And then if I want to look at the documentation, where does one find such things?

DANIEL: So, you should have your documentation under plugins. So, just like refresh your -- I don't know -- did you?

JASON: I thought I did. Let me see. Here it is. Documentation. Oh, and now there's a -- now there's a thing. Okay. So, I just needed to refresh the page.

DANIEL: Yep.

JASON: Uh-oh.

DANIEL: Uh-oh. Do we remember the password?

JASON: I remembered!

DANIEL: Nice.

JASON: Okay. So, this token, I want to open the documentation. And --

DANIEL: The UI.

JASON: And this is all generated. Like Open API, swagger docs. So, I click in here. We can see all of the pieces. So, let's look at developers. And now I can see what all of the query parameters are. And we can -- like, we can straight test all this, can't we?

DANIEL: Yep. Not in here, but I mean, we can put it in to the browser tab and do it.

JASON: Right. I mean, this is -- yeah. So, try it out. I can just go in here and like just try one of these. Which I will put nothing in it and then I will execute and then you get a response that's got all of your things. Swagger is dope. If you have never used it, the open API spec makes REST APIs predictable in a way that you can automatically generate documentation like this. And I love to see that Strapi is using that so that I don't have to write documentation. I can just hand this over to my team and say, hey, look. If you want to know what a thing is. I wouldn't have known they needed to go and put all of these features in there. I didn't know I generated them. But Strapi sure did. And can document those properly so that my code is useful to people.

DANIEL: it does generate a lot. You get a lot out of your first few interactions with Strapi. You can add way more. This is, again, speaking to the flexibility end and customization.

JASON: Yeah. And I mean, it's -- like, it's also very cool because we can see here as well. But it's letting us choose like Dev staging and prod. So, that if we -- once we have taken this live, I could choose like, oh, I want to test this on my local server. And then switch it over and try it on the stating server or the prod server to make sure that, oh, did I keep API compatibility? Et cetera, et cetera? Those sorts of things are really nice and making sure that we are providing a nice, clean experience for the rest of our team. We're not jerking people around. Shipping surprises. Like, that's... not having to do that manually is very nice. Like, having a tool that lets you sort of make these checks part of the process is pretty wonderful.

DANIEL: We had a session a couple weeks ago, actually, with Postman and we talked a lot about the collaboration and versioning that this specific plugin enables. I thought that was pretty cool.

JASON: Yeah.

DANIEL: I will try to look for that and share it.

JASON: Excellent. Yeah. Okay. So, we've got -- we've got ourselves an API. We've got that API documented with Swagger. We've got a GraphQL version of that that's self-documenting. I think the only thing that's left to do now is actually use this thing to build something, huh?

DANIEL: Let's do it.

JASON: Anything else you want to show off in here? Any settings we should mess with before we start?

DANIEL: I think the provider system is pretty cool. If you go to settings.

JASON: Settings...

DANIEL: On your authenticated route, you can sort of register users in Strapi. And if you look at providers, yep. Right there. Under --

JASON: Oh!

DANIEL: So, we have all these providers that we can sort of add to register users in Strapi and use that user information to access authenticated routes. If we wanted to make a SaaS version of our rubber ducky CRM, you could set up GitHub and Auth0. And GitHub, you authenticate with GitHub. Strapi stores that in the database. And after you authenticate, you have access to other problems. And you can see what problems developers are solving and what problems are not solved.

JASON: Yeah. I mean, like this is -- this is super-cool because it's -- like it's kind of nice to do this. So, I wonder, chat, what's more interesting you? Do you want to see a frontend get built with the Strapi data? Or do you want to see us do a little bit more with the Strapi config itself? Like, we could potentially attempt to go and configure GitHub auth. Or we could get in here and look at configuring so that only certain users could change data. We could grant an admin role for actually submitting new users via API. Just holler at what you want to see. Because we can also build a frontend. And building a frontend is always fun.

DANIEL: Yeah.

JASON: Config sounds great. Any other takers? Do it all! Okay. More config. I think more config is probably, you know, we've got plenty of episodes of this show where we build things based on APIs. So, let's figure out how to config these APIs.

DANIEL: Yeah, let's do it.

JASON: Where do you want to start? Do you want to start with configuring a GitHub auth? Or do you want to start with controlling access to the APIs?

DANIEL: I think let's start with controlling access to the APIs. It gives a really good introduction to the whole idea of what you can access and what you can't and then builds up the use case for auth.

JASON: Okay.

DANIEL: Yes.

JASON: Let's see here. We've got authenticated. That seems like one we would like to have extra permissions. And for this one, we would them to be able to do everything. Maybe they can't delete stuff. Like, this is a -- you can change data, but you can't delete data, right?

DANIEL: Yeah.

JASON: Yeah. That seems like a good -- that seems like a good thing to do. Anything else that we want to mess with in here?

DANIEL: No. There's the email provider, I don't think we want to mess with anything. So, this is like tweaking the internal stuff. I think we can sort of like leave that so we don't break anything.

JASON: Okay. So, now we've got a -- an authenticated user. But we don't have any users yet. Oh, I do have a user. Look at me.

DANIEL: That's an admin user. This is a common thing that a lot of people have. And it's something that we are trying to address because we think it's super-confusing. You have people who use the admin, which is like the backend. And this is -- this role is sort of like, what access do you have for operations in this admin panel that we're playing around with now? But if we go under user and permissions plugin, then we sort of have the end user roles. Where it's like, people are making requests to our API. What -- what -- what permissions do they have?

JASON: Got it.

DANIEL: That's sort of where we do it. And so, to manage end users, we have a users collection type at the top there.

JASON: Okay, okay.

DANIEL: And that's where we have to add images.

JASON: Okay. Does this have the same restrictions? I'll just use the same password so that I don't forget. And we'll just mark me as confirmed. I'm not blocked. Let me write that one more time.

DANIEL: You see there? You could have a role.

JASON: Ah. So, I want to be an authenticated user. Okay. So, I'm gonna save. All right. I have a user now. And if I... actually how would I even test this? What's the path for testing it?

DANIEL: So, I use Hoppscotch. I don't know what's your preferred API testing service.

JASON: I have -- source API. I've never tried this one. This one's my current favorite. Let's try it.

DANIEL: Let's do that. So, we have a special endpoint. I think we have to go to settings and turn proxy off. Let me just open up mine also and see how I did it last time. Oh, no, not here, sorry, in Hoppscotch.

JASON: Oh, in Hoppscotch.

DANIEL: Yeah.

JASON: We go to settings. And...

DANIEL: At the bottom, there should be like a proxy. Yeah. That should work. Let's... proxy disabled. Okay. No. That's good. Let's not touch anything. Perfect.

JASON: Okay.

DANIEL: So, go to -- go back to the home. Yes. There we go. And change your method to a post request.

JASON: Okay. And then I --

DANIEL: And then our URL -- yeah. It should be localhost 1337. Nope. Nope, nope. We have a special endpoint. So, I think let's like walk through the -- the authentication flow first of all.

JASON: Ah, gotcha. Yeah.

DANIEL: Yeah. So, like what this looks like is we're sending details, user details. The user you just made, right? You had a username, you had a password. What we're doing is we're sending a post request to an endpoint with the username and password as sort of like header data.

JASON: Okay.

DANIEL: And then if that's validated in the Strapi API, what we do is we get back a JSON web token.

JASON: Ah-ha. Gotcha.

DANIEL: And then that's what we can use to make like a normal get request with the jot as a header.

JASON: Okay. So, do I hit like -- is it login? Is it auth? What's the endpoint for this user?

DANIEL: It's auth/local.

JASON: Local. Okay. And then down here... am I?

DANIEL: Do a request body.

JASON: Okay.

DANIEL: In JSON.

JASON: Application, JSON.

DANIEL: Row input, rather. Let's just use row input. And open it up, exactly. And then we have identifier. And that should be your password.

JASON: Okay. Nobody write down this password. This is --

DANIEL: Sorry, that's wrong. It should be your email.

JASON: Okay.

DANIEL: My bad, yeah.

JASON: Okay. And then is it --

DANIEL: Yeah, then comma and then another. And then this should be password and that should be your password.

JASON: Okay. Everybody's gonna go hack everything. I'm in. Yeah, I know. [Laughs] That's it? We can send it?

DANIEL: Yep. Let's send it.

JASON: Ta-da! Okay. And so, here --

DANIEL: There!

JASON: Is our web token. So, if I go and I just like copy that.

DANIEL: Yeah, let's copy that.

JASON: Copied. Okay. So, then...

DANIEL: And now we can sort of like open another tab if you want to keep track of this. Someone wants you to paste it in there. Open another tab on Hoppscotch.

JASON: Okay. And for this one, we're gonna do like developer -- actually, I'm gonna go look at my settings again so that I can actually see these things. I'm going to authenticate, and then for developer, if I want to create one. We do post to developers. And then look at my Swagger docs to see what post developers needs. And it needs name and problems. So, we don't need the -- we can probably leave out almost all of that, right? I can just put in name?

DANIEL: Yep. No, actually. I think because we have that relation, we might get an error if we leave that out. But let's try it. I haven't used the REST API in a while.

JASON: All right. Let's see what happens if we send it in and then I need to send in a header. And that header is going to be authorization, right? And then is this one of those like bearer, like that?

DANIEL: Yep.

JASON: Okay. So, let's give this a shot. And it says? Boom! Done! Dave, you got problems? And if we go in and look at our -- oh, wait. Here we go. Developers. There it is! There's Dave!

DANIEL: Very cool. There is Dave.

JASON: So, I mean, that's -- that's great. Now, if I try this without the header... so, uncheck that.

DANIEL: It should work because I think you still have -- oh, no, we didn't give permission --

JASON: It shouldn't, yeah.

DANIEL: Exactly. Let's try it without header. Forbidden.

JASON: Let's see what happens without the hacker. Or without the header. Not. Get out of here.

DANIEL: There we go.

JASON: Perfect. So, it does what we want. You need that bearer token or else you can't enter things into the database. But we can if we switch to over a get request, we can without the header we can go and get a list of developers and problems.

DANIEL: All the developers, yes.

JASON: That's what we want. We're kind of thinking this as like a -- yeah, Dave has no problems. He's got the password now. He's fine.

DANIEL: He made it. Dave.

JASON: But, yeah. Okay. So, now we've got authentication here when we know that if we want to actually do this auth, there's a flow for that so we would have somebody enter their username and password into a form. We would submit that form to this endpoint and that would send back a JSON web token that we can then use for making requests.

DANIEL: Yes.

JASON: All right. I'm feeling pretty good about that. Can we take this -- what would be the easiest way to make an authenticated request in a serverless function? I think we could -- I mean, if we stored that JSON web token in a cookie, we can just pull that right out of the cookie in the web token -- or in the serverless function. Submit it as a header, submit it as whatever -- yeah, you would need to be logged in. I guess if you wanted to, you could like also pass in the username and password, but that's probably not a -- I don't know if that's the way I would go about that. Yeah, you would want a login flow and then from your login flow, you would -- you would send that token with subsequent requests. Okay. So, what if we want to take this a step further and do GitHub? Go back in here and start looking.

DANIEL: Good question. We would need to go to GitHub. First, let's look at what we need from GitHub. Look at providers. The thing with providers, is these usually work really well with a -- how do I describe this? You have like a frontend, right?

JASON: Oh. You're frozen. This question broke Daniel. Okay. So, we'll wait for Daniel to get back. I think he's having connection issues. And while we're waiting for that, I'm going to -- uh-oh. He's gone, gone! He'll join soon. Probably. Here he is. He's coming back. He's coming back.

DANIEL: Ah!

JASON: There you are.

DANIEL: My Internet has been doing this for like the longest time today. Yeah. Sorry about that. It just keeps dropping me off.

JASON: No worries. We got some -- yeah. We got some jokes out of it, you know? Okay. So, you were saying that GitHub, this auth works with a client-side app. Do I need to set up a quick client side app?

DANIEL: Yeah. What I'll do is you have like a client side app with the most basic implementation I've seen is like one button that says like, you know, login. And then that takes us to the GitHub URL and then, you know, all of that. So, that sort of thing. The flow get.

JASON: Okay. Let's see how far we can get. We've got about 20 minutes to do this. We're gonna jump in here and say auth frontend. I'll get init. And we're going it create an index.HTML. And let's just open this up and we'll make a real quick index.HTML page. So, we've got this. I'm going to use the autocomplete. Are you gonna do the thing? There it is. And now I can say... log into Strapi with GitHub. That's our goal. Right? Take that.

DANIEL: Yep.

JASON: Copy it right down here. And we're gonna have a button. And that button says, log in with GitHub. All right. So, this is the -- the very basics of what we've got here. And if I just run like Netlify Dev, we should get a local server that will let us do that. And then as we add serverless functions, that will -- come on. There you go. So, here's our -- here's our site. Currently doesn't do anything. We click that button, nothing happens.

DANIEL: Yes.

JASON: So, to wire this up, what do I need to do?

DANIEL: Right. So, we need to create an app in GitHub. So, yeah. You might have to show us your API secrets.

JASON: Let's do this -- I will pull the API secrets off screen. Let's go into -- I think it's -- is it a GitHub app or an OAuth app? Do you remember?

DANIEL: I think for this particular one, I'm not too sure, actually. It should be a GitHub. An OAuth app.

JASON: OAuth?

DANIEL: Yeah.

JASON: Okay. Let's do an OAuth app.

DANIEL: Yeah.

JASON: Okay. So, we're gonna call this one Strapi off. And this one's gonna be at localhost: 8888. And the callback URL is the one they were showing us in here.

DANIEL: Yep.

JASON: There. So, let's drop that in.

DANIEL: That's the thing. We're currently local. I think we have to use something like ngrok.

JASON: Oh. I'll just deploy it, then.

DANIEL: This is the Strapi app. We will make calls to -- I think I've got my stuff in a bunch here.

JASON: Oh, I see what you're saying. We need -- we need the -- the Strapi app to be publicly accessible?

DANIEL: So, I might have to expose the port 1337 using something like -- what do we use? I use ngrok.

JASON: There's one that I saw Online that was really nice.

DANIEL: What is the specific tool called?

JASON: Does anybody remember what the one is that lets you do a tunnel online? Like do I... could I hack it with Netlify Dev? Maybe. I'm not -- probably not gonna try to do that right now. Hold on. Something like it.

DANIEL: Tunnel 2.dev, I think. I just did like a quick search.

JASON: Tunnelto.dev. Expose your local web server to the Internet. Featured on product -- okay. Let's see, can I... installing... I swear there was one that you could just drop in the name of it and you didn't have to do anything. Let's see.

DANIEL: Install --

JASON: Naw, let's just do it. This is gonna be fun. See how long this takes. We may find ourselves out of time on this because we are -- we're at the -- we're at the 15-minute mark here.

DANIEL: Oh, no! Well, someone said something in the chat. Npx -- oh. I had no idea ngrok had npx. Like an executable thing on npx.

JASON: Okay. So, that is actually -- that installed way faster than I expected. So, let's try this. And we will do tunnelto... 1337. And we're gonna call this...

DANIEL: Corgi doc.

JASON: Server denied -- oh, I need an API key.

DANIEL: Oh.

JASON: Here we go.

DANIEL: This is like, oh. No. It's like email. That's a lot now.

JASON: It's all gonna be fine. We're gonna make this thing work. Let me get over here, tunnelto. All right. I'm -- I'm getting over here. Add a payment method? Oh, no.

DANIEL: Yeah. That's exactly what I was scared of.

JASON: Wait, I thought it would just --

DANIEL: Oh, yeah...

JASON: What if I just don't use a subdomain and I just want it to be like... dang. Okay. Well, that one's not gonna work. All right. So, we might not be able to do this because we don't have time to deploy this and I don't want to spend the rest of the time trying to dive in and debug local tunneling since I didn't do any ahead work to figure out what a good way to do that would be. But let's -- you're installing anyway, why not use ngrok? Let's try one more. Try ngrok. Why do I have to sign in? Netlify to the Strapi API, I don't think that's gonna work. But I can try it. Port 1337...

DANIEL: What's that?

JASON: So, that's the Netlify Dev server. But what is the -- did it do a -- oh, wait. That's the wrong one. Oh, crap. What's the command? It is Netlify Dev help. What am I looking for? Target port.

DANIEL: Oh, I didn't know about this. This looks cool.

JASON: No command specified. Come on. Can I just have a no op? No, I want you to... oh, come on. See, this is -- this is what I was worried about. It will work. But we have just broken framework detection. And so, it starts -- it starts trying to figure things out and doesn't realize that we're just trying to force break it. Set the framework option to... listen to me. There is no framework option in here, of course. Which means that we would need -- yeah, this is gonna -- like, we could get there. We absolutely could get there. I'm probably not going to do it in the next 5 minutes. And that would mean that we would have no time to actually do this once we got it running. So, I think we're gonna let this one go.

DANIEL: Yeah. No worries.

JASON: So, instead, why don't we -- that's -- but this honestly is a good -- is a good -- take a note for the future. Because this could be a great thing to dig into later. How do you do local development, right? Like, there might be a follow-up episode on this, maybe there's a tutorial that could be again. But getting that local Dev environment set up with a good tunneling solution for the backend. Because the nice thing that we get if we have this site built up, which I don't have -- I don't want to create a site to do it. But if we jump into one, like the one we did -- what's one of these that's fresh? Do the autocomplete one, I think. Where is that autocomplete one? One of these is fresh. Like, what did I do yesterday? Completely lost track --

DANIEL: There's a --

JASON: JavaScript autocomplete.

DANIEL: The realtime one.

JASON: With this one, the way that it's set up, if I run Netlify Dev public, it will open the localhost. But then it will also show us a... wait. Where did it go? Listening, Dev server, use host to expose? All right. So, this always works until I'm trying to figure out how to show it off. And then I like don't use this enough to remember what the pieces are. It's Netlify Dev live. Creating a live tunnel. That's what it was. It's not public, it's live. Check this out. So, now we have a live version of the local instance running so that we can do checks like that. So, it's pretty slick. It's very nice to use on the frontend. If I had something like ngrok actually installed and configured, we could do it for the backend. But we're not there today. And chances are we're not going get there in the next few minutes. Instead of that, let's do this. For somebody trying to take next steps from here. Let's recap, right? What we were able to do today is we jumped in. We were able to set up the schema for developers and problems. Right? We got these configured --

DANIEL: The relation.

JASON: Got the relationship set up between our developers and our problems. And then we were able to do data entry really quickly and we can see here the relationships that happen where we're able to add our problems and on the problems side, we can see who our developers are. And then we were able to do permissions. So, we can go into the roles. We've got our public, and we can see that if you're not logged in, you can only look up. You can't -- you can't create, you can't update, you can't delete. But if you're authenticated, an authenticated user can do everything except delete. And only the super-admin, which is me, who is logged in right now, can actually delete things. That would be a way to kind of lock down permissions incrementally where you don't let destructive actions happen in case somebody loses their database key. We were able to do that in a way with Swagger documentation. We have the whole REST API through swagger docs, it's available through a GraphQL API and we have it available through straight up REST API. We have all that data. We were able to do that whole thing in 30-ish minutes. So, that's pretty slick like how quickly we were able to do that. So, for somebody who wants to take next steps and they want to go further with this, where would you recommend they go?

DANIEL: Well, it depends. I see someone shared a link to the deployment guide, of course. You would want to deploy Strapi somewhere. And we've got some pretty explicit guides on how to do that. I would suggest going to our documentation. It's -- yeah. Exactly. This site. The site that's on your screen. It's got a lot of really cool resources for set up and like extending Strapi. Like using more advanced functionality. I would also send you over to our YouTube. We've got some really cool videos on a bunch of different topics. And our blog has got some amazing content too.

JASON: Ope! Righty. So, there's -- there's the YouTube. And then the Strapi blog is gonna be over here, I think.

DANIEL: Yep.

JASON: Where am I looking for this?

DANIEL: On your left. It's in the resource center.

JASON: Oh, there.

DANIEL: On the left tab. Yep.

JASON: So, here if you want to check out the blog. Lots of information in there as well. All righty.

DANIEL: Yeah.

JASON: So, that is -- I mean, just a ton of information. A lot of flexibility here. And all of this is open source as well. So, if we go and look at open source, we can also see, you know, this is -- here's all the stuff. You can go and poke at it. See how it works under the hood.

DANIEL: Yep.

JASON: If you saw anything that you want to change, like that Boolean flag that Daniel and I were talking about. You can go and open a PR for that right now. That's really -- that's pretty powerful stuff. I think that's really cool. Whoo!

DANIEL: Yeah, it's really cool. We have this big v4 release coming out. So, if you want to keep track of that also, you can have a look at the commits on like the branch. Different branches on the main Strapi repo. We actually had a release today.

JASON: Oh, nice.

DANIEL: So, yeah.

JASON: Here's v4.

DANIEL: Yeah. If you have a good look of that, actually, go to Strapi.io/v4.

JASON: There you go.

DANIEL: Yeah.

JASON: Looks like that's been dropped in the chat. But I'll drop it again for posterity. There's a waiting list, RFCs that explain what's happening. General overview. Love a good teaser. And, oh, video -- this looks great. I like it.

DANIEL: The video is really cool.

JASON: Well, cool. So, this --

DANIEL: A lot going on.

JASON: Yeah. This is exciting. Is this later this year? Or what's the plan for?

DANIEL: Yep.

JASON: Nice. Very, very exciting stuff.

DANIEL: Like we have an alpha, but don't tell anyone, that's out somewhere. We're just testing that. And we have a beta coming out early in September. But we should be stable in -- there is an engineer from my team that is there, Derek. Because I just --

JASON: End of September, he's saying.

DANIEL: Yeah, so, like early October we should have like the first stable -- yeah. End of September. So, like, early October. This should be out. And it's gonna change so much. I mean, like a lot of what we've done was like really cool. But we're sort of like patching up a lot of the things around how we do certain things. Lots of performance improvements. A huge visual overhaul. Just making everything a lot more intuitive. Making things a bit more accessible, at least, you know --

JASON: Nice.

DANIEL: Getting there in terms of accessibility also. There is so much. I'm actually pretty excited for this, yeah.

JASON: That's -- that's excellent. Well, cool. Let's -- I think let's call that a great stopping point. If you're interested in Strapi, hit all of these things, lots of resources. All in the show notes. And make sure -- go buy one of these corgi toys so I don't have so many around. Tell it all your problems. That is as good a place as any to send a little shoutout to Amanda from White Coat Captioning who has been giving us captions all day, thank you for sticking around. That's made possible through our sponsors, Netlify, Fauna, Hasura and Auth0, making the show more accessible. Check out the show. We have a lot of fun stuff. Tomorrow we have Moriel on, right to left support. And then Ahmad Awais talking about Node CLIs, Pachi coming on to talk about CSS, ADO coming back. Look at this list. We have so much amazing stuff coming on the show after the rest of this year. Where's Tim? We're missing Tim. But I'm like just completely thrilled with all the amazing things that are coming on the show. So, make sure you go and take a look at the schedule. And definitely, definitely click this add on Google Calendar button so that you can see when the new episodes are coming. It's just going put it on your Google Calendar. there's no notifications or anything. It's for you to never miss an episode. I want to hang out with you. I hope you want to hang out with me. Daniel, any parting words for anybody before we call this one done?

DANIEL: Just because this is at the top of my head. I saw you had Battlesnake with Joe Nash. I'm not missing that. I understand what that is, but I really want to understand.

JASON: I also have no idea what Battlesnake is. And I'm really excited to find out on that episode. I'm intentionally doing no research ahead of time. To the best of my understanding, it's a kind of -- you know that phone game snake from the old Nokias, it's a developer-centric version of that game. I have no idea how it works. I don't know how to program games. This might be an embarrassingly short episode where I'm like, I'm too far out of my depth. But we'll find out.

DANIEL: But it will be fun.

JASON: I am excited. There's a lot of really fun stuff coming in here that I'm really excited about. Mark your calendars, hang out. We'll see you over on Twitch. Hit that follow button and all those things. Follow Daniel on twitter as well and hope that he lets you through that gate.

DANIEL: Yeah, no, I definitely will. Yeah, thanks so much. I don't know if I'm a great teacher or you're an amazing learner. The show is Learn with Jason. I think you're an amazing learner. It's been my honor.

JASON: This has been so much fun. Chat, stick around, we're going find somebody to raid. And we will see you next time!

DANIEL: Yep!