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. Learn more β
Top 23 TypeScript Preact Projects
-
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.
-
router
π€ Fully typesafe Router for React (and friends) w/ built-in caching, 1st class search-param APIs, client-side cache integration and isomorphic rendering.
-
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.
-
microsite
Do more with less JavaScript. Microsite is a smarter, performance-obsessed static site generator powered by Preact and Snowpack.
-
browser-extension
Browser Extension Template with ESbuild builds, support for React, Preact, Typescript, Tailwind, Manifest V3/V2 support and multi browser build including Chrome, Firefox, Safari, Edge, Brave. (by Debdut)
-
papanasi
π₯―Papanasi is the Frontend UI library to use cross Frameworks. A set of components to use in Angular, Preact, Qwik, React, Solid, Svelte, Vue and Web Components
-
deco
Open-Source web editor based on Preact, Tailwind and TypeScript. The other side of code. (by deco-cx)
-
react-native-react-bridge
An easy way to integrate your React (or Preact/React Native Web) app into React Native app with WebView.
-
SaaSHub
SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives
Project mention: Show HN: Million Lint β ESLint for Performance | news.ycombinator.com | 2024-02-29Hey HN! Founder of Million β Weβre building a tool to that helps fix slow React code. Here is a quick demo: https://youtu.be/k-5jWgpRqlQ
Fixing web performance issues is hard. Every developer knows this experience: we insert console.log everywhere, catch some promising leads, but nothing happens before "time runs out." Eventually, the slow/buggy code never gets fixed, problems pile up on a backlog, and our end users are hurt.
We started Million to fix this. A VSCode extension that identifies slow code and suggests fixes (like ESLint, for performance!) The website is here: https://million.dev/blog/lint
I realized this was a problem when I tried to write an optimizing compiler for React in high school (src: https://github.com/aidenybai/million). It garnered a lot of interest (14K+ stars) and usage, but it didn't solve all user problems.
Traditionally, devtools either hinge on full static analysis OR runtime profiling. We found success in a mixture of the two with dynamic analysis. During compilation, we inject instrumentation where it's necessary. Here is an example:
function App({ start }) {
Deno: Deno with one of it's frameworks (like Fresh
Project mention: React Router has merged with Remix, should you use a different router? | dev.to | 2024-05-16The TanStack/router is a React router written in TypeScript so it's typesafe and it includes built-in caching. It is lightweight (12 KB) and has a lot of functionality. It goes beyond what wouter provides and has overlaps with features that React Router provides such as nested routes, file-based route generation, and automatic route prefetching. They provide a migration guide from React Router to TanStack/router that you can follow.
Project mention: React Router has merged with Remix, should you use a different router? | dev.to | 2024-05-16Wouter is a well-maintained routing library for React. It has minimal dependencies, is small (2.1 KB gzipped), and has the same basic components as React Router (Link, Switch, Redirect). It provides hooks for the location, the route, and the router, and the API is simple.
Putting the runic terminology aside and looking into how the signal primitive is implemented should dispel the magic. I learned a lot from examining preact's implementation: https://github.com/preactjs/signals/blob/main/packages/core/...
Project mention: π€ Collaborative & πΈ PhotoGrid Collage Maker - Built on Netlify Primitives β‘οΈ | dev.to | 2024-05-12To leverage the power of the Netlify Image CDN to deliver optimized and responsive images tailored to each user's device and selected layout, the application utilizes the unpic library, which has out-of-the-box support for Netlify Image CDN and generates responsive image tags with ease.
Project mention: The Top Tools for Transforming Figma Designs into Vue.js Code | dev.to | 2024-02-125. TeleportHQ
First, make an account At app.revolt.chat . Then, when you have done that, go to https://rvlt.gg/CDW0PHDZ And Follow The Instructions.
Project mention: Show HN: Deco.cx β realtime TypeScript web editor | news.ycombinator.com | 2024-04-10Gui, Lucis, and the deco.cx team here β we're a bunch of Brazilians building an open-source, all-in-one web editor for the modern TypeScript dev. Check out our GitHub at https://github.com/deco-cx/deco and discover more at our site https://deco.cx/.
We built frontend tools at a hyper-growth e-commerce platform for 9 years. Deco.cx is the thing that we wish existed when we were managing hundreds of enterprise-grade React-based websites.
The gist is: JSX, HTMX, TypeScript, Tailwind and Deno. All visually editable in a beautiful, collaborative, REALTIME (!) admin UI. Great for devs, great for content.
In essence, we're a git-based TypeScript-first configuration management system. We take TypeScript code that represents your site, your entities, your UI, and we allow anyone to "save" configuration and content based on those types.
It's great for developers, because you can code directly on the web, or on your machine, and get instant feedback. You "export interface Props" and boom, an automatic form is generated. It's great for the business users, the content editors, because you just press "." (dot) in your keyboard and you go into a visual edit mode for the page you're at right now. Everything the developer exported in TypeScript is editable.
And when you hit "publish", it's already live, with a proper CDN, proper caching, everything already setup and just working. Ready to scale!
But you can't fly blind. We're democratizing pro-level tools for web analytics and observability by bundling in our Pro plan: fully-managed Plausible analytics and HyperDX observability. Check them out β these are great tools on their own, and they shine in the deco.cx platform bundle.
We don't want to be the only answer, we don't claim to be right about anything, we just want to make the friendly and accessible open-source tool that we wish existed when we were junior developers. If you want to participate, please join our discord community at https://deco.cx/discord
on open-source: our admin UI core is not ready for prime time, we're working to open-source it this year. but basically everything else, our integrations, templates and configuration management runtime are all open-source already! take a look at these: https://github.com/deco-cx/deco https://github.com/deco-cx/apps https://github.com/deco-sites/storefront Making the admin UI core extensible and open source is a MAIN OBJECTIVE for this year, so expect news here soon!
Thanks for your support!
TypeScript Preact related posts
-
React Router has merged with Remix, should you use a different router?
-
π€ Collaborative & πΈ PhotoGrid Collage Maker - Built on Netlify Primitives β‘οΈ
-
π§ 50 Articles to Level Up
-
The Road to Fresh 2.0
-
How I built a cross-framework frontend library
-
React Jam just started, making a game in 13 days with React
-
Hacktoberfest 2023 Recap
-
A note from our sponsor - SurveyJS
surveyjs.io | 1 Jun 2024
Index
What are some of the best open-source Preact projects in TypeScript? This list will help you:
Project | Stars | |
---|---|---|
1 | million | 15,390 |
2 | fresh | 11,947 |
3 | router | 7,248 |
4 | wouter | 6,243 |
5 | signals | 3,569 |
6 | react-colorful | 3,031 |
7 | vite-plugin-pwa | 2,833 |
8 | scenejs | 2,668 |
9 | previewjs | 1,789 |
10 | unpic-img | 1,220 |
11 | teleport-code-generators | 962 |
12 | microsite | 879 |
13 | revite | 827 |
14 | Refract | 815 |
15 | teaful | 702 |
16 | browser-extension | 654 |
17 | papanasi | 577 |
18 | agrippa | 549 |
19 | next-super-performance | 406 |
20 | deco | 429 |
21 | zoom-image | 280 |
22 | react-native-react-bridge | 244 |
23 | preact-island | 211 |
Sponsored