Markdown platform · writer-ir.v1

Γράψε Markdown.
Πάρε HTML, PDF και IR — παντού ίδια.

Ο Writer είναι ένας premium, framework-agnostic Markdown editor με Web Components, ένα σταθερό ενδιάμεσο μοντέλο και SDKs για JavaScript/TypeScript, PHP και Python. Γράφεις μία φορά· το ίδιο document βγαίνει παντού ίδιο.

Κατέβασε το Writer Δοκίμασε τον editor

Χωρίς framework
CDN ή npm
JS/TS · PHP · Python
MIT

writer.gr/playground live

Γράψε εδώ — είναι πραγματικό. Πλήρες playground

32/32conformance fixtures × 3 γλώσσες

3SDKs: JS/TS, PHP, Python

7renderers: HTML, IR, JSON, MD, text, print, PDF

≈130 kBgzip · πλήρες editor + core

v0.2.0 Production & Trust

Έκδοση 0.2.0: ασφάλεια, PDF και παραγωγή.

Sanitization στο IR boundary σε JS, PHP και Python, first-party @writer/pdf, wrappers για React/Vue/Svelte, server examples και 32 conformance fixtures. Χωρίς DOCX/EPUB ή CRDT — μόνο ό,τι είναι πραγματικά έτοιμο.

Δες το changelog

Χαρακτηριστικά

Ένας editor που δεν σου κλείνει την πόρτα.

Ό,τι βλέπεις είναι markdown. Ό,τι βγαίνει είναι δομημένο. Χωρίς framework, χωρίς lock-in, χωρίς δεύτερο draft για το preview.

Framework-agnostic

Web Components, όχι wrapper. Δουλεύει σε plain HTML, React, Vue, Svelte, Astro, Rails, WordPress — οτιδήποτε μπορεί να φορτώσει ένα script.

0 dependencies

WYSIWYG + source + split

Ένα document, πέντε modes. Οι αλλαγές στο DOM γράφονται πίσω σε Markdown — όχι σε ένα δεύτερο, αποσυγχρονισμένο draft.

one document

Writer IR

Ένα σταθερό JSON contract (writer-ir.v1) ανάμεσα σε parser, editor και renderers. Επαληθευμένο σε 32 fixtures × 3 γλώσσες.

frozen contract

Τυπογραφία που ταξιδεύει

Πέντε themes, μεταβλητές, font faces και print CSS. Η ίδια τυπογραφία από τον editor στο HTML και στο PDF — όχι διαφορετικό “κάπως έτσι”.

5 themes

Πραγματικοί πίνακες

Alignment, εισαγωγή/διαγραφή γραμμών και στηλών, header toggle, CSV/TSV paste και keyboard navigation. Πίνακες, όχι σωροί από pipes.

real tables

Media, έξω από τον editor

Providers, όχι hardcoded uploads: memory, HTTP, PHP/Python (local/FTP/SFTP/S3) ή το Writer Media Protocol. Το media manager τρέχει και ως standalone component.

outside the editor

CSS frameworks

Bootstrap, Tailwind, Bulma, Foundation, UIkit. Detection, grid classes, buildGrid() και lint — χωρίς να μαντεύεις class names.

5 frameworks

Plugins με πραγματικό IR

Callouts, footnotes, task lists, TOC, math, mark, attrs, figures, code fences με line highlights. Στο preset ή opt-in — πάντα δομημένα.

FULL_PRESET

PDF χωρίς ψεύτικα bytes

Το @writer/pdf δίνει first-party engine με ενσωματωμένες γραμματοσειρές (DejaVu)· εναλλακτικά Dompdf/ReportLab ή print HTML. Χωρίς renderer ή engine, το asPDF() επιστρέφει NO_PDF_ENGINE — δεν μεταμφιέζει HTML σε PDF.

honest output

Αρχιτεκτονική

Από το πλήκτρο στο renderer, χωρίς μαγικά.

Ο Writer δεν μετατρέπει HTML σε Markdown ελπίζοντας για το καλύτερο. Κρατά ένα κανονικοποιημένο IR και χτίζει όλες τις εξόδους από αυτό.

input Markdown CommonMark + GFM

parse unified / remark mdast

contract Writer IR canonical JSON frozen · v1

render Renderers + SDKs

HTML IR JSON Markdown Text Print / PDF

Το ίδιο IR από JS/TS, PHP και Python — επαληθευμένο σε 32 conformance fixtures.

Γράφεις

WYSIWYG, source ή split. Το ίδιο document, όχι αντίγραφα.

Κανονικοποιείται

mdast → IR με σταθερά IDs, σειρά και attributes. Deterministic.

Επεξεργάζεται

Commands, plugins, tables, media. Κάθε αλλαγή περνά από το ιστορικό.

Βγαίνει

HTML, IR, JSON, Markdown, text, print/PDF. Ίδια δομή, ίδιο περιεχόμενο.

Render lab

Δες το IR να γεννιέται.

Γράψε αριστερά. Το preview, το HTML, το IR και το JSON είναι το ίδιο document — χωρίς server, χωρίς build step.

input.md

— Render-only σελίδα

SDKs

Μία γλώσσα για κάθε layer. Ένα contract για όλες.

Ο editor στο browser, το rendering στον server. Τα τρία SDKs μοιράζονται το ίδιο IR και τα ίδια conformance fixtures.

JavaScript / TypeScript

@writer/core

render.ts

import { WriterRender } from '@writer/core';

