Creating the Application with ADF

[alfresco]

This content is part of the Alfresco ADF getting started tutorials and describes how to create your Angular 4 application on top of the service layer composed by Alfresco Process Services, Alfresco Content Services or both. In the following sections we are going to see how to create a brand new application with Alfresco ADF, assuming an up and running service layer based on Alfresco Process Services and Alfresco Content Services. To reach the goal, we are going to split the whole task as described below:

1. Checking the prerequisites (Node.js). In this task you are going to be sure that you have installed all the required software and done all the necessary configurations into your environment.

2. Installing Yeoman and the Alfresco App Generator. In this task you are going to set up all it is requested to create your first application with Alfresco ADF.

3. Generating your first Alfresco ADF application. In this task you are going to create your first application with Alfresco ADF.

Below you can find a “step by step” description of each task, very straightforward also if you are not extremely familiar with these technologies.

1. Checking the prerequisites (Node.js)

In this task you are going to check all the requested software with the right versions and configurations. The prerequisites are mainly about the availability of Node.js JavaScript runtime built, together with its package ecosystem named npm.

Alfresco ADF supports Node.js 6.9.x as official long term supported version, but it is compliance with 7.x versions too. To check which version is installed into your environment, you can run the command below into a terminal (valid for Linux and Windows based Operating Systems).

node -v

To install Node.js into your environment (and npm as a consequence) you can follow the various guides and tutorials over the web. Please take a look at the link here, for further details about the available distributions and support for its installation.

2. Installing Yeoman and the Alfresco App Generator

Now that your environment is correctly checked, it’s time to install the Yeoman scaffolder generator and the Alfresco App Generator. To complete this task, simply run the commands below into a terminal (valid for Linux and Windows based Operating Systems). Please be sure to execute the commands with administrator permits (in Linux using the sudo prefix to all the commands).

npm install -g yo
npm install -g generator-ng2-alfresco-app

For further details about the Alfresco App Generator and contribution to the project, you can check the GitHub project available as Open Source.

3. Generating your first Alfresco ADF application

Once your environment is correctly set up, it’s time create the Alfresco ADF application. Creating your first application with Alfresco ADF is very straightforward following the commands described below.

• Open a terminal and move to a folder where you want to create your project.

• Run the command below to start the Alfresco ADF App Generator wizard.

yo ng2-alfresco-app

During the execution, some questions will be asked to correctly create the application. Below a screenshot showing the questions as an example.

Alfresco App Generator wizard.

Once all the questions will be fully completed, a new folder appears, named with the same name of your application (in this case my-adf). The folder represents the source code of your new project created with Alfresco ADF.

From now on, your project is defined in its initial (but working) version so you can: move it into another destination, start developing and customizing it, commit the source code into your preferred repository.

Next task >>