Console Kit

Azion Console Kit is a front-end development kit used for crafting a customized Azion Console interface. It’s developed with the Vue/Vite and Tailwind frameworks, as well as the PrimeVue component library. This kit is built upon the Azion API and supports multi-tenancy, which allows you to integrate the Azion Edge Computing Platform with your own APIs.

You can use Console Kit to provide a customized experience for developers by creating your own theme or rearranging UI components according to your business needs. Console Kit follows a simple and organized structure with layered separation of blocks, components, and services, promoting a clean and maintainable codebase.

The Console Kit is available on the Github repository.

Implementation

Check the full list of requirements and installation and configuration guides in the Console Kit repository on GitHub.

Requirements

  1. Install Node.js by downloading the executable.
  2. Open a terminal and run the following command to check the versions of the packages installed.
Terminal window
npm -v && node -v
  1. Now run the following command to install the Yarn package manager:
Terminal window
npm install -g yarn

Setting up a project

  1. To create your own version of the Azion Console, fork the repository into your account.
  2. On the homepage of the forked repository, click Code and copy the HTTPS git URI.
  3. Launch your terminal and paste your repository URI through the following command, ensuring you have Git installed:
Terminal window
git clone https://github.com/your-username/azion-console-kit.git
  1. Navigate to the console kit folder:
Terminal window
cd azion-console-kit
  1. Run the following command to update the project:
Terminal window
yarn install
  1. Run this command to launch the project locally:
Terminal window
yarn dev --host

Configuring environment variables

For a faster setup, generate a personal token in Azion Console and save it in a .env.development file:

Terminal window
echo 'VITE_PERSONAL_TOKEN=PERSONALTOKEN' > .env.development

By default, Azion Console Kit uses the STAGE stack to connect with Azion APIs. To point your application to the PRODUCTION stack, add the following command in the .env.development file:

.env.development
VITE_ENVIRONMENT='PRODUCTION'

Deploying the Console Kit to the edge

Azion Console Kit can run natively on Azion’s edge using the Azion CLI (version >= 0.70.0). To do so, follow these steps:

  1. Download and install the Azion CLI using your preferred method.
  2. Configure your personal token on the CLI:
Terminal window
azion --token PERSONAL_TOKEN
  1. Run the following command with sudo privileges:
Terminal window
azion link
  1. Respond to the prompts as needed.
  2. Once you deploy your application, the CLI will generate an edge application domain in the format https://xxxxxxxxxx.map.azionedge.net with the Console Kit project running.

Use Cases

Refer to the guides below for more information on Console Kit use cases:

Contributors