Login and Register page in android using Node JS REST API| Todo Android app using Node JS and REST API | Part 3

In this series of todo app using rest API, today we design and add functionalities in our Login and Register page in android using the Node JS REST API.

If you’re new then go through the previous parts of this project otherwise you will not understand anything about this project. CLICK HERE for Part 1 and CLICK HERE for Part 2.

Overview

Part 1: design Register and Login page

  • Create two new activity named as LoginActivity and RegisterActivity in our java package (/package/activity/RegisterActivity and /package/activity/LoginActivity).
  • Now in the Register XML file create our register page. Here I add three EditTexts, one for username, one for user email id, and one for the user password. And also add one button for sign up and one textView for redirecting the user to the sign-in page or login page.
  • We will POST this data using REST API to our database, here I used MongoDB database as our main database to store user data.

Now, let’s design our register page:

<?xml version=”1.0" encoding=”utf-8"?>
<ScrollView xmlns:android=”http://schemas.android.com/apk/res/android"
xmlns:app=”http://schemas.android.com/apk/res-auto"
xmlns:tools=”http://schemas.android.com/tools"
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:fillViewport=”true”
android:padding=”20dp”
android:fitsSystemWindows=”true”
android:background=”@drawable/on_page”
tools:context=”.RegisterActivity”>

<LinearLayout
android:orientation=”vertical”
android:layout_width=”match_parent”
android:layout_height=”match_parent”>

<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”@string/signup”
android:textColor=”@color/colorAccent”
android:fontFamily=”@font/poppins_bold”
android:textSize=”32sp”
android:layout_marginTop=”20sp”
android:layout_marginStart=”20dp”
android:includeFontPadding=”false”/>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”@string/create”
android:textColor=”@color/dotsColor”
android:fontFamily=”@font/poppins”
android:layout_marginStart=”20dp”
android:includeFontPadding=”false”
android:textSize=”14sp”/>

<LinearLayout
android:orientation=”vertical”
android:layout_width=”match_parent”
android:layout_margin=”20dp”
android:layout_height=”wrap_content”>

<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”@string/name”
android:layout_marginTop=”15dp”
android:fontFamily=”@font/poppins”
android:textColor=”@color/dotsColor”
android:textSize=”18sp”/>
<EditText
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:id=”@+id/name_ET”
android:inputType=”text”
android:hint=”@string/name_demo”
android:background=”@drawable/input_field”
android:textColor=”@color/colorPrimary”
android:textColorHint=”@color/dotsColor”
android:fontFamily=”@font/poppins”
android:layout_marginTop=”5dp”
android:singleLine=”true”/>

<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”@string/email”
android:layout_marginTop=”15dp”
android:fontFamily=”@font/poppins”
android:textColor=”@color/dotsColor”
android:textSize=”18sp”/>

<EditText
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:id=”@+id/email_ET”
android:inputType=”textEmailAddress”
android:hint=”@string/email_demo”
android:background=”@drawable/input_field”
android:textColor=”@color/colorPrimary”
android:textColorHint=”@color/dotsColor”
android:fontFamily=”@font/poppins”
android:layout_marginTop=”5dp”
android:singleLine=”true”/>

<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”@string/password”
android:fontFamily=”@font/poppins”
android:textColor=”@color/dotsColor”
android:textSize=”18sp”
android:layout_marginTop=”15dp”/>

<LinearLayout
android:layout_marginTop=”5dp”
android:orientation=”vertical”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”>
<EditText
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:id=”@+id/password_ET”
android:hint=”@string/password_demo”
android:layout_gravity=”center”
android:gravity=”center_vertical”
android:background=”@drawable/input_field”
android:textColor=”@color/colorPrimary”
android:textColorHint=”@color/dotsColor”
android:fontFamily=”@font/poppins”
android:inputType=”textPassword”
android:singleLine=”true”
android:layout_toLeftOf=”@+id/showHideBtn”
android:layout_alignParentStart=”true”/>

<CheckBox
android:id=”@+id/showHideBtn”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:buttonTint=”@color/colorAccent”
android:text=”Show Password”
android:textColor=”@color/colorAccent”
android:fontFamily=”@font/poppins”
android:layout_marginTop=”2dp”
android:gravity=”center”
android:textAlignment=”center”/>

</LinearLayout>

<Button
android:id=”@+id/registerBtn”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_gravity=”center”
android:layout_marginTop=”60dp”
android:background=”@drawable/button_back”
android:fontFamily=”@font/poppins_bold”
android:gravity=”center”
android:text=”@string/signupbtn”
android:textAlignment=”center”
android:textColor=”@color/colorAccent”
android:textSize=”20sp” />

