https://github.com/robbestad/svenjs

A JavaScript framework for composable web apps
https://github.com/robbestad/svenjs

Last synced: 20 days ago
JSON representation

A JavaScript framework for composable web apps

• Host: GitHub
• URL: https://github.com/robbestad/svenjs
• Owner: robbestad
• Created: 2015-08-11T06:31:53.000Z (over 9 years ago)
• Default Branch: master
• Last Pushed: 2018-08-24T10:59:52.000Z (over 6 years ago)
• Last Synced: 2024-11-07T23:52:49.060Z (about 2 months ago)
• Language: JavaScript
• Homepage:
• Size: 861 KB
• Stars: 45
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# SvenJS

A JavaScript framework for composable web apps

# Demos

  - [TodoMVC](http://svenanders.github.io/svenjs-todomvc/) ([Source](https://github.com/svenanders/svenjs-todomvc))

# Releases

 - 2.0.2: ES modules, bug fixes and more!

 - 0.3.2: Added *_beforeMount* life cycle method. 

 - 0.3.1: Added composition (importing components and referencing them in JSX by name). For instance: _const SecondComponent = require("SecondComponent")_. Referenced in _render_ like this: __

 - 0.3.0: Renamed life cycle methods. New names: *_didMount* & *_didUpdate*

# Features

 - Enforced state immutability

 - Minimal file size

# Goals

 - Can be used in a browser script tag (almost there)

 - A web library that enables you to write code that can be accessed both serverside and clientside

 - Built in store implementation (todo)

# Install

Use the npm version:

```bash

  npm install svenjs

```

Build youself. Clone this repo and run

```bash

  npm run build

```

# How to use 

```html

import SvenJs from "svenjs";

SvenJs.create({

    initialState: {

        clicks: 0

    },

    render() {

    const clickFunc = () =>{

      let clicks=this.state.clicks;

      this.setState({clicks: ++clicks });

    }

    return (


            
The Click App

            


              Click me?

            

        


            
Click stats

          
You have clicked on the button {this.state.clicks} times

        

    
)

    }

});

SvenJs.render(App, document.getElementById("app"))

```


## Related Modules

* [svenjsx](https://github.com/svenanders/svenjsx) - JSX as used by SvenJS.

* [svenjsx-loader](https://github.com/svenanders/svenjsx-loader) - Webpack loader for SvenJS.