Skip to content

Commit

Permalink
ENDOC-346 Absorb review comments, copy to Next
Browse files Browse the repository at this point in the history
  • Loading branch information
Lydia committed Nov 12, 2021
1 parent 8309127 commit e79088d
Show file tree
Hide file tree
Showing 2 changed files with 41 additions and 35 deletions.
70 changes: 38 additions & 32 deletions vuepress/docs/next/tutorials/ecr/publish-simple-bundle.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,32 +5,36 @@ redirectFrom: /next/tutorials/ecr/tutorials/create-ecr-bundle-from-git.html
# Build and Publish a Simple Bundle

## Overview
This tutorial shows you how to create a simple Entando bundle and deploy it into the Entando Component Repository. This involves manually defining a bundle with a single widget, checking your bundle artifacts into git, apply the Entando bundle custom resource to Kubernetes, and then installing the bundle into your application.
In this tutorial you will learn how to create a simple Entando bundle and deploy it into the Entando Component Repository. This involves manually defining a bundle with a single widget, checking the bundle artifacts into Git, applying the Entando bundle custom resource to Kubernetes, and then installing the bundle into an application.

## Prerequisites
* Use the [Entando CLI](../../docs/reference/entando-cli.md#check-environment) to verify you have the prerequisites in place for this tutorial (e.g. Java, npm, git).
* Use the [Entando CLI](../../docs/reference/entando-cli.md#check-environment) to verify all dependencies for this tutorial are installed (e.g. Java, npm, Git).
``` sh
ent check-env develop
```
* You will also need your git credentials, an available git repository, and an Entando instance.
* Authenticated Git credentials, an empty Git repository and an available Entando instance are required for the commands below to execute without errors.

Some of the following steps can be simplified by using the `ent prj` command and its publication system (pbs) convenience methods. The manual steps are also provided in those cases.
Publishing a bundle can be simplified by using the `ent prj` command and its publication system (pbs) convenience methods. Both the CLI and manual commands are provided.

## Create the project structure
First create a parent project directory along with a child bundle directory. In a project generated by the Entando Component Generator the microservice and micro frontend source files also live under the parent directory.
First create a parent project directory (e.g. `example-bundle`) along with a child bundle directory. In a project generated by the Entando Component Generator the microservice and micro frontend source files live under the parent directory.

``` sh
mkdir -p example-bundle/bundle; cd example-bundle/bundle
```
## Add a simple widget

Create a widget directory and descriptor file:
Create a widget directory
``` sh
mkdir widgets
```

Create a widget descriptor file within that directory
``` sh
touch widgets/example-widget.yaml
```

Populate the `example-widget.yaml` with a simple definition. Make sure to retain the correct YAML indentation.
Populate the widget descriptor file `example-widget.yaml` with a simple definition. Make sure to retain the correct YAML indentation of 2 or 4 spaces.
``` yaml
code: example-widget
titles:
Expand All @@ -42,100 +46,102 @@ customUi: <h2>Hi from Example Widget</h2>
## Create the bundle descriptor
The `descriptor.yaml` is the main file processed by the Entando Component Repository and describes all of the components in the bundle. The name of the bundle descriptor must be `descriptor.yaml`.
The main file processed by the Entando Component Repository is `descriptor.yaml`, which describes all of the components within the bundle. The name of the bundle descriptor file must be `descriptor.yaml` and it must be stored in the child bundle directory (e.g. `example-bundle/bundle`).
```sh
touch descriptor.yaml
```

Populate the descriptor with the following YAML definition:
Populate the bundle descriptor file with the following YAML definition
``` yaml
code: example-bundle
description: This is an example of an Entando bundle
components:
widgets:
- widgets/example-widget.yaml
```
The component descriptor file name and location (e.g. `widgets/example-widget.yaml`) are arbitrary since the bundle descriptor explicitly points to the file. The typical convention is to group components by type, for example with all widgets in one directory, all page templates in another, etc.
Component descriptor file names and locations (e.g. `widgets/example-widget.yaml`) are arbitrary since the bundle descriptor explicitly points to those files. Convention is to group components by type with all widgets in one directory, all page templates in another, etc.

## Publish the bundle

You can publish a bundle using the CLI or you can perform the steps by hand.
The bundle can be published using the CLI or the steps can be performed manually.

### CLI steps
1. Change to the project directory, if needed
1. Change to the project directory if needed
```sh
cd example-bundle
```

2. Initialize the Entando project and accept the defaults.
2. Initialize the Entando project and accept the defaults
``` sh
ent prj init
```
3. Initialize the publication system. You'll need the git repository URL and your credentials here.

3. Initialize the publication system. This step requires the empty Git repository URL (ending in .git) and your Git credentials.
``` sh
ent prj pbs-init
```
4. Publish the bundle to git. By convention your first version will be `v0.0.1` but this is up to you.

4. Publish the bundle to Git. By convention the first version is assigned the tag `v0.0.1` but the prefix "v" is optional.
``` sh
ent prj pbs-publish
```
On subsequent iterations you can run just this command again to quickly push a new version of your bundle to git.
Running just the command `ent prj pbs-publish` will quickly push subsequent iterations of the bundle to Git. You will be asked to input the bundle version each time. To ensure that iterations are listed in the correct order you must be consistent with versioning format and alphanumeric precedence.

5. You can now deploy the bundle into the Entando Component Repository in one step.
5. The bundle can now be deployed into the Entando Component Repository with one command
``` sh
ent prj deploy
```
The `prj deploy` command uses the git repository URL and project name from earlier steps to create the custom resource.
The `prj deploy` command uses the Git repository URL and project name (e.g. `example-bundle`) to create the custom resource.

6. Jump to the section below to finish installing your bundle: [Install the bundle into an application](#install-the-bundle-into-an-application)
6. Jump to [Install the bundle into an application](#install-the-bundle-into-an-application) to finish installing your bundle.

### Manual steps
1. Change to the bundle directory, if needed
### Manual steps
1. Change to the bundle directory if needed
``` sh
cd example-bundle/bundle
```

2. Run the following commands to initialize git and commit the files.
2. Run the following commands to initialize Git and commit the files
``` sh
git init
git add .
git commit -m "Init Git repository"
```

3. Add your remote repository as origin and push the bundle.
3. Add your remote repository as origin and push the bundle
``` sh
git remote add origin https://your/remote/repository.git
git push -u origin master
```

4. Publish a git tag using the following commands.
4. Publish a Git tag
``` sh
git tag -a "v0.0.1" -m "My first tag"
git push --tags
```

5. Now that you've published your bundle to git you can create the Kubernetes custom resource for it.
5. Now that you've published your bundle to Git you can create the Kubernetes custom resource for it.

Install the bundler if you haven't previously done so.
Install the bundler if you haven't previously done so
``` sh
npm install -g @entando/[email protected]
```

Next generate the custom resource for your bundle. Run the `entando-bundler from-git` command and provide your remote git repository URL via the `--repository` option and the correct namespace via `--namespace`. You can also provide a thumbnail for your bundle with `--thumbnail-file` or `--thumbnail-url`.
To generate the custom resource for your bundle run the `entando-bundler from-git` command, then provide your remote Git repository URL via the `--repository` option and the correct namespace via `--namespace`. You can also provide a thumbnail for your bundle with `--thumbnail-file` or `--thumbnail-url`.

``` sh
entando-bundler from-git --name=example-bundle --namespace=entandp --repository=https://your/remote/repository.git --dry-run > example-bundle.yaml
entando-bundler from-git --name=example-bundle --namespace=entando --repository=https://your/remote/repository.git --dry-run > example-bundle.yaml
```

Next you can apply this definition to Kubernetes. You may need to first transfer the file to your VM, e.g using `multipass transfer`.
Now you can apply this definition to Kubernetes. You may need to first transfer the file to your VM (e.g using `multipass transfer`).

```
kubectl -n entando apply -f example-bundle.yaml
```
You can confirm the presence of your custom resource via `kubectl get EntandoDeBundle -n entando`
You can confirm the presence of your custom resource with the command `kubectl get EntandoDeBundle -n entando`.
## Install the bundle into an application
Now you can go to the `App Builder` → `Component Repository` and install your bundle. You should see your bundle in the list and when you click `Install` you can select your preferred version if the bundle contains more than one.
Your bundle should appear in `App Builder` → `Component Repository` in your Entando instance. Clicking `Install` should allow version selection if your bundle has multiple iterations.
At this point the Entando platform will download and install the components contained in the bundle. Once complete you should see the `Install` button change to give you an option to `Uninstall` that specific version. You can also navigate to `Components` → `Micro Frontends & Widgets` and find your custom widget under the `User` section.
The Entando platform will then download and install the components contained in the bundle. Once complete you should see the `Install` button change to give you the option to `Uninstall` that specific version. If you navigate to `Components` → `Micro Frontends & Widgets` you should find your custom widget within the `User` section.
6 changes: 3 additions & 3 deletions vuepress/docs/v6.3.2/tutorials/ecr/publish-simple-bundle.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ ent check-env develop
Publishing a bundle can be simplified by using the `ent prj` command and its publication system (pbs) convenience methods. Both the CLI and manual commands are provided.

## Create the project structure
First create a parent project directory (e.g. `example-bundle` along with a child bundle directory. In a project generated by the Entando Component Generator the microservice and micro frontend source files live under the parent directory.
First create a parent project directory (e.g. `example-bundle`) along with a child bundle directory. In a project generated by the Entando Component Generator the microservice and micro frontend source files live under the parent directory.

``` sh
mkdir -p example-bundle/bundle; cd example-bundle/bundle
Expand Down Expand Up @@ -46,7 +46,7 @@ customUi: <h2>Hi from Example Widget</h2>
## Create the bundle descriptor
The bundle descriptor file `descriptor.yaml` is the main file processed by the Entando Component Repository and describes all of the components within the bundle. The name of the bundle descriptor must be `descriptor.yaml` and it must be stored in the child bundle directory (e.g. `example-bundle/bundle`).
The main file processed by the Entando Component Repository is `descriptor.yaml`, which describes all of the components within the bundle. The name of the bundle descriptor file must be `descriptor.yaml` and it must be stored in the child bundle directory (e.g. `example-bundle/bundle`).
```sh
touch descriptor.yaml
```
Expand All @@ -59,7 +59,7 @@ components:
widgets:
- widgets/example-widget.yaml
```
Component descriptor file names and locations (e.g. `widgets/example-widget.yaml`) are arbitrary since the bundle descriptor explicitly points to those files. Convention is to group components by type (e.g. all widgets in one directory, all page templates in another, etc.).
Component descriptor file names and locations (e.g. `widgets/example-widget.yaml`) are arbitrary since the bundle descriptor explicitly points to those files. Convention is to group components by type with all widgets in one directory, all page templates in another, etc.

## Publish the bundle

Expand Down

0 comments on commit e79088d

Please sign in to comment.