<ProgressBar
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_gravity=”center”
android:layout_marginTop=”8dp”
android:id=”@+id/progress_bar”
android:visibility=”gone”/>

</LinearLayout>

<LinearLayout
android:orientation=”horizontal”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:gravity=”center”
android:layout_gravity=”center”
android:layout_marginTop=”50dp”
android:layout_marginBottom=”20dp”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”@string/already”
android:textSize=”16sp”
android:layout_gravity=”center”
android:gravity=”center”
android:fontFamily=”@font/poppins”
android:textColor=”@color/colorAccent”/>
<TextView
android:id=”@+id/singBtn”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”@string/signin”
android:fontFamily=”@font/poppins_bold”
android:textSize=”16sp”
android:layout_marginLeft=”5dp”
android:textColor=”@color/colorAccent”/>
</LinearLayout>

</LinearLayout>

</ScrollView>

  • Now, go to the Login XML file and design our Login page. Same as the register page, here we add two EditTexts, one for user email id and one for the user password. And add one button to sign in the user, also add one textView to redirect them to the register page.

Now, let’s design our login page:

<?xml version=”1.0" encoding=”utf-8"?>
<ScrollView
xmlns:android=”http://schemas.android.com/apk/res/android"
xmlns:app=”http://schemas.android.com/apk/res-auto"
xmlns:tools=”http://schemas.android.com/tools"
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:fillViewport=”true”
android:padding=”20dp”
android:fitsSystemWindows=”true”
android:background=”@drawable/on_page”
tools:context=”.LoginActivity”>

<LinearLayout
android:orientation=”vertical”
android:layout_width=”match_parent”
android:layout_height=”match_parent”>

<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”@string/welcome_back”
android:textColor=”@color/colorAccent”
android:fontFamily=”@font/poppins_bold”
android:textSize=”32sp”
android:layout_marginTop=”60dp”
android:layout_marginStart=”20dp”
android:includeFontPadding=”false”/>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”@string/explore”
android:textColor=”@color/dotsColor”
android:fontFamily=”@font/poppins”
android:layout_marginStart=”20dp”
android:includeFontPadding=”false”
android:textSize=”14sp”/>

<LinearLayout
android:orientation=”vertical”
android:layout_width=”match_parent”
android:layout_margin=”20dp”
android:layout_height=”wrap_content”>

<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”@string/email”
android:layout_marginTop=”15dp”
android:fontFamily=”@font/poppins”
android:textColor=”@color/dotsColor”
android:textSize=”18sp”/>
<EditText
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:id=”@+id/email_ET”
android:inputType=”textEmailAddress”
android:hint=”@string/email_demo”
android:background=”@drawable/input_field”
android:textColor=”@color/colorPrimary”
android:textColorHint=”@color/dotsColor”
android:fontFamily=”@font/poppins”
android:layout_marginTop=”5dp”
android:singleLine=”true”/>

<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”@string/password”
android:fontFamily=”@font/poppins”
android:textColor=”@color/dotsColor”
android:textSize=”18sp”
android:layout_marginTop=”15dp”/>

<EditText
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:id=”@+id/password_ET”
android:hint=”@string/password_demo”
android:layout_gravity=”center”
android:gravity=”center_vertical”
android:background=”@drawable/input_field”
android:textColor=”@color/colorPrimary”
android:textColorHint=”@color/dotsColor”
android:fontFamily=”@font/poppins”
android:layout_marginTop=”5dp”
android:inputType=”textPassword”
android:singleLine=”true”/>

<CheckBox
android:id=”@+id/showHideBtn”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:buttonTint=”@color/colorAccent”
android:text=”Show Password”
android:textColor=”@color/colorAccent”
android:fontFamily=”@font/poppins”
android:layout_marginTop=”2dp”
android:gravity=”center”
android:textAlignment=”center”/>

<Button
android:id=”@+id/signInBtn”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:text=”@string/signInbtn”
android:background=”@drawable/button_back”
android:fontFamily=”@font/poppins_bold”
android:textSize=”20sp”
android:layout_gravity=”center”
android:gravity=”center”
android:textAlignment=”center”
android:textColor=”@color/colorAccent”
android:layout_marginTop=”60dp”/>

<ProgressBar
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_gravity=”center”
android:layout_marginTop=”8dp”
android:id=”@+id/progress_bar”
android:visibility=”gone”/>

</LinearLayout>

