https://github.com/josnin/libweb

libweb is a library for building Web Components
https://github.com/josnin/libweb

fastify nodejs typescript webcomponent

Last synced: 3 months ago
JSON representation

libweb is a library for building Web Components

• Host: GitHub
• URL: https://github.com/josnin/libweb
• Owner: josnin
• License: mit
• Archived: true
• Created: 2021-09-11T13:14:22.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2023-01-22T13:31:43.000Z (almost 2 years ago)
• Last Synced: 2024-05-01T12:50:57.825Z (8 months ago)
• Topics: fastify, nodejs, typescript, webcomponent
• Language: TypeScript
• Homepage:
• Size: 212 KB
• Stars: 2
• Watchers: 2
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# libweb is a library for building [Web Components](https://developer.mozilla.org/en-US/docs/Web/Web_Components)

* Template syntax

* Data binding

* Event handling

## Use directly in browser

```html 

       

    

   

    

        

     class BindingComponent extends LWElement { 

         __reactive = { username: 'darling' };

         __template = `<input data-bind="username" type="text"/>  {username}`;

     }

     customElements.define('app-root', BindingComponent);

    

    

```

## Create Events

```js

import { LWElement } from 'libweb.js';

class EventComponent extends LWElement { 

  firstname = 'Johny'; // non reactive variable

  __template = `Click Sample event`

  alertMe(arg) {

   alert(`Hello ${arg}`);

  }

 

}

customElements.define('sample-event', EventComponent);

```

### index.html

```html

```

## Installation 

```

npm install

```

## How to run development server? 

```

cd ~/Documents/libweb/

npm run build

npm start

```

### Help

Need help? Open an issue in: [ISSUES](https://github.com/josnin/libweb/issues)

### Contributing

Want to improve and add feature? Fork the repo, add your changes and send a pull request.