138 Repositories
JavaScript shadow-dom Libraries
A lightweight function that executes callback when we see specific DOM elements.
did-i-see A lightweight function that executes callback when we see specific DOM elements. Built with IntersectionObserver. 🔴 Demo: https://did-i-see
Generate smooth, consistent and always-sexy box-shadows, no matter the size, ideal for design token generation.
smooth-shadow Generate smooth, consistent and always-sexy box-shadows, no matter the size, ideal for design token generation. Demo As Tobias already p
Awesome Books project : An online Book Library. Storing book information using local storage and displaying it as a list on HTML page
This is project is my based on building an online Book Library. Storing book information using local storage and displaying it as a list on html page
This is a basic app that allows user add/remove books from a list of books. It was created by using JavaScript arrays and objects to dynamically modify the DOM.
Awesome-Books This application lets you compile a dynamic collection of books using JavaScript. It is a single page app. You enter your book title & a
Incredible resources (with links) to help up-skill yourselves on various fields. Resources like programming, designing, engineering and much more and completely Open Source.
Shiryoku Incredible resources (with links) to help up-skill yourselves on various fields. Resources like programming, designing, engineering and much
A simple todo list app written in javascript and html with basic CSS styling This project makes use of webpack to bundle the code. I implemented 3 functionalities on the this project namely: Add task edit task delete task using Js
My To-Do List A simple todo list app written in javascript and html with basic CSS styling This project makes use of webpack to bundle the code. I imp
Add class(es) to DOM elements while waiting for async action. Promise or callback.
jquery.loading Add class(es) to DOM elements while waiting for async action. Promise or callback. Install The simplest way is to include loading.js in
A pure javascript class for paginating through any number of DOM elements
PurePajinate A pure javascript class for paginating through any number of DOM elements. Inspired by Pajinate, a plugin for jQuery. Options Option Type
adds the *scrollin* and *scrollout* events to jquery, which will fire when any given element becomes (respectively) visible and invisible in the browser viewpori
jQuery.scrolling This plugin adds the scrollin and scrollout events to jquery: these events will fire when any given element becomes visible/invisible
A JavaScript library to watch the DOM changes in a single callback
watchmydom A Javascript library to watch the DOM changes in a single callback Demo Click here to see the detailed demo. Download Minified script file
A powerful and simple JavaScript library provides a history for undo/redo functionality. Just like a time machine! 🕐
UndoRedo.js A powerful and simple Javascript library provides a history for undo/redo functionality. Just like a time machine! 🕐 Installation: Node.j
Creates a table of contents in a DOM element optionally linked to with anchors. No jQuery or other dependencies.
HTML-Contents Creates a table of contents in a DOM element optionally linked to with anchors. No dependencies. @psalmody Get It We're on npm: npm i ht
Provides event handling and an HTMLElement mixin for Declarative Shadow DOM in Hotwire Turbo.
Turbo Shadow Provides event handling and an HTMLElement mixin for Declarative Shadow DOM support in Hotwire Turbo. Requires Turbo 7.2 or higher. Quick
Basic website that allows users to add/remove books from a list. Achieved using JavaScript objects and arrays, dynamically modifying the DOM and adding basic events.
Awesome Books Basic website that allows users to add/remove books from a list. Achieved using JavaScript objects and arrays, dynamically modifying the
Web application that manages your sales team efficiently.
Sales Incentive Management System Overview • Entities • APIs • Demo • Application Properties • Development • Build Overview Problem Statement Creating
jQuery-plugin for add/remove dom-items with renaming form-elements (arrays)
dynamicrows jQuery-plugin for add/remove rows by cloning existing row / renaming form-elements (arrays). Requirements jQuery =2.0 if move-action used
A little JavaScript plugin to generate PDF, XLS, CSV and DOC from JavaScript Object or DOM element only from the frontend!
💫 JavaScript Object to csv, xls, pdf, doc and DOM to html generator 💫 A little JavaScript plugin to generate PDF, XLS, CSV and DOC from JavaScript O
A JavaScript library to shuffle the text content of a DOM element with an animated effect.
shuffle-letters.js A JavaScript library to shuffle the text content of a DOM element with an animated effect. NOTE: This library is a port to vanilla
Colorful shadows for your images. 🎨
cosha Colorful shadows for your images. 🎨 cosha lets you add colorful shadows to your images. Try it out and look for yourself—it really couldn't be
A DOM-merging algorithm
Idiomorph Idiomorph is a javascript library for morphing one DOM tree to another. It is inspired by other libraries that pioneered this functionality:
Minimally viable DOM Document implementation for NativeScript.
DOMiNATIVE Minimally viable DOM Document implementation for NativeScript NOTE THIS IS STILL EXPERIMENTAL. Installation Via npm: npm install dominative
Movie application consuming The Movie DB's API
Movie application consuming The Movie DB's API
Awesome-book is an online library website where a user can store a collection of books. Different book can be added and removed. Built with JavaScript using Dom
Awesome-book Description Awesome-book is an online library website where a user can store a collection of books. Differents book can be added and remo
Million is a lightweight (1kb) Virtual DOM. It's really fast and makes it easy to create user interfaces.
🎦 Watch Video 📚 Read the docs 💬 Join our Discord What is Million? Million is a lightweight (1kb) Virtual DOM. It's really fast and makes it easy t
Tiny js library to make DOM elements movable and resizable .
resizedrag.js Tiny js library to make DOM elements movable and resizable . Demo Here . This library has added resizing functionalities to the existing
A Javascript library to export svg charts from the DOM and download them as an SVG file, PDF, or raster image (JPEG, PNG) format. Can be done all in client-side.
svg-exportJS An easy-to-use client-side Javascript library to export SVG graphics from web pages and download them as an SVG file, PDF, or raster imag
Collection of CSS box-shadows for every taste contains more than 100 simple, beautiful and airy shadows.
Vue Box-shadows Collection of CSS box-shadows for every taste contains more than 100 simple, beautiful and airy shadows. Add beautiful shadow effects
🖱 A JavaScript library for interactively picking DOM elements
pick-dom-element A JavaScript library (written in TypeScript) for interactively picking DOM elements. Usage Create an instance of the ElementPicker cl
Necktie – a simple DOM binding tool
👔 Necktie – a simple DOM binding tool Necktie is a library that binds your logic to the Document Object Model elements in an easy way. It has only ~3
Long shadow jQuery plugin
Long Shadow jQuery Plugin Easy text-shadow with long shadow jquery plugin UNPKG script src="https://unpkg.com/jquery-longshadow"/script Use $(sele
An open-source Typing-effect Library, That enables potential users to add a typing effect to mere DOM Elements.
Typing Effect Library An open-source Typing-effect Library I created. That enables potential users to add a typing effect to mere DOM Elements. Tool P
A work-in-progress HTML sanitizer that strives for: performance like window.Sanitizer, readiness like DOMPurify, and ability to run in a WebWorker like neither of those.
Amuchina A work-in-progress HTML sanitizer that strives for: performance like window.Sanitizer, readiness like DOMPurify, and ability to run in a WebW
This project will be a basic website that allows users to add/remove books from a list. The main objective is to understand how to use JavaScript objects and arrays and dynamically modify the DOM and add basic events.
Awesome-books Awesome Books This project will be a basic website that allows users to add/remove books from a list. This project is part of the Microv
A super tiny Javascript library to make DOM elements draggable and movable. ~500 bytes and no dependencies.
dragmove.js A super tiny Javascript library to make DOM elements draggable and movable. Has touch screen support. Zero dependencies and 500 bytes Gzip
JavaScript library to resize, reduce, or change ranges of DOM elements.
Range.js JavaScript library to resize, reduce, or change ranges of DOM elements using the HTML5 input type="range" element. Usage: Include range.js
Adds `long-press` event to the DOM in 1k of pure JavaScript
long-press-event A 1k script that adds a long-press event to the DOM using CustomEvent and pure JavaScript. Works in IE9+, Chrome, Firefox, Safari as
Lightweight basic CSS style sheets.
Styled CSS Base Lightweight basic CSS style sheets. If you get tired of setting up a comprehensive styling scaffold, you may try returning back to thi
An extension of DOM-testing-library to provide hooks into the shadow dom
Why? Currently, DOM-testing-library does not support checking shadow roots for elements. This can be troublesome when you're looking for something wit
Minimalist Virtual DOM library with JSX and factory pattern for stateful components.
Reflex Reflex JS is a tiny virtual-dom library with factory based functional components. See this example running See more complex demos Table of cont
Screenshots with JavaScript
html2canvas Homepage | Downloads | Questions JavaScript HTML renderer The script allows you to take "screenshots" of webpages or parts of it, directly
Generates an image from a DOM node using HTML5 canvas
DOM to Image What is it dom-to-image is a library which can turn arbitrary DOM node into a vector (SVG) or raster (PNG or JPEG) image, written in Java
Domvas implements the missing piece that connects the DOM and Canvas.
Domvas Overview Domvas implements the missing piece that connects the DOM and Canvas. It gives to the ability to take arbitrary DOM content and paint
📃 Fold up DOM elements like paper
OriDomi Fold up DOM elements like paper Dan Motzenbecker, MIT License @dcmotz Visit oridomi.com for examples, documentation and notes. Read the annota
zoom in on any element in the DOM
zoom.js Enables a minimal JS API for zooming in on specific points or DOM elements. Note that this is only a proof of concept so don't use it for anyt
CSS classes to move your DOM!
CSShake Some CSS classes to move your DOM! Live Demo Download Center You could download the complete csshake.css file or separated files for each shak
Custom Vitest matchers to test the state of the DOM, forked from jest-dom.
vitest-dom Custom Vitest matchers to test the state of the DOM This library is a fork of @testing-library/jest-dom. It shares that library's implement
📸 Generate image using HTML5 canvas and SVG
egami → image README | 中文文档 Generate image using HTML5 canvas and SVG Fork from html-to-image Installation pnpm pnpm add egami npm npm i egami Usage i
Simple, Fast, Secure, Flat-File CMS
Bludit Simple, Fast and Flexible CMS. Bludit is a web application to build your own website or blog in seconds, it's completely free and open source.
Custom alert box using javaScript and css. This plugin will provide the functionality to customize the default JavaScript alert box.
customAlertBoxPlugin Custom Alert Box Plugin Using JavaScript and CSS Author: Suraj Aswal Must Include CSS Code/Default Custom Alert Box Class: /* mus
LiveJSON provides LiveView-like updating for JSON objects rather than DOM elements.
live_json LiveJSON provides LiveView-like updating for JSON objects rather than DOM elements. It works within your existing LiveViews - just use push_
🗿 Surreal - Hyper minimalist jQuery alternative
🗿 Mini jQuery alternative for devs who 💙 ergonomics. Use direct elements or arrays transparently! Locality of behavior (LoB) using me()! It's vanilla querySelector but better!
💊 Event-driven DOM programming in a new style
Capsule v0.5.3 Event-driven DOM programming in a new style Features Supports event-driven style of frontend programming in a new way. Supports event d
Search/Filter beer for beerpong
Beer for Beerpong 🍺 You can search beer to play beer pong 🍻 🏓 You sink it, they drink it LINK Technologies 🚀 React React Router Dom Beer Animation
Keep track of the movies you've watched and create your own movies lists!
Cinematek Keep track of the movies you've watched and create your own movies lists! All the movies informations are provided by The Movie Database Dep
An application that allow users to manage their daily task.
An application that allow users to manage their daily task. They can add and delete a specific task, and even delete all those which already completed buiilt with JavaScript, webpack and experiments with Jest as a unit testing framework
Fast & tiny DOM differ
swapdom Fast & tiny DOM swapper. import swap from './swap-inflate.js' swap(parentNode, oldNodes, newNodes, endNode) swap-deflate.js strategy is small
A simple library that I use for web scraping. Uses htmlparser2 to parse dom.
Docpa A simple library that I use for web scraping. Uses htmlparser2 to parse dom. Usage const Docpa = require("docpa") const doc = new Docpa(`html
An app to manage tasks. A user can add, delete and edit a task and mark it as completed, It uses simple GUI and relies on DOM manipulation in pure JS and using local storage.
An app to manage tasks. A user can add, delete and edit a task and mark it as completed, It uses simple GUI and relies on DOM manipulation in pure JS and using local storage.
Mini Social Media App with a liitle bit of facebook components (Still Developing)
Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np
A small javascript DOM manipulation library based on Jquery's syntax. Acts as a small utility library with the most common functions.
Quantdom JS Quantdom is a very small (about 600 bytes when ran through terser & gzipped) dom danipulation library that uuses a Jquery like syntax and
Medium.com (Redesign with Next.js & Tailwindcss)
Medium.com (Redesign with Next.js & Tailwindcss) It is a redesign of the popular blogging website Medium.com. It is designed with React and Tailwindcs
Webpack vue debug
Click the element of the page, it will open the vscode and jump to the source code of the element automatically
A JSDOM alternative with support for server side rendering of web components
About A JSDOM alternative with support for server side rendering of web components. Happy DOM aim to support the most common functionality of a web br
I forgot about el.outerHTML so I made this, it takes a DOM element and returns its html as string
htmlToString Convert html/DOM element to string Works with rendered and virtual DOM Installation npm install htmltostring Or using CDN script src="ht
Netflix clone, React Advance, scrimba course
Final Project from React Advance in Scrimba, excellent and complex work, features like redirection, HOC's, Hooks, Firebase to authenticated, styled-components and more...
Projeto voltado para aplicação de conhecimentos referente a manipulação da árvore DOM via JavaScript.
Adivinha-número Opa oi oi! Trago aqui um projeto que fiz visando aplicar e testar meus conhecimentos de manipulação da árvore DOM via JavaScript. Você
A Drag-and-Drop library for all JavaScript frameworks implementing an enhanced transformation mechanism to manipulate DOM elements
JavaScript Project to Manipulate DOM Elements DFlex A Drag-and-Drop library for all JavaScript frameworks implementing an enhanced transformation mech
A quick start Create React App template with react-router-dom, material-ui, gh-pages and firebase
A quick start Create React App template with react-router-dom, material-ui, gh-pages and firebase. With google authentication, routing and deployment capabilities built in.
An extensible HTML DOM window manager with a professional look and feel
Wingman An extensible HTML DOM window manager with a professional look and feel. Installation Wingman only requires two files: wingman.css and wingman
🍼 650B Virtual DOM - Use reactive JSX with minimal overhead
🍼 little-vdom Forked from developit's little-vdom gist. npm: npm i @luwes/little-vdom cdn: unpkg.com/@luwes/little-vdom 650B Virtual DOM Components S
TrackIt - Single Page Application that helps the user track their habits.
TrackIt - Single Page Application that helps the user track their habits. Implemented with JavaScript/React and an API server which enables the user to sign-in or sign-up in the app.
Material Design implemented in Web Components (Custom Elements v1)
Material Web Components Material Design implemented in Web Components (Custom Elements v1) https://dannymoerkerke.github.io/material-webcomponents/ Ge
AppRun is a JavaScript library for developing high-performance and reliable web applications using the elm inspired architecture, events and components.
AppRun AppRun is a JavaScript library for building reliable, high-performance web applications using the Elm-inspired architecture, events, and compon
Atomico a micro-library for creating webcomponents using only functions, hooks and virtual-dom.
Atomico simplifies learning, workflow and maintenance when creating webcomponents. Scalable and reusable interfaces: with Atomico the code is simpler
Component oriented framework with Virtual dom (fast, stable, with tooling)
Bobril Main site bobril.com Changelog of npm version: https://github.com/Bobris/Bobril/blob/master/CHANGELOG.md Component oriented framework inspired
Dyo is a JavaScript library for building user interfaces.
Dyo A JavaScript library for building user interfaces. Installation Use a Direct Download: script src=dyo.js/script Use a CDN: script src=unpkg.c
DOM ViewModel - A thin, fast, dependency-free vdom view layer
domvm (DOM ViewModel) A thin, fast, dependency-free vdom view layer (MIT Licensed) Introduction domvm is a flexible, pure-js view layer for building h
Builds components using a simple and explicit API around virtual-dom
Etch is a library for writing HTML-based user interface components that provides the convenience of a virtual DOM, while at the same time striving to
A Fast & Light Virtual DOM Alternative
hyper(HTML) 📣 Community Announcement Please ask questions in the dedicated discussions repository, to help the community around this project grow ♥ A
Javascript (TypeScript) library for building web user interfaces
ivi · ivi is a javascript (TypeScript) library for building web user interfaces. Status Maintenance mode. Bug fixes and documentation updates only. Qu
An inheritable and strong logic template front-end mvvm framework.
Intact 文档 Documents 简介 Intact作为一个可继承，并且拥有强逻辑模板的前端MVVM框架，有着如下特色： 充分利用组合与继承的思想，来最高限度地复用代码 同时支持数据驱动和组件实例化调用，来最便捷地实现功能 强逻辑模板，赋予模板更多功能和职责，来完成业务逻辑和表现逻辑分离 安装
Pure and simple virtual DOM library
Maquette Maquette is a Javascript utility which makes it easy to synchronize the DOM tree in the browser with your data. It uses a technique called 'V
🦁 1kb compiler-augmented virtual DOM. It's fast!
English | 中文 1kb compiler-augmented virtual DOM. It's fast! Current Virtual DOM implementations are inadequate—Ranging from overcomplicated to abando
minimalist virtual dom library
petit-dom A minimalist virtual DOM library. Supports HTML & SVG elements. Supports Render functions and Fragments. Custom components allows to build y
Create DOM element and bind observables on it.
rx-domh Create DOM element and bind observables on it. Inspired by Binding.scala and react-flyd, I made this. Just a simple todo example: /** @jsx h *
A data-binding function for the DOM.
Alert: this library is now deprecated. s2 is its successor. It implements what simulacra does in a better way (using Proxy), and more. Simulacra.js Si
Fast & Robust Front-End Micro-framework based on modern standards
Chat on gitter Hello slim.js - your declarative web components library import { Slim } from 'slim-js'; import { tag, template } from 'slim-js/decorato
Library to build UI based on virtual DOM
vidom Vidom is just a library to build UI. It's highly inspired from React and based on the same ideas. Its main goal is to provide as fast as possibl
A small jQuery plugin that will automatically cast a shadow creating depth for your flat UI elements
#Flat Shadow by Pete R. A small jQuery plugin that will automatically cast a shadow creating depth for your flat UI elements Created by Pete R., Found
A tiny javascript library for obfuscating and revealing text in DOM elements
baffle.js A tiny javascript library for obfuscating and revealing text in DOM elements. camwiegert.github.io/baffle ~1.8kb gzipped ⚡ Dependency-free ?
curtains.js is a lightweight vanilla WebGL javascript library that turns HTML DOM elements into interactive textured planes.
What is it ? Shaders are the new front-end web developpment big thing, with the ability to create very powerful 3D interactions and animations. A lot
Todo App is a single page application for listing tasks
Todo App is a single page application for listing tasks. These tasks that are stored in the local storage can be marked as completed, edited and deleted. It is built using React, Bootstrap and CSS.
Chart.js plugin for more styling options
chartjs-plugin-style Chart.js plugin for more styling options This plugin requires Chart.js 2.6.0 or later. Installation You can download the latest v
a more intuitive way of defining private, public and common routes for react applications using react-router-dom v6
auth-react-router is a wrapper over react-router-dom v6 that provides a simple API for configuring public, private and common routes (React suspense r
A custom element for rendering stylable (light DOM) Markdown
Motivation There are many web components these days to render Markdown to HTML. Here are a few: zero-md marked-element …and I’m sure many others H
Adds `swiped` events to the DOM in 0.7k of pure JavaScript
swiped-events A 0.7k script that adds swiped-left, swiped-right, swiped-up and swiped-down events to the DOM using CustomEvent and pure JS. Based on t
A highly impartial suite of React components that can be assembled by the consumer to create a carousel with almost no limits on DOM structure or CSS styles.
A highly impartial suite of React components that can be assembled by the consumer to create a carousel with almost no limits on DOM structure or CSS styles. If you're tired of fighting some other developer's CSS and DOM structure, this carousel is for you.
Frontend framework for creating reactive UIs using direct DOM manipulation. (WIP)
Cosmos Framework A frontend framework for creating reactive UIs using direct DOM manipulation. (Heavily WIP) How to get started with Cosmos Framework
A platformer game using Phaser3 library and Vanilla JS. This project features the knowledge of Webpack, ES6, JS Modules, Async code, DOM, JSON and Jest tests.
RUNNING BUNNY A platformer game using Phaser3 library and Vanilla JS. This project features the knowledge of Webpack, ES6, JS Modules, Async code, DOM
A personal semantic search engine capable of surfacing relevant bookmarks, journal entries, notes, blogs, contacts, and more, built on an efficient document embedding algorithm and Monocle's personal search index.
Revery 🦅 Revery is a semantic search engine that operates on my Monocle search index. While Revery lets me search through the same database of tens o