<LinearLayout
android:orientation=”horizontal”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:gravity=”center”
android:layout_gravity=”center”
android:layout_marginTop=”60dp”
android:layout_marginBottom=”10dp”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”@string/notsignup”
android:textSize=”16sp”
android:layout_gravity=”center”
android:gravity=”center”
android:fontFamily=”@font/poppins”
android:textColor=”@color/colorAccent”/>
<TextView
android:id=”@+id/signUpBtn”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”@string/signup”
android:fontFamily=”@font/poppins_bold”
android:textSize=”16sp”
android:layout_marginLeft=”5dp”
android:textColor=”@color/colorAccent”/>
</LinearLayout>

</LinearLayout>
</ScrollView>

Part 2: Create the REST API

  • Now, this is the main part of our project. Here I will not discuss how to create a Node JS project and how to connect it to the MongoDB database and connect to the server. Here I used Heroku as my server. I just add the login and register user code here.

Register code:

router.post(‘/register’,async (req, res, next) => {

const { username, email, password } = req.body;

try{

let user_exist = await User.findOne({ email: email });

if(user_exist){

return res.status(400).json({

success: false,

msg: ‘User already exists’

});

}

let user = new User();

user.username = username;

user.email = email;

const salt = await bcryptjs.genSalt(10);

user.password = await bcryptjs.hash(password, salt);

let size = 200;

user.avatar = “https://gravatar.com/avatar/?s="+size+'&d=retro';

await user.save();

const payload = {

user: {

id: user.id

}

}

jwt.sign(payload, process.env.jwtUserSecret, {

expiresIn: 360000

}, (err, token) =>{

if(err) throw err;

res.status(200).json({

success: true,

token: token

})

})

}catch(err){

console.log(err);

}

});

Login code:

router.post(‘/login’, async (req, res, next) =>{

const email = req.body.email;

const password = req.body.password;

try{

let user = await User.findOne({

email: email

});

if(!user){

return res.status(400).json({

success: false,

msg: ‘User not exists, go and register to continue’

});

}

const isMatch = await bcryptjs.compare(password, user.password);

if(!isMatch){

return res.status(400).json({

success: false,

msg: ‘Invalid password’

});

}

const payload = {

user: {

id: user.id

}

}

jwt.sign(payload, process.env.jwtUserSecret,{

expiresIn: 360000

}, (err, token) =>{

if(err) throw err;

res.status(200).json({

success: true,

msg: ‘User logged in’,

token: token,

user: user

});

})

}catch(error){

console.log(error.message);

res.status(500).json({

success: false,

msg: ‘Server Error’

})

}

})

Part 3: Add the functionality

  • In the Register java file (/package/activity/RegisterActivity.java), first, validate our user then using the rest API completes the registration.

public class RegisterActivity extends AppCompatActivity {

private TextView loginBtn;
private EditText name_ET, email_ET, password_ET;
private Button registerBtn;
private CheckBox showHideBtn;
ProgressBar progressBar;
private String name, email, password;
UtilService utilService;
SharedPreferenceClass sharedPreferenceClass;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.
activity_register);

showHideBtn = findViewById(R.id.showHideBtn);
showHideBtn.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton compoundButton, boolean value) {
if (value)
{
// Show Password
password_ET.setTransformationMethod(HideReturnsTransformationMethod.getInstance());
}
else
{
// Hide Password
password_ET.setTransformationMethod(PasswordTransformationMethod.getInstance());
}
}
});

loginBtn = findViewById(R.id.singBtn);
loginBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
startActivity(new Intent(getApplicationContext(), LoginActivity.class));
finish();
}
});

progressBar = findViewById(R.id.progress_bar);
name_ET = findViewById(R.id.
name_ET);
email_ET = findViewById(R.id.
email_ET);
password_ET = findViewById(R.id.
password_ET);
utilService = new UtilService();
sharedPreferenceClass = new SharedPreferenceClass(this);

registerBtn = findViewById(R.id.registerBtn);
registerBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
utilService.hideKeyboard(view, RegisterActivity.this);
name = name_ET.getText().toString();
email = email_ET.getText().toString();
password = password_ET.getText().toString();

if (validate(view)){
registerUser(view);
}
}
});
}