const html = WriterRender(markdown).asHTML();
const ir   = WriterRender(markdown).asIR();
const json = WriterRender(markdown).asJSON({}, true);
const pdf  = await WriterRender(markdown).asPDF();

PHP

writer/writer

render.php

use Writer\Writer;

$html = WriterRender($markdown)->asHTML();
$ir   = WriterRender($markdown)->asIR();
$json = WriterRender($markdown)->asJSON(true);
$pdf  = WriterRender($markdown)->asPDF(); // dompdf

Python

writer

render.py

from writer import WriterRender

html = WriterRender(markdown).as_html()
ir   = WriterRender(markdown).as_ir()
json = WriterRender(markdown).as_json(pretty=True)
pdf  = WriterRender(markdown).as_pdf()

Parity: 32 fixtures × κάθε γλώσσα, ελεγμένα στο canonical IR. JS/TS PHP Python writer-ir.v1

Quickstart

Από το μηδέν στο render, σε ένα tab.

Το ίδιο bundle είναι self-hosted στο /assets/writer/. Ένα script tag, ή ένα import — διαλέγεις εσύ.

index.html

<link rel="stylesheet" href="https://writer.gr/assets/writer/writer.css">
<script src="https://writer.gr/assets/writer/writer.min.js"></script>

<div id="editor"></div>
<script>
  const editor = Writer.mount('#editor', {
    value: '# Hello',
    theme: 'serif-editorial'
  });

  editor.addEventListener('wr-change', () => {
    console.log(editor.getMarkdown());
  });
</script>

Editor.tsx

import { useEffect, useRef } from 'react';
import { mount } from '@writer/editor';

export function Editor({ value }: { value: string }) {
  const host = useRef<HTMLDivElement>(null);

  useEffect(() => {
    const editor = mount(host.current!, {
      value,
      theme: 'serif-editorial'
    });
    return () => editor.destroy();
  }, []);

  return <div ref={host} />;
}

render.php

<?php
require 'vendor/autoload.php';

$html = WriterRender($markdown)->asHTML();
$ir   = WriterRender($markdown)->asIR();
$pdf  = WriterRender($markdown)->asPDF(); // DompdfEngine

render.py

from writer import WriterRender

html = WriterRender(markdown).as_html()
ir   = WriterRender(markdown).as_ir()
pdf  = WriterRender(markdown).as_pdf()

Live demos

Μη μας πιστεύεις. Δοκίμασέ το.

Τα demos τρέχουν το πραγματικό bundle — όχι screenshots. Άλλαξε mode, άνοιξε panels, ανέβασε αρχείο, δες το IR.

Playground

Modes, themes, chrome, panels, IR inspector και event log — με πραγματικό editor.

Άνοιξε το playground

Media manager

Standalone component, έξω από τον editor. Folders, upload, insert — με custom provider.

Δες το component

Render-only

Χωρίς editor. Μόνο core: HTML, IR, JSON, text, Markdown και PDF test.

Άνοιξε το render lab

FAQ

Οι ερωτήσεις που κάνουν όλοι.

Είναι δωρεάν;

Ναι. Ο Writer είναι MIT. Μπορείς να κάνεις self-host τα bundles, να τα βάλεις στο CDN σου ή να τα χρησιμοποιήσεις ως έχουν. Δεν υπάρχει κλειδωμένο cloud.

Χρειάζομαι React/Vue/Svelte;

Όχι. Ο editor είναι Web Component. Σε React/Vue/Svelte τον χρησιμοποιείς με ένα ref — χωρίς wrapper library. Το ίδιο ισχύει και για στατικό HTML ή server-rendered σελίδες.

Πού αποθηκεύονται τα media;

Όπου πεις εσύ. Ο browser μιλά σε έναν provider: memory για demos, HTTP για το δικό σου API, local/FTP/SFTP/S3 στις PHP/Python εκδόσεις, ή το Writer Media Protocol. Ο editor δεν υποθέτει filesystem.

Παράγει PDF;

Ναι — με το @writer/pdf στο JS (ενσωματωμένες γραμματοσειρές, απευθείας από το IR) ή με engine/print HTML· στις PHP/Python εκδόσεις υπάρχουν Dompdf/ReportLab. Αν δεν υπάρχει renderer ή engine, το asPDF() αποτυγχάνει με NO_PDF_ENGINE αντί να επιστρέψει HTML με κατάληξη .pdf.

Είναι συμβατό με CommonMark/GFM;

Ναι: CommonMark + GFM (tables, task lists, strikethrough, autolinks, footnotes), συν τα Writer extensions (callouts, math, attrs, marks, TOC, figures). Το round-trip Markdown → IR → Markdown είναι μέρος των tests.

Πόσο μεγάλο είναι το bundle;

Το πλήρες writer.min.js είναι ≈130 kB gzip (editor + core). Το writer-core.min.js, για render-only σελίδες, είναι ≈100 kB gzip. Και τα δύο είναι self-contained — χωρίς framework runtime.

Μπορώ να το βάλω σε WordPress ή Laravel;

Ναι. Στο WordPress φορτώνεις το script και το custom element σε ένα template/block. Στο Laravel χρησιμοποιείς το PHP SDK για server rendering και το JS bundle για τον editor. Δεν απαιτείται συγκεκριμένο CMS.

Το επόμενο κείμενο δεν χρειάζεται framework.

Δοκίμασε τον editor, δες το IR, διάλεξε SDK — ή κατέβασε το bundle και ξεκίνα.

Άνοιξε το playground Κατέβασε το Writer