Integrate Astro and Sanity with our new Astro Integration! 🚀
HTML-код
- Опубликовано: 28 авг 2024
- I demo our new Astro + Sanity integration package that helps you use Sanity as a Headless CMS seamlessly in an Astro project.
▬▬▬▬▬▬▬▬▬▬ Links
NPM Package: www.npmjs.com/...
Source code: github.com/lit...
▬▬▬▬▬▬▬▬▬▬ Let's Connect
littlesticks.d...
/ jaydanurwin
/ littlesticksdev
▬▬▬▬▬▬▬▬▬▬ My Gear
The gear I use to make these videos:
jaydanurwin.co...
▬▬▬▬▬▬▬▬▬▬ Timestamps
coming soon...
Наука
Love that you fumble as you go through your video!
Great help in getting back into Sanity after about 4 years. Thanks.
Dude thanks for your videos man! Moving over from 11ty and this is the exact type of vids I need to see
That's great to hear thanks for the encouragement! I'm glad to hear they're helping you out!
This is great! I love Sanity, and starting to drift towards Astro.
Same here, been a big fan of Sanity for a long time and fortunately it's easy to use with just about any framework. 🙌🏼
@@jaydanurwin I’ll be building my personal site using Astro based on your videos. Nice work! Seriously. I love how fast you are. Normally, I have to speed these things up. In your case, I have to slow them down! I love it.
This seems way to new to be useful. I have searched high and low for information on using Astro with Sanity and there is very little information/examples etc. I hate this about JavaScript Frameworks. There is always something new that looks great...but when you try to learn more about it there is nothing but a empty shelf with a few crumbs. I think I will just head on back to php land where old guys like me go to die.
thank you sir, great work
So good, thanks a lot.
Thank you❤❤❤❤❤❤
Followed this... and I'm getting "Property 'title' does not exist on type 'never'." when displaying a single post.
Well done thanks! Just a question... why my vscode doesn't show me any suggestions on astro config file like the sanity properties 🤔 Do you have any additional extension?
Great question! I'm just using the official Astro extension for Astro files, nothing fancy. Since I wrote the package in TypeScript that is where the auto completion should be coming from.
Would you happen to know of a way to integrate a user dashboard within astro? I've seen plenty of CMS options, but as for web apps, I've found myself trying to fit in Mantine components--not ideal.
Great question! I personally wouldn't recommend Astro as my top framework of choice for building user dashboards that are extremely data driven. They present themselves as a framework for primarily content driven sites like blogs, marketing sites, docs sites, etc. With some tweaking you definitely could get it to work but something like Svelte, Remix, Vue, or React might be an easier/better choice right now if you're trying to build a highly interactive web app.
One thing your tutorial (and every other tutorial I've read) misses here is how to import a component and render it using this method. What you've shown here only works rendering HTML elements, but what about a JSX component? E.g. I have a RUclips type ( using the astro-embed package). This does not render using your method. I have no idea how to get it to render to HTML using portabletext.
It sounds like what you're looking for is the portable text to React plugin (link below). This actually is how I used to set up my Astro projects at the very start but since have gotten away from React components in my frontend as much as possible. It should be a near drop in replacement in place of my portable text to HTML approach.
www.sanity.io/docs/portable-text-to-react
@@jaydanurwin Yeah I tried this, but I think the fragment () is somehow bypassing Astro's React integration. Using @portabletext/react just renders [object Object] for the React components.
@@jaydanurwin If you can update your Git repo with a working example, I'd be eternally grateful.
Hey great tutorials. I am using your starter and i noticed that netlify is not showing my newly added posts unless i redeploy manually using clear cache option. Any thoughts on fixing that? Thank you in advance
UPDATE: Same goes for local development. I have to restart astro dev server each time I edit blog posts.
Unless the app is being built via SSR then this would be the expected behavior. when you the dev or build commands Astro is caching the responses to your fetches to Sanity. You can get around this potentially by trying to turn off the CDN in your Sanity client. But ultimately it's up to Astro's internal fetch on what is cached and for how long. SSR helps with this because at that point it would be requesting the data from Sanity with each page request.
@@jaydanurwin yeah i’ve tried turning off CDN option but nothing changed, so i have two options:
1. Use SSR as you suggested
2. Use sanity’s netlify redeploy plugin when posts are mutated.
what would you choose?
@@affordablebrucewayne8508 hey! Did you find any sort of workaround for this problem? I'm facing a similar conundrum. Thanks
Honestly, i do not understand all these headless cms, especially Strapi. I do not see any value. All we need is a frontend webstack and a backend api/data server. This can be achieved simply by using Astro and Codeigniter4/Laravel. In my opinion, these headless cms are a overkill on resources and overload on our development workload, not mention the price we have to pay. We, in our team, just dump these headless cms!
While I do understand the sentiment of reducing complexity and avoiding a headless CMS I do think it depends on the site you're building and who it's for. If you are building a site where non-technical people need to be able add/edit new content then you're going to need a CMS of some kind. Sanity is my personal favorite so far because it gives you a ton of flexibility while still removing the need to manage and deploy a database and auth like Strapi and others require. Like I always say, pros and cons to every decision