text.js

A simple and lightweight website editor.

Made with javascript and Node.js.

Double-click any text to edit it!

Text.js auto saves right to your HTML file.
Just set it up on your server and you're good to go!

How to Install

Get started with Text.js in two easy ways:

Install and run

The fastest way to install Text.js:

git clone https://github.com/wlr-inc/textjs

Then run node text.js to start the server.

node text.js

Or

Add to your Node server

Integrate Text.js into your own Express app:

app.post('/save', (req, res) => {
    const filename = req.body.filename || 'index.html';

    // Basic security: prevent directory traversal attacks
    if (!filename.match(/^[a-z0-9_\-\.]+$/i)) {
        return res.status(400).send('Invalid filename');
    }

    // Save to the 'public' directory
    const filePath = path.join(__dirname, 'public', filename);

    fs.writeFile(filePath, req.body.html, err => {
        if (err) return res.status(500).send('Error saving file');
        res.send('File saved');
    });
});

Then run node text.js to start the server.

node text.js

Make sure to include the CDN tags in your files

Add to all pages you want to be able to edit:

<link src="https://textjs.tech/text.css"></link>
<script src="https://textjs.tech/text.js"></script>

This will allow you to access the editor.

Documentation

Project folder structure example:

your-project/
├── public/
│   └── index.html
│   └── // other HTML files
├── node_modules/
├── text.js
└── package.json

Setup: Place your HTML files in the public folder on your server. Add the following CDN tags to every page you want to edit:
```
<link src="https://textjs.tech/text.css"></link>
<script src="https://textjs.tech/text.js"></script>
```

Editing: Double-click any text element (headings, paragraphs, buttons, etc.) to start editing, no special class is needed. A toolbar will appear at the bottom for formatting (bold, italic, underline), color, margin, and padding.

Saving: Changes are automatically saved to your HTML file after you edit. The editor removes its own UI before saving, so your HTML stays clean.

Undo: Use "CTRL + Z" to undo changes in Visual Studio Code, just like any other text editor.

API: The editor sends a POST request to /save with your updated HTML. Example:
```
{
  "filename": "index.html",
  "html": "<h1>Your edited HTML here</h1>"
}
```
Your server should handle this endpoint to save the file (see install instructions above).

Run node text.js to start the server.

If you have questions, please email kowskiiocode@gmail.com