Purpose

To demonstrate how to create a webpackage using the Coder DevTools.

Prerequisites

• A Cubbles project was generated

• Coder DevTools are a available

Create a Webpackage

A Webpackage acts as a container for the different artifacts, i.e. components, apps and utilities. A webpackage is defined by a file called manifest.webpackage, which is a JSON file that describes the internal model of the webpackage and of each of its artifacts.

> grunt +createWebpackage

Then you should provide the following information:

• A name for the webpackage, e.g. "<your-name>-starterpack"
• A name, e.g. your name
• An email address, e.g. your email
• And (optionally) a webpackage groupId, as kind of namespace for your organization

The new webpackage will be the active webpackage. If everything went well you will get the following message:

The created Webpackage is the new 'activeWebpackage' (@see .workspace)

Done, without errors.

Process finished with exit code 0

Note that at this stage it is possible to change some package settings. This is not necessary and not mandatory for this tutorial. A few possibilities will be mentioned here:

• You can change the parameters of the file .editorconfig, for instance if you like working with a different indent_size.
• You can add the .gitignore file inside your package folder when you want to specify files (of packages for example) that should be ignored by the git management.
• If you want to use bower to download additional libraries in the future you can change the default folder to download libraries to by modifying the file .bowerrc.

Test: Start the webserver

To visualize the webpackage, it is necessary to start a local webserver. You can use the following command, to run the +startWebserver task:

> grunt +startWebserver

If everything goes well, the bash will display the following message:

Currently mapped Webpackage: my-starterpack (@see ..\webpackages\.workspace)

Running "cubx-http-server:dev" (cubx-http-server) task
Server running on http://localhost:8282/
Hit CTRL-C to stop the server

Then, your standard web browser will open the http://localhost:8282 url and show the root of the project folder. Now you can navigate to your webpackage (same name as given above). Your webpackage is provided with an example artifact called app, click on it and you will sea a Hello World! page.