Top 23 JavaScript ReactJS Projects

• taro

  1 29,778 9.8 JavaScript

  开放式跨端跨框架解决方案，支持使用 React/Vue/Nerv 等框架来开发微信/京东/百度/支付宝/字节跳动/ QQ 小程序/H5/React Native 等应用。 https://taro.zone/

  

  Project mention: Top 10 Developer Trends, Thu Oct 22 2020 | dev.to | 2020-10-22

  NervJS / taro

• normalizr

  5 20,548 1.9 JavaScript

  Normalizes nested JSON according to a schema

  Project mention: We just launched our product on Product Hunt which is entirely made with React Native | reddit.com/r/reactnative | 2021-09-08

  We've struggled with the navigation too. We rely on Interaction Manager and Pure component. We are trying to make sure no component should not render without a reason, we're still optimizing the app. I'd recommend this package called Why Did You Render. It helps us to find the culprit and mitigate it. And since our app is heavily relied upon Redux, we use normalizr for better optimization.

• Syncfusion

  syncfusion.com

  sponsored

  Build stunning web applications quickly using Syncfusion JavaScript UI controls.. The Syncfusion JavaScript suite offers more than 65 cross-platform, responsive, and lightweight JS/HTML5 UI controls for building modern web applications.

  

• reactjs-interview-questions

  8 16,996 6.8 JavaScript

  List of top 500 ReactJS Interview Questions & Answers....Coding exercise questions are coming soon!!

  Project mention: I have an interview tomorrow for a React.js Developer position any tips/advice? | reddit.com/r/learnprogramming | 2021-09-02

  I did several react interviews, always got some questions from this lists: https://github.com/sudheerj/reactjs-interview-questions

• react-testing-library

  7 15,320 7.2 JavaScript

  🐐 Simple and complete React DOM testing utilities that encourage good testing practices.

  

  Project mention: Getting Started with React Cosmos | dev.to | 2021-08-23

  There are many ways to test component UIs and some testing frameworks help us achieve that, to mention but a few react-testing-library, where we write tests to check what a component has, for example, if we are testing a form component, we will write tests to check it a button is rendered, if there are input and/or select tags, etc and we usually see the results in our terminals but with React cosmos, we have a visual way to test our components (Visual TDD) which makes testing easier.

• emotion

  16 13,795 7.6 JavaScript

  👩‍🎤 CSS-in-JS library designed for high performance style composition

  

  Project mention: How to Add An RSS Feed to a NextJS Blog | dev.to | 2021-10-17

  My site uses Chakra UI for theming, which uses Emotion -- a CSS-in-JS library -- under the hood. Emotion will happily render tons of tags when statically generating HTML from your React components. For most use cases where you render React on the server (statically or not), this is desirable. In the case of RSS/Atom feeds, this is pretty useless.

  Solution

  The solution here is to strip all the and tags from the generated HTML. Rather than summoning The One whose Name cannot be expressed in the Basic Multilingual Plane by trying to use regex here, I found this library to help me with this task:
  

  const cleanHtmlContent = stripHtml(htmlContent, {
      onlyStripTags: ['script', 'style'],
      stripTogetherWithTheirContents: ['script', 'style'],
  }).result;
  

  Enter fullscreen mode Exit fullscreen mode

  The end result

  I now have serve RSS, Atom and a JSON Feed for your reading pleasure. Most of the relevant code can be found here

  Future plans

  At some point I want to diversify my writing output by not only writing about tech. And even within the topic of tech there are many sub-topics I could write about, not all of which are equally interesting to every reader (all 5 of them, including my mom 👩‍👦). I'm planning to introduce tags to allow filtering content once I have enough of it.

  Once I have tags, I would like to start supporting dynamic feeds so readers can subscribe only to the stuff they actually want to read. I imagine building an endpoint like this:
  

  /feeds/by-tags.xml?tags=tag1,tag2
  

  Enter fullscreen mode Exit fullscreen mode

  I'm curious if others are doing this!

• reactotron

  2 13,199 1.1 JavaScript

  A desktop app for inspecting your React JS and React Native projects. macOS, Linux, and Windows.

  

  Project mention: Reactotron Setup In React Native Redux Applications | dev.to | 2021-09-23

  Reactotron Official Site: https://github.com/infinitered/reactotron

• mdx-deck

  2 10,414 3.7 JavaScript

  ♠️ React MDX-based presentation decks

  Project mention: On the limits of MDX | dev.to | 2021-04-01

  Yep, you can import JSX components and embed them with your run-of-the-mill Markdown prose. If you're documenting your JSX based component library, which is what Docz let you do, this makes all the sense in the world. MDX is also used to author slide decks in mdx-deck, which is very appealing if you're tired of clicking around in Keynote/PowerPoint/Google Sheets. Which many of us are. I'm not denying the appeal or usability of MDX for certain things for certain people.

• Nanos

  github.com/nanovms

  sponsored

  Run Linux Software Faster and Safer than Linux with Unikernels.

  

