https://github.com/samcodex/ngarch

NgArch is an Angular application architecture tool, analyzing the static structure of the Angular application and visually displaying the modules, components, services and data models in multiple diagrams. This repo is the web app(client) of the NgArch
https://github.com/samcodex/ngarch

angular4 architecture tool

Last synced: 10 days ago
JSON representation

NgArch is an Angular application architecture tool, analyzing the static structure of the Angular application and visually displaying the modules, components, services and data models in multiple diagrams. This repo is the web app(client) of the NgArch

• Host: GitHub
• URL: https://github.com/samcodex/ngarch
• Owner: samcodex
• Created: 2018-03-11T20:33:48.000Z (almost 7 years ago)
• Default Branch: master
• Last Pushed: 2023-01-07T02:20:14.000Z (about 2 years ago)
• Last Synced: 2025-01-15T14:15:26.102Z (21 days ago)
• Topics: angular4, architecture, tool
• Language: TypeScript
• Homepage:
• Size: 6.32 MB
• Stars: 3
• Watchers: 3
• Forks: 6
• Open Issues: 23
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# ngArch

ngArch is an Angular application architecture tool, analyzing the static structure of the Angular application and visually displaying the modules, components, services and data models in multiple diagrams.

## Description

ngArch(Angular application architecture tool) includes the following parts and projects.



  
ngArch server, called ngarch-server, is a node and express application. It parses the Typescript source code and extracts the elements of the Angular application.

  (To install, using 'npm install ngarch-server')

  
ngArch application, called ngarch, is an Angular 6 application. It visually shows the elements and the structure of the application in multiple diagrams.

  (To install, using 'npm install ngarch')

  
Dependency package, called ngarch-dev, is Angular project development dependency, which contains server(ngarch-server) and application(ngarch).

  (To install, using 'npm install ngarch-dev')



## Demo

ngArch Architecture







Structure Diagram







more demos

## Contributing

The project is maintained by samcodex

When contributing to this repository, please first discuss the change you wish to make via issue, email, or any other method with the owners of this repository before making a change.

Please note we have a code of conduct, please follow it in all your interactions with the project.

  
Google JavaScript Style Guide,

  Angular Style Guide


### Getting started



  
Fork the ngArch project


    Click on the "fork" button on top to clone your own fork of the ngArch project. It contains ngArch source code and the dependencies, including ngArch-server


  
Install the dependencies

    

    npm install

    


  
Start ngArch server


    npm start ngarch-server

    (using port 3000 for websocket)

    When the server is running, it first parses the current Angular project which is ngArch application itself.

  
Start ngArch application


    npm start

    (using port 5200)

  
Access ngArch application in browse


    http://localhost:5200

    Since ngArch is already parsed, the displaying content is the structure of ngArch itself.

    Change the analyzing project from drop down menu on the top.



## Use ngArch as development dependency

Install ngArch as development dependency to your Angular project



  
Installation


    npm install ngarch-dev --save-dev

  
Add launch script to package.json


    "scripts": {

      ...

      "ngarch": "node node_modules/ngarch-server/server",

      ...

    }

  
Start ngArch server


    npm run ngarch

    (using port 3000 for web and websocket)

    When the server is running, it first parses the host angular project.

  
Access ngArch application in browse


    http://localhost:3000

    The displaying content is the structure of your Angular project



## License

MIT