TypeScript JSX

Open-source TypeScript projects categorized as JSX Edit details

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: ReactJS vs SolidJS | dev.to | 2022-08-07

    I have had experience with ReactJS for a while, and recently, I found a new interesting framework which is SolidJS. Its community is still very small (~21k stars now on Github), so I'm not sure it's mature enough for enterprise products.

  • mitosis

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

    Project mention: A Quick Guide to Mitosis: Why You Need It and How You Can Use It | dev.to | 2022-05-04

    You might be thinking, "What’s the big deal? It’s all just JavaScript anyway." Sure, you’re right, but the real challenge here is when each of these teams need to coexist within a single brand that has a very specific design system. This is where Builder.io's Mitosis can help you create a single source of truth for all of the reusable components within your Design System.

  • Appwrite

    Appwrite - The Open Source Firebase alternative introduces iOS support . Appwrite is an open source backend server that helps you build native iOS applications much faster with realtime APIs for authentication, databases, files storage, cloud functions and much more!

  • sucrase

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

    Project mention: Should i switch to Typescript? | reddit.com/r/reactjs | 2022-08-05

    First, npm i -D sucrase to install sucrase. Now you can do node -r sucrase/register ./index.ts to run TypeScript code directly with Node.

  • fre

    :ghost: Tiny Footprint Concurrent UI library for Fiber.

    Project mention: Fre: 1KB Concurrency React Alternative | news.ycombinator.com | 2022-03-29
  • crank

    Write JSX-driven components with functions, promises and generators.

    Project mention: What happens if you mix React, Mobx and generators*? Ok, let's do it! | reddit.com/r/javascript | 2022-07-25

    Reminds me of https://github.com/bikeshaving/crank, which was rather fun for a PoC I made a while back.

  • unplugin-icons

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

    Project mention: Which vue-cli plugin for inlining SVG images? | reddit.com/r/vuejs | 2022-06-22

    I will suggest unplugin-icons package

  • Blaze UI

    Atoms for Blaze UI (by BlazeUI)

    Project mention: Does anyone know a good alternative to Bootstrap when working with web components ? | reddit.com/r/WebComponents | 2022-06-15

    https://crayons.freshworks.com/ https://shoelace.style/ https://www.blazeui.com/ https://developer.salesforce.com/docs/component-library/documentation/en/lwc https://docs.microsoft.com/en-us/fluent-ui/web-components/ https://component.kitchen/elix https://nordhealth.design/web-components/

  • SonarLint

    Clean code begins in your IDE with SonarLint. Up your coding game and discover issues early. SonarLint is a free plugin that helps you find & fix bugs and security issues from the moment you start writing code. Install from your favorite IDE marketplace today.

  • babel-plugin-jsx

    JSX for Vue 3

  • vscode-glean

    The extension provides refactoring tools for your React codebase

    Project mention: Issues with Svelte that could be addressed in an open source project? | reddit.com/r/sveltejs | 2022-03-14

    If you guys made something like glean for svelte that would be amazing. It’s a VS Code extension for React that I feel the svelte community needs.

  • lume

    🔥 Static site generator for Deno 🦕 (by lumeland)

    Project mention: Lume, which is the simplest static site generator for Deno | dev.to | 2022-01-12

    $ mkdir lume-example $ cd lume-example $ lume init Use Typescript for the configuration file? [y/N] y How do you want to import lume? Type a number: 1 import lume from "lume/mod.ts" 2 import lume from "https://deno.land/x/lume/mod.ts" 3 import lume from "https:/deno.land/x/[email protected]/mod.ts" [1] Do you want to import plugins? Type the plugins you want to use separated by comma. All available options: - attributes https://lumeland.github.io/plugins/attributes/ - base_path https://lumeland.github.io/plugins/base_path/ - bundler https://lumeland.github.io/plugins/bundler/ - code_highlight https://lumeland.github.io/plugins/code_highlight/ - date https://lumeland.github.io/plugins/date/ - eta https://lumeland.github.io/plugins/eta/ - inline https://lumeland.github.io/plugins/inline/ - jsx https://lumeland.github.io/plugins/jsx/ - liquid https://lumeland.github.io/plugins/liquid/ - modify_urls https://lumeland.github.io/plugins/modify_urls/ - on_demand https://lumeland.github.io/plugins/on_demand/ - postcss https://lumeland.github.io/plugins/postcss/ - pug https://lumeland.github.io/plugins/pug/ - relative_urls https://lumeland.github.io/plugins/relative_urls/ - resolve_urls https://lumeland.github.io/plugins/resolve_urls/ - slugify_urls https://lumeland.github.io/plugins/slugify_urls/ - svgo https://lumeland.github.io/plugins/svgo/ - terser https://lumeland.github.io/plugins/terser/ Example: postcss, terser, base_path Created a config file _config.ts Do you want to configure VS Code? [y/N] y VS Code configured

  • vue-tsx-support

    TSX (JSX for TypeScript) support library for Vue

  • react-code-blocks

    React code blocks and code snippet components

  • recks

    🐶 React-like RxJS-based framework

  • jsonx

    JSONX - Create React Elements, JSX and HTML from JSON

  • core

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

    Project mention: I created a framework with JSX components on generators*, a fast mobx-like state management and an exclusive cssx styling system | dev.to | 2022-07-27

    My name is Dani. For several years now, I have been experimenting with different approaches to front-end development. I tried many different ideas, the best of which I collected in my framework Whatsup. In this article, I want to briefly tell you about architectural decisions and discuss them with you in the comments.

  • nornj

    More exciting JS/JSX based on Template Engine, support control flow tags, custom directives, two-way binding, filters and custom operators.

  • callbag-jsx

    callbags + JSX: fast and tiny interactive web apps

  • component-elements

    Create a custom element from any component with these tiny functions (2KB GZipped, ~1KB Brotli). Preact and React currently supported

    Project mention: Partial hydration for Preact using custom elements | reddit.com/r/javascript | 2022-01-12
  • sendight-frontend

    P2P File sharing

    Project mention: Me and my friend created a peer to peer webRTC based file transfer website | reddit.com/r/reactjs | 2021-10-17

    Frontend source code: https://github.com/thephilomaths/sendight-frontend

  • jsx-sfc

    A SFC like React function component API for managing CSS-in-JS and static members.

  • truss

    A TypeScript DSL for writing utility CSS in React/JSX (by homebound-team)

    Project mention: Ask HN: Who is hiring? (November 2021) | news.ycombinator.com | 2021-11-01
  • core

    Light weight feature rich UI Framework for JavaScript for Browser with Dependency Injection, Mocking and Unit Testing (by web-atoms)

  • jsx-readme

    Generate Readme files with a React-like syntax and package.json-aware helpers.

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 2022-08-07.

TypeScript JSX related posts


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

Project Stars
1 solid 21,035
2 mitosis 5,748
3 sucrase 4,773
4 fre 3,450
5 crank 2,520
6 unplugin-icons 1,692
7 Blaze UI 1,518
8 babel-plugin-jsx 1,400
9 vscode-glean 1,376
10 lume 635
11 vue-tsx-support 469
12 react-code-blocks 377
13 recks 130
14 jsonx 126
15 core 122
16 nornj 94
17 callbag-jsx 72
18 component-elements 60
19 sendight-frontend 59
20 jsx-sfc 52
21 truss 22
22 core 19
23 jsx-readme 14
Find remote jobs at our new job board 99remotejobs.com. There are 3 new remote jobs listed recently.
Are you hiring? Post a new remote job listing for free.
Less time debugging, more time building
Scout APM allows you to find and fix performance issues with no hassle. Now with error monitoring and external services monitoring, Scout is a developer's best friend when it comes to application development.