awesome-repositories.com
Blog
awesome-repositories.com

Descoperă cele mai bune repository-uri open source cu căutare AI.

ExploreazăCăutări recomandateAlternative open-sourceSoftware self-hostedBlogHartă site
ProiectDespreCum realizăm clasamentulPresăServer MCP
LegalConfidențialitateTermeni
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·

120 repository-uri

Awesome GitHub RepositoriesComponent-Based Architectures

Patterns for modular UI development.

Distinguishing note: Focuses on the architectural approach of modular, stateful UI elements.

Explore 120 awesome GitHub repositories matching web development · Component-Based Architectures. Refine with filters or upvote what's useful.

Awesome Component-Based Architectures GitHub Repositories

Găsește cele mai bune repo-uri cu AI.Vom căuta cele mai potrivite repository-uri folosind AI.
  • kamranahmedse/developer-roadmapAvatar kamranahmedse

    kamranahmedse/developer-roadmap

    357,434Vezi pe GitHub↗

    Developer Roadmap este o platformă condusă de comunitate care oferă căi de învățare structurate, bazate pe grafuri, pentru ingineria software. Servește drept repository cuprinzător de cunoștințe unde domeniile tehnice sunt organizate în secvențe vizuale pentru a ghida dobândirea competențelor profesionale și creșterea în carieră. Proiectul se distinge printr-un ecosistem colaborativ care permite utilizatorilor să contribuie cu roadmap-uri, să cureție cele mai bune practici din industrie și să mențină profiluri profesionale. Acesta integrează framework-uri de evaluare diagnostică pentru a evalua competența tehnică, ajutând dezvoltatorii să identifice lacunele de cunoștințe și să se pregătească pentru interviurile profesionale prin secvențe de învățare țintite. Dincolo de capabilitățile sale de bază de mapare, platforma oferă idei practice de proiecte și tutorat interactiv pentru a consolida conceptele de inginerie. Oferă un spațiu centralizat pentru ca comunitatea să partajeze resurse, să urmărească dezvoltarea progresivă a competențelor și să navigheze prin peisaje tehnice complexe.

    Structures the interface into modular, reusable elements that manage their own state and presentation logic independently.

    TypeScriptangular-roadmapbackend-roadmapblockchain-roadmap
    Vezi pe GitHub↗357,434
  • vuejs/vueAvatar vuejs

    vuejs/vue

    209,900Vezi pe GitHub↗

    Vue este un framework JavaScript progresiv, bazat pe componente, conceput pentru construirea de interfețe utilizator reactive și aplicații single-page. Se concentrează pe un sistem de template-uri declarativ care transformă HTML-ul în funcții de randare eficiente, permițând dezvoltatorilor să organizeze interfețe complexe în unități izolate, reutilizabile, care se sincronizează automat cu starea aplicației. Framework-ul se distinge printr-un sistem de reactivitate bazat pe urmărirea dependențelor care monitorizează accesul la date în timpul randării pentru a declanșa actualizări precise. Oferă o arhitectură flexibilă care suportă atât adoptarea incrementală ca bibliotecă ușoară, cât și dezvoltarea de aplicații la scară largă. Dezvoltatorii pot utiliza un model de extensibilitate robust, bazat pe plugin-uri, pentru a injecta logică globală, în timp ce reconcilierea virtuală a DOM-ului framework-ului asigură actualizări eficiente ale interfeței prin calcularea mutațiilor minime. Dincolo de capabilitățile sale de randare de bază, proiectul include o suită cuprinzătoare de instrumente pentru gestionarea stării aplicației, rutarea bazată pe URL și randarea pe partea de server. Oferă suport extins pentru compunerea componentelor, distribuția conținutului și gestionarea animațiilor, alături de măsuri de securitate încorporate, cum ar fi escaparea automată a conținutului pentru a preveni vulnerabilitățile comune. Framework-ul este distribuit cu declarații oficiale de tip pentru a susține analiza statică și poate fi instalat prin manageri de pachete standard sau integrat direct în mediile de browser prin tag-uri script.

    Organizes user interfaces into isolated, reusable units that encapsulate their own logic, styles, and template structure.

    TypeScriptframeworkfrontendjavascript
    Vezi pe GitHub↗209,900
  • elemefe/elementAvatar ElemeFE

    ElemeFE/element

    54,116Vezi pe GitHub↗

    Element is a Vue.js UI component library and web UI toolkit. It provides a collection of pre-styled user interface components and modular building blocks used to build web applications. The project includes a customizable CSS theme framework, allowing for the modification of visual styles and brand requirements through theme tools and generators. The toolkit covers frontend component management, custom web theming, and a workflow for rapid prototyping.

    Implements a modular UI architecture where visual elements and behavior are encapsulated into reusable Vue components.

    Vuecomponentselement-uijavascript
    Vezi pe GitHub↗54,116
  • ionic-team/ionic-frameworkAvatar ionic-team

    ionic-team/ionic-framework

    52,539Vezi pe GitHub↗

    Ionic Framework is a cross-platform UI toolkit and hybrid app framework used to build native-quality mobile and progressive web applications using HTML, CSS, and JavaScript. It functions as a web component library that enables the deployment of a single codebase across iOS, Android, and the web. The framework features a platform-adaptive design system that automatically switches the visual style of components to match the design patterns of the host operating system. It utilizes a web-component-based architecture with CSS custom properties for global theming and specialized bindings to synchr

    Utilizes a web-component-based architecture to ensure consistent UI behavior across different JavaScript frameworks.

    TypeScriptangularcapacitorframework
    Vezi pe GitHub↗52,539
  • styled-components/styled-componentsAvatar styled-components

    styled-components/styled-components

    41,094Vezi pe GitHub↗

    styled-components is a CSS-in-JS styling library and tool for React components. It provides a cross-platform UI styling API and a dynamic theme management system to maintain consistent design tokens and encapsulate visual logic, preventing global scope conflicts. The library utilizes a unified interface that works across both web environments and native mobile frameworks. It enables the definition of styles using JavaScript and TypeScript template literals, allowing CSS to be bound directly to components. The system supports dynamic prop-based styling, style inheritance, and the creation of

    Enables a modular UI approach where visual styles are tightly coupled to the component's logic and properties.

    TypeScriptcsscss-in-jsreact
    Vezi pe GitHub↗41,094
  • freecodecampchina/freecodecamp.cnAvatar FreeCodeCampChina

    FreeCodeCampChina/freecodecamp.cn

    37,712Vezi pe GitHub↗

    This project is an interactive coding learning platform and open-source educational courseware designed for mastering web development. It provides a browser-based environment where users can engage with a structured curriculum covering front-end, back-end, and data visualization skills through hands-on exercises. The platform distinguishes itself by integrating a browser-based code sandbox and a nonprofit technical partnership portal. This framework allows learners to transition from guided lessons to building and maintaining real-world software applications for nonprofit organizations. The

    Uses a component-based architecture to build a modular user interface for curriculum navigation and the workspace.

    CSScareercertificationcn-freecodecamp
    Vezi pe GitHub↗37,712
  • yewstack/yewAvatar yewstack

    yewstack/yew

    32,696Vezi pe GitHub↗

    Yew is a framework for building front-end web applications using Rust and WebAssembly. It provides a component-based architecture that allows developers to create modular, reusable user interface elements that manage their own state and logic. By compiling code into binary modules, the framework enables high-performance execution within modern browser environments. The framework distinguishes itself through a macro-based markup language that transforms declarative, HTML-like syntax into strongly-typed component structures during compilation. It features a robust server-side rendering engine t

    Creates modular and reusable interface elements that manage their own state and logic.

    Rustasmjsconcurrencyelm
    Vezi pe GitHub↗32,696
  • youzan/vantAvatar youzan

    youzan/vant

    24,323Vezi pe GitHub↗

    Vant is a mobile UI library and component framework for Vue, providing a collection of lightweight, reusable interface elements optimized for small screens and touch interactions. It serves as a mobile component library and accessible web UI kit designed to integrate with Vue's reactivity and state management. The framework functions as a themable design system, allowing for visual branding and dark mode support through customizable theme variables. It includes built-in tools for internationalization to localize user interfaces across different geographic regions. The library covers a broad

    Builds the interface using a tree of independent, reusable Vue components that manage their own state.

    TypeScript
    Vezi pe GitHub↗24,323
  • react-bootstrap/react-bootstrapAvatar react-bootstrap

    react-bootstrap/react-bootstrap

    22,608Vezi pe GitHub↗

    React Bootstrap is a frontend component framework and responsive UI kit that translates the Bootstrap CSS framework into a React-based component architecture. It provides a collection of reusable, pre-styled interface elements and grid systems designed for consistent, responsive web development. The library distinguishes itself by wrapping raw HTML markup in React components to manage accessibility and stateful behaviors. It utilizes a centralized theme provider to propagate global configuration and breakpoints, while employing portal-based rendering for overlays to prevent clipping issues.

    Provides React components that wrap Bootstrap HTML to manage accessibility and stateful behaviors.

    TypeScriptbootstraphacktoberfestjavascript
    Vezi pe GitHub↗22,608
  • resend/react-emailAvatar resend

    resend/react-email

    19,350Vezi pe GitHub↗

    React Email is a development framework for designing and testing HTML emails using a library of modular components. It provides a set of reusable UI primitives that allow developers to build email templates through declarative code, ensuring consistent visual presentation across various desktop and mobile email service providers. The framework functions by transforming component trees into static HTML markup, automatically handling the complex requirements of email client rendering. It includes a built-in engine that extracts style declarations and injects them directly into HTML elements, by

    Provides an abstraction layer that maps declarative UI components into reliable, email-compatible HTML tables and inline styles.

    TypeScriptemailhacktoberfest
    Vezi pe GitHub↗19,350
  • stackblitz-labs/bolt.diyAvatar stackblitz-labs

    stackblitz-labs/bolt.diy

    19,005Vezi pe GitHub↗

    Bolt.diy is a browser-based integrated development environment designed for full-stack web application construction. It functions as an AI-powered development platform that automates project scaffolding, code generation, and application deployment directly within the browser. The platform distinguishes itself through a secure, isolated execution environment that runs development servers and package managers in a sandboxed container. It utilizes a provider-agnostic model abstraction, allowing users to connect multiple artificial intelligence services to power automated reasoning and code gener

    Structures the development interface using modular, state-driven components that react to live code changes.

    TypeScript
    Vezi pe GitHub↗19,005
  • alibaba/weexAvatar alibaba

    alibaba/weex

    18,532Vezi pe GitHub↗

    A framework for building Mobile cross-platform UI

    Structures mobile apps with reusable, pluggable native UI components and modules for consistent behavior across platforms.

    C++androidiosmobile
    Vezi pe GitHub↗18,532
  • hydralauncher/hydraAvatar hydralauncher

    hydralauncher/hydra

    15,219Vezi pe GitHub↗

    Hydra is a cross-platform desktop application designed to serve as a centralized game library manager. It consolidates video games from multiple sources and platforms into a single, searchable interface, allowing users to organize their collections and manage installations through a unified dashboard. The application distinguishes itself through extensive support for interface personalization and data portability. Users can modify the visual appearance and notification sounds of the launcher by creating or installing community-shared themes. Furthermore, the tool includes integrated cloud syn

    Employs a component-based architecture to manage state-driven visual updates and user interactions.

    TypeScript
    Vezi pe GitHub↗15,219
  • primefaces/primevueAvatar primefaces

    primefaces/primevue

    14,457Vezi pe GitHub↗

    PrimeVue is a UI component library and design system for Vue. It provides a structured collection of interactive interface elements, widgets, and visual building blocks that integrate with the Vue reactivity system to accelerate web development. The framework enables the creation of responsive web designs and enterprise dashboards through a consistent set of pre-styled components. It supports custom theme implementation and rapid frontend prototyping to maintain a uniform user experience across applications. The system utilizes a component-based architecture and a design token approach. It e

    Implements a modular UI architecture using stateful, reusable components for consistent application styling.

    Vuenuxtnuxtjsvue
    Vezi pe GitHub↗14,457
  • angular/angular-seedAvatar angular

    angular/angular-seed

    13,373Vezi pe GitHub↗

    Angular-seed is a boilerplate project designed to facilitate the development of modular web applications. It provides a structured environment for building user interfaces through a component-based architecture, where logic, styles, and templates are encapsulated into self-contained units. The framework utilizes a dependency injection container to manage object lifecycles and promote modularity across the codebase. It supports reactive data binding and two-way synchronization between the data model and the view layer, ensuring that the user interface reflects the current application state. T

    Constructs user interfaces using a hierarchical tree of self-contained, modular components.

    JavaScript
    Vezi pe GitHub↗13,373
  • hiteshchoudhary/chai-aur-reactAvatar hiteshchoudhary

    hiteshchoudhary/chai-aur-react

    12,808Vezi pe GitHub↗

    This project is an educational course and a collection of frontend projects designed to teach the core concepts and architecture of the React library. It serves as a practical guide for building modular user interfaces through a series of hands-on project builds. The repository includes a technical implementation of a custom React renderer, demonstrating how to transform JSX elements into a document object model. It further provides examples of state management, specifically illustrating how to share global data across a component tree using the provider pattern to avoid property drilling. T

    Teaches the construction of modular interfaces by composing independent, reusable UI components.

    JavaScript
    Vezi pe GitHub↗12,808
  • macrozheng/mall-admin-webAvatar macrozheng

    macrozheng/mall-admin-web

    12,556Vezi pe GitHub↗

    This project is a Vue 3 e-commerce administration dashboard designed as a centralized backend manager for online stores. It provides a web-based interface for overseeing store settings, product catalogs, and general business workflows using the Element Plus component library. The system integrates a business intelligence dashboard for visualizing financial metrics and operational performance through interactive charts and reports. It features a content management system for editing rich text and controlling promotional banners, alongside a role-based access control interface to restrict sensi

    Utilizes a component-based architecture by composing reusable Element Plus components into complex administration pages.

    Vueaxioselement-uiv-charts
    Vezi pe GitHub↗12,556
  • netease/pomeloAvatar NetEase

    NetEase/pomelo

    11,880Vezi pe GitHub↗

    Pomelo is a distributed Node.js game server framework designed for building scalable multiplayer game backends and real-time web applications. It employs a multi-process architecture to distribute application logic horizontally across a cluster of machines, enabling high concurrency and balanced network traffic. The framework utilizes a WebSocket communication layer to manage bidirectional data exchange between diverse web clients and server clusters. It incorporates a remote procedure call system for triggering functions across remote server processes and uses Protocol Buffers for binary ser

    Allows the creation of custom modules to add specialized functionality to the core server architecture.

    JavaScript
    Vezi pe GitHub↗11,880
  • zyronon/douyinAvatar zyronon

    zyronon/douyin

    11,473Vezi pe GitHub↗

    This project is a mobile-first web interface built with Vue 3 that replicates the layout and interaction patterns of a short-form video platform. It is designed as a responsive web application focused on high-performance mobile rendering and short-video workflows. The application features a vertical video carousel with infinite scrolling and a vertical-slide view orchestration system for seamless content playback. It employs a responsive layout using viewport-relative units to ensure consistent rendering across various mobile screen sizes and aspect ratios. The project incorporates Pinia for

    Utilizes a reactive component architecture with a virtual DOM for efficient rendering on mobile devices.

    Vue
    Vezi pe GitHub↗11,473
  • oldboyxx/jira_cloneAvatar oldboyxx

    oldboyxx/jira_clone

    11,064Vezi pe GitHub↗

    This project is a full-stack project management web application designed for organizing work and managing project workflows. It consists of a Node.js TypeScript REST API for server-side business logic and a React component UI library for the frontend interface. The application implements a board-based task visualization system with customizable status workflows. It provides mechanisms for issue workflow management, including task prioritization and team member assignment to track responsibilities and progress. The system is built with a decoupled client-server architecture using full-stack T

    Builds the interface using a library of modular, reusable React components for visual consistency.

    JavaScript
    Vezi pe GitHub↗11,064
Înapoi12345…6Înainte
  1. Home
  2. Web Development
  3. Component-Based Architectures

Explorează sub-etichetele

  • Component-Based Architectures13 sub-tag-uriPatterns for modular UI development. **Distinct from Component-Based Architectures:** Focuses on the architectural approach of modular, stateful UI elements.