Coder Social home page Coder Social logo

tangweikun / erda-ui Goto Github PK

View Code? Open in Web Editor NEW

This project forked from erda-project/erda-ui

0.0 1.0 0.0 11.6 MB

Erda's frontend UI, dashboard, console

License: GNU Affero General Public License v3.0

Dockerfile 0.01% JavaScript 5.63% TypeScript 89.17% SCSS 5.07% EJS 0.02% HTML 0.10% Shell 0.01%

erda-ui's Introduction

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 Install erda-ui cli to global
	npm i @erda-ui/cli -g


# Step2 Initialize the project of erda-ui
  # Run the following command in the root directory of erda-ui
	erda-ui init

  # What does this command do?
  # Generate initial config to the .env file. After successful running, the .env configuration file will be generated in the root directory of erda-ui.


# Step3 Build core package
  # Run the following command in the directory of core
	npm run build

  # 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 Watch shell package
  # Run the following command in the directory of shell
	npm run watch

  # What does this command do?
  # Watch the shell package file change and build file to the public folder of the root directory.


# Step5 Start App
  # Run the following command in the directory of scheduler
  npm start

  # What does this command do?
  # Start the dev server, redirect /static/{module}/* to the corresponding module folder in public folder based on the .env file, and redirect /api/* to api server.

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.

erda-ui's People

Contributors

daskyrk avatar dspo avatar effet avatar erda-bot avatar hujiahao-hjh avatar laojun avatar licao404 avatar liuhaoyang avatar mcdaddy avatar michael8512 avatar rayzhangzhang avatar sherotree avatar withlin avatar zero-rock avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.