Retail Electricity and Natural Gas Supply Provider build a Pricing App using React.JS with TypeScript

After performing a detailed customer environment assessment, VNB Consulting's Apps and Integration team recommended an architecture using React with TypeScript as the front-end and Axios framework as a middleware to integrate with on-premises API's. Design Patterns used in React based app allowed the users to easily navigate across the Menu bar, access the different screens seamlessly. Additional functionalities included to get data for a specific date range, filter set up for all the columns to sort data as per need, access to historical data, color-coded rows to easily identify different workflow type, tabular view of information, security restrictions to allow users only with required permission to go beyond the landing screen. Middleware services are created using Axios framework to connect to the on-premises API, while Redux store is used to maintain user specific data its state throughout the workflow. The API's were built to provide interaction with on premise data sources and contained the business rules and procedures to secure data. Token based authentication was used to generate the list of permission a User would have within the system. The overall solution was built with atomic design and React patterns which help achieve reusable components, improve speed and flexibility and reduce overall cost.