create-servoframe

create-servoframe

Create ServoFrame apps with zero configuration.

Usage

# With npm
npm create servoframe my-app

# With yarn  
yarn create servoframe my-app

# With npx
npx create-servoframe my-app

What's Included

The generated project includes:

• Modern project structure with organized source files
• Multiple development approaches:
  • Programmatic API in src/main.js
  • Declarative HTML with <servoframe> tags in src/app.html
  • Auto-detection support
• Example styling with CSS and responsive design
• Interactive JavaScript with event handlers and state management
• Development scripts for quick start
• Documentation with usage examples

Project Structure

my-app/
├── src/
│   ├── main.js          # Application entry point (programmatic API)
│   ├── app.html         # Declarative HTML with <servoframe> tags
│   ├── styles.css       # Application styles
│   └── app.js           # Application JavaScript
├── package.json         # Project configuration and scripts
├── README.md           # Project documentation
└── .gitignore          # Git ignore rules

Getting Started

After creating your project:

cd my-app
npm install
npm start

Development Approaches

1. Programmatic API

Edit src/main.js to use the ServoFrame API directly:

const { ServoFrame } = require('servoframe');

const app = new ServoFrame({
    title: 'My App',
    width: 1200,
    height: 800,
    resizable: true
});

app.start(htmlContent);

2. Declarative HTML

Use src/app.html with <servoframe> tags:

<servoframe 
    title="My App"
    width="1200" 
    height="800" 
    resizable="true">
    
    <!-- Your app content -->
    
</servoframe>

3. Auto-Detection

ServoFrame can automatically detect and launch HTML files with <servoframe> tags:

node -e "require('servoframe')"

Features

• Cross-platform: Works on macOS, Linux, and Windows
• Web Technologies: Use HTML, CSS, and JavaScript you already know
• High Performance: Powered by Servo rendering engine
• Zero Configuration: Get started immediately with sensible defaults
• Hot Reloading: Fast development cycle
• Modern APIs: Access to both web APIs and Node.js

Requirements

• Node.js 16.0.0 or higher
• npm or yarn package manager

License

MIT - see LICENSE for details.