React Formatter

Know more about React JS

React Formatting : Introduction

The react format is a new way to render markup and components without using the long-standing HTML or the more short yet shallow JavaScript templates. The way it works is that you write your code right in the place where you want to render it, which means as soon as you save your file, it will automatically update every time there is a change. In this article, we will see how React can render HTML on the client-side and how to use JSX syntax to write these declarative UI components.

React was developed by Facebook in 2011, while they were building Facebook’s news feed. It was pioneered by Jordan Walke & Tom Occhino and it was initially open sourced in 2013. React is different from most JavaScript libraries because of its emphasis on one-way. For more information got to ReactJS.org

React Number Format

import NumberFormat from 'react-number-format'

Example of Number Format

import React from "react";
import NumberFormat from "react-number-format";

export default function App() {
  return (
    {/* Prefix $ will be added after the number */}
    <div className="App">
      <NumberFormat
        value={50000}
        displayType={"text"}
        thousandSeparator={true}
        prefix={"$"}
      />
    </div>
  );
}
    

React Text Mask

import MaskedInput from 'react-text-mask'