AdminLTE is a professional, open-source admin dashboard template and UI framework built on Bootstrap 5.3. It provides a comprehensive set of responsive layout components, widgets, and vanilla TypeScript plugins (sidebar push menu, treeview, card widget, direct chat, fullscreen toggling, color mode, sidebar search, accessibility manager) activated via data-lte-* attributes. The architecture is modular: SCSS sources are compiled into a production-ready CSS bundle, and TypeScript sources are bundled into UMD and ESM builds. The project includes an extensive demo site with over 50 pages (dashboard, tables, forms, charts, mailbox, etc.) and a documentation site built with Astro and MDX. It ships with an optional extended color palette (14 WCAG AA-compliant colors) and a runtime primary color switcher, as well as a legacy v3 color compatibility sheet. The repository is the HTML/JS/CSS core; framework-specific editions exist for React, Vue, Angular, Laravel, and others.
Zircle is a JavaScript library for building circular, zoomable user interfaces using native custom elements. It recreates the original Zircle component family (z-canvas, z-view, z-spot, z-list, z-dialog) with Orbit for radial layout and Zumly for zoom navigation, eliminating the previous Vue dependency. The library provides a declarative HTML API via templates and a programmatic controller via `createZircle()`, supporting multiple independent canvases, themes, responsive sizing, and accessibility. Internal components include radial knobs, sliders, scrollbars, and pagination, all built with pointer, keyboard, and reduced-motion support. The architecture separates engine concerns: Orbit handles polar geometry and SVG progress rings; Zumly manages view history, zoom transitions, and hash routing; Zircle provides the component vocabulary and canvas lifecycle. Key entry points are the `z-canvas` custom element for declarative usage and the `createZircle()` function for programmatic integration. External dependencies are limited to @zumer/orbit and zumly, and the build produces ESM, standalone ESM, IIFE, and CSS bundles. The codebase demonstrates strong software craftsmanship with thorough browser tests across Chromium, Firefox, and WebKit, TypeScript declarations, a reusable base class (ZSurface) for light-DOM content distribution, and clean separation of control logic in control-utils.js. Several components (z-knob, z-scroll, z-dialog, z-list) implement complex interactive behaviors in a framework-agnostic way, making them valuable references for custom element development.
TuiCss is a CSS framework and JavaScript library that enables developers to build retro-style text-based user interfaces (TUI) for the web, mimicking the aesthetic of MS-DOS applications and Turbo Vision. It provides a comprehensive set of SCSS components including windows, panels, buttons, forms, tables, charts, modals, progress bars, and a responsive grid system, all styled with high-contrast colors and monospace fonts. The accompanying vanilla JavaScript adds interactivity for tabs, collapsible side navigation, modal dialogs, and live clock displays. The codebase is well-organized with modular SCSS files, a build pipeline using Gulp, and a clean separation of concerns. While the library has no automated tests, its examples demonstrate functional correctness, and the component structure supports straightforward reuse or theming via SCSS variables. The project is published on npm and has a small but active community with a healthy issue tracker.
A client-side single-page web application providing an interactive comparison tool for premium debrid services (AllDebrid, Real-Debrid, TorBox, Premiumize, etc.). It displays pricing, file host support (over 300 hosts), adult host support, usenet availability, and links to tools and community resources. The app is built with vanilla JavaScript (ES modules), Vite, and Workbox for offline support. Data is bundled as static JSON files directly imported at build time. The UI features searchable/filterable tables with lazy rendering, a side-by-side comparison module, dark mode, and responsive design. The codebase is well-structured, modular, and demonstrates good engineering practices including accessibility (ARIA labels, skip link, focus management), performance optimizations (content-visibility, skeleton loaders, debounced search), and a component lifecycle pattern for resource cleanup. It does not have tests or CI/CD pipelines.
SortYourMusic is a client-side web application that lets users sort their Spotify playlists by musical attributes like tempo, energy, danceability, loudness, valence, and more. It uses the Spotify Web API with PKCE OAuth for authentication and runs entirely in the browser with no backend server. The repository contains two versions: an older monolithic implementation (web/) using jQuery, Bootstrap 3, and Underscore.js, and a modern modular rewrite (web2/) using vanilla ES modules, CSS custom properties, and no framework dependencies. The modern version demonstrates clean architecture with separate modules for authentication, API calls, state management, views, and utility functions. Key features include BPM filtering with doubled BPM support, artist separation ordering, and the ability to save sorted playlists as new copies or overwrite existing ones.
This repository contains the starter files and completed solutions for Wes Bos's 'JavaScript30' course - a collection of 30 vanilla JavaScript exercises, each a self-contained mini-application demonstrating a specific browser API or JavaScript pattern. The exercises cover: DOM manipulation and events (Drum Kit, Clock, Whack-a-Mole), modern array methods (Array Cardio Days 1-2), localStorage persistence, HTML5 Canvas drawing, custom video player controls, speech recognition/synthesis, webcam/media devices API, geolocation, CSS variables manipulation, flexbox transitions, sticky navigation, drag-to-scroll, type-ahead autocomplete, shift-click range selection, konami code detection, scroll-triggered animations, dropdown navigation, link highlighting, and various console/debugging techniques. Each exercise exists as a pair: START (boilerplate HTML/CSS) and FINISHED (working solution). The code is intentionally written as inline scripts in HTML files to match the video tutorials, not as modular, reusable components. There are no build tools, test suites, or dependency management (except browser-sync for live-reload in a few exercises). The repo is actively maintained to stay in sync with the course videos, but the content is pedagogically frozen - PRs that improve code but deviate from the videos are explicitly rejected.
Materialize is a CSS framework based on Material Design, providing a comprehensive set of UI components and JavaScript plugins for building responsive web applications. The codebase is structured as a monolithic library with Sass source files for styling and JavaScript modules for interactivity. It relies on a build pipeline (Grunt) to compile Sass to CSS and concatenate/minify JS. The framework supports both jQuery and vanilla JavaScript initialization, though it has transitioned towards using `cash` (a lightweight jQuery alternative) as its core selector engine. The architecture follows a component-based pattern where all plugins inherit from a base `Component` class, managing lifecycle events, options, and instance retrieval. Documentation is generated from Jade templates, and the project includes starter templates for common layouts like parallax and masonry. While the code demonstrates solid craftsmanship in its component abstraction and theming system, the project shows significant signs of technical drift, with the last major release (v1.0.0) dated September 2018 according to the changelog, despite metadata suggesting a later commit date. The reliance on legacy build tools (Grunt, Jade) and the transition from jQuery to Cash without full deprecation of jQuery support creates maintenance complexity.
LobsterBoard is a self-hosted, drag-and-drop dashboard builder implemented as a monolithic Node.js server with a vanilla JavaScript frontend. It provides real-time system monitoring via SSE, 50+ configurable widgets (weather, finance, AI usage, system stats, etc.), a template gallery, custom pages with server-side APIs, and remote server management with ECDH-encrypted polling. The server handles authentication (password/PIN/public mode), secrets management, proxy with SSRF protection, and AI provider integrations. The frontend consists of modular editor components (canvas, drag-drop, properties, export) and a widget library using a simple generateHtml/generateJs pattern. The architecture is straightforward but lacks modern framework abstractions, has some code duplication between source and legacy files, and uses eval for widget JS generation, posing potential security risks. The project is actively maintained (recent commits, CHANGELOG) but shows signs of technical drift: dated JavaScript patterns (var, IIFEs), manual DOM manipulation, and a BSL license that restricts commercial use.