ūüöÄx-chart is a draggable & resizable data visualization system Introduction x-chart¬†is a draggable & resizable data visualization dashboard. Based on¬†Vue.js,¬†vue-echarts¬†and¬†vue-grid-layout. Notice¬†This version is rewrote by¬†typescript, if you want the old version by¬†javascript, you can checkout tag¬†v0.1.2. Develop # clone the project git clone https://github.com/yugasun/x-chart.git # install dependency npm install # develop npm run dev # […]

Lint for Sketch

Check the compliance of your design guidelines within seconds Validate your designs against your defined design guidelines, within seconds Extract the rules To use this plugin, you just need a Sketch file with your design guideline. This is file which contains text styles and colors swatches defined. The plugin can extract all the typography cases […]

Fromfrom- A JS Library

A JS library written in TS to transform sequences of data from format to another fromfrom fromfrom is a LINQ inspired library to transform sequences of data. Installation npm install –save fromfrom Documentation Find it here. Usage The library exports only a single function, from. from wraps the given source data into a Sequence. Sequence has a wide range of chainable methods to operate […]

Use Query Params

React Hook for managing state in URL query parameters with easy serialization.¬† useQueryParams A¬†React Hook¬†for managing state in URL query parameters with easy serialization. Works with¬†React Router¬†and¬†Reach Router¬†out of the box. TypeScript supported. ¬† Installation¬†|¬†Usage¬†|¬†Examples¬†|¬†API¬†|¬†Demo When creating apps with easily shareable URLs, you often want to encode state as query parameters, but all query parameters […]

React Native Animatable

Standard set of easy to use animations and declarative transitions for React Native react-native-animatable Declarative transitions and animations for React Native   Installation $ npm install react-native-animatable –save Usage To animate things you must use the¬†createAnimatableComponent¬†composer similar to the¬†Animated.createAnimatedComponent. The common components¬†View,¬†Text¬†and¬†Image¬†are precomposed and exposed under the¬†Animatable¬†namespace. If you have your own component that you […]

The Platform- Web. Components

The Platform Web API’s turned into React Hooks and Suspense-friendly React components. #useThePlatform Install Note: React 16.8+ is required for Hooks. With npm npm i the-platform –save Or with yarn yarn add the-platform Examples Basics Low Quality Image Placeholder Using¬†<Script>¬†and Stripe Checkout API Hooks useDeviceMotion() useDeviceOrientation() useGeoPosition() useNetworkStatus() useMedia() useScript() useStylesheet() useWindowScrollPosition() useWindowSize() Components <Img> […]


ūüďä Interactive SVG Charts A modern JavaScript charting library to build interactive charts and visualizations with simple API. Sponsored by       Browsers support Firefox Chrome Safari Edge IE11 31+ ‚úĒ 35+ ‚úĒ 6+ ‚úĒ Edge ‚úĒ IE11 ‚úĒ Download and Installation Installing via npm npm install apexcharts –save Direct <script> include <script src=”https://cdn.jsdelivr.net/npm/apexcharts”></script> […]

Reach UI

The Accessible Foundation for React Apps and Design Systems. Welcome to Reach UI Development¬†‚ôŅÔłŹ Thanks for getting involved with Reach UI development! Looking for the documentation? https://ui.reach.tech Getting Started This project uses Lerna¬†to manage multiple libs Storybook¬†for a great development experience Gatsby¬†for a blazing fast website. Jest¬†for painless testing. Before doing anything else, run these […]

React Coat

Structured React + Redux with Typescript and support for isomorphic rendering beautifully(SSR) English The framework is React state and data flow management. It does not improve and encapsulate React itself, nor does it violate the style and trend of React FP. The framework uses Class to organize the Model, supports inheritance, but does not force […]

React Image 

React.js <img> tag rendering with multiple fallback & loader support React Image ūüŹĚ ūüŹĖ ūüŹú React Image is an &lt;img&gt; tag replacement for React.js, featuring preloader and multiple image fallback support. With React Image you can specify multiple images to be used as fallbacks in the event that the browser couldn’t load the previous image. Additionally, you can specify any React element to be […]