Das CMS für Web-Agenturen, die Qualität garantieren wollen. Entwickeln Sie individuelle Komponenten mit klaren Strukturen für konsistentes Content-Management ohne Kontrollverlust.
Ob Vanilla JS, React, Svelte, Vue oder ein anderes Framework – Sie entscheiden. Dank Islands Architecture laden nur interaktive Komponenten JavaScript. Statische Inhalte bleiben schnell, schlank und perfekt für SEO.
Ein durchdachter Entwicklungs- und Content-Workflow, der Entwickler und Content-Editoren gleichermaßen glücklich macht.
Unser CLI macht's möglich: Lokal entwickeln mit Live-Preview. Ein Befehl – und Ihre Komponenten sind im CMS verfügbar.
Drag & Drop Interface für Ihre Kunden. Komponenten kombinieren, Inhalte einfügen – intuitiv und strukturiert.
Sehen Sie jede Änderung sofort. Teilbare Preview-Links für Feedback. Alles funktioniert? Dann geht's live.
Unser Managed Hosting (am einfachsten), Netlify, Vercel, via SSH oder Custom API – Sie wählen das Ziel.
Alles was Sie brauchen, um professionelle Websites zu bauen und Ihre Kunden glücklich zu machen.
Erstellen Sie statische Komponenten mit Standard HTML. Perfekt für Header, Footer, Hero-Sections und alle nicht-interaktiven Inhalte.
<!-- components/hero.html -->
<div class="hero">
<h1>{{title}}</h1>
<p>{{subtitle}}</p>
<a href="{{buttonUrl}}">
{{buttonText}}
</a>
</div> Interaktive Komponenten genau dort, wo Sie sie brauchen. Jede Island lädt nur ihr eigenes JavaScript – der Rest der Seite bleibt statisch und schnell.
<!-- components/article.html -->
<article>
<h1>{{title}}</h1>
<div>
{{content}}
</div>
<!-- Island wird hier eingefügt -->
<div data-island="counter"></div>
</article> // Vanilla JS - islands/counter.js
export default class Counter {
constructor(element) {
this.count = 0;
this.element = element;
this.render();
}
increment() {
this.count++;
this.render();
}
render() {
this.element.innerHTML = `
<button onclick="this.parentElement.__instance.increment()">
Zähler: ${this.count}
</button>
`;
}
} <!-- Svelte - islands/counter.svelte -->
<script>
let count = $state(0);
</script>
<button onclick={() => count++}>
Zähler: {count}
</button> // React - islands/counter.jsx
import { useState } from 'react';
export default function Counter() {
const [count, setCount] = useState(0);
return (
<button onClick={() => setCount(count + 1)}>
Zähler: {count}
</button>
);
} // Preact - islands/counter.jsx
import { useState } from 'preact/hooks';
export default function Counter() {
const [count, setCount] = useState(0);
return (
<button onClick={() => setCount(count + 1)}>
Zähler: {count}
</button>
);
} // Vue - islands/counter.js
import { ref } from 'vue';
export default {
setup() {
const count = ref(0);
return {
count,
increment: () => count.value++
};
},
template: `
<button @click="increment">
Zähler: ${count}
</button>
`
}; // Lit - islands/counter.js
import { LitElement, html } from 'lit';
export class Counter extends LitElement {
constructor() {
super();
this.count = 0;
}
render() {
return html`
<button @click=${this.increment}>
Zähler: ${this.count}
</button>
`;
}
increment() {
this.count++;
this.requestUpdate();
}
} <!-- Alpine.js - islands/counter.html -->
<div x-data="{ count: 0 }">
<button @click="count++">
Zähler: <span x-text="count"></span>
</button>
</div> Erstellen Sie beliebig viele Websites in Ihrem Account – jede mit dem Paket, das zu ihren Anforderungen passt. Starten Sie kostenlos, upgraden Sie bei Bedarf.
Zum Kennenlernen
Standard-Websites
Standard Business
Große Projekte
Kostenloser Account in 30 Sekunden. Keine Kreditkarte. Sofort loslegen.