npx cms-create-site my-site Ano ang nais mong buuin ngayon?
AlaminAno ang Vertex
Ang isang content site ay isang config file. Lahat ng iba pa ay problema ng framework.
Ang Vertex CMS ay isang Vue 3 framework na nakatayo sa vite-ssg. Sumusulat ka ng JSON na naglalarawan kung ano ang laman ng bawat pahina; ibinabalik nito ang isang pre-rendered na static site kung saan ayos na ang routing, metadata, theming, at mga larawan. Walang application code na isusulat at walang server na patatakbuhin.
Ang mga pahina ay datos, hindi code
Ang isang pahina ay listahan ng mga component at ang nilalamang kailangan ng mga component na iyon. Ang pagdaragdag ng seksyon ay pagdaragdag ng isang linya. Walang kailangang magbukas ng .vue file para lang magpalit ng headline, at hindi masisira ng pag-edit ng nilalaman ang build.
Ang disenyo ay isang token manifest
Ang theme ay iisang JavaScript object ng mga design token — palette, tipograpiya, mga surface, focus ring, elevation. Kino-compile ito ng framework tungo sa CSS custom properties, kaya ang pagpapalit ng anyo ng buong site ay isang file lamang, hindi isang pagsusuri ng stylesheet.
Static na output, totoong SEO
Ang bawat ruta ay pre-rendered sa sarili nitong HTML kasama ang canonical URL, mga hreflang alternate, JSON-LD, mga Open Graph tag, isang sitemap, at isang robots.txt na hango sa iyong draft settings. I-deploy ang folder saanman may nagsisilbi ng mga file.
Mabilisang simula
Mula sa wala tungo sa nade-deploy na site sa apat na utos.
Dumarating ang Vertex bilang iisang npm package kasama ang isang Vite plugin. Ang scaffolder ay sumusulat ng gumaganang site na maaari mong i-build agad; mula roon, JSON na lang ang ine-edit mo.
Gumawa ng site
Ginagawa nito ang site directory, isang panimulang theme, at isang home page na nagba-build na.
terminal npx cms-create-site my-site cd my-site npm installIlarawan ang isang pahina
Mga patag na key sa dot notation na may array index. Binubuklat ito ng framework tungo sa nested object na binabasa ng iyong mga component habang nagre-render.
site/content/en/pages/home.json { "components[0]": "Header", "components[1]": "Hero", "components[2]": "Footer", "content.hero.headline": "Welcome", "content.hero.subhead": "Built with Vertex CMS.", "content.hero.cta.text": "Get in touch", "content.hero.cta.href": "/contact", "path": "/" }I-preview ito
Vite development server na may hot reload. Agad na nagre-reload ang mga pagbabago sa nilalaman; gayundin ang mga pagbabago sa larawan at theme.
terminal npm run devI-build ang static site
Pre-rinerender ang bawat ruta sa sarili nitong HTML file sa dist/, gumagawa ng mga responsive na bersyon ng larawan, at sumusulat ng sitemap.xml, robots.txt, manifest.json, at isang 404 na pahina.
terminal npm run build:ssg
Iyan na ang buong ikot. Para sa buong content model, mga theming token, at mga deploy target, basahin ang dokumentasyon →
Ano ang kasama
Ang mga bahaging kailangan ng bawat content site, nakabuo na.
Hindi ito mga plugin na kailangan mo pang hanapin. Nasa loob sila ng framework, nakabukas bilang default, at isinasaayos mula sa parehong JSON tulad ng lahat ng iba pa.
Pre-rendered na routing
Hango ang mga ruta sa iyong mga page file. Ang bawat isa ay nire-render sa sarili nitong HTML habang nagba-build — walang SPA rewrite, walang shell ng homepage na inihahain para sa totoong content URL.
Maraming wikang nilalaman
Magkakatugmang direktoryo bawat wika. Nauuna ang base na wika, at ang bawat wika ay nagpapalit lamang ng mga key na tinukoy nito, kaya wasto pa rin ang bahagyang salin.
Mga responsive na larawan
Ihulog lang ang orihinal sa site/assets/img/. Gumagawa ang build ng AVIF, WebP, at JPEG sa anim na lapad, itinatago ang mga ito sa labas ng iyong repositoryo, at inihahain sa pamamagitan ng srcset sa loob ng <picture>.
SEO metadata
Mga canonical URL, hreflang alternate, Open Graph at Twitter card, JSON-LD, kusang hinangong breadcrumb, sitemap.xml, robots.txt, at isang web app manifest — lahat ginagawa, walang inaalagaan nang manu-mano.
Pagkandado ng draft
Ikandado ang isang pahina, isang path prefix, o ang buong site sa likod ng password. Ang mga nakakandadong pahina ay inilalabas nang may noindex, hindi pumapasok sa sitemap, at walang nirerender na katawan hangga't hindi binubuksan.
Mga theme at extension
Ang mga theme ay token manifest. Ang mga extension ay validated na bungkos ng component. Pareho silang maaaring manatili sa loob ng iyong repositoryo o mailathala sa npm at gamitin sa maraming site.
Tatlong antas na component
Ang mga component na lokal sa site ay nangingibabaw sa mga component ng extension, na nangingibabaw naman sa kasamang set. Ang mas tiyak ang panalo, at ang mga pangalang may tukoy na pinagmulan ang naglilinaw kapag nagbanggaan.
Isang totoong 404
Pre-rineender ng framework ang /404.html gamit ang sariling balangkas ng iyong site, kaya ang mga URL na walang katugma ay nakakakuha ng may-brand na pahina na may noindex sa halip na walang lamang response body.
Magsimula
Kaya — ano ang nais mong buuin ngayon?
Ang Vertex CMS ay lisensyado sa ilalim ng MIT at nakalathala sa npm. Gumawa ng site, basahin ang dokumentasyon, o basahin ang source code.
npx cms-create-site my-site