Device Manager Web Application is a client web application built using React that allows users to manage a list of devices. The application provides CRUD (Create, Read, Update and Delete) operations, sorting, and filtering functionality for the list of devices.
- Create, read, update, and delete devices from the list.
- Sort devices based on system name and HDD capacity.
- Apply filters to the device list for more organized viewing.
- React
- Vite (Build Tool)
- Wouter (For navigation)
- Zustand (State Management)
- Mantine (UI Components)
- FontAwesome (Icon Library)
Follow these steps to get Device Manager Web Application up and running on your local machine.
Make sure you have the following installed:
- Node.js (v18 or higher)
-
Install the Backend.
-
Clone the repository:
git clone https://github.com/rdourado/ninjaone-client.git
-
Navigate to the project directory:
cd ninjaone-client
-
Install dependencies:
npm install
-
Make sure the Backend is running on http://localhost:3000.
-
Start the development server:
npm run dev
-
The default browser will open automatically in the local url.
Every component follows the same folder structure, with index.tsx
being the only required file. Components can be nested while maintaining this structure.
└── ComponentName/
├── index.tsx
├── ComponentName.types.ts
├── ComponentName.utils.ts
├── ComponentName.[…].ts
├── __assets__/
│ └── […]
└── __tests__/
├── ComponentName.utils.test.ts
└── […]
.utils.ts
files essentially contain pure functions, each of which is accompanied by its own set of unit tests.- Types are mainly kept close to their usage, but they can be moved to a
.types.ts
file when there's a need for sharing them.