t3element/t3headless

Create Custom Element using T3headless

1.0.0 2026-04-21 16:54 UTC

Requires

• b13/container: >=3.1.12
• t3element/t3headlessextend: 1.0.0
• typo3/cms-core: ^13.0 || ^14.0

proprietary

• Milan Pandya

README

T3Headless

Build headless TYPO3 websites without writing frontend components.

T3Headless is a production-ready headless solution for TYPO3 that automatically generates frontend components from TYPO3 Content Blocks and Content Elements.

From TYPO3 backend → to live Next.js components — automatically.

Why T3Headless?

Traditional headless setups require building and maintaining frontend components manually.

T3Headless removes that bottleneck.

• No duplicate work
• No manual component syncing
• No dependency on frontend developers for every change

Key Features

Auto Component Generation (USP)

• Create or update a Content Block / Content Element in TYPO3
• Automatically generates the corresponding Next.js component
• No manual frontend development required

Visual Builder (Inside TYPO3)

• Drag & drop content layout
• Build pages visually
• Headless-ready output

Backend-Controlled Components

• Manage component templates directly in TYPO3 backend
• Update UI without touching frontend codebase

Frontend Stack Options

• Next.js support
• Tailwind CSS or Bootstrap

All-in-One System

• Header / Footer management
• Logo & branding
• Menu builder
• Multi-language support

TYPO3 Compatibility

• TYPO3 v13.x
• TYPO3 v14.x

How It’s Different

• Auto-generated components
• Automatic frontend sync
• Visual builder included
• Full backend control
• Reduced developer dependency

Production Ready

Already used in live client projects before public release.

• Stable and scalable
• Proven in real-world TYPO3 implementations

Architecture Overview

TYPO3 CMS (Backend) ↓ T3Headless Extension ↓ API / Structured Output ↓ Next.js Frontend (Auto-generated components)

Getting Started

1. Install TYPO3 Extension composer require t3element/t3headless

2. Install Frontend Package clone package https://github.com/milancrayon/t3headless-frontend

3. Connect TYPO3

• Set API_LICENSE_KEY in config.js
• For setup use command : "yarn setup" / "npm setup"
• For Theme change : "yarn themebuild" / "npm themebuild"

1. Start Building Create Content Blocks and see components generated automatically

Developer Flexibility

• Override generated components
• Customize templates
• Extend frontend logic

Use Cases

• Corporate websites
• SaaS platforms
• Content-heavy portals
• Multi-language websites

Philosophy

Content should drive the frontend.

License

GNU 2.0 (update if needed)

Links

Documentation: https://document.t3elements.com/
Website: https://t3headless.com