12 - May - 2022
| No | Package Installs | Usage for... |
|---|---|---|
| 1 | yarn add sass |
Styling the UI . |
| 2 | yarn add axios |
Promise based HTTP client for the browser |
| 3 | yarn add date-fns |
Modern JavaScript date utility library |
| 4 | yarn add react-date-range |
Component for choosing dates & date ranges |
| 5 | yarn add react-router-dom |
DOM bindings for React Router |
| 6 | yarn add @fortawesome/react-fontawesome |
Font-Awesome Components |
| 7 | yarn add @fortawesome/fontawesome-svg-core |
icons |
| 8 | yarn add @fortawesome/free-solid-svg-icons |
icons |
| 9 | yarn add @fortawesome/free-regular-svg-icons |
icons |
| No | Package Installs | Usage for... |
|---|---|---|
| 1 | yarn add sass |
Styling the UI |
| 2 | yarn add recharts |
React Charts |
| 3 | yarn add react-circular-progressbar |
React waiting progress bar |
| 4 | yarn add @mui/x-data-grid |
Data Grid Component |
| 5 | yarn add @mui/icons-material |
Material Design icons as SVG |
| 6 | yarn add @mui/material |
Google's Material Design |
| 7 | yarn add @emotion/react |
Simple styling in React |
| 8 | yarn add @emotion/styled |
Styled API for emotion |
| No | Package Installs | Usage of |
|---|---|---|
| 1 | yarn add express |
Framework of Node.Js for avoiding boilerplate code |
| 2 | yarn add nodemon |
Restart serve on every changing.. |
| 3 | yarn add dotenv |
Hiding environment variables |
| 4 | yarn add cors |
Node.js CORS middleware |
| 5 | yarn add mongoose |
MongoDB Database Schema |
| 6 | yarn add bcryptjs |
Hashing for user password |
| 7 | yarn add jsonwebtoken |
JSON Web Token implementation |
| 8 | yarn add cookie-parser |
Parse Cookie header and populate req.cookies with an object |
| No | Context learn by doing this project... |
|---|---|
| 1 | Layout Architecture |
| 2 | Organize File Structure |
| 3 | Data Passing through react-router-dom |
| 4 | Implementation of date picker library |
| 5 | Custom Hook implementation for Data Fetching |
| 6 | ContextAPI + useReducer + Trick Part of using ContextAPI |
| 7 | Starting to Ending Date subtraction for calculate Total Days |
| 8 | position: fixed sidebar search + hight: max-content option |
| 9 | Raw image sidler left + right moving functionality implementation |