Recursive HTML

Have your html file output instantaneously with Recursive HTML!
Recursive HTML is a client-site tool to test and debug little abstractions of code. You write the HTML code, and receive the output recursively and instantaneously.
This tool is a reimagination of the legendary tool Real-time HTML Editor

What it should have:

    Done

  • Pure HTML5 + JS (ES) + CSS3
  • Dark-mode
  • Syntax highlighting
  • Client-side only app
  • Possibility to share link without back-end with base64
  • Single self-contained HTML file
  • Working online and local
  • Possibility to save the content on file
  • Save scroll Position on editor change
  • Capturing: Console.log, console.error, throw new Error('!'), Form submit and Noscript | Example
  • Sublime shortcuts
  • Hold fab button (mobile) & Ctrl + S (Computer) to save it
  • Sniper-like screen to show sizes and scroll offset in canvas | Example

  • Result on a div projecting a shadow-dom
  • Pressing the fab button shows the content sandbox (like an iframe)
  • debug mode with url (@param DEBUG=true) | Example

  • Full page (MAXIMIXED) rendering (@param m=1 + HTML=...) | Example

    • Partially done

  • Mobile friendly (because of a bug in codemirror)

  • Recursive sidebar with HTML elements

  • Context menu with "reverse rendering"

    • Not Done

  • Working offline (Because it doesn't allows it without a service worker)

Preview


Open in a new tab

Flexing

Pagespeed: Score 100%

W3C: Valid CSS

Credits

Hosted on blogger ❤️

Uses Codemirror 5 and Split-js

Using Blogger blank template

Popular posts from this blog