3d inventory

1. 3d inventory
   1. About project
      1. Motivation
   2. Technology stack
   3. Demo
   4. Data Model
      1. Logical model
   5. Aplication
      1. List devices
      2. Models
      3. Attributes
      4. Attribute Dictionary
      5. Connections
   6. Run
   7. Deploy
   8. Google Cloud
   9. APIs repos
   10. Contributing
   11. Next todo/progress/ideas

About project

The ✨3d inventory✨ project allows you to build a spatial and database representation of your datacenters.

Motivation

This project serves as a sandbox to explore relevant topics and issues related to creating a simple and efficient platform for IT inventory.

Project contain three repos:

• ⚓ https://github.com/karol-preiskorn/3d-inventory-angular-ui
• ⚓ https://github.com/karol-preiskorn/3d-inventory-mongo-api
• ⚓ https://github.com/karol-preiskorn/3d-inventory-oracle-api

Technology stack

• Angular 17+ - as a Corp framework.
• Bootstrap 5.3+ - logic for insert UI data
• tree.js 163+ - as best graph framework.
• MongoAtlas|Oracle - I want in this project try different solution and different data structure and storage datamodels relational and noSQL.
• REST - prepared API in use in Swagger.
• Podman --> Google Cloud as containers

Demo

Demo 3d inventory use Angular and three.js framework for graphics representation.

This project build from this example contain three.js in Angular Tutorial to render 3D 3d in Angular + Three.js.

Data Model

This is the implementation of a parametric generic attribute class. All attributes for Devices, Models, and Connections are stored in this model.

Parameter types are defined in the Attribute Dictionary.

In Attributes, values defined in the Attribute Dictionary for Devices, Models, and Connections are stored. The Attribute Dictionary specifies parameters for these entities.

Logical model

Relational data model is maped to noSQL model im MondoDb.

Aplication

List devices

Models

Attributes

Attribute Dictionary

Connections

Run

git clone https://github.com/karol-preiskorn/3d-inventory-angular-ui.git
cd 3d-inventory-angular-ui
npm install
npm run start

or run separately json-server and ui

npm run start:json-server
npm run start:ng

Goto in browser http://localhost:4200

Deploy

https://angular.io/guide/deployment

Build in first terminal: ng build --watch in npm alias:

npm run build

Google Cloud

tbc

APIs repos

• Oracle 3d-inventory-oracle-api
• Mongo Atlas ✨ 3d-inventory-mongo-api

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change. Please make sure to update tests as appropriate. Don't forget about the code guidelines.

Next todo/progress/ideas

• Connection between showing 3D and defined devices.
• Build interface to Mongo Atlas.
• Set position and model in data and show this data in 3D.
• Show attributes of DEVICES, MODELS, and CONNECTIONS.
  • Attributes will show as a table of AttributesDictionary types + value.
• Generate FLOOR.
  • As an array of squares (x, y, h).
• Docker -> Serve application in GitHub Pages --> AWS EC2.
• Use Dev container in GitHub for development.
• Recognize Grunt/Gulp to CI/CD use in this project.
• Add actual tasks from GitHub during build in README.md.
• Add light/dark theme switch in UI.
• Use https://formly.dev/ ?
• Create blog on GitHub Pages or use https://ultimasolution.pl.
  • Start writing blog articles.
• Try using NgDoc to document how to use code with NgDoc.
  • Use tsdoc (middle fun).