private void registerUser(View view) {
progressBar.setVisibility(View.
VISIBLE);

final HashMap<String, String> params = new HashMap<>();
params.put(“username”, name);
params.put(“email”, email);
params.put(“password”, password);

String apiKey= “https://snapshotproject.herokuapp.com/api/snapshot/auth/register”;

JsonObjectRequest jsonObjectRequest = new JsonObjectRequest(Request.Method.POST,
apiKey, new JSONObject(params), new Response.Listener<JSONObject>() {
@Override
public void onResponse(JSONObject response) {
try {
if (response.getBoolean(“success”)){
String token = response.getString(“token”);
sharedPreferenceClass.setValue_string(“token”, token);

Toast.makeText(RegisterActivity.this, token, Toast.LENGTH_SHORT).show();
startActivity(new Intent(RegisterActivity.this, ExtraActivity.class));
finish();
}
progressBar.setVisibility(View.
GONE);
} catch (JSONException e) {
e.printStackTrace();
progressBar.setVisibility(View.
GONE);
}
}
}, new Response.ErrorListener() {
@Override
public void onErrorResponse(VolleyError error) {
NetworkResponse response = error.networkResponse;
if (error instanceof ServerError && response != null){
try {
String res = new String(response.data, HttpHeaderParser.
parseCharset(response.headers, “utf-8”));

JSONObject obj = new JSONObject(res);
Toast.
makeText(RegisterActivity.this, obj.getString(“msg”), Toast.LENGTH_SHORT).show();

progressBar.setVisibility(View.GONE);

}catch (JSONException | UnsupportedEncodingException je){
je.printStackTrace();
progressBar.setVisibility(View.
GONE);
}
}
}
}) {
@Override
public Map<String, String> getHeaders() throws AuthFailureError {
HashMap<String, String> headers = new HashMap<>();
headers.put(“Content-Type”,”application/json”);

return params;
}
};

//set retry policy
int socketTime = 3000;
RetryPolicy policy = new DefaultRetryPolicy(socketTime, DefaultRetryPolicy.
DEFAULT_MAX_RETRIES,
DefaultRetryPolicy.
DEFAULT_BACKOFF_MULT);
jsonObjectRequest.setRetryPolicy(policy);

//request add
RequestQueue requestQueue = Volley.newRequestQueue(this);
requestQueue.add(jsonObjectRequest);
}

public boolean validate(View view){
boolean isValid;
if (!TextUtils.
isEmpty(name)){
if (!TextUtils.
isEmpty(email)){
if (!TextUtils.
isEmpty(password)){
isValid = true;
}else {
utilService.showSnackbar(view, “Please enter password”);
isValid = false;
}
}else {
utilService.showSnackbar(view, “Please enter email”);
isValid = false;
}
}else {
utilService.showSnackbar(view, “Please enter name”);
isValid = false;
}
return isValid;
}

@Override
protected void onStart() {
super.onStart();

SharedPreferences snapshot_pref = getSharedPreferences(“user_snapshot”, MODE_PRIVATE);
if (snapshot_pref.contains(“token”)){
startActivity(new Intent(RegisterActivity.this, ExtraActivity.class));
finish();
}
}
}

  • Now, in the login java file (/package/activity/LoginActivity.java), first validate the user with the data that entered at the time of registration then log in that user to the main screen.

public class LoginActivity extends AppCompatActivity {

private TextView registerBtn;
private EditText email_ET, password_ET;
private Button loginBtn;
private CheckBox showHideBtn;
ProgressBar progressBar;
private String email, password;
UtilService utilService;
SharedPreferenceClass sharedPreferenceClass;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getWindow().setSoftInputMode(WindowManager.LayoutParams.
SOFT_INPUT_ADJUST_PAN);
setContentView(R.layout.
activity_login);

showHideBtn = findViewById(R.id.showHideBtn);
showHideBtn.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton compoundButton, boolean value) {
if (value)
{
// Show Password
password_ET.setTransformationMethod(HideReturnsTransformationMethod.getInstance());
}
else
{
// Hide Password
password_ET.setTransformationMethod(PasswordTransformationMethod.getInstance());
}
}
});

registerBtn = findViewById(R.id.signUpBtn);
registerBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
startActivity(new Intent(getApplicationContext(), RegisterActivity.class));
finish();
}
});

loginBtn = findViewById(R.id.signInBtn);
progressBar = findViewById(R.id.
progress_bar);
email_ET = findViewById(R.id.
email_ET);
password_ET = findViewById(R.id.
password_ET);
utilService = new UtilService();
sharedPreferenceClass = new SharedPreferenceClass(this);

loginBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
utilService.hideKeyboard(view, LoginActivity.this);
email = email_ET.getText().toString();
password = password_ET.getText().toString();

if (validate(view)) {
loginUser(view);
}
}
});
}

