User Registration Example App for Bootstrap and Ionic with AngularJS

Posted: June 18th, 2015Author:

Example of a login box

User login/registration is one of the most common features in a mobile app. With Appery.io Database’s built-in user management feature, adding a login and registration capability to an app is very fast and simple. We know that developers love examples and so we created a ready-to-run app available in the App Builder that shows how to do that. In fact, we created two examples: one example uses Bootstrap and another example uses Ionic, both based on AngularJS.

To create an app from an example, click Create new app > From example and choose the example you want from the list of available examples.

ionic_login_page

Ionic Login Page

bootstrap_login_page

Bootstrap Login Page

Here is what functionality is covered in this example:

  • User registration
  • User login
  • User sign out
  • User session management
  • Create/view/delete – a list of items for the logged in user

Because example uses database to store data, it requires a very minimal setup:

  1. Create a new database called: myDB.
  2. Inside the database, create a collection called: Stuff.
  3. Inside the Stuff collection, create one column called: text (String type).
  4. With the Stuff collection open, click Change default ACL button.
  5. Inside the input field type: @Creator, click Add User.
  6. Click Save and Close.
  7. Copy the created database id and paste it to the myDB_settings > database_id (under Services folder) in the Visual Builder.

Both examples are virtually identical with the only difference being the UI framework used: Bootstrap or Ionic. Try these examples and let us know what you think.