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! Learn more →
Top 23 React Open-Source Projects
-
Project mention: How Open Source helped me get into the GitHub Octernships program. | dev.to | 2023-08-02
I started open source software development a few months into my last internship, after one of my colleagues suggested it. When I made my first open source contribution, I realized how much of an impact I could create with this work, especially because of the size of the org I contributed to. My first PR was a feature that I added to the freeCodeCamp codebase; this repo has the highest number of stars on GitHub! I made this contribution in October, and to my surprise, I got an email in December informing me that I was one of the top contributors of 2022 to the freeCodeCamp codebase because of this contribution! I was elated and the sense of satisfaction that I got from this feat was something that I had not experienced before. freeCodeCamp was also the first open source community I was a part of, interacting with the maintainers in their Discord server daily to get my PRs merged and learn more about the codebase!
-
1. React
-
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.
-
https://github.com/vercel/next.js/discussions/42732
As someone who runs Next.js with a custom server setup on a VPS, I think the haydays of Next.js are behind us. I'm looking to simplify my frontend stack. I love how stable my Node.js backend is and want the same for my frontend.
-
In this post, I'll show how to create a Development container (aka dev container) to use it to develop a React Native app with Expo.
-
Can you be more specific which linting rule you're talking about or the sake of readers who may be unaware, and perhaps mention how this completely solves this problem? Because 1. a linting rule does not absolve this from being a footgun and 2. if you're talking about 'exhaustive-deps' there are many cases where following the linter here has caused infinite render loops among newbies across multiple teams I've worked with. Also see this highly contentious thread: https://github.com/facebook/create-react-app/issues/6880
-
material-ui
MUI Core: Ready-to-use foundational React components, free forever. It includes Material UI, which implements Google's Material Design.
With GitHub stars of 88K(August 2023) and weekly NPM downloads of 2.9 million(August 2023), MUI is one of the most popular React UI libraries in the world.
-
Project mention: ⚡ Best Open Source React framework and libraries for Building Enterprise B2B apps | dev.to | 2023-09-27
Additionally, refine offers built-in integrations with Ant Design, Material UI, Mantine, and Chakra UI, providing swift starting points for your projects.
-
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!
-
storybook
Storybook is a frontend workshop for building UI components and pages in isolation. Made for UI development, testing, and documentation.
Project mention: PSA: Storybook sends telemetry data, opt-in by default | news.ycombinator.com | 2023-09-21I took some interest in the concept of hashing IPs to avoid PII issues [0], and it turns out that since there's only so few IPv4 addresses, it's trivial to simply take the salt the project uses and calculate all the hashes. On my laptop it would take around two hours with the most naive implementation, so I don't really think this solves anything. This problem would be sidestepped by IPv6, but we all know how that is going so far.
[0] https://github.com/storybookjs/storybook/discussions/19910#d...
-
Replace is-not-bun with the name of your package. This tutorial is the text version of this Youtube tutorial and will address the same problem space of determining if a user is running an npm package using Bun (you don't need to know about Bun either).
-
One thing that stands out from React’s history and creation is the power of open source projects and an active community. React's ecosystem provides a vast array of third-party libraries and tools that extend its functionality and make it easier to create performant applications.
-
Project mention: 33-JS-concepts – 33 JavaScript concepts every developer should know | news.ycombinator.com | 2023-08-27
-
Flexibility : Developers have complete control over the frontend so they can use their preferred tools and frameworks like React, Next.js, Gatsby, or Remix.
-
Or like not being able to delete a user without running some SQL:
https://github.com/apache/superset/issues/13345
Almostl instantly run into this issue setting up a test instance of Superset. And the issue has been around for years.
-
Ionic Framework
A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
Ionic Framework UI Components are used to build a website and then a mobile application is built using Ionic Capacitor. Ionic UI components are not required but are used for UX. The vue js code presented here will work fine in a separate application.
-
Project mention: User Guides in Code Documentation: Empowering Users with Usage Instructions | dev.to | 2023-08-20
Docusaurus is a static-site generator. It builds a single-page application with fast client-side navigation, leveraging the full power of React to make your site interactive. It provides out-of-the-box documentation features but can be used to create any kind of site (personal website, product, blog, marketing landing pages, etc).
-
react
Cheatsheets for experienced React developers getting started with TypeScript (by typescript-cheatsheets)
Project mention: Ultimate Guide & Resources to Enhancing Your ReactJS Skills || 16 GitHub repositories | dev.to | 2023-08-14Quickly reference the essentials with these handy React cheatsheets.
-
I think that’s more or less what this project is working towards:
-
styled-components
Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress 💅
You can use Media Queries in Styled-Components similar to how you would use them in CSS, other than the fact that you can define custom screen sizes in your theme and access them inside your Media Queries:
-
30-Days-Of-JavaScript
30 days of JavaScript programming challenge is a step-by-step guide to learn JavaScript programming language in 30 days. This challenge may take more than 100 days, please just follow your own pace. These videos may help too: https://www.youtube.com/channel/UC7PNRuno1rzYPb1xLa4yktw
-
Project mention: Ultimate Guide & Resources to Enhancing Your ReactJS Skills || 16 GitHub repositories | dev.to | 2023-08-14
Explore a curated list of awesome React components that can save you time and effort.
-
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: Explicit Design, Part 6. Cross-Cutting Concerns and Extendable Infrastructure | dev.to | 2023-08-21By the way, I think that useSWR and React Query take on too much. They go too deep into the multiple application layers, making themselves no longer “non-opinionated,” and in some cases, using them becomes inconvenient. There are libraries that implement the SWR standard and do not use hooks, but there are not many of them.
-
For production, Vite can use another bundler, esbuild, to speed up transpilation and minification, while it in production also uses the bundler Rollup to create the client side JS bundle, due to Rollup's flexible API. Even though Vite uses ESM in development environment, for speed. In the future Vite may use esbuild entirely for bundling instead of Rollup, due to the speed it would gain.
-
A truly reactive Preact [1] is merely 3 kb of JS.
OTOH the need for really simple bits of interactivity does occur in real life. If the htmx [2] approach does not cu it, a micro-library like this could.
[2]: https://htmx.org/
-
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.
React related posts
- Coding Snippets Dev Log (9/27/23)
- Ask HN: Risk of Vendor Lock-In with Next.js
- Native Cosmos USDC is getting an awesome traction
- Looking for a self-hosted cross-platform note-taking application with user decentralized for business.
- ⚡ Best Open Source React framework and libraries for Building Enterprise B2B apps
- How to implement an optional route segment for SEO-friendly URLs?
- Google Podcasts to shut down in 2024
-
A note from our sponsor - Appwrite
appwrite.io | 28 Sep 2023
Index
What are some of the best open-source React projects? This list will help you:
Project | Stars | |
---|---|---|
1 | freeCodeCamp | 374,363 |
2 | React | 213,563 |
3 | Next.js | 112,400 |
4 | react-native | 112,167 |
5 | create-react-app | 100,804 |
6 | material-ui | 88,971 |
7 | antd | 87,627 |
8 | storybook | 80,401 |
9 | bun | 62,712 |
10 | awesome-react | 58,212 |
11 | 33-js-concepts | 57,711 |
12 | Gatsby | 54,720 |
13 | superset | 54,269 |
14 | Ionic Framework | 49,487 |
15 | Docusaurus | 48,016 |
16 | react | 42,228 |
17 | hyperterm | 41,518 |
18 | styled-components | 39,486 |
19 | 30-Days-Of-JavaScript | 38,571 |
20 | awesome-react-components | 37,301 |
21 | TanStack Query | 36,329 |
22 | esbuild | 36,078 |
23 | Preact | 35,073 |