JavaScript UI Components

Open-source JavaScript projects categorized as UI Components | Edit details

Top 23 JavaScript UI Component Projects

  • GitHub repo Semantic UI

    Semantic is a UI component framework based around useful principles from natural language.

    Project mention: 10 UI Library to Make Your React App Development Faster | dev.to | 2021-08-17

    Semantic is a UI component framework based around useful principles from natural language.

  • GitHub repo Swiper

    Most modern mobile touch slider with hardware accelerated transitions

    Project mention: 5 Modern JS Sliders for 2022 | dev.to | 2021-11-27

    SwiperJS

  • Scout APM

    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.

  • GitHub repo react-beautiful-dnd

    Beautiful and accessible drag and drop for lists with React

    Project mention: Simplest Drag and Drop setup in React, in 10 lines of code with SortableJS | dev.to | 2021-11-27

    React Beautiful Dnd: build by Atlassian for Trello, it's reliable BUT

  • GitHub repo sortablejs

    Reorderable drag-and-drop lists for modern browsers and touch devices. No jQuery or framework required.

    Project mention: Simplest Drag and Drop setup in React, in 10 lines of code with SortableJS | dev.to | 2021-11-27

    I went to look for SortableJS, clicked on the demo, scrolled to the grid example which was doing exactly the simple stuff I was looking for.

  • GitHub repo react-virtualized

    React components for efficiently rendering large lists and tabular data

    Project mention: Big list performance with React | reddit.com/r/codehunter | 2021-11-26

    Since this is apparently a popular question and things have progressed since the original question was asked, while I do encourage you to watch the video linked above, in order to get a grasp of a virtual layout, I also encourage you to use the React Virtualized library if you do not want to re-invent the wheel.

  • GitHub repo react-table

    ⚛️ Hooks for building fast and extendable tables and datagrids for React

    Project mention: What table component library you prefer to use with React? | reddit.com/r/reactjs | 2021-11-26

    check out react-table it is simple-ish. in a sense that it handles most of the logic, but you have to implement the UI.

  • GitHub repo react-dates

    An easily internationalizable, mobile-friendly datepicker library for the web

    Project mention: react-dates: disabling the default calendar popup | reddit.com/r/reactjs | 2021-07-14

    `ReactDateRangePicker`, gives it's own date picker to use(see ss: https://i.stack.imgur.com/6mkER.png)

  • Nanos

    Run Linux Software Faster and Safer than Linux with Unikernels.

  • GitHub repo react-window

    React components for efficiently rendering large lists and tabular data

    Project mention: React Hyper Scroller v3 released! | dev.to | 2021-11-24

    One thing to keep in mind is that React Hyper Scroller may not be the best for all use-cases. If it doesn't work for you, there are very cool alternatives like react-window, react-virtualized or react-virtual.

  • GitHub repo evergreen

    🌲 Evergreen React UI Framework by Segment

    Project mention: Where are some places I can find pre-made good looking React components (i.e button) | reddit.com/r/webdev | 2021-10-31

    Evergreen

  • GitHub repo marko

    A declarative, HTML-based language that makes building web apps fun

    Project mention: Understanding Transitional JavaScript Apps | dev.to | 2021-11-12

    Now as some of you know this has been an area of focus for me the last couple years both with Marko and even to some degree with Solid. In fact it's kind of been on everyone's mind:

  • GitHub repo react-color

    :art: Color Pickers from Sketch, Photoshop, Chrome, Github, Twitter & more

    Project mention: I’m looking for a certain library for colors | reddit.com/r/webdev | 2021-08-18

    depends on the environment/framework you would use. Eg. I use https://casesandberg.github.io/react-color/ as color selector for react.

  • GitHub repo downshift 🏎

    🏎 A set of primitives to build simple, flexible, WAI-ARIA compliant React autocomplete, combobox or select dropdown components.

    Project mention: From my point of Vue: Headless components | dev.to | 2021-11-18

    The concept is not new, it's been discussed and implemented for a couple of years, I first heard of it when Adam Watham, creator of Tailwind CSS, and its team launched Headless UI libraries like downshift by Kent Dodds also used this pattern, just to mention a couple of cases.

  • GitHub repo react-slick

    React carousel component

    Project mention: Awesome Things Related To React Hooks 😍 | dev.to | 2021-09-23

    React Slick - React carousel component. One of the best sliders out there to showcase anything.

  • GitHub repo react-sortable-hoc

    A set of higher-order components to turn any list into an animated, accessible and touch-friendly sortable list✌️

    Project mention: Please give a solution to this | reddit.com/r/reactjs | 2021-07-29

    Package link:- https://www.npmjs.com/package/react-sortable-hoc

  • GitHub repo victory

    A collection of composable React components for building interactive data visualizations

    Project mention: Top 5 React chart libraries | dev.to | 2021-09-24

    Like many other React chart libraries on the list, Victory was built with React and D3. It comes with a wide variety of charts out of the box that are fully customizable.

  • GitHub repo react-dropzone

    Simple HTML5 drag-drop zone with React.js.

    Project mention: Dropzone UI: the new way of providing Drag and Drop File Uploads in React app. | dev.to | 2021-09-25

    In standard HTML5 you can perform file uploads through . Additionally there are packages like dropzone and react-dropzone that can handle this task very well. However, inspired in the last ones, there was created something new and more powerful: dropzone-ui.

  • GitHub repo react-text-mask

    Input mask for React, Angular, Ember, Vue, & plain JavaScript

  • GitHub repo react-markdown

    Markdown component for React

    Project mention: How I built my portfolio using NextJS, Typescript, and Chakra UI | dev.to | 2021-10-24

    react-markdown: Markdown component for React using remark.

  • GitHub repo react-draggable

    React draggable component

    Project mention: Simplest Drag and Drop setup in React, in 10 lines of code with SortableJS | dev.to | 2021-11-27

    -react-draggable: I must say I didn't see that one, and didn't try.

  • GitHub repo react-modal

    Accessible modal dialog component for React

    Project mention: How do I selectively install/delete folders/files from my repo when I install it? | reddit.com/r/reactjs | 2021-10-21
  • GitHub repo tailblocks

    Ready-to-use Tailwind CSS blocks.

    Project mention: Tailwindcss: Most Powerful and Popular Framework of CSS | dev.to | 2021-11-20

    Tailblocks is a website to grab built-in templates using tailwindcss. You can directly copy those components from the website.

  • GitHub repo react-map-gl

    React friendly API wrapper around MapboxGL JS

    Project mention: When to use react-map-gl or plain mapbox-gl in React app? | reddit.com/r/gis | 2021-10-13

    I'm working on a React app with a mapbox component and am trying to understand the use case for react-map-gl vs the examples on the Mapbox site that just use mapbox-gl. From the React GitHub issues they mention this in regards to performance -

  • GitHub repo react-datepicker

    A simple and reusable datepicker component for React

    Project mention: Help with daterangepicker | reddit.com/r/reactjs | 2021-11-11

    Yes. You can style it however you want by providing your own styles instead of importing the ones from the npm package. Just replace these with whatever you styling you want: https://github.com/Hacker0x01/react-datepicker/blob/master/src/stylesheets/datepicker.scss

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 2021-11-27.

JavaScript UI Components related posts

Index

What are some of the best open-source UI Component projects in JavaScript? This list will help you:

Project Stars
1 Semantic UI 49,687
2 Swiper 29,267
3 react-beautiful-dnd 25,585
4 sortablejs 23,441
5 react-virtualized 22,808
6 react-table 15,560
7 react-dates 11,662
8 react-window 11,607
9 evergreen 11,309
10 marko 10,743
11 react-color 10,227
12 downshift 🏎 10,140
13 react-slick 10,004
14 react-sortable-hoc 9,699
15 victory 9,201
16 react-dropzone 8,600
17 react-text-mask 8,092
18 react-markdown 7,940
19 react-draggable 7,128
20 react-modal 6,676
21 tailblocks 6,240
22 react-map-gl 6,208
23 react-datepicker 6,168
Find remote jobs at our new job board 99remotejobs.com. There are 34 new remote jobs listed recently.
Are you hiring? Post a new remote job listing for free.
SaaSHub - Software Alternatives and Reviews
SaaSHub helps you find the best software and product alternatives
www.saashub.com