{"id":13876219,"url":"https://github.com/cloudforet-io/console","last_synced_at":"2025-10-26T14:07:36.834Z","repository":{"id":58685556,"uuid":"532699501","full_name":"cloudforet-io/console","owner":"cloudforet-io","description":"Frontend Project for Open-source Multi \u0026 Hybrid Cloud Management Platform","archived":false,"fork":false,"pushed_at":"2025-02-15T16:57:06.000Z","size":250545,"stargazers_count":46,"open_issues_count":2,"forks_count":39,"subscribers_count":7,"default_branch":"develop","last_synced_at":"2025-02-15T18:15:11.971Z","etag":null,"topics":["composition-api","console","core","frontend","vue"],"latest_commit_sha":null,"homepage":"https://console-cloudforet.vercel.app","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/cloudforet-io.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":"AUTHORS","dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-09-05T01:06:16.000Z","updated_at":"2025-02-15T16:55:57.000Z","dependencies_parsed_at":"2024-04-15T01:36:04.918Z","dependency_job_id":"01e14fe2-6ce9-4380-8e17-6949ff4561d4","html_url":"https://github.com/cloudforet-io/console","commit_stats":null,"previous_names":[],"tags_count":679,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cloudforet-io%2Fconsole","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cloudforet-io%2Fconsole/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cloudforet-io%2Fconsole/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cloudforet-io%2Fconsole/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/cloudforet-io","download_url":"https://codeload.github.com/cloudforet-io/console/tar.gz/refs/heads/develop","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247353729,"owners_count":20925329,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["composition-api","console","core","frontend","vue"],"created_at":"2024-08-06T06:01:10.124Z","updated_at":"2025-10-26T14:07:36.819Z","avatar_url":"https://github.com/cloudforet-io.png","language":"Vue","funding_links":[],"categories":["Vue","vue"],"sub_categories":[],"readme":"\n\u003ch1 align=\"center\"\u003eCloudforet Console\u003c/h1\u003e  \n  \n\u003cbr/\u003e  \n\u003cdiv align=\"center\" style=\"display:flex;\"\u003e  \n  \u003cimg width=\"300\" src=\"https://user-images.githubusercontent.com/65589909/197983716-71a1bd21-4d6a-4217-b509-177afbadf5bc.png\"\u003e  \n  \u003cp\u003e \u003cbr\u003e  \n\u003ca  href=\"https://www.apache.org/licenses/LICENSE-2.0\"  target=\"_blank\"\u003e  \n\u003cimg  alt=\"License: Apache 2.0\"  src=\"https://img.shields.io/badge/License-Apache 2.0-yellow.svg\"  /\u003e  \n\u003c/a\u003e \u003cbr\u003e\n\u003ca href=\"http://storybook.developer.spaceone.dev/\"  target=\"_blank\"\u003e  \n    \u003cimg alt=\"mirinae storybook\" src=\"https://img.shields.io/badge/Design System-Mirinae-blueviolet.svg?logo=storybook\" /\u003e  \n\u003c/a\u003e\n\u003c/p\u003e  \n  \n\u003c/div\u003e    \n  \n\n\u0026nbsp;\n  \nThe present repository contains the source code of the **Cloudforet Web Console** application and related packages such as **Mirinae** which is the design system of the web console.\u003cbr/\u003e \n\n## Documentation\n\nThe documentation for the Cloudforet Console is located under the [docs](./docs) directory. \u003cbr/\u003e\n\n\n[![](https://sourcerer.io/fame/wesky93/spaceone-dev/console/images/0)](https://sourcerer.io/fame/wesky93/spaceone-dev/console/links/0)[![](https://sourcerer.io/fame/wesky93/spaceone-dev/console/images/1)](https://sourcerer.io/fame/wesky93/spaceone-dev/console/links/1)[![](https://sourcerer.io/fame/wesky93/spaceone-dev/console/images/2)](https://sourcerer.io/fame/wesky93/spaceone-dev/console/links/2)[![](https://sourcerer.io/fame/wesky93/spaceone-dev/console/images/3)](https://sourcerer.io/fame/wesky93/spaceone-dev/console/links/3)[![](https://sourcerer.io/fame/wesky93/spaceone-dev/console/images/4)](https://sourcerer.io/fame/wesky93/spaceone-dev/console/links/4)[![](https://sourcerer.io/fame/wesky93/spaceone-dev/console/images/5)](https://sourcerer.io/fame/wesky93/spaceone-dev/console/links/5)[![](https://sourcerer.io/fame/wesky93/spaceone-dev/console/images/6)](https://sourcerer.io/fame/wesky93/spaceone-dev/console/links/6)[![](https://sourcerer.io/fame/wesky93/spaceone-dev/console/images/7)](https://sourcerer.io/fame/wesky93/spaceone-dev/console/links/7)\n\n## Getting Started\n\nTo run the Web Console, you need follow the steps below.\n\n### 1. Configure the backend services\n\nThe Cloudforet Web Console needs backend services to run. \u003cbr/\u003e\nYou can see the details in the [Cloudforet Quick Install Guide](https://cloudforet.io/docs/setup_operation/quick_install). \u003cbr/\u003e\n\n### 2. Set up the configuration file\n\nTo run the Web Console, you need to set up the environment configuration file. \u003cbr/\u003e\n\u003cbr/\u003e\nThe configuration file is located in the `apps/web/public/config` directory. \u003cbr/\u003e\nThe default configuration file is `apps/web/public/config/default.json`. \u003cbr/\u003e\n\u003cbr/\u003e\nFor your development environment, you can copy `apps/web/public/config/development.sample.json` to `apps/web/public/config/\u003cenvironment\u003e.json` and modify it.\n- for development environment: ```apps/web/public/config/development.json```\n- for production environment: ```apps/web/public/config/production.json```\n\nThe final configuration file will be generated by merging the default configuration file and the environment configuration file. \u003cbr/\u003e\n\n#### Config Description\n\n| Name             | Description                                                                                                                                                                                            | Required |\n|------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------|\n| CONSOLE_API      | The configuration for Console API, including the ENDPOINT (API URL) and TIMEOUT (request timeout in milliseconds).                                                                                     | O        |\n| CONSOLE_API_V2   | The configuration for Console API V2, including the ENDPOINT (API URL) and TIMEOUT (request timeout in milliseconds).                                                                                  | O        |\n| GTAG_ID          | Google analytics Id                                                                                                                                                                                    | X        |\n| GTM_ID           | Google tag manager Id                                                                                                                                                                                  | X        |\n| DOMAIN_NAME      | Tenancy name                                                                                                                                                                                           | X        |\n| DOMAIN_NAME_REF  | In case of `hostname`, it will extract the domain name from the url.\u003c/br\u003eIn case of `config`, it will take `DOMAIN_NAME` value at the config file.                                                     | X        |\n| ADMIN_DOMAIN     | Root domain name                                                                                                                                                                                       | X        |\n| AMCHARTS_LICENSE | License information of amcharts                                                                                                                                                                        | X        |\n| DEV              | Development configuration. Refer to the [Development Configuration](###Development Configuration) section for details.                                                                                 | X        |\n| ASSET_PATH       | Asset endpoint information                                                                                                                                                                             | X        |\n| DOMAIN_IMAGE     | The url of the image used for the SignIn page and GNB                                                                                                                                                  | X        |\n| DOCS             | Information for creating related document links. \u003cbr/\u003e - Array of objects with labels and links \u003cbr/\u003e - Support ejs template grammar \u003cbr/\u003e - Provided variable: `lang` (User language code. e.g. \"en\") | X        |\n| CONTACT_LINK     | Define the 'contact us' link on the SignIn page                                                                                                                                                        | X        |\n| SERVICES | The config of service activation and versioning.                                                                                                           | X        |\n| SMTP_ENABLED | The state of the SMTP(Simple Mail Transfer Protocol) functionality. | X        |\n\n\n### 3. Add your chart license keys to your config file (Optional)\n\nThe Web Console internally uses amCharts 5 for charts. \u003cbr/\u003e\nBefore using the Console, look carefully at [amCharts' license](https://www.amcharts.com/online-store/licenses-explained/). \u003cbr/\u003e\nYou can download and use all amCharts 5 products for free. \u003cbr/\u003e\nThe only limitation of the free version is that a small amCharts logo will be displayed in the corner of your charts. \u003cbr/\u003e\nIf you’d rather have your charts without any branding, please purchase a [commercial license](https://www.amcharts.com/online-store/) and configure it to your config file with the following format: \u003cbr/\u003e\n\n```json\n{\n \"AMCHARTS_LICENSE\": {\n  \"ENABLED\": true,\n  \"AM5_CHARTS\": \"\",\n  \"AM5_MAPS\": \"\"\n }\n}\n```\n\n## Run\n\nYou can run the Web Console on your local with following commands.\n\n```shell\nnpm install\n\nnpm run start:web\n```\n### Development Configuration\n\nConfiguration for `DEV` in the config file.\nFollow the example at `apps/web/public/config/development.sample.json`.\n\n| Name    | Description                                                                                                            | Required |\n|---------|------------------------------------------------------------------------------------------------------------------------|----------|\n| ENABLED | boolean(false). Whether to use dev config or not.                                                                      | X        |\n| MOCK    | Mock mode configuration. Refer to the [Mock Configuration](####Mock Mode Configuration) section for details.           | X        |\n| AUTH    | Authentication configuration. Refer to the [Authentication Configuration](####Auth Configuration) section for details. | X        |\n\n#### Mock Mode Configuration\n\nConfiguration for `DEV.MOCK` in the config file.\n\n| Name          | Description                                                                                                                                                                        | Required |\n|---------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------|\n| ENABLED       | boolean(false). Whether apply mock mode to api requests except for reflection apis.                                                                                                | X        |\n| REFLECTION_V1 | boolean(false). Whether to apply mock mode to reflection api v1 or not.                                                                                                            | X        |\n| REFLECTION_V2 | boolean(false). Whether to apply mock mode to reflection api v2 or not.                                                                                                            | X        |\n| ENDPOINT_V1   | string(\"\"). Mock server endpoint for console api v1.                                                                                                                               | X        |\n| ENDPOINT_V2   | string(\"\"). Mock server endpoint for console api v2.                                                                                                                               | X        |\n| API_LIST_V1   | array of string([]). List of api v1 to enable mock mock mode. Refer to the [Rules for API_LIST](#####Rules for DEV.MOCK.API_LIST_V1 and DEV.MOCK.API_LIST_V2) section for details. | X        |\n| API_LIST_V2   | List of api v2 to enable mock mock mode. Refer to the [Rules for API_LIST](#####Rules for DEV.MOCK.API_LIST_V1 and DEV.MOCK.API_LIST_V2) section for details.                      | X        |\n\n##### Rules for DEV.MOCK.API_LIST_V1 and DEV.MOCK.API_LIST_V2\n\n- If the api is not in the list, it will be called to the real server.\n- If the api is in the list, it will be called to the mock server.\n- The black list has higher priority. So if the api is in the list and the api is in the black list, it will be called to the real server.\n\ne.g. [\"*\"] : All apis will be called to the mock server. \u003cbr/\u003e\ne.g. [\"/identity/*\", \"!/identity/domain/*\"] : All apis in the `/identity/*` will be called to the mock server except for `/identity/domain/*` api.\n\n#### Auth Configuration\n\nConfiguration for `DEV.AUTH` in the config file.\n\n| Name             | Description                                        | Required |\n|------------------|----------------------------------------------------|----------|\n| ENABLED          | boolean(false). Whether to use auth config or not. | X        |\n| SKIP_TOKEN_CHECK | Whether to skip checking token.                    | X        |\n| API_KEY          | API key which is used instead of access token.     | X        |\n\n\n## Testing\n\n### Set variables for e2e test\n\nAdd `apps/web/playwright/local.env` file into project root.\n```\n  USERNAME=testuser\n  PASSWORD=password\n  BASEURL=https://example.com/ \n```\n- `BASEURL` is an optional variable. Default is `http://localhost:8080`\n\n\n## 🧩 Mirinae - Cloudforet Design System  \n\nYou can see the details in the [Mirinae storybook](http://storybook.developer.spaceone.dev/). \u003cbr/\u003e\nYou can see the description of the Mirinae in the [Mirinae package](./packages/mirinae/README.md). \u003cbr/\u003e\n\n## Contributing\n\nTBU\n\n## 👨‍👩‍👧 Author  \n  \nSee our [OWNERS](https://github.com/cloudforet-io/console/blob/master/AUTHORS) file.   \n  \n\u0026nbsp;\n  \n## 📝 License\n\nThis project is [Apache 2.0](https://www.apache.org/licenses/LICENSE-2.0) licensed.\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcloudforet-io%2Fconsole","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcloudforet-io%2Fconsole","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcloudforet-io%2Fconsole/lists"}