Skip to content

giosil/wux

Repository files navigation

WUX - Wrapped User Experience

A Javascript library to build component based user interface.

Build

  • git clone https://github.com/giosil/wux.git
  • npm install typescript -g
  • tsc --declaration --project ./ts/wux/tsconfig.json

Gulp

Gulp global installation

  • npm install gulp -g
  • npm install gulp-debug -g
  • npm install gulp-rename -g
  • npm install gulp-sourcemaps -g
  • npm install gulp-typescript -g
  • npm install gulp-uglify -g
  • npm install merge-stream -g
  • npm list -g --depth 0

Gulp local installation

  • npm link gulp
  • npm link gulp-debug
  • npm link gulp-rename
  • npm link gulp-sourcemaps
  • npm link gulp-typescript
  • npm link gulp-uglify
  • npm link merge-stream
  • npm link typescript
  • npm list --depth 0
  • gulp --verify

Gulp build

  • gulp

Example

class HelloWorld extends WUX.WComponent {
  protected render() {
    return '<h1>Hello world</h1>';
  }
}
<!DOCTYPE html>
<html lang="it">
<head>
  <title>WUX</title>
</head>
<body>
  <div id="view-root">

  <script src="js/jquery-3.6.1.min.js"></script>
  <script src="dist/wux.min.js"></script>
  <script src="out/hello.js"></script>
  <script type="text/javascript">
    WuxDOM.render(new HelloWorld(), 'view-root');
  </script>
</body>
</html>

Documentation

SVG Logo

<?xml version="1.0" encoding="utf-8"?>
<svg viewBox="0 0 82 72" xmlns="http://www.w3.org/2000/svg">
  <text style="fill: rgb(0, 0, 0); font-family: Consolas; font-size: 50px;" x="0" y="40">{&#x00B5;}</text>
  <text style="fill: rgb(0, 0, 0); font-family: Consolas; font-size: 14px;" x="7" y="65">micro-wux</text>
</svg>

License

License

Contributors