Quick Start

Here is everything to you need for start a project

Create Project

For start, use singlighter to create a new project

npx singlighter@latest new YOUR_PROJECT_NAME

For example

npx singlighter@latest new blog

This command will creating a directory like it

blog
├── Scripts
│   ├── Accessors
│   ├── Components
│   ├── Hooks
│   │   └── Fisher.js
│   ├── Pages
│   │   └── HomePage.js
│   ├── App.js
│   ├── Router.js
│   └── Singlight.js
├── Styles
│   └── main.css
├── .htaccess
├── index.html
├── nginx.conf
└── singlighter

Now change your directory

cd blog

Editor Setup

SinglightJs use string for create templates and components. PHP Storm Support (and highlight) this syntax but Visual Studio Code Don't

If you need to highlight HTML code in backtick, install es6-string-html extension on Visual Studio Code and write /*html*/ before backtick

template() {
    return /*html*/`
        <h1>Hi there!</h1>
    `;
}

Serving App

For serving SinglightJs app, you need to use node and singlighter

node singlighter serve

This command will creating a server on your localhost and port 8000

If port 8000 is busy, singlighter tries to serve app on port 8001, if port 8001 is busy, tries to serve on port 8002, ...

And you can set a custom port for serving

node singlighter serve 3000 # App will serving on port 3000