private void loginUser(View view) {

progressBar.setVisibility(View.VISIBLE);

final HashMap<String, String> params = new HashMap<>();
params.put(“email”, email);
params.put(“password”, password);

String apiKey= “https://snapshotproject.herokuapp.com/api/snapshot/auth/login”;

JsonObjectRequest jsonObjectRequest = new JsonObjectRequest(Request.Method.POST,
apiKey, new JSONObject(params), new Response.Listener<JSONObject>() {
@Override
public void onResponse(JSONObject response) {
try {
if (response.getBoolean(“success”)){
String token = response.getString(“token”);
sharedPreferenceClass.setValue_string(“token”, token);

Toast.makeText(LoginActivity.this, token, Toast.LENGTH_SHORT).show();
startActivity(new Intent(LoginActivity.this, ExtraActivity.class));
finish();
}
progressBar.setVisibility(View.
GONE);
} catch (JSONException e) {
e.printStackTrace();
progressBar.setVisibility(View.
GONE);
}
}
}, new Response.ErrorListener() {
@Override
public void onErrorResponse(VolleyError error) {
NetworkResponse response = error.networkResponse;
if (error instanceof ServerError && response != null){
try {
String res = new String(response.data, HttpHeaderParser.
parseCharset(response.headers, “utf-8”));

JSONObject obj = new JSONObject(res);
Toast.
makeText(LoginActivity.this, obj.getString(“msg”), Toast.LENGTH_SHORT).show();

progressBar.setVisibility(View.GONE);

}catch (JSONException | UnsupportedEncodingException je){
je.printStackTrace();
progressBar.setVisibility(View.
GONE);
}
}
}
}) {
@Override
public Map<String, String> getHeaders() throws AuthFailureError {
HashMap<String, String> headers = new HashMap<>();
headers.put(“Content-Type”,”application/json”);

return params;
}
};

//set retry policy
int socketTime = 3000;
RetryPolicy policy = new DefaultRetryPolicy(socketTime, DefaultRetryPolicy.
DEFAULT_MAX_RETRIES,
DefaultRetryPolicy.
DEFAULT_BACKOFF_MULT);
jsonObjectRequest.setRetryPolicy(policy);

//request add
RequestQueue requestQueue = Volley.newRequestQueue(this);
requestQueue.add(jsonObjectRequest);

}

public boolean validate(View view) {
boolean isValid;

if (!TextUtils.isEmpty(email)) {
if (!TextUtils.
isEmpty(password)) {
isValid = true;
} else {
utilService.showSnackbar(view, “Please enter password”);
isValid = false;
}
} else {
utilService.showSnackbar(view, “Please enter email”);
isValid = false;
}
return isValid;
}

@Override
protected void onStart() {
super.onStart();

SharedPreferences snapshot_pref = getSharedPreferences(“user_snapshot”, MODE_PRIVATE);
if (snapshot_pref.contains(“token”)){
startActivity(new Intent(LoginActivity.this, ExtraActivity.class));
finish();
}
}
}

Part 4: Logout

  • To check whether the login and register page is working or not add a Logout button in the main activity and add functionality for the logout button.

First, design the XML file

<?xml version=”1.0" encoding=”utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android=”http://schemas.android.com/apk/res/android"
xmlns:app=”http://schemas.android.com/apk/res-auto"
xmlns:tools=”http://schemas.android.com/tools"
android:layout_width=”match_parent”
android:layout_height=”match_parent”
tools:context=”.ExtraActivity”>

<Button
android:id=”@+id/logoutBtn”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”Log out”
app:layout_constraintBottom_toBottomOf=”parent”
app:layout_constraintEnd_toEndOf=”parent”
app:layout_constraintStart_toStartOf=”parent”
app:layout_constraintTop_toTopOf=”parent”
android:textColor=”@color/backgroundMain”
android:textSize=”16sp”
android:fontFamily=”@font/ubuntu_bold”/>

</androidx.constraintlayout.widget.ConstraintLayout>

Add functionality

public class ExtraActivity extends AppCompatActivity {

Button logoutBtn;
SharedPreferenceClass sharedPreferenceClass;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.
activity_extra);

sharedPreferenceClass = new SharedPreferenceClass(this);

logoutBtn = findViewById(R.id.logoutBtn);
logoutBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
sharedPreferenceClass.clear();
startActivity(new Intent(ExtraActivity.this, LoginActivity.class));
finish();
}
});
}
}

Part 5: Database

In MongoDB create a database and within that database create a cluster for the users. Here I show you a screenshot of my MongoDB database

In the next tutorial, we will create the main page of our app, where we add our TODO list with a navigation drawer menu.

Stay tuned for the next parts.

Hi everyone, myself Golap an Android app developer with UI/UX designer.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store