214 Repositories
JavaScript dom-elements Libraries
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
Custom HTML elements for generic components (dropdown, modal...) without style.
Headless elements The goal of this project is to create a library of Custom Elements to stop reinventing the wheel (starting by reinventing the wheel
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
Script para colocar la altura maxima entre el conjunto de elementos.
set-height-elements Script para colocar la altura maxima entre el conjunto de elementos. La principal función de este script es hacer que todos los el
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ê
DoMe is a ToDo App. you can add, delete and reorder elements of the todo list using drag and drop. You can also toggle between dark&light mode
DO ME Todo App Live Preview : DO ME Built With : - ReactJS - TailwindCSS Make sure you have: - Git - Nodejs version 14 or higher (we recommend using
A simple copy of the Reddit app using it's API in React Native
A simple copy of the Reddit app using it's API in React Native
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
Physics on web page elements.
MatterDropdown 0.1 Applies physics to DOM elements and lets you bounce them around with the mouse. Built with matter.js and ismailman/decompose-dommat
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.
Clarity is a scalable, accessible, customizable, open source design system built with web components
Clarity is an open source design system that brings together UX guidelines, design resources, and coding implementations with Web Components
Lightweight web components library built with LitElement.
Aybolit Aybolit is a lightweight, standards-based, framework agnostic UI components library built with LitElement. Aybolit is a fictional character fr
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 ?
An easy way to animate SVG elements.
Walkway I loved the animations for the polygon ps4 review a few months back and decided to create a small library to re-create them (simple demo). It
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
Animate elements as they scroll into view.
Animate elements as they scroll into view. Introduction ScrollReveal is a JavaScript library for easily animating elements as they enter/leave the vie
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.
A simple guide to HTML head elements
🤯 HEAD A simple guide to HTML head elements Table of Contents Recommended Minimum Elements Meta Link Icons Social Facebook Open Graph Twitter Card
Chart.js plugin to display labels on data elements
Overview Highly customizable Chart.js plugin that displays labels on data for any type of charts. Requires Chart.js 3.x. Documentation Introduction Ge
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
🛤 Detection of elements in viewport & smooth scrolling with parallax.
Locomotive Scroll Detection of elements in viewport & smooth scrolling with parallax effects. Installation ⚠️ Scroll-hijacking is a controversial prac
Slide-element - A ~700 byte Promise-based library for animating elements with dynamic heights open & closed. Basically, a modern variant of jQuery's slideUp(), slideDown(), and slideToggle().
slide-element A tiny, accessible, Promise-based, jQuery-reminiscent library for sliding elements with dynamic heights open & closed. To see it in acti
Vue-cursor-fx - 🖱 An animated custom cursor effects for interactive elements like navigation - w/ VueJS - SSR Compatible
🎉 Vue Cursor Fx An animated custom cursor effects for interactive elements like navigation - w/ VueJS - SSR Compatible Installation This package is a
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.
React tooltip is a React.JS Component that brings usefull UX and UI information in selected elements of your website.
React Tooltip ✅ React tooltip is a React.JS Component that brings usefull UX and UI information in elements of your website. Installation ⌨️ React Too
A JavaScript Library for things I use often, as well as some helper functions
Elements A JavaScript Library for things I use often, as well as some helper functions. Full documentation below. Inspired by Habitat, another library
An extremely helpful React Hook to trap the focusable elements / Hello Modals! Hello a11y!
react-use-focus-trap Everytime when people implement Modals... ...People forget that pro users as well as users that are permanently or temporarily re
Convert json data from editorjs to html elements
EditorJs Data Parser Easyly convert json data from editorjs to html elements Installaton npm i editorjs-data-parser yarn add editorjs-data-parser Supp
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
Custom Elements Manifest is a file format that describes custom elements in your project.
@custom-elements-manifest Custom Elements Manifest is a file format that describes custom elements. This format will allow tooling and IDEs to give ri
Free Bootstrap 5 Admin and Dashboard Template that comes with all essential dashboard components, elements, charts, graph and application pages. Download now for free and use with personal or commercial projects.
PlainAdmin - Free Bootstrap 5 Dashboard Template PlainAdmin is a free and open-source Bootstrap 5 admin and dashboard template that comes with - all e
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
Pretty Cool Elements
Pretty Cool Elements Social Media Photo by Jamison McAndie on Unsplash This module is a follow up of this Medium post, and it provides element mixins/
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
A no-dependency, intuitive web framework from scratch in Javascript
Poseidon 🔱 Intro Poseidon is, to use a nice description by Reef, an anti-framework. It's a a no-dependency, component-based Javascript framework for
🔥 Dreamy-db - A Powerful database for storing, accessing, and managing multiple database.
Dreamy-db About Dreamy-db - A Powerful database for storing, accessing, and managing multiple databases. A powerful node.js module that allows you to
A library to add a virtual Trackball to your DOM
Trackball.js - 3D Trackballs for your Website Trackball.js is a small JavaScript library on top of Quaternion.js to enable free 3D rotation of element
A refined tool for exploring open-source projects on GitHub with a file tree, rich Markdown and image previews, multi-pane multi-tab layouts and first-class support for Ink syntax highlighting.
Ink codebase browser, "Kin" 🔍 The Ink codebase browser is a tool to explore open-source code on GitHub, especially my side projects written in the In
A JavaScript library to create html elements with js easily
applecake is a javascript library for making HTML elements with javascript really easy . Why applecake ? Really easy to use It is not heavy It has a s
A ready-to-use project template to build custom elements (web components) with Svelte 3 with support and examples for web components, jest, sass, nested components with props, eslinting, stylelinting, Github actions, propagating custom events from shadow-DOM to real-DOM etc.
svelte-webcomponents If you’re using web-components or if you like the project, please ★ this repository to show your support! 🤩 The world's most eas
A Full Stack Amazon Clone which created using ReactJS with full E-Commerce Functionality!!
Amazon Clone with ReactJS A small web app that tries to imitate the desktop web version of amazon site, you can add items to the basket, delete them,
CSS loading animations with minimal effort!
Whirl CSS loading animations with minimal effort! whirl is a curation of CSS loading animations(whirls! 😅 ). It started as a drop in CSS file to get
A little library that can be used for bursting particles effects on buttons and other elements
Particle Effects for Buttons Bursting particles effects for buttons. By Luis Manuel. Article on Codrops Demo Credits anime.js Basic usage The Particle
👓 Parallax tilt hover effect for React JS - tilt.js
React.js - Tilt.js React version of tilt.js Demo https://vx-demo.now.sh/gallery Install yarn: yarn add react-tilt npm: npm install --save react-tilt U
Bookmarklet to remove sticky elements and restore scrolling to web pages!
Bookmarklet to remove sticky elements and restore scrolling to web pages!
Migrated to https://gitlab.com/powjs/powjs
PowJS PowJS 是一个 ECMAScript 6 编译型 Real-DOM 模板引擎. Real-DOM 直接在 DOM Tree 上编译, 渲染. DOM Tree 就是模板 原生语法 指令与 ECMAScript 原生语法对应 导出视图 采用 ECMAScript 源码 属性插值 非指令
Full CSS support for JSX without compromises
styled-jsx Need help? Full, scoped and component-friendly CSS support for JSX (rendered on the server or the client). Code and docs are for v3 which w
A plugin for Babel v6 which transforms inline styles defined in JavaScript modules into class names so they become available to, e.g. the `className` prop of React elements. While transforming, the plugin processes all JavaScript style definitions found and bundles them up into a CSS file, ready to be requested from your web server.
babel-plugin-css-in-js A plugin for Babel v6 which transforms inline styles defined in JavaScript modules into class names so they become available to
CSS Object Model implemented in pure JavaScript. It's also a parser!
CSSOM CSSOM.js is a CSS parser written in pure JavaScript. It is also a partial implementation of CSS Object Model. CSSOM.parse("body {color: black}")
The epic event-driven, front-end only, reactive JavaScript framework with functionality in one-liner CSS. Over 100 incredible CSS commands for DOM manipulation, ajax, reactive variables, single-page application routing, and lots more. Could CSS be the JavaScript framework of the future?
Active CSS Power-up your CSS with actions! Is the CSS of the future a full-on programming language? Active CSS is a JavaScript plugin that adds event-
🐐 Simple and complete React DOM testing utilities that encourage good testing practices.
React Testing Library Simple and complete React DOM testing utilities that encourage good testing practices. Read The Docs | Edit the docs Table of Co
🙋♀️ 3kb library for tiny web apps
3kb library for tiny web apps. Sometimes, all you want to do is to try and do something—No boilerplate, bundlers, or complex build processes. Lucia ai
A JavaScript Framework for Building Brilliant Applications
mithril.js What is Mithril? Installation Documentation Getting Help Contributing What is Mithril? A modern client-side JavaScript framework for buildi
⚛️ Fast 3kB React alternative with the same modern API. Components & Virtual DOM.
Fast 3kB alternative to React with the same modern API. All the power of Virtual DOM components, without the overhead: Familiar React API & patterns:
Build CRUD apps in fewer lines of code.
CanJS CanJS is a collection of client-side JavaScript architectural libraries. Web Components CanJS’s StacheElement allows you to create Web Component
Next-generation DOM manipulation
Ractive.js - Next-generation DOM manipulation Have any questions or just want to chat? Join us on GitHub Discussions! What is Ractive.js? It's a JavaS
HTML Framework that allows you not to write JavaScript code.
EHTML (or Extended HTML) can be described as a set of custom elements that you can put on HTML page for different purposes and use cases. The main ide
A declarative, HTML-based language that makes building web apps fun
A declarative, HTML-based language that makes building web apps fun 🔥 Docs ∙ Try Online ∙ Contribute ∙ Get Support Intro Marko is HTML re-imagined as
A rich text editor for everyday writing
Trix A Rich Text Editor for Everyday Writing Compose beautifully formatted text in your web application. Trix is a WYSIWYG editor for writing messages
Clean up user-submitted HTML, preserving whitelisted elements and whitelisted attributes on a per-element basis. Built on htmlparser2 for speed and tolerance
sanitize-html sanitize-html provides a simple HTML sanitizer with a clear API. sanitize-html is tolerant. It is well suited for cleaning up HTML fragm
DOMPurify - a DOM-only, super-fast, uber-tolerant XSS sanitizer for HTML, MathML and SVG. DOMPurify works with a secure default, but offers a lot of configurability and hooks. Demo:
DOMPurify DOMPurify is a DOM-only, super-fast, uber-tolerant XSS sanitizer for HTML, MathML and SVG. It's also very simple to use and get started with
:flashlight: Set a spotlight focus on DOM element adding a overlay layer to the rest of the page
Focusable An awesome and lightweight library for performing spotlight in your DOM elements, setting an animated overlay to the rest of the page. You c
An interactive guide for web page elements using jQuery and CSS3
pageguide.js An interactive, responsive, and smart guide for web page elements using jQuery and CSS3. Works great for dynamic pages and single-page ap
Vegas is a jQuery/Zepto plugin to add beautiful backgrounds and Slideshows to DOM elements.
Vegas – Backgrounds and Slideshows Vegas is a jQuery/Zepto plugin to add beautiful backgrounds and Slideshows to DOM elements. Important note: Vegas 2
HTML Framework that allows you not to write JavaScript code.
EHTML (or Extended HTML) can be described as a set of custom elements that you can put on HTML page for different purposes and use cases. The main ide
🌟 DataFormsJS 🌟 A minimal JavaScript Framework and standalone React and Web Components for rapid development of high quality websites and single page applications.
🌟 Welcome to DataFormsJS! Thanks for visiting! 🌠 👍 🌐 🌎 🌏 🌍 中文 (简体) 欢迎来到 DataFormsJS Español Bienvenido a DataFormsJS Português (do Brasil) Bem
A high-performance, dependency-free library for animated filtering, sorting, insertion, removal and more
MixItUp 3 MixItUp is a high-performance, dependency-free library for animated DOM manipulation, giving you the power to filter, sort, add and remove D
The perfect library for adding search, sort, filters and flexibility to tables, lists and various HTML elements. Built to be invisible and work on existing HTML.
List.js Perfect library for adding search, sort, filters and flexibility to tables, lists and various HTML elements. Built to be invisible and work on
A simple and fast API to monitor elements as you scroll
scrollMonitor The scroll monitor allows you to receive events when elements enter or exit a viewport. It does this using watcher objects, which watch
Mobile UI elements for Vue.js
Mint UI Mobile UI elements for Vue 2.0 Homepage Documentation Installation npm i mint-ui -S # for Vue 1.x npm i mint-ui@1 -S Usage Import all compone
🐐 Simple and complete React DOM testing utilities that encourage good testing practices.
React Testing Library Simple and complete React DOM testing utilities that encourage good testing practices. Read The Docs | Edit the docs Table of Co
Examples of how to do query, style, dom, ajax, event etc like jQuery with plain javascript.
You (Might) Don't Need jQuery Frontend environments evolve rapidly nowadays and modern browsers have already implemented a great deal of DOM/BOM APIs
Next-generation DOM manipulation
Ractive.js - Next-generation DOM manipulation Have any questions or just want to chat? Join us on GitHub Discussions! What is Ractive.js? It's a JavaS
:steam_locomotive::train: - sturdy 4kb frontend framework
Choo 🚂 🚋 🚋 🚋 🚋 🚋 Fun functional programming A 4kb framework for creating sturdy frontend applications Website | Handbook | Ecosystem | Contribut