Login and Logout

First, a dependency on the user component is added in the instance configuration:

"user": [
  "ccm.start",
  "https://ccmjs.github.io/akless-components/user/versions/ccm.user-9.3.1.js",
  {
    "realm": "guest",
    "title": "Guest Mode: Please enter any username",
    "logged_in": true
  }
]

In the start method you can then use something of this:

// log in user if not already logged in
await this.user.login();

// check if user is logged in
if (this.user.isLogged()) {...}

// logs data of logged in user in the developer console
console.log( this.user.data() );

// logs the unique user key of the user
console.log( this.user.data().key );

// logs the unique username of the user
console.log( this.user.data().user );

// logs the real name of the user (if exists)
console.log( this.user.data().name );

// if you need a login/logout button for the users, then do this:
this.element.querySelector('#login_logout_area').appendChild( this.user.root );