This repository is a browser extension for generating two-factor authentication (2FA) TOTP and HOTP codes. It allows users to securely store account secrets (optionally encrypted with a passphrase), generate codes for login, and provides features such as autofill into web pages, cloud backups (Dropbox, Google Drive, OneDrive), and synchronization across browsers. The extension is built with TypeScript and Vue 2.x, using Webpack for bundling and Vuex for state management. It supports multiple browsers (Chrome, Firefox, Edge) and manifests for Manifest V3. The architecture consists of a background service worker (for handling events and cloud sync), a popup UI (for displaying codes and managing accounts), an options page (for settings), content scripts (for autofill and QR code scanning), and an import page. Data flows involve storing encrypted account secrets in browser storage, generating OTPs from these secrets, and securely backing up and restoring data via cloud services or encrypted files. External dependencies include browser APIs, cloud service APIs (OAuth), and cryptographic libraries (argon2-browser, crypto-js, node-gost-crypto). The codebase demonstrates good engineering practices with clear separation of concerns, reusable abstractions for encryption and storage, and a modular structure for UI components and cloud backup providers. It includes internationalization support, a security advisor for recommendations, and a test suite (unit and end-to-end). While the project faces some technical debt due to its reliance on Vue 2.x and complex backup integrations, it remains actively maintained and functional.
This is a monorepo for General Translation (GT), a comprehensive internationalization (i18n) and localization (l10n) platform. It provides runtime libraries for React, Next.js, Vue, React Native, Node.js, and Python frameworks, enabling developers to translate entire React components—not just strings—using a simple `<T>` wrapper. The platform includes a CLI for extracting translatable strings from source code, uploading them to a translation service, and downloading completed translations. A Babel/SWC compiler injects translation hashes at build time, and a Sanity CMS plugin manages document-level translations. The architecture is a multi-package monorepo with shared core types, a compiler pipeline, framework-specific adapters, and a cloud API client. The codebase demonstrates high craftsmanship with clean abstractions like condition stores, singleton caches, batch processing utilities, and a step-based workflow pattern. It is actively maintained with extensive test coverage and modern tooling (pnpm, Turborepo, TypeScript, Vitest).
This is a Nuxt module for device detection that provides a reactive `$device` object and `useDevice()` composable. It determines device type (mobile, tablet, desktop), operating system (iOS, Android, Windows, macOS, Linux), browser (Chrome, Firefox, Edge, Safari, Samsung), and crawler status by parsing the User-Agent header and/or CDN-provided headers (Amazon CloudFront, Cloudflare). The core detection logic is encapsulated in `src/runtime/generateFlags.ts`, which is a standalone, well-tested function. The module is built for Nuxt 3+ (ESM-only) and uses `crawler-user-agents` for crawler detection with a build-time generated regex for performance. The codebase is small, focused, and demonstrates good engineering practices with clean separation of concerns, comprehensive tests, and proper use of Nuxt module APIs.
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.
Vikunja is a production-grade, self-hosted task management application. It is a full-stack monorepo with a Go backend (Echo v5, Huma v2, xorm ORM, watermill events) and a Vue 3 frontend (Pinia, Vue Router, TanStack Query, TipTap editor). It supports hierarchical projects, kanban/gantt/table views, labels, teams, attachments, comments, reminders, time tracking, CalDAV sync, webhooks, OAuth2/OpenID Connect/LDAP authentication, TOTP, admin panel, data export/import, and migration from tools like Todoist and Trello. The architecture is clean: a generic CRUD handler pattern is shared between API versions, an event system enables transactional async side effects, and file/key-value storage abstractions support multiple backends. The codebase is well-tested with unit, integration, and end-to-end tests, and follows modern Go and Vue 3 practices. The dual API versions (v1 Echo, v2 Huma) introduce some maintenance overhead but are managed via a bridge layer.
Inspira UI is a curated collection of beautifully designed, copy-paste-ready Vue/Nuxt UI components, inspired by Aceternity UI and Magic UI. The repository serves both as a component library and a documentation/demo site built with Nuxt 4, Tailwind CSS v4, and a rich ecosystem of animation and WebGL libraries (motion-v, Three.js, OGL, GSAP). The architecture is a standard Nuxt application with i18n (English, French, Chinese), content management via @nuxt/content, and a custom registry system that generates component metadata for CLI installation. Key entry points include the Nuxt configuration (nuxt.config.ts), the app configuration (app.config.ts) for UI theming, and the registry build script (scripts/build-registry.mts) that crawls component files and produces Zod-validated schemas. The primary data flow is static: markdown documentation files in content/ are rendered alongside live interactive playgrounds that allow users to tweak component props via DialKit config panels. External dependencies are heavy but modern, including motion-v for spring animations, Three.js/OGL for WebGL effects, canvas-confetti for particle effects, and @vueuse/core for utilities. The codebase demonstrates consistent patterns (barrel exports, cn() class merging, shader-based backgrounds, context injection for compound components) and a strong emphasis on visual polish and developer experience.
FormKit is a form-building framework for Vue and React, organized as a monorepo of 15+ packages. The architecture is a core (framework-agnostic) node tree that manages form state, validation, schema rendering, and plugins, with separate packages for framework bindings (Vue, React, Nuxt), inputs, validation rules, internationalization (30+ locales), icons, themes (CSS, Tailwind, UnoCSS), addons (multi-step, floating labels, localStorage), a CLI for scaffolding and theme generation, and Zod integration. It uses a schema system (JSON-serializable) to define form layouts and conditional rendering, and a plugin/feature pattern for extensibility. The repository demonstrates high engineering quality: extensive test coverage (unit, type, e2e memory leak tests), well-structured abstractions (observers, message stores, composables), and cross-framework consistency. However, there are minor inconsistencies (license declared as UNLICENSED despite README claiming MIT, incomplete translations in some locales, deprecated packages like @formkit/tailwindcss, and potential brittleness in remote API dependencies in the CLI). Overall, it's a production-grade form solution with solid reusability of its core patterns.
Sidebery is a mature, feature-rich Firefox WebExtension that transforms the browser's sidebar into a highly customizable vertical tab manager. It provides tree-style tab management, integrated bookmarks and history panels, container-based tab isolation, session snapshots, search across tabs/bookmarks/history, context menus, keyboard shortcuts, drag-and-drop, custom CSS theming, and synchronization via Firefox Sync or Google Drive. The codebase is built with Vue 3, TypeScript, and Stylus, and follows a modular architecture with distinct background, sidebar, setup, and popup contexts communicating via a custom IPC framework. The source code reveals deep integration with Firefox's WebExtensions APIs and extensive use of reactive state patterns to maintain synchronized UI across multiple extension pages. The repository is actively maintained (latest commit August 2026) with frequent releases, a comprehensive issue tracker, and continuous integration via GitHub Actions. The code exhibits strong engineering practices: separation of foreground/background services, debounced storage operations, typed IPC actions, and a centralized utility module. However, some modules (notably `tabs.fg.ts` and `sidebar.fg.ts`) are large and tightly coupled, and there are minor signs of technical debt (deprecated settings, hardcoded error strings). Overall, the extension delivers on its promise of a powerful sidebar tab manager with an impressive degree of customization.
Nuxt Security is a Nuxt 3+ module that automatically configures applications to follow OWASP security patterns through HTTP headers and middleware. It provides security response headers (including CSP with nonce/hash support for SSR/SSG), request size and rate limiting, XSS validation, CORS support, and optional features like Basic Auth and CSRF protection. The architecture uses Nitro plugins to integrate with Nuxt's server lifecycle, separating concerns between configuration, middleware, build-time plugins, and runtime hooks. The module handles both SSR and SSG modes appropriately, using nonces for CSP in SSR and computed hashes for SSG, with proper strict-dynamic support.
eslint-plugin-project-structure is a TypeScript-based ESLint plugin that enforces scalable, consistent project architecture through three configurable rules: folder-structure enforcement, file-composition constraints (e.g., `**/*.consts.ts` may only contain variables, `**/*.types.ts` only interfaces/types), and independent-modules enforcement to prevent massive dependency trees. The plugin parses all import syntaxes — ESM, CJS, dynamic `import()`, `require()`, `jest.mock()`, `jest.requireActual()`, plus `ExportAllDeclaration`/`ExportNamedDeclaration` — and validates file paths against micromatch glob patterns. Configuration is provided via JSON files validated against a bundled JSON schema, enabling IDE autocompletion and early error detection. The codebase is a standard ESLint plugin library: rules receive AST nodes and report violations, with utility modules handling import classification, cross-platform path resolution (Windows/POSIX), and multi-pattern glob matching. It is distributed as compiled CommonJS (`dist/index.js`) with a self-referencing dev dependency for integration testing. The project ships with comprehensive tests covering edge cases like Windows paths, `@types/` scoped packages, and external-import detection, plus CI running type checks, format checks, lint, and tests via Yarn 3.6.3.
Slidev is a developer-oriented slide presentation tool that turns Markdown files into interactive, web-based slide decks. The system is built as a monorepo with several packages: a Node.js CLI and Vite-based dev server (`packages/slidev`), a Vue 3 client application (`packages/client`), a markdown parser (`packages/parser`), shared type definitions (`packages/types`), a VS Code extension (`packages/vscode`), and scaffolding tools (`create-app`, `create-theme`). The core workflow involves parsing Markdown slides with frontmatter, rendering them as Vue components with support for code highlighting (Shiki), diagrams (Mermaid, PlantUML, KaTeX), interactive editors (Monaco), animations (v-click, v-mark), and drawing tools. Export capabilities include PDF, PPTX (both raster and editable), PNG, and Markdown via Playwright. The system also includes a Model Context Protocol (MCP) server for AI agent integration, enabling programmatic slide editing. The architecture is modular: the parser handles slide splitting and feature detection, the client provides a rich presentation UI with presenter mode, and the CLI orchestrates build, serve, and export commands. The VS Code extension adds language support, a preview panel, and AI tools. Overall, Slidev is a mature, feature-rich application for creating technical presentations with minimal friction.
ruoyi-vue-pro (芋道) is a large-scale, multi-module enterprise rapid development platform built on Spring Boot 2.7, MyBatis-Plus, and Vue 3. It provides a comprehensive backend infrastructure for building business applications such as ERP, CRM, HRM, MES, WMS, OA, BPM (Flowable), IoT, AI, IM, Pay, Mall, and more. The codebase is structured around a reusable framework layer (`yudao-framework`) with many Spring Boot starters for security, data permission, multi-tenancy, WebSocket, Excel, monitoring, and protection (rate limiting, idempotency). Business modules follow a consistent layered pattern (DO → Mapper → Service → Controller → VO) with MapStruct converters. The system supports MySQL, PostgreSQL, Oracle, SQL Server, and Dameng databases, and integrates with Redis, RabbitMQ, Kafka, RocketMQ for messaging. It includes a code generator, a workflow designer, and AI chat/image/mind-map capabilities. The architecture is modular and well-organized, though the sheer number of modules (20+) introduces some duplication and complexity. Overall, it is a mature, actively maintained project with strong adherence to common enterprise patterns.
This repository is Taro, a large-scale cross-platform application framework that compiles a single React/Vue/Solid codebase to multiple targets: WeChat/Alipay/Baidu/ByteDance/QQ/JD mini-programs, H5 web applications, React Native, and HarmonyOS. It is a monorepo containing over 100 packages coordinated via pnpm workspaces. The architecture spans CLI tooling (`@tarojs/cli`), build runners (Webpack5 and Vite with platform-specific loaders), a runtime layer that simulates DOM/BOM for non-browser targets (`@tarojs/runtime`), platform adapters that map component and API specifications for each target (e.g., `@tarojs/platform-weapp`, `@tarojs/platform-harmony`), and Rust-based SWC plugins for compile-time JSX optimization (`crates/swc_plugin_compile_mode`). The project is actively maintained with a large community (over 37K stars), frequent commits, and thorough testing across packages, including unit, integration, snapshot, and e2e tests. However, some platform-specific stubs (e.g., `temporarilyNotSupport` for Harmony) and multiple parallel Harmony implementations indicate medium technical drift in certain areas.
Open Video Downloader (formerly youtube-dl-gui) is a cross-platform desktop GUI for downloading videos and audio from YouTube and over 1000 other websites, using yt-dlp as its core engine. It provides a queue-based download workflow with features including format/codec selection, subtitle management, SponsorBlock integration, authentication (cookies, tokens, passwords), input filtering (date, size, match filters), and extensive output customization (containers, filename templates, directory organization). The application also manages automatic updates of both itself and its helper binaries (yt-dlp, ffmpeg, ffprobe, deno, AtomicParsley) via a signed manifest. The architecture is a Tauri 2 application with a Rust backend and Vue 3 frontend. The Rust backend handles yt-dlp process management, output parsing (progress, errors, metadata), binary updates, configuration persistence, and concurrent download scheduling. The frontend uses Pinia stores for state management, Vue Router for navigation, and composables for reusable logic. Communication between frontend and backend occurs through Tauri IPC commands and events, with a well-defined command structure in Rust and corresponding listener plugins in TypeScript. Key entry points include src/main.ts (Vue app bootstrap), src-tauri/src/main.rs (Rust entry), src/router.ts (route definitions), and src/plugins/tauriListeners.ts (event listener registration). The primary data flow begins when a user adds a URL: the frontend sends an IPC command to the backend, which runs yt-dlp to fetch metadata, parses the JSON output into structured models, and returns the data to the frontend. The user then configures download options, and the backend spawns a yt-dlp download process, streaming progress events back to the frontend for real-time UI updates. External dependencies include yt-dlp, ffmpeg, ffprobe, deno, AtomicParsley, the SponsorBlock API, system keyring (via Tauri stronghold), and Sentry for error reporting.
VxeTable is a Vue 3 component library for building complex, enterprise-grade data tables and grids. It provides a comprehensive set of features including virtual scrolling for millions of rows, inline editing, Excel-style copy-paste, column resizing/dragging, filtering, sorting, pivot tables, tree/gannt views, and export/import/print. The library is architected as a set of Vue components (VxeTable, VxeGrid, VxeColumn, VxeToolbar, VxeColgroup) with an extensible plugin system based on hooks and renderers. It relies on a companion UI library (vxe-pc-ui) for modals, buttons, selects, and other controls, and uses xe-utils for utility functions. The codebase is large and well-organized, with separate modules for editing, filtering, keyboard navigation, validation, column customization, and export. Performance is a key focus, with virtual scrolling implemented for both X and Y axes. The library supports i18n with over 20 languages and includes a comprehensive theming system with light/dark modes. While primarily a UI component library, it also includes proxy-based server-side data operations in the VxeGrid component. The repository includes a demo application (examples/) for testing features, though the main artifact is the published npm package.
Tencent/wujie is a production-grade micro-frontend framework that achieves native-level isolation by combining iframe sandboxing for JavaScript execution with Web Components (Shadow DOM) for CSS scoping. Unlike other micro-frontend solutions that rely on JavaScript sandbox polyfills (e.g., 'with' statements), Wujie leverages the browser's built-in iframe security model, making it robust against prototype pollution and global variable conflicts. The framework is implemented as a monorepo containing a core library (wujie-core), framework-specific integrations for Vue 2/3 and React, comprehensive examples, and an extensive test suite. The core provides lifecycle APIs (startApp, preloadApp, destroyApp) and supports multiple running modes: alive (keep-alive), singleton (lifecycle-based), and rebuild (full destroy each time). It includes a plugin system for custom asset loaders (HTML, CSS, JS), routing synchronization between main and sub-apps, and a decentralized EventBus for cross-application communication. The architecture handles degradation gracefully: if Proxy or WebComponent is unavailable, it falls back to a pure iframe with Object.defineProperty-based sandbox. The repository exhibits high craftsmanship in several areas: a dedicated EventCleanupTracker for preventing memory leaks, a custom proxy generator that patches cross-realm instanceof checks, and deferred style loading to support libraries like TinyMCE. Integration and unit tests cover lifecycle, plugins, routing sync, and memory leak scenarios. The accompanying documentation site provides detailed guides and API references. However, the codebase shows signs of maintenance burden: the example sub-apps use outdated frameworks (Angular 12, React 16/17), the integration test setup is complex and slow, and the dense patching of native DOM APIs introduces fragility across browser updates. Overall, it is a well-architected and actively maintained solution for micro-frontend orchestration.
Frappe Books is a full-featured, offline-first desktop accounting and inventory management application built with Electron, Vue 3, and a custom ORM framework (fyo) on top of SQLite. It supports double-entry bookkeeping, invoicing (Sales/Purchase/Returns), payment processing, stock management (batches, serial numbers, FIFO valuation), Point of Sale (classic and modern layouts), financial reports (Balance Sheet, P&L, Trial Balance, General Ledger, GST reports), loyalty programs, pricing rules, coupon codes, and multi-currency. The architecture is schema-driven: JSON schema files define document structures, and model classes add business logic via formulas, validations, and lifecycle hooks. The backend runs in the Electron main process and exposes IPC APIs for file operations, database access, and auto-updates. The frontend is a reactive Vue 3 SPA with a comprehensive component library. Regional support (India, Switzerland) is implemented through model overrides and schema extensions. The codebase demonstrates strong engineering practices with a layered architecture, but the custom framework introduces some coupling. It is actively maintained with CI/CD, automated tests, and regular patches.
unplugin-icons is a universal build tool plugin that enables on-demand import of thousands of SVG icons as framework-specific components. It integrates with Vite, Webpack, Rollup, Nuxt, Rspack, and esbuild via the unplugin abstraction. The core architecture consists of a loader that resolves icon paths (e.g., `~icons/mdi/account`), fetches SVG data from Iconify or custom collections, and passes the SVG through a compiler that generates code for Vue 3, React/JSX, Svelte, Solid, Astro, Ember, Qwik, Web Components, or raw SVG strings. Options allow customization of scale, style, class, icon customizer, and auto-install of icon sets. The resolver module enables auto-importing icons as components in Vue/React/Solid projects via unplugin-vue-components or unplugin-auto-import. The codebase is well-structured, with clear separation between build tool adapters, core logic, and compilers. It relies on external dependencies like @iconify/utils for SVG loading and optional peer dependencies for framework-specific compilation.
Vexip UI is a large, TypeScript-first Vue 3 component library with over 78 high-quality components, built as a monorepo with multiple internal packages (`@vexip-ui/utils`, `@vexip-ui/hooks`, `@vexip-ui/config`, `@vexip-ui/icons`, `@vexip-ui/bem-helper`, etc.). It provides a consistent prop system via `useProps`, BEM-based theming, extensive composable hooks, custom directives, and a global configuration provider. The codebase is actively maintained, with comprehensive unit and SSR tests, bilingual documentation (VitePress), and a playground. It follows modern Vue 3 patterns (Composition API, JSX/TSX, TypeScript generics) and demonstrates strong engineering practices in component architecture, state injection, and performance (virtual scroll, lazy rendering, resize observers). While heavily coupled internally, many of its building blocks (e.g., BEM helper, PostCSS plugin, utility functions) are published as standalone packages and are reusable in other Vue projects.
WhatsApp Contact Sync is a web application that synchronizes profile pictures from WhatsApp to Google Contacts. The system uses a client-server architecture with a Vue.js 3 frontend and Node.js/Express.js backend. Users authenticate with WhatsApp via QR code scanning and with Google via OAuth, then the backend matches contacts by phone number (handling international format variations) and transfers profile pictures while respecting Google's API rate limits. The application features real-time progress updates via WebSocket, configurable sync options (manual/automatic), and a contribution-based access model to support server costs.