Creating an Enterprise News starter with Next.js and Hygraph CMS

hello everyone this is Tim from hgraph and in this video we're going to be talking about how hgraph partnered with blaz to build an Enterprise starter kit and I'm here with Marin who is from bra and who actually built this starter and I'm sure I butchered his name so Martin Could you actually say your name correctly in your language and then talk a little bit about who you are so hello I'm Martin and I'm a developer at blaz we are a a startup from Poland and we specialize in headless nextjs technology we build apps Integrations and stuff like that and we are actually partnered with hrab to to build this stter it's a news media website it's built to be as plug and play as possible but we do assume that you have a developer at your site so he can set it up configure it and do all the good stuff to match your desires and needs and so um in the intro I actually said this is an Enterprise starter kit right so in your opinion what makes this actually Enterprise versus normal I guess I'm not sure what the distinction is here okay so we actually some time ago built a Enterprise St kit that is just a boiler plate for all the good stuff that the Enterprises would like like end to endend tests all the like everything the unit tests maybe the story book and you can check it out and based on that we l we we fed it and adapted it to to create a more complete solution so it's not just a boiler plate it's a working application that you can adapt to your needs maybe change up the Styles maybe not if you like something more plain but yeah is there for you so when we talk about starters we tend to see different directions right sometimes it's like really Bare Bones without any opinion and you kind of just have to you have some good building blocks and you just plug some things in as a developer yourself but then you also have starters are essentially full forth projects with everything in it and it's handy because out of the box it's really fast but then you have to change things if you want so um what approach did you take and which parts of that approach that you take are super super opinionated and which are kind of like open well I wouldn't say We There is the any parts that are really strong controversial opinions it just stuff that we in general think is a good approach so not Everyone likes code gen I personally can't imagine walking with graphql without having the Coden set up we used Tailwind it used to be controversial now it's not at all everyone uses it and for a good reason well yeah it works doesn't it like I made a tweet like a few months ago like I had to write some CSS just standard stuff and I I I was doing Tailwind classes it's like whoa what happened right things have changed in our development life uh in life and workflow anyways you just mentioned this God genen thing right so um of course High graph uses graphql as his main endpoint and of course having Goen that does introspection of your graph qal endpoint really helps with typing all your data and your queries so with that in mind um which part of high graph did you actually use in this starter I think we used most of high graphs features at least the the stuff that everyday user would use certainly maybe with some additions so it's localization we are using components we are using of course the modules and and the entries yeah but we also use web hooks we use them to to revalidate the data that changes only that where everything is aggressively cached in next 13 up router so we are picking and choosing the other stuff that changes in high graph and we are revalidating that in our app we are also using a remote Source at first we use an external API but it would be I think impossible to to Port it for to everyone without leaking our our API code so we have that mocked but there's an example of usage for you and so what kind of um external API did you use or and you mocked it now of course but what is that what does it do yeah it's a stock API it's something pretty standard on all the news websites you check out the news and you can see that you lost your money or you gained some money stuff like that yeah sure and so um because this thing is actually Enterprise right what kind of um um like how do you say this like what kind of like security related things did you put in well to be honest there isn't that much stuff to secure because now basically everything is server side anyway so you don't really have to care about having the keys to the front end or using some proxies and anything like that so but we are of course we have a web H cter endpoint so we are validating if the if actually the request came from HRA not some spoofed another source so cool and so now that you you said that like everything is like SSR rendered again so how are you doing this because you already mentioned next app directory a little bit so how is this thing meant to run in your opinion are you doing serers side components that are then cached with like ISR something like that how does it work in this starter okay so by default everything is a react server component and every query that we make in our application is permanently cached by nextjs using the data cach I'm not sure if any other service supports it besides verel of course so there might be some problems with exporting your app anywhere else there's a library that wraps your app nextjs app and makes it Deployable on AWS but we didn't try that so but like why would sorry go oh yeah the words so if anyone would try that yeah be sure to let us know because to be honest I really I'm really curious how how the next 13 Works outside of sales architecture well I imagine it will because next is almost I would imagine like one of the most used tools out there so it would be pretty C crazy for places like Cloud flare workers and stuff like that that if it didn't work right so I imagine that accessibility for it should be kind of fine and so I'm wrapping this up a little bit so where can people find the blaz starter with high grab well it's going to be available on the this little page when you create a new high graph project and you have all the status to choose from and it will be there so make sure to check it out and let us let know what you think create a pull request if you have any new ideas or maybe you think you we could do something better but it's there for you you can just f it and make it yours so you don't really have to stick to anything we we provided but we do think it's a it's a good starting point for for anyone well we clearly think so as well otherwise we wouldn't have partnered with you when we saw this thing it's it's just amazing it has the whole kitchen syn for anybody wanting to do anything Enterprise and so um if you want to try this thing out you can just it will be on the new starter page in your hgraph account but you can also just join us on slack at slack. hyra.com to actually just chat about this stuff or you can go to bl.com where they actually link you to a Discord server where you can chat about stuff as well because we do all the stuff in the open that make it's so fun um thank you Martin for your this interview and um happy coding I guess cheers yeah thank you see you