JavaScript Code Design

Open-source JavaScript projects categorized as Code Design

Top 23 JavaScript Code Design Projects

  • create-react-app

    Set up a modern web app by running one command.

    Project mention: A Simple App with TypeScript, React and Styled Components - Part 1: setting up the tools | dev.to | 2022-11-28

    The first step is to use create-react-app to generate a simple application as a starting point. create-react-app spares us the work of configuring several build tools, and makes our life easier. Among many others, it will automatically set up Webpack and Babel(configured to compile TypeScript), as well as web-vitals. All of this in a single command!

  • react-boilerplate

    :fire: A highly scalable, offline-first foundation with the best developer experience and a focus on performance and best practices.

    Project mention: 100+ Must Know Github Repositories For Any Programmer | dev.to | 2022-11-17

    10. React Boilerplate

  • Scout APM

    Truly a developer’s best friend. Scout APM is great for developers who want to find and fix performance issues in their applications. With Scout, we'll take care of the bugs so you can focus on building great things 🚀.

  • classnames

    A simple javascript utility for conditionally joining classNames together

    Project mention: How would I add multiple classes to a React component with CSS modules AND string interpolation? | reddit.com/r/webdev | 2022-12-01

    I would suggest using the package classnames for managing multiple classnames. It’s an elegant way to deal with conditional/multiple classnames

  • redux-form

    A Higher Order Component using react-redux to keep form state in a Redux store (by redux-form)

    Project mention: How can I show a redux-form warning as a result of async-validation? | reddit.com/r/codehunter | 2022-04-26

    You pass validation functions either to a specific field, or the form as a whole, and these validator functions are called as needed by redux-forms.

  • react-redux-universal-hot-example

    A starter boilerplate for a universal webapp using express, react, redux, webpack, and react-transform

    Project mention: Is there a cleaner way of getting current URL in both client and server side in isomorphic react apps? | reddit.com/r/codehunter | 2022-04-19

    I am developing an app based in this React Redux boilerplate. In one component I need to get the current URL when component is mounted in order to generate a shareable URL for social media. Than component is being accesible from dynamically generated URLs with React Router. In client side I wouldn't have any problem by getting it through javascript document object but the problem lies server side.

  • react-final-form

    🏁 High performance subscription-based form state management for React

    Project mention: A side project I made a year ago and still use to quickly skim through repos/libraries | reddit.com/r/reactjs | 2022-11-19

    If you like form libraries, quick plug for Final Form, which was made by the same folks who did Redux Form. It's render engine agnostic (works on react, angular, vue) but has a way better api than formik, and handles custom input components better than RHF.

  • stitches

    CSS-in-JS with near-zero runtime, SSR, multi-variant support, and a best-in-class developer experience.

    Project mention: What working with Tailwind CSS every day for 2 years looks like | news.ycombinator.com | 2022-11-29

    By having a style guide with variants, StitchesJS pioneered this but there are others like Vanilla-Extract.

    https://stitches.dev/

  • Zigi

    The context switching struggle is real. Zigi makes context switching a thing of the past. It monitors Jira and GitHub updates, pings you when PRs need approval and lets you take fast actions - all directly from Slack!

  • nwb

    A toolkit for React, Preact, Inferno & vanilla JS apps, React libraries and other npm modules for the web, with no configuration (until you need it)

  • reflux

    A simple library for uni-directional dataflow application architecture with React extensions inspired by Flux

    Project mention: What is the core difference of redux & reflux in using react based application? | reddit.com/r/codehunter | 2022-03-17

    Recently I conducted a preliminary study on developing an E-commerce site and discovered that redux and reflux both come from flux architecture in Facebook and that both are popular. I am confused about the difference between the two.

  • wouter

    🥢 A minimalist-friendly ~1.5KB routing for React and Preact. Nothing else but HOOKS.

    Project mention: Project without React router library | reddit.com/r/reactjs | 2022-09-13

    Other options than react-router are also available, like wouter, if you can't use react-router for some specific reason.

  • react-hot-boilerplate

    Minimal live-editing example for React

    Project mention: Where do the webpack output files from the react-hot-loader go? | reddit.com/r/codehunter | 2022-05-14

    Let me preface this by saying that everything I have set up works, this is just a question that's nagging me that I would love to get an answer for. I'm using the react-hot-boilerplate project (https://github.com/gaearon/react-hot-boilerplate). However, in webpack.config.js, this setting is confusing me to no end:

  • react-server

    :rocket: Blazing fast page load and seamless navigation.

  • alt

    Isomorphic flux implementation

    Project mention: The new wave of React state management | news.ycombinator.com | 2022-07-02
  • react-refetch

    A simple, declarative, and composable way to fetch data for React components

  • generator-react-webpack

    Yeoman generator for ReactJS and Webpack

  • react-templates

    Light weight templates for react

  • formsy-react

    A form input builder and validator for React JS

  • redux-router

    Redux bindings for React Router – keep your router state inside your Redux store

    Project mention: React + Redux + Router - should I use one state/store for all pages/components? | reddit.com/r/codehunter | 2022-04-30

    I am using React + Redux, and after reading about react-router-redux and redux-router, and after reading Dan Abramov's answer, I decided to use "vanilla" react-router (I don't care about time travel etc. at this point).

  • redux-auth-patch

    Complete token authentication system for react + redux that supports isomorphic rendering.

  • essential-react

    A minimal skeleton for building testable React apps using Babel

  • cerebral

    Declarative state and side effects management for popular JavaScript frameworks

    Project mention: Achieving an Organized State in your React App with Overmind (Basic) | dev.to | 2022-02-05

    Today's mainly going to be focused on the frontend, because I want to introduce this state management system that I've been really digging lately. It's called Overmind, the same team that made Cerebral. Overmind is somewhat similar to Cerebral, but it supports TypeScript and it's... well, it's not abandoned.

  • kea

    Production Ready State Management for React

  • fluxible

    A pluggable container for universal flux applications.

    Project mention: Importing CSS files in Isomorphic React Components | reddit.com/r/codehunter | 2022-03-15

    Html.jsx - My HTML jsx component that tries to import/require the CSS. This is an isomorphic app (using Fluxbile), hence needing to have the actual HTML as a rendered component. Using the require statement seen in this file, in any part of my application, gives the error described.

  • Sonar

    Write Clean JavaScript Code. Always.. Sonar helps you commit clean code every time. With over 300 unique rules to find JavaScript bugs, code smells & vulnerabilities, Sonar finds the issues while you focus on the work.

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-12-01.

JavaScript Code Design related posts

Index

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

Project Stars
1 create-react-app 98,074
2 react-boilerplate 28,862
3 classnames 16,076
4 redux-form 12,608
5 react-redux-universal-hot-example 12,063
6 react-final-form 7,130
7 stitches 6,646
8 nwb 5,518
9 reflux 5,384
10 wouter 4,704
11 react-hot-boilerplate 3,929
12 react-server 3,915
13 alt 3,452
14 react-refetch 3,430
15 generator-react-webpack 2,890
16 react-templates 2,809
17 formsy-react 2,600
18 redux-router 2,323
19 redux-auth-patch 2,148
20 essential-react 2,033
21 cerebral 1,961
22 kea 1,865
23 fluxible 1,813
Build time-series-based applications quickly and at scale.
InfluxDB is the Time Series Data Platform where developers build real-time applications for analytics, IoT and cloud-native services in less time with less code.
www.influxdata.com