UnoWeb

Usage

Converting Template To a Jekyll Project

We can get some template from any web(theme) designer, which normally contains a set of html files with also js, css files inside it

node convert.js --from /data/tyolab/themes/boilerplates/vex --to /data/tyolab/mynewweb/client --dry-run true index.html

Converting Temlate to a NextJS Project

Step 1

node convert.js --from /data/tyolab/themes/boilerplates/vex --to /data/tyolab/mynewweb/client --dry-run true --engine nextjs --strip_layout false index.html

Step 2

# Replace All Strings
"\{(.*)\}" -> {$1}

Creating language

Content Editor

UnoWeb includes a built-in content editor for managing text variables and content files extracted from templates. The editor provides a web interface to edit both JSON configuration files and Markdown content files.

Features

• Project Management: Switch between different projects/pages
• File Browser: View and select JSON files (menu.json, footer.json, settings.json) and Markdown files (section0.md, section1.md, etc.)
• Live Editing: Edit content directly in the browser with syntax highlighting
• Auto-save: Save changes with error handling and validation
• Content Types:
  • JSON files: Structured data like menu items, footer links, site settings
  • Markdown files: Long text content with HTML/Markdown formatting

Usage

Start the Content Editor

# Use default client directory
node content-editor.js

# Or specify a custom project path
node content-editor.js /path/to/your/project

The server will start on http://localhost:3001 by default.

Using the Web Interface

1. Open the editor: Visit http://localhost:3001 in your browser
2. Select a project: Click on a project button (e.g., "home", "posts")
3. Choose a file: Select from the sidebar:
   • JSON files (marked with "JSON" badge): menu, footer, settings
   • Markdown files (marked with "MD" badge): section content
4. Edit content: Make changes in the text editor
5. Save: Click "Save Changes" to persist your edits

Content Structure

The editor works with the following directory structure:

project/
├── content/
│   ├── menu.json          # Navigation menu configuration
│   ├── footer.json        # Footer links and settings
│   ├── settings.json      # Site-wide settings
│   ├── home/              # Page-specific content
│   │   ├── section0.md    # Text content sections
│   │   ├── section1.md
│   │   └── ...
│   └── posts/             # Another page
│       └── ...

API Endpoints

The content editor provides REST API endpoints:

• GET /api/projects - List available projects
• GET /api/content/:page - Get markdown content for a page
• POST /api/content/:page/:section - Update markdown content
• GET /api/json/:page - Get all JSON files for a page
• GET /api/json/:page/:file - Get specific JSON file content
• POST /api/json/:page/:file - Update JSON file content

Dependencies

The content editor requires Express.js:

npm install express