webiny-js
Open-source, self-hosted CMS platform on AWS serverless (Lambda, DynamoDB, S3). TypeScript framework with multi-tenancy, lifecycle hooks, GraphQL API, and AI-assisted development via MCP server. Built for developers at large organizations.
Top Related Projects
π Strapi is the leading open-source headless CMS. Itβs 100% JavaScript/TypeScript, fully customizable, and developer-first.
The flexible backend for all your projects π° Turn your DB into a headless CMS, admin panels, or apps with a custom UI, instant APIs, auth & more.
The superpowered headless CMS for Node.js β built with GraphQL and React
Payload is the open-source, fullstack Next.js framework, giving you instant backend superpowers. Get a full TypeScript backend and admin panel instantly. Use Payload as a headless CMS or for building powerful applications.
Sanity Studio β Rapidly configure content workspaces powered by structured content
JavaScript library for Contentful's Delivery API (node & browser)
Quick Overview
Webiny is an open-source serverless CMS platform built on top of AWS cloud infrastructure. It provides a modern, scalable solution for building and managing websites and applications, offering features like headless CMS, page builder, and form builder, all within a serverless architecture.
Pros
- Serverless architecture for easy scaling and cost-effectiveness
- Comprehensive set of features including headless CMS, page builder, and form builder
- Built on modern technologies like React, GraphQL, and Node.js
- Extensible and customizable through plugins and custom code
Cons
- Primarily focused on AWS, which may limit options for users preferring other cloud providers
- Steeper learning curve for developers not familiar with serverless architectures
- Documentation could be more comprehensive for advanced use cases
- Community is growing but still relatively small compared to some other CMS platforms
Code Examples
- Fetching data using Webiny's GraphQL API:
import { GET_PUBLISHED_PAGE } from "./graphql/pages";
import { client } from "./graphql/apollo";
const fetchPage = async (slug) => {
const { data } = await client.query({
query: GET_PUBLISHED_PAGE,
variables: { slug }
});
return data.pageBuilder.getPublishedPage;
};
- Creating a custom Webiny plugin:
import { definePlugin } from "@webiny/plugins";
export default definePlugin({
type: "admin-menu-item",
name: "admin-menu-item-custom",
render({ Menu, Item }) {
return (
<Menu name="custom-menu">
<Item label="Custom Item" path="/custom" />
</Menu>
);
}
});
- Using Webiny's form builder in a React component:
import React from "react";
import { Form } from "@webiny/form";
import { Input } from "@webiny/ui/Input";
const MyForm = () => (
<Form onSubmit={data => console.log(data)}>
{({ submit }) => (
<>
<Input label="Name" name="name" />
<Input label="Email" name="email" type="email" />
<button onClick={submit}>Submit</button>
</>
)}
</Form>
);
Getting Started
To get started with Webiny:
-
Install Webiny CLI:
npm install -g @webiny/cli -
Create a new Webiny project:
webiny create my-webiny-project cd my-webiny-project -
Deploy to AWS:
webiny deploy -
Start the local development server:
webiny dev
Visit the Webiny documentation for more detailed instructions and configuration options.
Competitor Comparisons
π Strapi is the leading open-source headless CMS. Itβs 100% JavaScript/TypeScript, fully customizable, and developer-first.
Pros of Strapi
- More mature and widely adopted, with a larger community and ecosystem
- Offers a user-friendly admin panel out-of-the-box
- Supports multiple databases (SQLite, MySQL, PostgreSQL, MongoDB)
Cons of Strapi
- Less focus on serverless architecture compared to Webiny
- May require more server resources for larger projects
- Limited built-in support for complex content modeling
Code Comparison
Strapi (Route definition):
module.exports = {
routes: [
{
method: 'GET',
path: '/hello',
handler: 'controller.hello',
config: {
policies: [],
middlewares: [],
},
},
],
};
Webiny (GraphQL resolver):
export const helloResolver = {
Query: {
hello: (_, args, context) => {
return "Hello, World!";
}
}
};
Both Strapi and Webiny are powerful headless CMS solutions, but they cater to different use cases. Strapi excels in traditional server-based setups with its user-friendly admin interface and multi-database support. Webiny, on the other hand, is designed for serverless environments and offers more flexibility in terms of infrastructure. The code comparison shows that Strapi uses a more traditional route-based approach, while Webiny leverages GraphQL for its API layer.
The flexible backend for all your projects π° Turn your DB into a headless CMS, admin panels, or apps with a custom UI, instant APIs, auth & more.
Pros of Directus
- More flexible and customizable data model
- Stronger focus on content management and API-first approach
- Larger and more active community, with frequent updates
Cons of Directus
- Steeper learning curve for developers
- Less integrated serverless functionality
- May require more setup and configuration for complex projects
Code Comparison
Directus API endpoint example:
app.get('/items/:collection', (req, res) => {
const { collection } = req.params;
const items = directus.items(collection).readByQuery(req.query);
res.json(items);
});
Webiny API endpoint example:
export const handler = createHandler(
plugins([
createStorageOperations(),
createCrudOperations({
model: MyModel,
read: { maxResults: 100 }
})
])
);
Both Directus and Webiny offer powerful solutions for building web applications and managing content. Directus excels in flexibility and content management, while Webiny provides a more integrated serverless approach. The choice between them depends on specific project requirements and developer preferences.
The superpowered headless CMS for Node.js β built with GraphQL and React
Pros of Keystone
- More mature and established project with a larger community
- Flexible schema definition and customization options
- Built-in GraphQL API and admin UI
Cons of Keystone
- Steeper learning curve for beginners
- Less focus on serverless architecture
- Fewer built-in features for complex applications
Code Comparison
Keystone schema definition:
const { Text, Relationship } = require('@keystonejs/fields');
const listSchema = {
fields: {
name: { type: Text },
author: { type: Relationship, ref: 'Author' },
},
};
Webiny schema definition:
import { Model } from "@webiny/commodo";
class Book extends Model {
static name = "Book";
constructor() {
super();
this.attr("name").char();
this.attr("author").models("Author");
}
}
Both Keystone and Webiny are powerful headless CMS platforms, but they cater to different needs. Keystone offers more flexibility and customization options, making it suitable for complex projects with specific requirements. Webiny, on the other hand, provides a more streamlined experience with a focus on serverless architecture and rapid development. The choice between the two depends on the project's specific needs, team expertise, and desired deployment strategy.
Payload is the open-source, fullstack Next.js framework, giving you instant backend superpowers. Get a full TypeScript backend and admin panel instantly. Use Payload as a headless CMS or for building powerful applications.
Pros of Payload
- Lightweight and flexible, allowing for easier customization
- Built-in authentication and access control system
- Extensive documentation and active community support
Cons of Payload
- Less comprehensive out-of-the-box features compared to Webiny
- Steeper learning curve for developers new to headless CMS
- Limited serverless deployment options
Code Comparison
Payload configuration:
const config = {
collections: [
{
slug: 'posts',
fields: [
{ name: 'title', type: 'text' },
{ name: 'content', type: 'richText' },
],
},
],
};
Webiny configuration:
const contentModelGroup = await createContentModelGroup({
name: "Blog",
description: "A group for blog-related models",
});
await createContentModel({
name: "Blog Post",
group: contentModelGroup.id,
fields: [
{ fieldId: "title", type: "text" },
{ fieldId: "content", type: "rich-text" },
],
});
Both Payload and Webiny offer powerful content management capabilities, but they cater to different needs. Payload focuses on simplicity and flexibility, making it ideal for developers who want more control over their CMS. Webiny, on the other hand, provides a more comprehensive solution with additional features like serverless deployment and a graphical interface for content modeling. The choice between the two depends on project requirements and developer preferences.
Sanity Studio β Rapidly configure content workspaces powered by structured content
Pros of Sanity
- More flexible content modeling with a powerful schema system
- Real-time collaboration features for content editors
- Extensive plugin ecosystem and customization options
Cons of Sanity
- Steeper learning curve for developers new to the platform
- Requires more setup and configuration compared to Webiny
- Pricing can be higher for large-scale projects or high-traffic sites
Code Comparison
Sanity schema definition:
export default {
name: 'post',
title: 'Blog Post',
type: 'document',
fields: [
{
name: 'title',
title: 'Title',
type: 'string',
},
// ... more fields
],
}
Webiny schema definition:
import { createContentModelField } from "@webiny/api-headless-cms/content-model";
export default {
name: "BlogPost",
fields: [
createContentModelField("title", "text"),
// ... more fields
],
};
Both Sanity and Webiny offer powerful content management capabilities, but they cater to different use cases. Sanity provides more flexibility and real-time collaboration features, making it suitable for complex content structures and team-based workflows. Webiny, on the other hand, offers a more integrated serverless approach, which can be advantageous for developers looking for an all-in-one solution. The choice between the two depends on specific project requirements and team preferences.
JavaScript library for Contentful's Delivery API (node & browser)
Pros of Contentful.js
- More established and widely adopted in the industry
- Extensive documentation and community support
- Simpler integration for content-focused applications
Cons of Contentful.js
- Less flexible for custom backend development
- Higher costs for large-scale projects
- Limited control over the underlying infrastructure
Code Comparison
Contentful.js:
const client = contentful.createClient({
space: 'your_space_id',
accessToken: 'your_access_token'
});
client.getEntries()
.then((response) => console.log(response.items))
.catch(console.error);
Webiny.js:
import { createHandler } from "@webiny/handler-aws";
import headlessCmsHandler from "@webiny/api-headless-cms/handler";
export const handler = createHandler(
headlessCmsHandler()
);
Webiny offers a more comprehensive framework for building serverless applications, while Contentful.js focuses primarily on content management and delivery. Webiny provides greater flexibility for custom backend development, but may have a steeper learning curve. Contentful.js excels in simplicity and ease of use for content-centric projects, but may be less suitable for complex, custom applications. The choice between the two depends on project requirements, scalability needs, and development preferences.
Convert 
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual CopilotREADME
AI-programmable CMS for enterprises hosting on AWS
About Webiny
Open-source content platform. Self-hosted on AWS serverless. Built as a TypeScript framework you extend with code, not a closed product you configure through a UI.
Runs on Lambda, DynamoDB, S3, and CloudFront inside your own AWS account. Scales automatically. No servers to manage. Infrastructure provisioned via IaC (Pulumi) in a single deploy command.
Used in production by teams managing hundreds of millions of content records, petabytes of assets, and thousands of editors Γ’ΒΒ including Amazon, Emirates, Fortune 500 companies, government agencies, and SaaS platforms that white-label Webiny inside their own products.
Documentation ΓΒ· Learn Webiny Course ΓΒ· Community Slack
What's Inside
.png%3Foriginal&w=3840&q=75)
Headless CMS Γ’ΒΒ Custom content models, GraphQL API, field-level permissions, localization, versioning. Models can be defined through the admin UI or in code via the framework.
Website Builder Γ’ΒΒ Visual drag-and-drop page editor with a Next.js SDK. Render pages through your own frontend (Vercel, CloudFront, wherever). Create custom page elements with React components.
File Manager Γ’ΒΒ Digital asset management with CDN delivery, folder structure, tagging, search. Integrated into CMS and Website Builder.
Publishing Workflows Γ’ΒΒ Multi-step content approval with draft states, reviewer assignments, scheduled publishing, and audit trails.
Multi-Tenancy Γ’ΒΒ Native tenant isolation (data, users, assets, permissions) from a single deployment. One instance can host thousands of tenants. Tenants are created and managed programmatically via GraphQL API. Supports hierarchical tenant structures (Root Γ’ΒΒ Brand Γ’ΒΒ Market, Root Γ’ΒΒ Client Γ’ΒΒ Site, etc.).
Webiny Framework Γ’ΒΒ TypeScript framework with lifecycle hooks, dependency injection, GraphQL schema extensions, admin UI extension points, and infrastructure extensions. This is the core Γ’ΒΒ it's what makes Webiny programmable rather than just configurable.
Architecture
Γ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒ
Γ’ΒΒ Your AWS Account Γ’ΒΒ
Γ’ΒΒ Γ’ΒΒ
Γ’ΒΒ Γ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒ Γ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒ Γ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒ Γ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒ Γ’ΒΒ
Γ’ΒΒ Γ’ΒΒ Lambda Γ’ΒΒ Γ’ΒΒ DynamoDB Γ’ΒΒ Γ’ΒΒ S3 Γ’ΒΒ Γ’ΒΒCloudFrontΓ’ΒΒ Γ’ΒΒ
Γ’ΒΒ Γ’ΒΒ (API + Γ’ΒΒ Γ’ΒΒ (Content Γ’ΒΒ Γ’ΒΒ(Assets)Γ’ΒΒ Γ’ΒΒ (CDN) Γ’ΒΒ Γ’ΒΒ
Γ’ΒΒ Γ’ΒΒ business Γ’ΒΒ Γ’ΒΒ storage) Γ’ΒΒ Γ’ΒΒ Γ’ΒΒ Γ’ΒΒ Γ’ΒΒ Γ’ΒΒ
Γ’ΒΒ Γ’ΒΒ logic) Γ’ΒΒ Γ’ΒΒ Γ’ΒΒ Γ’ΒΒ Γ’ΒΒ Γ’ΒΒ Γ’ΒΒ Γ’ΒΒ
Γ’ΒΒ Γ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒ Γ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒ Γ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒ Γ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒ Γ’ΒΒ
Γ’ΒΒ Γ’ΒΒ
Γ’ΒΒ Optional: OpenSearch (full-text search at scale) Γ’ΒΒ
Γ’ΒΒ Optional: VPC deployment, multi-AZ, custom config Γ’ΒΒ
Γ’ΒΒ Γ’ΒΒ
Γ’ΒΒ All provisioned automatically via Pulumi IaC Γ’ΒΒ
Γ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒΓ’ΒΒ
Stack: TypeScript, React, GraphQL, Node.js, Pulumi, AWS serverless services.
What you control: Everything. The IaC templates are open-source. Modify Lambda memory, add CloudWatch alarms, change VPC configuration, add custom AWS resources Γ’ΒΒ it's your infrastructure.
What you don't manage: Servers. Patching. Scaling. Capacity planning. That's the point of serverless.
Quick Start
Prerequisites: Node.js 22+, Yarn, AWS account with programmatic access.
npx create-webiny-project my-project
cd my-project
yarn webiny deploy
First deploy takes 5Γ’ΒΒ15 minutes (AWS provisioning). After that, you get an admin panel URL. Create your first admin account, and you're in.
Local development:
yarn webiny watch admin # React dev server on localhost:3001
yarn webiny watch api # Local Lambda execution environment
New team member onboarding:
git clone <your-repo>
yarn
# Ready to develop
AI-Assisted Development
Webiny ships with an MCP server and AI skills that give AI coding agents (Claude Code, Cursor, Kiro, etc.) deep context about the platform's architecture, extension points, and patterns.
This means you can ask an AI agent to:
- Create content models with specific field types and validation
- Build lifecycle hooks that trigger on content events
- Extend the GraphQL API with custom queries and business logic
- Scaffold admin UI extensions with React components
- Wire integrations with external systems via lifecycle events
- Set up multi-tenant configurations programmatically
The AI produces code that follows Webiny's actual patterns because the MCP server gives it real knowledge of the framework Γ’ΒΒ not generic guesses.
Why this works better on Webiny than most platforms: The framework is strongly typed with explicit extension points. AI-generated code either fits the type system or it doesn't compile. There's no ambiguous plugin API where the AI has to guess. Types enforce correctness.
Getting started with the MCP server:
# The MCP server runs locally inside your Webiny project
# Connect it to your AI coding tool of choice
# See docs for tool-specific setup instructions
Γ’ΒΒ AI-Assisted Development Guide
Extending Webiny
All customization happens in the extensions/ folder and is registered in webiny.config.tsx. Four extension types:
API Extensions Γ’ΒΒ Custom GraphQL schemas, resolvers, lifecycle hooks, business logic.
// extensions/NotifyOnPublish.ts Γ’ΒΒ Example: send Slack notification when content is published
class NotifyOnPublish implements CmsLifecycleHook.Interface {
constructor(private slackService: SlackService.Interface) {}
async afterPublish(params: AfterPublishParams): Promise<void> {
await this.slackService.notify(`Content published: ${params.entry.title}`);
}
}
Admin Extensions Γ’ΒΒ Custom UI components, white-label branding, new views, tenant-specific themes. Standard React Γ’ΒΒ use any patterns and libraries you already know.
Infrastructure Extensions Γ’ΒΒ Modify AWS resources via Pulumi. Add Lambda functions, S3 buckets, CloudWatch alarms, or change existing resource configuration.
CLI Extensions Γ’ΒΒ Custom commands for deployment workflows, data migrations, code generators.
Γ’ΒΒ Extensions Guide
When to Use Webiny
- You need a self-hosted CMS and don't want to run servers
- You need multi-tenancy as a first-class primitive, not a workaround
- You want to extend the CMS with real code (TypeScript), not just configuration
- You need to embed a CMS inside your own product (white-label)
- Data ownership and compliance requirements rule out SaaS CMS
- You want AI agents to be able to build on your content platform effectively
- You're on AWS (or planning to be)
When Not to Use Webiny
Be honest with yourself about these:
- Simple sites or blogs. Webiny is built for complex projects. If you need a blog with 10 pages, use something simpler.
- Not on AWS. Webiny only runs on AWS. No GCP, no Azure, no on-prem. If that's a dealbreaker, it's a dealbreaker.
- No TypeScript/React skills on the team. The entire extension model is TypeScript and React. If your team works in a different stack and doesn't want to adopt these, Webiny won't be a good fit.
- You want a no-code, plug-and-play SaaS CMS. Webiny is a platform for developers to build on. If you want zero development involvement, this isn't it.
Licensing
Community Edition Γ’ΒΒ MIT license. Free forever. Includes Headless CMS, Website Builder, File Manager.
Business Edition Γ’ΒΒ Commercial license starting at $79/mo. Adds RBAC, multi-tenancy, publishing workflows.
Enterprise Edition Γ’ΒΒ Custom pricing. Adds SSO, audit logs, team management, priority support, managed hosting option.
All plans: unlimited content entries, pages, assets, API calls, roles, and workflows. No per-seat pricing traps. No API metering.
Γ’ΒΒ Pricing Details
Project Structure
my-webiny-project/
extensions/ # Your custom code lives here
public/ # Admin app static assets
webiny.config.tsx # Project configuration (React components, type-safe)
package.json
tsconfig.json
Single package.json. Single tsconfig.json. Configuration in webiny.config.tsx uses React components for type safety and IDE auto-completion.
Key Commands
npx create-webiny-project <name> # Create new project
yarn webiny deploy # Deploy to AWS
yarn webiny deploy core api # Deploy specific apps
yarn webiny watch admin # Local admin dev server
yarn webiny watch api # Local Lambda dev environment
yarn webiny info # Show endpoints and URLs
yarn webiny destroy # Tear down all AWS resources
Resources
- Learn Webiny Course Γ’ΒΒ Structured course covering architecture, extensions, deployment, and AI-assisted development
- Documentation Γ’ΒΒ Full reference docs
- Community Slack Γ’ΒΒ Community chat
- Website Builder Next.js Starter Γ’ΒΒ Starter kit for rendering Webiny pages with Next.js
Contributing
We welcome contributions. See CONTRIBUTING.md for guidelines.
Before opening a PR, please check existing issues or start a discussion Γ’ΒΒ it helps us give you better guidance and avoids duplicate work.
Top Related Projects
π Strapi is the leading open-source headless CMS. Itβs 100% JavaScript/TypeScript, fully customizable, and developer-first.
The flexible backend for all your projects π° Turn your DB into a headless CMS, admin panels, or apps with a custom UI, instant APIs, auth & more.
The superpowered headless CMS for Node.js β built with GraphQL and React
Payload is the open-source, fullstack Next.js framework, giving you instant backend superpowers. Get a full TypeScript backend and admin panel instantly. Use Payload as a headless CMS or for building powerful applications.
Sanity Studio β Rapidly configure content workspaces powered by structured content
JavaScript library for Contentful's Delivery API (node & browser)
Convert designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual Copilot