Skip to content

Erda's frontend UI, dashboard, console

License

Notifications You must be signed in to change notification settings

erda-bot/erda-ui

 
 

Repository files navigation

Frontend UI for Erda platform.

logo

codecov

📣 Introduction

Erda is an open-source platform created by Terminus to ensuring the development of microservice applications. This repository is about Erda's User Interface.

✨ Platforms

  • DevOps platform
  • Microservice Governance platform
  • Multi-Cloud Management platform
  • Edge computing platform
  • Fast-Data platform(open source soon)

For a detailed introduction, please check the official website.

🖥 Environment Support

Modern browsers

Firefox
Firefox
Chrome
Chrome
Safari
Safari
Edge
Edge
last 2 versions last 2 versions last 2 versions last 2 versions

🚀 Quick Start

Usage

Welcome to use Erda Cloud

Installation

Please follow How to install Erda.

Run Erda-UI project

This repository contains many Node.JS packages. Each package has its own set of commands, but the most common commands are available from the root package.json and can be accessed using the npm run ... command. Just follow the four steps below to start.

# Step1 Initialize the project of erda-ui
  # Run the following command in the root directory of erda-ui
	node setup.js

  # What does this command do?
  # 1.1 Initialize dependencies in shell, core, scheduler and cli
  # 1.2 Initialize ./erda/config.js in shell and core
  # 1.3 Register erda-ui command globally
  # 1.4 Generate .env in the root directory of erda-ui, which includes some environment variables


# Step2 Initialize modules in the directory of fdp and admin (Except for modules in the erda-ui directory)
  # Run the following command in the root directory of fdp and admin
	erda-ui setup <module> <port> 
	e.g., erda-ui setup admin 5001

  # What does this command do?
  # The port number of each module can be viewed in the .env file. After successful running, the .erda/config.js configuration file will be generated in the root directory of each module, and the path of the corresponding module will be automatically written in the .env file


# Step3 Build core package
  # Run the following command in the directory of erda-ui/core
	npm run build-dev

  # What does this command do?
  # The core package file will be generated in the public folder of the root directory, and static files will be read from that directory in development mode


# Step4 Start App
  # Run the following command in the directory of erda-ui
  	erda-ui launch

  # What does this command do?
  # The erda-ui directive contains a launch command. Running the erda-ui launch in the root directory of erda-ui can manage the processes of multiple modules in the same window simultaneously, and it will launch the corresponding services based on the modules registered in the .env file

Architecture

Technology stack:

  • UI library: Ant Design & Terminus NUSI
  • state management: cube-state
  • i18n: i18next
  • bundler: webpack

This project contain the following parts:

  • cli: command line interface for erda-ui, help to quick setup develop environment and pack files to docker images.
  • core: provide registration framework and core functions such as initialize cube-state and i18n etc.
  • shell: provide layout, user and common components for business modules.
  • scheduler: support module federation style development, register and navigate to multiple modules.
  • modules: business modules, each of these can develop and publish standalone.

architecture

architecture of development mode

🔗 Links

🤝 Contributing PRs Welcome

We welcome all contributions. Please read our CONTRIBUTING.md first. You can submit any ideas as pull requests or as GitHub issues. If you'd like to improve code, check out the Development Instructions and have a good time! :)

Contact Us

We look forward to your connecting with us, you can ask us any questions.

Wechat
  • 钉钉用户群(Dinktalk):
Dingtalk

License

Erda is under the AGPL 3.0 license. See the LICENSE file for details.

About

Erda's frontend UI, dashboard, console

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • TypeScript 88.8%
  • JavaScript 5.9%
  • SCSS 5.2%
  • HTML 0.1%
  • EJS 0.0%
  • Dockerfile 0.0%