tetris-dev-web / react_datagrid_app

Testing App using React + Databrid + KendoUI + Fake API

react_datagrid_app

Testing assessment App using React + Datagrid + KendoUI + Fake API

Features

Insert, Listing, Update, Delete Users using Fake API

Install

npm install

Quickstart

npm start

Technologies

• Typescript
• React
• Kendo React
• Material UI
• MobX
• formik, Yup
• Axios

Pages

• User List (Landing Page) - Kendo UI
• User Add (Dialog) - Kendo UI
• User Edit (Page) - Material UI

API

• Dummy data is stored in json formatted file
• Web API is fetching data from json file
• All API access contain >1s delay
• MobX 6.3.13

Kendo UI

• Kendo 5.0.1 under 30-days trial licence
• Grid, Form, Loader, Datepicker, Dialog, Button ...

Validation

• Username(required, length, alphanumeric), First Name(required, length), Last Name(required, length), Full Name (length)
• Username duplicated check

UX

• Button Color
• Delete confirming dialog
• Toast message for each action
• Loading screen for API call
• 404 error handling