TypeScript JSX

Open-source TypeScript projects categorized as JSX

JSX is an embeddable XML-like syntax. It is meant to be transformed into valid JavaScript, though the semantics of that transformation. JSX is an XML-like syntax extension to ECMAScript without any defined semantics. It's NOT intended to be implemented by engines or browsers.

Top 23 TypeScript JSX Projects

  • solid

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

    Project mention: Resources for understanding the Solid compiler | /r/solidjs | 2023-04-18

    The reactivity core, which is in https://github.com/solidjs/solid This is where you'll see the reactivity runtime implementation. Take note that Solid's reactivity doesn't rely on compile-time magic

  • mitosis

    Write components once, run everywhere. Compiles to React, Vue, Qwik, Solid, Angular, Svelte, and more.

    Project mention: Show HN: Create-multi-lib – Write UI code once, compile to multiple frameworks | news.ycombinator.com | 2023-09-23

    Mitosis (https://github.com/BuilderIO/mitosis) is a fantastic project, but is still in its early stages, and in need of some build tooling. It allows you to "write once, run everywhere" in the sense that you can write a UI component and have it compiled to a React component for use in a React project, a Svelte component for use in a Svelte project, and so on. It does not, however, support bundling.

    create-multi-lib (run like so `npx create-multi-lib ) is my attempt to contribute a much needed bundling-layer on top of Mitosis.

    It also comes with E2E testing included, and your resulting packages include type-declarations.

  • Appwrite

    Appwrite - The open-source backend cloud platform. The open-source backend cloud platform for developing Web, Mobile, and Flutter applications. You can set up your backend faster with real-time APIs for authentication, databases, file storage, cloud functions, and much more!

  • satori

    Enlightened library to convert HTML and CSS to SVG

    Project mention: All you need to know about metadata in next.js 13 by Anik Routh | dev.to | 2023-09-24

    Examples are available in the Vercel OG Playground.

  • sucrase

    Super-fast alternative to Babel for when you can target modern JS runtimes

    Project mention: Created a simple online JavaScript Playground, it's a place for you to try out your code and ideas. | /r/learnjavascript | 2023-06-20

    Thanks u/OutlandishnessKey953, the playground built with React, Docusaurus(https://docusaurus.io/), CodeMirror(https://codemirror.net/), Sucrase(https://sucrase.io/), etc.

  • fre

    :ghost: Tiny Concurrent UI library with Fiber.

  • unplugin-icons

    🤹 Access thousands of icons as components on-demand universally.

    Project mention: Svelte Libraries / feature completeness | /r/sveltejs | 2023-07-03

    Now i am using https://github.com/antfu/unplugin-icons

  • crank

    The Just JavaScript Framework

    Project mention: A Proposal for an asynchronous Rust GUI framework | news.ycombinator.com | 2023-09-03

    I'm very interested in seeing if using the commonly implemented forms of compiler support for async programming can also be well used for GUI programming. One wishawa[0] is also perusing this approach in Rust but I first came upon this idea from the crank-js[1] authors. It wasn't clear to me why that one never went anywhere. Was it failure with the approach or was React just a good solution in the space? I can say this though, there's something strikingly elegant about those initial samples of using JavaScript generators for components.

    [0]: https://github.com/wishawa/async_ui

    [1]: https://github.com/bikeshaving/crank

  • Amplication

    Amplication: open-source Node.js backend code generator. An open-source platform that helps developers build backends without spending time on boilerplate & repetitive coding. Including production-ready GraphQL & REST APIs, DB schema, DTOs, filtering, pagination, RBAC, & more.

  • babel-plugin-jsx

    JSX for Vue 3

    Project mention: Can you give me an idea on how to implement this in vue? | /r/vuejs | 2022-10-15

    It's also possible to use JSX, as OP's example, using https://github.com/vuejs/babel-plugin-jsx

  • Blaze UI

    Atoms for Blaze UI (by BlazeUI)

  • lume

    🔥 Static site generator for Deno 🦕

    Project mention: Node.js vs. Deno vs. Bun: JavaScript runtime comparison | dev.to | 2023-09-06

    Deno also has a tooling ecosystem around it to enable developers to jumpstart their projects. Fresh is a web framework built for Deno and Lume is their static site generator.

  • vscode-glean

    The extension provides refactoring tools for your React codebase

  • nano

    🎯 SSR first, lightweight 1kB JSX library. (by nanojsx)

    Project mention: That people produce HTML with string templates is telling us something | news.ycombinator.com | 2023-05-26

    for sure not suggesting using E4X as it is, JSX has evolved a lot from E4X. For example, as small implementation such as https://nanojsx.io would be a good start.

  • vue-tsx-support

    TSX (JSX for TypeScript) support library for Vue

  • react-code-blocks

    React code blocks and code snippet components

  • ai-jsx

    The AI Application Framework for Javascript

    Project mention: AI App Development: What you need to know to get started | news.ycombinator.com | 2023-06-27

    AI.JSX (https://github.com/fixie-ai/ai-jsx) is a framework specific to AI App development, but it's built to integrate with React / JS UI development.

    So I think the answer to your question is "both". :) To build an AI app, you need many of the same skills you need to build any other type of app. But it's not like AI is some spooky thing that only ML pros can touch. It's accessible to any dev.

  • skott

    All-in-one devtool to automatically analyze, search and visualize dependencies from JavaScript, TypeScript (JSX/TSX) and Node.js (ES6, CommonJS)

    Project mention: 💉 Test-Driven Development and Dependency Injection are the way | dev.to | 2023-07-26

    Welcome back into these series everyone, past few days have been incredible as skott just reached 130 stars on GitHub, 100k of total downloads and lately around +12k weekly downloads since I started open-sourcing it. It's very far for being mainstream but it's a good start, isn't it? Anyway, let me put my personal satisfaction aside, and let's talk about what you came for!

  • jsx-mail

    Building the future of email with JSX syntax 📜

    Project mention: Acabou de chegar o novo #jsxmail! Use o poder do React para criar templates de e-mail incríveis! | /r/u_Theryston | 2022-12-09
  • jsx-dom

    Use JSX to create DOM elements.

  • next-api-og-image

    :bowtie: Easy way to generate open-graph images dynamically in HTML or React using Next.js API Routes. Suitable for serverless environment.

  • jsonx

    JSONX - Create React Elements, JSX and HTML from JSON

  • classix

    🏛️ The fastest and tiniest utility for conditionally joining classNames.

    Project mention: Classix — a faster and smaller alternative to clsx and classnames for conditionally joining classes | /r/tailwindcss | 2022-09-26
  • core

    A frontend framework for chillout-mode development 🥤 JSX components on generators*, fast mobx-like state management and exclusive cssx style system (by fract)

  • recks

    🐶 React-like RxJS-based framework

  • SurveyJS

    A Non-Cloud Alternative to Google Forms that has it all.. SurveyJS JavaScript libraries allow you to easily set up a robust form management system fully integrated into your IT infrastructure where users can create and edit multiple dynamic JSON-based forms in a no-code form builder. Learn more now.

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 2023-09-24.

TypeScript JSX related posts

Index

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

Project Stars
1 solid 28,981
2 mitosis 9,666
3 satori 8,878
4 sucrase 5,367
5 fre 3,645
6 unplugin-icons 2,987
7 crank 2,579
8 babel-plugin-jsx 1,607
9 Blaze UI 1,550
10 lume 1,479
11 vscode-glean 1,440
12 nano 1,323
13 vue-tsx-support 526
14 react-code-blocks 511
15 ai-jsx 423
16 skott 362
17 jsx-mail 350
18 jsx-dom 242
19 next-api-og-image 208
20 jsonx 160
21 classix 155
22 core 141
23 recks 137
Updating dependencies is time-consuming.
Solutions like Dependabot or Renovate update but don't merge dependencies. You need to do it manually while it could be fully automated! Add a Merge Queue to your workflow and stop caring about PR management & merging. Try Mergify for free.
blog.mergify.com