handshou / cloudflare-blog-template

0 stars 0 forks source link

Astro SSR for Tinacms #6

Closed handshou closed 1 year ago

handshou commented 1 year ago

I think this is what I want https://tina.io/docs/contextual-editing/overview/

Not necessarily SSR

handshou commented 1 year ago

https://github.com/dawaltconley/tina-astro

handshou commented 1 year ago

Using React in Astro is quite critical for this to work, followed by useTina hook. Not sure if client.queries as found at https://tina.io/docs/features/data-fetching/ is required for useTina hook.

Video reference on useTina hook in next.js: https://www.youtube.com/watch?v=PcgnJDILv4w&list=PLPar4H9PHKVqoCwZy79PHr8-W_vA3lAOB

handshou commented 1 year ago

Implemented

handshou commented 1 year ago
  1. Import Tina directive from dawaltconley.
  2. Implement Tina config with ui prop under a content collection.
  3. Use astro's content collections, export markdown files to src/content.
  4. In .astro files, convert from SSG to SSR, by replacing getStaticPaths() with getEntry().
  5. However, implementing TinaCMS visual editing walks back Step 4, and replaces getEntry with component using Tina directives.