15 dépôts
Component architectures that execute exclusively on the server to reduce client-side bundle size and data fetching overhead.
Explore 15 awesome GitHub repositories matching web development · Server Components. Refine with filters or upvote what's useful.
React est une bibliothèque JavaScript pour créer des interfaces utilisateur basées sur une architecture orientée composants et un flux de données unidirectionnel.
Provides entry points for rendering component trees on a server for initial page delivery.
This project is a cross-platform user interface framework that maps mobile-native component primitives to standard web elements. It enables developers to build consistent applications that function across both mobile and web environments by providing a unified library of components and shared logic. The framework distinguishes itself through a specialized style engine that converts JavaScript object-based declarations into optimized, scoped CSS at runtime. It also features a responsive layout engine that implements a flexbox-based system, ensuring that interfaces adapt dynamically to differen
Enables server-side rendering of component trees to improve initial load performance.
Taxonomy is a full-stack application template and reference implementation built with the Next.js app router. It serves as a comprehensive starter for developing web applications using server components and modern React patterns. The project integrates a variety of specialized systems, including an identity management workflow for OAuth and session handling, and a billing system for managing recurring subscriptions and payment events. It also features a content pipeline that transforms Markdown and JSX files into type-safe data collections for rendering blogs and documentation. The architect
Implements a modern web architecture centered around Next.js server components for optimized rendering.
Taxonomy is a SaaS boilerplate and Next.js application template designed for building subscription-based web applications. It provides a foundational architecture implemented as a TypeScript web framework, utilizing server components and app-router file routing. The project serves as a comprehensive starter for software-as-a-service products, combining user authentication workflows with recurring subscription billing. It further functions as a markdown content site, enabling the creation of blogs or documentation through markdown-to-HTML rendering. The codebase integrates several core capabi
Utilizes a server-component architecture to render application logic on the server and reduce client-side JavaScript.
Awesome Vite is a curated collection of resources, plugins, and templates designed for the Vite build tool ecosystem. It serves as a central directory for developers looking to extend the capabilities of this high-performance frontend build pipeline and module bundler. The project highlights the core strengths of Vite, including its native ESM-based development server, instant hot module replacement, and pre-bundled dependency optimization. By aggregating community-maintained tools, it showcases how to leverage Vite’s plugin-based architecture to customize build pipelines, integrate popular f
Supports modern rendering patterns including server-side component architectures for optimized web applications.
React is a JavaScript library for building user interfaces through the composition of modular, self-contained components. It employs a declarative programming model where developers describe the desired visual state, and the library automatically manages the underlying document updates and state synchronization. By utilizing a virtual representation of the document, it calculates and applies minimal changes to the browser, ensuring efficient rendering even in complex applications. The library distinguishes itself through a sophisticated scheduling system that manages rendering work in increme
Executes components on the server to access data without increasing client-side bundle size.
nuqs is a TypeScript library for managing React component state through the browser's URL query string. It provides a type-safe hook-based approach that synchronizes component state with the address bar, enabling shareable and bookmarkable application states. The library handles parsing and serializing URL query parameters into typed JavaScript values, supporting integers, floats, booleans, dates, and custom types with bijectivity verification. The library distinguishes itself through its comprehensive approach to URL state management, combining batch URL updates that merge multiple parameter
Reads type-safe search parameters in nested server components without prop drilling.
Vinext is a build system and edge runtime compiler that enables framework-agnostic serverless deployments. It functions as a Vite plugin and compatibility layer that emulates file-system routing, server components, and server actions, allowing projects to maintain specific framework API surfaces while targeting edge workers and serverless environments. The project provides a specialized bridge for migrating projects to a Vite-based build pipeline while preserving routing and server component patterns. It utilizes a system of module shimming and adapters to produce standalone bundles compatibl
Processes server-side UI components through a streaming pipeline to deliver nested layouts.
Waku is a minimal React framework built around React Server Components. It renders components exclusively on the server for data fetching and server-side logic, then hydrates client components in the browser for interactivity. The framework supports hybrid rendering, mixing static prerendering at build time with dynamic per-request rendering within a single application, and allows independently loading slice components that can be static or dynamic. The framework distinguishes itself through its file-based routing system that defines pages, layouts, and API endpoints by placing files in a dir
Renders React components exclusively on the server for data fetching, while client components hydrate in the browser for interactivity.
next-i18next is an internationalization library that integrates the i18next ecosystem into Next.js applications, supporting both the App Router and Pages Router. It provides locale-aware routing middleware, server-component translation hydration, and a unified translation management system that works across server and client components. The library handles automatic language detection from browser cookies and HTTP Accept-Language headers, persists user language preferences across sessions, and rewrites URLs with locale prefixes for proper routing. It includes a translation hydration framework
Provides a dedicated translation function for translating text directly inside async Server Components without client hydration.
Lingui is a JavaScript internationalization library that provides a framework-agnostic core with bindings for React, SolidJS, Svelte, Astro, and other JavaScript frameworks. It operates through a compile-time message extraction pipeline that scans source files for translatable strings, generates standard PO, JSON, or CSV catalog files, and compiles them into optimized JavaScript modules for production deployment. The library uses macro-based message definition to wrap translatable text in source code while preserving context for extraction, and includes a plural rule engine that automatically
Flags direct string literals in JSX that should be wrapped with a translation function.
This project is a comprehensive interview preparation guide and technical study resource for React. It functions as a frontend engineering curriculum and coding challenge bank designed to help developers master the internal mechanics, patterns, and core fundamentals of the React ecosystem. The resource distinguishes itself by providing a curated collection of technical interview questions, conceptual quizzes, and expert solutions. It includes a bank of coding challenges that can be solved in a browser-based environment with automated test cases and real-time rendering, as well as research int
Provides study materials on server components that execute exclusively on the server to reduce bundle size.
React on Rails est un framework d'intégration qui intègre des composants React dans les vues Ruby on Rails. Il fonctionne comme un moteur de rendu côté serveur et un orchestrateur de composants full-stack, permettant aux données backend d'être transmises directement aux composants frontend sans avoir besoin d'appels API séparés. Le projet synchronise le routage client-serveur pour maintenir des états de navigation cohérents à travers l'application. Il inclut un pipeline d'assets Webpack pour gérer les bundles JavaScript et implémenter le découpage de code pour une livraison optimisée. Le framework couvre le rendu de vue hybride et l'optimisation des assets frontend, incluant la capacité d'injecter le contexte de requête côté serveur dans le processus de rendu JavaScript. Il fournit également des outils pour diagnostiquer les problèmes d'intégration lors de l'installation ou des mises à niveau.
Passes request-specific server context as props to frontend components to adapt output based on backend state.
Uploadthing est un outil pour intégrer les téléchargements de fichiers dans les applications web, fournissant un système pour accepter et stocker des fichiers via une gestion de fichiers serverless. Il gère le processus de téléchargement de bout en bout, de la création de points de terminaison backend à la diffusion de contenu via un réseau de diffusion de contenu (CDN). Le projet utilise un workflow d'URL pré-signées pour permettre aux clients de télécharger des fichiers directement vers le stockage cloud, réduisant l'entrée serveur. Il dispose d'un système de validation basé sur les routes pour appliquer des contraintes sur les types et tailles de fichiers, aux côtés d'un middleware pour l'autorisation des requêtes et des webhooks de callback sécurisés après téléchargement. La plateforme couvre un large éventail de capacités, incluant la gestion du stockage cloud pour renommer ou supprimer des fichiers et l'implémentation de téléchargements reprenables pour les transferts volumineux. Elle fournit une suite de composants UI, tels que des boutons de téléchargement et des zones de dépôt, qui peuvent être stylisés ou remplacés par des interfaces personnalisées utilisant des hooks composables. Le système est conçu pour un déploiement sur des runtimes edge et des environnements serverless, avec une configuration gérée via des variables d'environnement.
Passes router permissions from server components to the client to remove loading states during initial page load.
Ce projet est une implémentation de React Server Components, fournissant une architecture de composants full-stack qui mélange le rendu côté serveur avec l'interactivité côté client. Il permet le développement d'applications web où les composants côté serveur uniquement pour la récupération de données et les composants clients interactifs coexistent au sein d'un seul arbre de composants. Le système se concentre sur l'orchestration des données serveur-client, permettant l'exécution de fonctions serveur et de mutations de base de données à travers la limite réseau. Il se distingue par une architecture de composants hybride qui déplace l'exécution des composants vers le serveur pour réduire la taille des bundles clients et améliorer les temps de chargement initiaux. Le projet couvre une large gamme de capacités, y compris la récupération de données asynchrone avec suspense, la mémoïsation automatique des composants et l'optimisation du rendu côté serveur. Il inclut également des outils pour gérer l'état complexe, coordonner le chargement des actifs pour éviter les décalages de mise en page, et construire des applications multiplateformes pour le web et le mobile. L'outillage de développement est fourni pour détecter les composants impurs, analyser les dépendances des modules et inspecter les hiérarchies de composants pendant le développement.
Implements a hybrid architecture mixing server-only components for data fetching with interactive client components.