TypeScript Code Design

Open-source TypeScript projects categorized as Code Design

Top 23 TypeScript Code Design Projects

  • react-router

    Declarative routing for React

    Project mention: Stateful React Pages using URLSearchParams and Local/Session Storage | dev.to | 2024-01-04

    React Router DOM provides an intuitive way of managing the URL search value of a webpage, it provides the useSearchParams hook that allows accessing the webpage URL search values and also changing the values without reloading the active webpage.

  • react-hook-form

    📋 React Hooks for form state management and validation (Web + React Native)

    Project mention: [React JS] I don't know a better way to handle Forms in React | dev.to | 2024-02-06

    But now, all those difficulties are gone since I found React Hook Form and zod.

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  • TanStack Query

    🤖 Powerful asynchronous state management, server-state utilities and data fetching for the web. TS/JS, React Query, Solid Query, Svelte Query and Vue Query.

    Project mention: React Query Mutations Offline React-Native | dev.to | 2024-02-28

    I trust you found this information beneficial. For further details, please refer to the conversation on this GitHub issue here

  • react-redux

    Official React bindings for Redux

    Project mention: Get out of state management hell with automatic revalidation | dev.to | 2024-01-09

    You add the current user state to a React Context or state management library, read from it on the top bar, and write to it after a user signs in. Done. No big deal, right?

  • electron-react-boilerplate

    A Foundation for Scalable Cross-Platform Apps

    Project mention: How I Used Electron and React to Create a Sweet UI for FFMPEG | dev.to | 2023-12-15

    For a swift and efficient setup, I began by cloning the Electron-React Boilerplate. This boilerplate provided a pre-configured combination of Electron and React, along with Redux and Webpack, setting a solid foundation for the project. This choice allowed me to focus on building the unique features of my application, leveraging the boilerplate's stable and community-tested framework.

  • nx

    Smart Monorepos · Fast CI

    Project mention: Ask HN: Cleanest way to manage Windows OS? | news.ycombinator.com | 2024-02-22

    On Nix, you can declare everything necessary to build a package so you don't need to install packages on your system by yourself. I don't want to put myself into a dependency hell anymore. But I have an idea for this: using docker. Docker separates developing environment from host's system so there would be no pre-installed dependencies. It would be good and I'm considering learning docker. Next thing I'm considering is to use something like [nx](https://nx.dev/). If you have better ideas, please tell me.

    This is pretty much everything I need for my next Windows environment. Every small tips or tricks are welcome.

  • apollo-client

    :rocket:  A fully-featured, production ready caching GraphQL client for every UI framework and GraphQL server.

    Project mention: Things I wish I knew before moving 50K lines of code to React Server Components | news.ycombinator.com | 2023-09-01

    Actually, it's worse than that. Next has started throwing errors if it statically detects you even _importing_ hooks inside of a React Server Component environment:

    - https://github.com/apollographql/apollo-client/issues/10974

    - https://github.com/apollographql/apollo-client/issues/11167

    To the point that Lenz Weber( a maintainer of Apollo Client, and my co-maintainer on Redux Toolkit), is considering resorting to a package that wraps and re-exports all of React's public API just to avoid that static analysis:

    - https://github.com/apollographql/apollo-client/pull/11175

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

  • reselect

    Selector library for Redux

    Project mention: Redux Toolkit 2.0: new features, faster perf, smaller bundle sizes (plus major versions for all Redux family packages!) | /r/reactjs | 2023-12-05
  • react-jsonschema-form

    A React component for building Web forms from JSON Schema.

    Project mention: Framework Interoperable Component Libraries Using Lit Web Components. | dev.to | 2023-10-08

    I've been very passionate about a project called react-jsonschema-form (github, editor). I personally hate writing forms, and love the idea of serializable components, schema, validation all in one. I've always wanted an alternative to this project that offered an alternative to react, and possibly the ability to render a schema form to static HTML (like ssg).

  • formily

    📱🚀 🧩 Cross Device & High Performance Normal Form/Dynamic(JSON Schema) Form/Form Builder -- Support React/React Native/Vue 2/Vue 3

  • react-responsive

    CSS media queries in react - for responsive design, and more.

    Project mention: Media Queries and Responsive Design | dev.to | 2023-09-14

    There are NPM packages like react-responsive that provide custom hooks for easy usage of Media Queries:

  • wouter

    🥢 A minimalist-friendly ~2.1KB routing for React and Preact

    Project mention: Finally switched to Vite after CRA. | /r/reactjs | 2023-07-04

    We're using wouter with great success. It's simple and effective for what we need from a router

  • effector-react

    Business logic with ease ☄️

    Project mention: Global, reactive data store vs local, colocated graphql query? | /r/reactnative | 2023-03-20

    I've been using effector, together with the apollo-client for the last few years and, while it works, it's completely detached from the actual screens. In other words, you need to fetch everything (at startup) you might use at some point and it stays in the memory for the entire duration of the session. Error handling is also tricky as you need to explicitly subscribe to the specific error stores in order to render them. And, if something goes wrong, it's tricky to tell what data is actually used in the current screen, so it's almost impossible to do the Retry efficiently. OTOH the screens are nice and simple - no spinners, the data is just there, thus the app feels (and is) fast.

  • React Figma

    ⚛️ A React renderer for Figma

  • JSONForms

    Customizable JSON Schema-based forms with React, Angular and Vue support out of the box.

    Project mention: Looking for an Android framework for dynamic form creation based on JSON schema | /r/androiddev | 2023-06-04

    I'm currently working on an Android app that requires dynamic form creation based on JSON schema. I came across the website jsonforms.io and was impressed by their framework for generating forms from JSON schema.

  • Router5

    Flexible and powerful universal routing solution

  • universal-router

    A simple middleware-style router for isomorphic JavaScript web apps

  • Kuma UI

    🐻‍❄️ A Headless, Utility-First, and Zero-Runtime UI Component Library ✨

    Project mention: Does it make sense to use new NextJS with UI libraries if I have to put "use client" on top of every page in src/app to make CSS-in-JS work and can't use server components? | /r/reactjs | 2023-06-04

    Kuma UI

  • react-inlinesvg

    An SVG loader component for ReactJS

    Project mention: How Do I Style A SVG That Is In A React Component, Using CSS? | /r/reactjs | 2023-08-13

    https://www.npmjs.com/package/react-inlinesvg demo: https://codesandbox.io/s/github/gilbarbara/react-inlinesvg/tree/main/demo

  • teaful

    🍵 Tiny, easy and powerful React state management

  • rockpack

    Rockpack is a simple solution for creating React Application with Server Side Rendering, bundling, linting, testing within 5 minutes

  • redux-first-history

    Redux history binding support react-router - @reach/router - wouter - react-location

  • aesthetic

    🎨 Aesthetic is an end-to-end multi-platform styling framework that offers a strict design system, robust atomic CSS-in-JS engine, a structural style sheet specification (SSS), a low-runtime solution, and much more! (by aesthetic-suite)

  • WorkOS

    The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.

NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020). The latest post mention was on 2024-02-28.

TypeScript Code Design related posts


What are some of the best open-source Code Design projects in TypeScript? This list will help you:

Project Stars
1 react-router 51,670
2 react-hook-form 38,878
3 TanStack Query 38,641
4 react-redux 23,177
5 electron-react-boilerplate 22,431
6 nx 21,389
7 apollo-client 19,149
8 reselect 18,989
9 react-jsonschema-form 13,483
10 formily 10,570
11 react-responsive 6,857
12 wouter 5,947
13 effector-react 4,452
14 React Figma 2,379
15 JSONForms 1,847
16 Router5 1,725
17 universal-router 1,691
18 Kuma UI 1,590
19 react-inlinesvg 1,236
20 teaful 698
21 rockpack 571
22 redux-first-history 426
23 aesthetic 202
The modern identity platform for B2B SaaS
The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.