Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
September 8, 2022 04:26 pm GMT

100DaysOfCode: Day 04, UI Design with Knott JS Weavv CSS

Image description
Image description

GitHub logo louislow81 / 100DaysOfCode

The 100 Days of Code with HTML, WEAVV CSS, and Vanilla.JS or sometime use Knott.JS to create Web Components


GitHub logo louislow81 / knott.js

A weightless virtual DOM javascript micro web component library for the basic web.

Knott JS

A weightless javascript micro web component library for the basic web.

License: MITnpm versionnpm downloads

Introduction

Knott.JS is a tiny Virtual DOM JavaScript library for creating object-based web components it's called virtual nodes with very basic necessary features to build a simple web application or website.

craft

Use craft() to create virtual nodes commonly everywhere in the project. It takes a selector as a new element, props as attributes, text as string to put on the document, html to add custom non-virtual-node element, optional actions as an event listener, tasks as custom function calls, and expands the array of children elements in the same node with expand: [...]. Read more details below.

craft(  selector, {    props {      id: "",      class: "",      style: "",      // any...    },    text: "TEXT",    html: `<p></p>`,    data: [

GitHub logo weavv / weavv-css-documentation

The official WEAVV CSS documentation website

Netlify Status

image

WEAVV CSS Documentation

Read the official documentation

Developer Tools

  • WEAVV Playground - Online code editor for testing and prototyping UI design with WEAVV.
  • WEAVV CLI - Create empty project on-the-go with example template, written with Vanilla JS web component. Optional to use HTML inline CSS class or to use SASS with @extend directive to extract WEAVV CSS classes in semantic way.

Features

Build

clone the repository,

$ git clone https://github.com/weavv/weavv-css-documentation.git$ cd weavv-css-documentation

install dependencies,

# YARN$ yarn# NPM$ npm i

serve locally,

# YARN$ yarn dev# NMP$ npm run dev

Credits

Nunjunks, Gulp, NodeJS, Sass

MIT

Enjoy!


Original Link: https://dev.to/louislow/100daysofcode-day-04-ui-design-with-knott-js-weavv-css-1d08

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To