If you find any errors, typos or have general feedback, select the text and click CTRL+ALT+ENTER.

Introduction

In this tutorial, you’ll learn how to create an account with the Amazon web service (AWS), set up your external relational database and connect it for using in an Appery.io app with API Express.

Before you begin

Tutorial level: intermediate.
Prerequisites: an Appery.io account.

Creating Amazon AWS Account

1. Open the link – https://aws.amazon.com.

2. Click Create a Free Account.

3. In the new page, enter the e-mail, select I am a new user. and click Sign in using our secure server.

4. On the next page, fill in all the fields and click Create account.

5. The next step is providing all the contact information. After that, click Create Account and Continue.

6. After that, enter your payment information and click Continue.

7. The next step is your identity verification by telephone. Make all the necessary corrections in the fields and click Call Me Now. After you get a call from an automated system, you’ll be prompted to enter your PIN-number on the phone.

8. If everything has been done correctly, you’ll be redirected to the next page where you should select the AWS Support Plan and click Continue.

Congratulations! Your registration has been completed.

Creating a database

1.  Now, you can login with your account on the main page.

2. Proceed with your login and password.

3. After the successful login, you’ll get access to the Amazon Web Services console. Choose the Database > RDS:Console

4. On the next page, select Instances.

5. And then click Launch DB Instance.

6. Then select a DB Engine (here – PostgreSQL) and confirm your choice.

7. On the next step, select No (if the DB accessibility in several zones is not critical in your case) and click Next Step.

8. On the next step, you should specify the DB details for the instance. In the example, we use db.t2.micro, and, for Multi-AZ Deployment select No:SpecifyDBDetails

9. If needed, configure the network and security settings and/or the database options:
ConfigureAdvancedSettings

Mind the message that appears when you select Create new Security Group for the VPC Security Group(s).
By default, accessing the database is made possible with the current mail (the instance was created with), but below you will find how you can change it, if necessary.

10. After all the necessary fields have been filled in, click Launch DB Instance.

11. As a result, the success message appears.

12. Now, let’s click View your DB Instances and wait for the instance to be created. When the status changes to available, your database is ready and can be used. Click the triangle sign on the left to open the full view:Available

13. For getting access, we use the following:

  • URL  – Endpoint.
  • PortPort.
  • Database nameDB Name.
  • Username and password – the previously set credentials.

14. If any changes to the database security are necessary (for accessing the database from other addresses), follow this link for Security Groups:SecurityGroups

15. In the new window, select Actions > Edit inbound rules:EditInboundrules

16. Then, select Anywhere for Source (you can also define a desired address by selecting Custom IP) and click Save:Anywhere

Creating a database table

Now, to start working with API Express, we need to create a table(s) by using special database tools.

1. Let’s take, as an example, pgAdminhttp://www.pgadmin.org/index.php.

2. Download the soft, install it, and run.

3. On the main page, click Add a connection to a server.

4. Fill in all the necessary fields (see step 15 from the Logging into AWS and Creating DB section above), define any name you like and confirm:
NewServerInfo

5. In the Object browser view, select the newly created connection:
NewServer

6. Open the connections tree and switch to Databases > NewDB > Schemas > Public > Tables:
TablesTree

7. Right-click on Tables, then select New Table.

8. In the new window, enter the name and switch to the Columns tab:NewTable

9. Add the columns to your table by clicking Add and defining their names and types.

10. In our example, we add two columns: (idserial and namecharacter varying):
2cols

11. Now, let’s add a Primary key: on the Constraints tab, click Add:
PrimaryKey

12. And, in the new page, enter the Primary key name and switch to Columns:
PKCols

13. In the drop-down, select id, click Add, and then  – OK:
IDSelect

14. In the New Table dialog, also click OK.

Filling the table with data

Let’s add some data to the table.

1. In pgAdmin III, right-click on the table in Tables (here it’s NewTable), then select View Data, and then – View All Rows:EditData

2. In the new page, enter some data into the fields provided:
3Items

Ensure, that the table has a primary key defined.

Now, when we have a table filled in, let’s create an app and check how our model works.

Adding database to API Express

1. In the Appery.io builder, go to the API Express tab.

2. There, click Create new  DB connection, fill in all the required information (see step 15 from the Logging into AWS and Creating DB section above), enter any name, select Relational database as Connectional type, and, for Database type, select PostgreSQL:

3. To ensure it works, click Test and then – Save.

4. Now, let’s create a new project: under the same API Express tab, click Create new project, enter its name and click Create.

5. Open it and click on the new model.

6. In the new window, enter the name, select connection and table, and click Save:
ModelSaved

7. The model saved, now it can be tested.

Creating an App

1. In the builder, go Apps > Create new app > Bootstrap AngularJS App.

2. Name the app and click Create.

3. In the app: CREATE NEW > Extensions > API Express Generator.

4. Now, add the services to be able to work with the model. Select the project (here – NewProject), then click on the root folder link, opening the model (here – NewModel) and click generateGenerate

5. In the new window, enter the service name (for example, APIExpressService_users), confirm, and reload your browser page.

6. After reloading, the list of created Services and JavaSscript appears in the Project tree.

7. Now, switch to Pages > Screen1, and add the following PALETTE components:

  • an Input to enter an id for search. For the Input, enter userid for the ng-model.
  • a Button to invoke a getrecord function (change its Text to Get and add get() for ng-click).
  • and a Text to get the returned entries (change its Text to {{username}}):

UI

8. In SCOPE, add two variables: userid (to connect the model to input) and username (which is outputted to text with the help of {{username}}):2variables

9. Then, add the get function, click Edit, then – Invoke service. For the service name, enter: APIExpressService_users_get.

10. Now, define the following mappings and click Save and return:

  • for request: RequestMapping
  • and for success:SuccessMapping

11. For a successful response case, add the following to the code (to apply the UI changes):

12. And, for the error, add the following:

13. As a result, the get function should look like this:

Testing the app

Click TEST to test the app.

The app looks like the following:
Fin

Result