• spectrum

  9 10,183 8.5 JavaScript

  Simple, powerful online communities.

  

  Project mention: Junior devs, what's your general struggle right now? Let's get you some advice! | reddit.com/r/webdev | 2021-10-13

  I agree. If I were you I would pick a super popular one like Jenkins or CircleCI, follow a tutorial to set it up and build from there. There are also quite a lot of open source projects that uses these tools, you can look at what they do to learn as well, a good example is https://github.com/withspectrum/spectrum which is a quite big project so plenty to learn from them. If their config file or something else is too complex, you can always search Github for config files to see how others have done it. Maybe there is even a "jenkins starter" or something you could play around with? Otherwise I'd search for something like "jenkins [platform] cicd" and see what comes up. This was a top result for "jenkins node cicd" https://medium.com/@mosheezderman/how-to-set-up-ci-cd-pipeline-for-a-node-js-app-with-jenkins-c51581cc783c

• Blitz

  9 9,491 9.8 JavaScript

  ⚡️The Fullstack React Framework — built on Next.js

  

  Project mention: Develop and Deploy a Blitz JS Application. | dev.to | 2021-07-29

  blitz/recipes at canary · blitz-js/blitz

• nerv

  1 5,391 0.0 JavaScript

  A blazing fast React alternative, compatible with IE8 and React 16. (by NervJS)

  

  Project mention: [AskJS] Millions of Indian and Chinese devs use Javascript: how come there aren't more big open source tools coming out of these places? | reddit.com/r/javascript | 2021-03-03

  https://github.com/NervJS/nerv is a chinese react drop-in alternative (pretty decent one, at that)

• react-draft-wysiwyg

  3 5,340 3.2 JavaScript

  A Wysiwyg editor build on top of ReactJS and DraftJS. https://jpuri.github.io/react-draft-wysiwyg

  Project mention: 15+ Fantastic React UI Libraries to Consider for your Project | dev.to | 2021-06-14

• Manta

  1 5,150 0.0 JavaScript

  🎉 Flexible invoicing desktop app with beautiful & customizable templates.

  Project mention: How do you create your invoices? | dev.to | 2021-05-07

  My favorite is a free, open-source project Manta - a desktop application for creating invoices with beautiful and customizable templates.

• twin.macro

  25 4,785 8.8 JavaScript

  🦹‍♂️ Twin blends the magic of Tailwind with the flexibility of css-in-js (emotion, styled-components, stitches and goober) at build time.

  Project mention: Tailwind extension suggestion | reddit.com/r/reactjs | 2021-09-29

  Good idea about the extension. I think there’s another tool that could also help you with that called twin macro. It combines css-in-js with tailwind. You can choose emotion or styled-components as your css library. This way you can create css components aside where there’s lots of styling and maybe conditional styling. It’s also much more performant than tailwind

• React95

  2 4,723 6.3 JavaScript

  🌈🕹 Refreshed Windows 95 style UI components for your React app

  Project mention: WinBox - a professional HTML5 window manager for the web: lightweight, outstanding performance, no dependencies, fully customizable, open source | reddit.com/r/programming | 2021-10-17

  We've had React95 for a while.

• react-firebase-starter

  1 4,350 1.7 JavaScript

  Boilerplate (seed) project for creating web apps with React.js, GraphQL.js and Relay

  

  Project mention: 12+ React Boilerplates & Starter Kits For Developers In 2021 | dev.to | 2021-05-11

  GitHub

• ToolJet

  27 3,692 9.9 JavaScript

  ToolJet is an open-source low-code platform for building and deploying internal tools with minimal engineering efforts 🚀

  

  Project mention: Why we’re changing our license to AGPL | reddit.com/r/opensource | 2021-09-28

  TLDR; We are changing our license from GPL V3 to AGPL V3. ( PR) For users, nothing will change.

• react-flip-move

  0 3,638 2.7 JavaScript

  Effortless animation between DOM changes (eg. list reordering) using the FLIP technique.

• airframe-react

  2 3,630 0.0 JavaScript

  Free Open Source High Quality Dashboard based on Bootstrap 4 & React 16: http://dashboards.webkom.co/react/airframe

  Project mention: Free React dashboard templates and themes | dev.to | 2021-05-06

  Live Demo / Download

• coreui-free-react-admin-template

  3 3,498 8.3 JavaScript

  CoreUI React is a free React admin template based on Bootstrap 5

  

  Project mention: Top Free React Dashboards to Use for Your Next Project | dev.to | 2021-09-21

  Download / Live Demo

• material-kit-react

  4 3,321 5.2 JavaScript

  React Dashboard made with Material UI’s components. Our pro template contains features like TypeScript version, authentication system with Firebase and Auth0 plus many other

  

  Project mention: Example projects search. Admin UI for database | reddit.com/r/react | 2021-09-08

• react-ace

  2 3,273 8.1 JavaScript

  React Ace Component

  Project mention: Embedding Code Editor In Your React App | dev.to | 2021-04-23

  This is a basic setup, for further modifications you can check the above provided link, you can generate the code interactively here

• react-music

  0 2,679 0.0 JavaScript

  Make beats with React!

  

• React-Sight

  1 2,658 0.0 JavaScript

  Visualization tool for React, with support for Fiber, Router (v4), and Redux

  

  Project mention: Resources for Visualization React Trees in Planning Stage | reddit.com/r/reactjs | 2021-10-03

  I'm looking for something like React-Sight but for before you begin building in React, rather than in course of development. Something like a node or tree visualization with a visual editor for laying out React components, state and props, that kinda thing.

Index

Sponsored

Scout APM: A developer's best friend. Try free for 14-days

Scout APM uses tracing logic that ties bottlenecks to source code so you know the exact line of code causing performance issues and can get back to building a great product faster.

scoutapm.com