Topics

Ik heb geprobeerd te migreren van microCMS naar EmDash + Cloudflare.

Wat is EmDash?

Cloudflare heeft een CMS aangekondigd dat zij beschouwen als de spirituele opvolger van WordPress.
Het is een volledig geïntegreerd CMS met een moderne architectuur, dat verschillende Cloudflare-resources (D1/R2/Workers) combineert met Astro. Het is echt een CMS dat volledig onderdeel uitmaakt van het Cloudflare-ecosysteem!
Om te zien wat er zou gebeuren, heb ik experimenteel een blog die ik met microCMS had opgezet, overgezet naar EmDash.

De gemigreerde website is hier te vinden.Yurulog
Dit is slechts een experimentele website, dus ik gebruik voorlopig het standaardthema. Ik zal later een ander ontwerp toepassen.

Installatieproces

1. Projectcreatie

npm create emdash@latestVoer het proces uit. U krijgt interactief verschillende vragen voorgelegd, dus selecteer de juiste opties.

2. Cloudflare-resources aanmaken

Door op deze manier databases en opslag te creëren, wordt de implementatie eenvoudig.

npx wrangler login
npx wrangler d1 create my-site
npx wrangler r2 bucket create my-site-media
npm run build && npm run deploy

3. Lokale ontwikkeling

npx emdash devHiermee wordt uw lokale omgeving opgestart.
Beheerschermhttp://localhost:4321/_emdash/adminGa naar [naam van de website/het platform] en voer de installatie uit.

4. Implementatie en eerste installatie

npx wrangler deployHet wordt vervolgens uitgedeeld aan de werknemers.https://[name].workers.devHet wordt uitgebracht op [platformnaam].
Omdat de lokale en externe databases onafhankelijk van elkaar zijn, is een initiële configuratie (het aanmaken van een beheerdersaccount) vereist, zelfs bij gebruik van het scherm voor beheer op afstand.

Door te koppelen aan een GitHub-repository kunt u implementaties ook automatiseren met pushes (Cloudflare Dashboard → Workers → Instellingen → Build → Koppelen met Git-repository).

5. Artikelen migreren vanuit microCMS

Maak een migratiescript om alle artikelen op te halen via de microCMS API → EmDash CLIcontent createIk heb het toegevoegd.

punt

  • Converteer de rich editor (HTML) van microCMS naar Markdown en importeer deze vervolgens.
  • De afbeeldingen werden aanvankelijk gemigreerd via externe URL's en vervolgens geüpload naar R2, waar de referenties werden bijgewerkt.
  • npx emdash seedNiet  .npx emdash content createGebruik   (omdat Seed geen revisies aanmaakt, wordt het artikel niet weergegeven)

Probeer het eens in de praktijk te gebruiken.

Dit CMS combineert het installatie- en implementatiegemak van een headless CMS met het gemak van end-to-end beheer van een full-stack CMS, en biedt daarmee het beste van beide werelden.
Het mooiste is dat je, omdat het op Astro gebaseerd is, je bestaande kennis kunt benutten, wat geweldig is. Het lijkt een goede oplossing voor kleine tot middelgrote blogs.

Omdat het echter nog in de bètafase is,

  • De conceptvoorbeeldfunctie werkt standaard niet (zie hieronder).
  • Centreren en rechts uitlijnen worden niet weergegeven in WYSIWYG.
  • Bij het bewerken van items in de menu's leiden relatieve paden tot een foutmelding.
  • Aangepaste velden kunnen niet worden gesorteerd.
  • Gebruikers kunnen niet worden uitgenodigd.

Er waren een paar aandachtspunten, zoals hierboven vermeld (vanaf versie 0.1.0).

Over conceptvoorvertoning

Hoewel er een knop "Conceptvoorbeeld" beschikbaar is op het bewerkingsscherm, is het niet mogelijk om artikelen in conceptvorm te bekijken.

EmDash heeft een preview-functie, maar deze lijkt niet standaard ingeschakeld te zijn. Daarom waren de volgende stappen nodig.

  1. omgevingsvariabelenPREVIEW_SECRETStel een willekeurige geheime sleutel in (npx emdash auth secret(Kan worden gegenereerd met)
  2. Op de artikelpaginaverifyPreviewTokenGebruik deze methode om het concept te verkrijgen.
import { getEmDashEntry, verifyPreviewToken } from "emdash";

const preview = await verifyPreviewToken({
  url: Astro.url,
  secret: import.meta.env.PREVIEW_SECRET,
});

const { entry, isPreview } = await getEmDashEntry("posts", slug, { preview });

Je kunt je conceptartikelen nu bekijken via de knop "Conceptvoorbeeld" in het beheerderspaneel.

samenvatting

Deze keer heb ik het als een full-stack applicatie geïmplementeerd volgens de basisprincipes, maar het lijkt erop dat het ook als een "headless CMS" gebruikt zou kunnen worden door artikelen op te halen met fetch en een SSG te bouwen, dus dat wil ik de volgende keer proberen.

Het is nog een erg nieuwe bètaversie. Ik ben heel benieuwd hoe het zich verder zal ontwikkelen!

Geschreven door

Hij maakte de overstap van DTP naar de webwereld en ontwikkelde zich al snel tot een "meester in zijn vak" met een beheersing van markup, front-end design, richting en toegankelijkheid. Sinds de oprichting van Liberogic is hij actief geweest in diverse vakgebieden en is hij nu een wandelend woordenboek binnen het bedrijf. De laatste tijd is hij geobsedeerd door het onderzoeken van efficiëntieverbeteringen met behulp van prompts, met de vraag: "Kunnen we meer op AI vertrouwen voor toegankelijkheid?" Zijn technologie en denkwijze blijven zich ontwikkelen.

Futa

IAAP-gecertificeerde specialist in webtoegankelijkheid (WAS) / Markup-engineer / Front-end-engineer / Webdirecteur

Bekijk het artikel van deze medewerker

Wij zijn trots op onze betrouwbare teamstructuur en snelle reactiemogelijkheden.

Bij Liberogic stimuleren onze ervaren medewerkers projecten proactief, waardoor we hoog gewaardeerd worden door onze klanten.
Wij zorgen ervoor dat projectmanagers en directeuren correct worden toegewezen om een ​​soepel verloop van het gehele project te garanderen. Wij voorkomen onnodige kostenstijgingen door volledige toezeggingen en wijzen middelen toe aan de juiste mensen op de juiste plaatsen. Bovendien staan ​​we bekend om de snelheid waarmee we de inhoud van het werk begrijpen en offertes opstellen en indienen.

Houd er rekening mee dat we niet actief betrokken zijn bij SES-achtige werkzaamheden op locatie.

We ondersteunen bijna alle belangrijke projectmanagement- en chattools, waaronder Slack, Teams, Redmine, Backlog, Asana, Jira, Notion, Google Workspace, Zoom en Webex.

Bij grootschalige projecten met SES en offshoreHeeft u technische problemen of maakt u zich zorgen over hoe u deze kunt aanpakken?

Casestudy