diff --git a/Test2.txt b/Test2.txt
new file mode 100644
index 0000000..e69de29
diff --git a/auth_required.js b/auth_required.js
index 7b693a3..4a0a838 100644
--- a/auth_required.js
+++ b/auth_required.js
@@ -1,3 +1,14 @@
 /***
  * @todo Redirect the user to login page if token is not present.
- */
\ No newline at end of file
+ */
+const U = 'https://todo-app-csoc.herokuapp.com/';
+$.ajax({
+    headers: {
+        Authorization: 'Token ' + localStorage.getItem('token'),
+    },
+    url: U + 'auth/profile/',
+    method: 'GET',
+    error: function(data, status, xhr) {
+       window.location.href='/login';
+    }
+})
\ No newline at end of file
diff --git a/index.html b/index.html
index a3bde5b..d1e8c35 100644
--- a/index.html
+++ b/index.html
@@ -55,61 +55,18 @@
     </nav>
     <center>
         <div class="input-group mb-3 todo-add-task">
-            <input type="text" class="form-control" placeholder="Enter Task">
+            <input type="text" class="form-control" placeholder="Enter Task" id="ET">
             <div class="input-group-append">
                 <button type="button" class="btn btn-outline-success" onclick="addTask()">Add Task</button>
             </div>
         </div>
-        <ul class="list-group todo-available-tasks">
+        <ul class="list-group todo-available-tasks" id="AT">
             <span class="badge badge-primary badge-pill todo-available-tasks-text">
                 Available Tasks
             </span>
 
 
-            <li class="list-group-item d-flex justify-content-between align-items-center">
-                    <input id="input-button-1" type="text" class="form-control todo-edit-task-input hideme" placeholder="Edit The Task">
-                    <div id="done-button-1"  class="input-group-append hideme">
-                        <button class="btn btn-outline-secondary todo-update-task" type="button" onclick="updateTask(1)">Done</button>
-                    </div>
-                    <div id="task-1" class="todo-task">
-                        Sample Task 1
-                    </div>
-
-                    <span id="task-actions-1">
-                        <button style="margin-right:5px;" type="button" onclick="editTask(1)"
-                            class="btn btn-outline-warning">
-                            <img src="https://res.cloudinary.com/nishantwrp/image/upload/v1587486663/CSOC/edit.png"
-                                width="18px" height="20px">
-                        </button>
-                        <button type="button" class="btn btn-outline-danger" onclick="deleteTask(1)">
-                            <img src="https://res.cloudinary.com/nishantwrp/image/upload/v1587486661/CSOC/delete.svg"
-                                width="18px" height="22px">
-                        </button>
-                    </span>
-            </li>
-
-
-            <li class="list-group-item d-flex justify-content-between align-items-center">
-                    <input id="input-button-2" type="text" class="form-control todo-edit-task-input hideme" placeholder="Edit The Task">
-                    <div id="done-button-2" class="input-group-append hideme">
-                        <button class="btn btn-outline-secondary todo-update-task" type="button" onclick="updateTask(2)">Done</button>
-                    </div>
-
-                    <div id="task-2" class="todo-task">
-                        Sample Task 2
-                    </div>
-                    <span id="task-actions-2">
-                        <button style="margin-right:5px;" type="button" onclick="editTask(2)"
-                            class="btn btn-outline-warning">
-                            <img src="https://res.cloudinary.com/nishantwrp/image/upload/v1587486663/CSOC/edit.png"
-                                width="18px" height="20px">
-                        </button>
-                        <button type="button" class="btn btn-outline-danger" onclick="deleteTask(2)">
-                            <img src="https://res.cloudinary.com/nishantwrp/image/upload/v1587486661/CSOC/delete.svg"
-                                width="18px" height="22px">
-                        </button>
-                    </span>
-            </li>
+            
 
 
         </ul>
diff --git a/init.js b/init.js
index 10e2b05..6e934c5 100644
--- a/init.js
+++ b/init.js
@@ -2,6 +2,74 @@ function getTasks() {
     /***
      * @todo Fetch the tasks created by the user and display them in the dom.
      */
+
+
+    $.ajax({
+        headers: {
+            Authorization: 'Token ' + localStorage.getItem('token'),
+        },
+        url: API_BASE_URL + 'todo/',
+        method: 'GET',
+        success: function(data, status, xhr) {
+            if(flag){var k=data.length-1;}
+            else{var k=0;}
+            for(var j=k;j<data.length;j++){
+                var i=data[j].id;
+                const intext=data[j].title;
+                const ul=document.getElementById('AT');
+            const list=document.createElement('li');
+            list.id=i;
+            list.setAttribute('class','list-group-item d-flex justify-content-between align-items-center');
+            const inp=document.createElement('input');
+            inp.id='input-button-'+i;
+            inp.type='text';
+            inp.setAttribute('class','form-control todo-edit-task-input hideme');
+            inp.placeholder='Edit The Task';
+            const d1=document.createElement('div');
+            d1.id='done-button-'+i;
+            d1.setAttribute('class','input-group-append hideme');
+            const b1=document.createElement('button');
+            b1.setAttribute('class','btn btn-outline-secondary todo-update-task');
+            b1.type='button';
+            b1.setAttribute('onclick','updateTask('+i+')');
+            b1.innerHTML='Done';
+            d1.appendChild(b1);
+            const d2=document.createElement('div');
+            d2.id='task-'+i;
+            d2.setAttribute('class','todo-task');
+            d2.innerHTML=intext;
+            list.appendChild(inp);
+            list.appendChild(d1);
+            list.appendChild(d2);
+            const sp=document.createElement('span');
+            sp.id='task-actions-'+i;
+            const b2=document.createElement('button');
+            b2.style.marginRight='10px';
+            b2.type='button';
+            b2.setAttribute('onclick','editTask('+i+')');
+            b2.setAttribute('class','btn btn-outline-warning');
+            const i1=document.createElement('img');
+            i1.setAttribute('src','https://res.cloudinary.com/nishantwrp/image/upload/v1587486663/CSOC/edit.png');
+            i1.setAttribute('width','18px');
+            i1.setAttribute('height','20px');
+            b2.appendChild(i1);
+            const b3=document.createElement('button');
+            b3.type='button';
+            b3.setAttribute('onclick','deleteTask('+i+')');
+            b3.setAttribute('class','btn btn-outline-danger');
+            const i2=document.createElement('img');
+            i2.setAttribute('src','https://res.cloudinary.com/nishantwrp/image/upload/v1587486661/CSOC/delete.svg');
+            i2.setAttribute('width','18px');
+            i2.setAttribute('height','22px');
+            b3.appendChild(i2);
+            sp.appendChild(b2);
+            sp.appendChild(b3);
+            list.appendChild(sp);
+            ul.appendChild(list);
+            }
+        }
+    })
+    
 }
 
 $.ajax({
diff --git a/main.js b/main.js
index 3929d68..ba7d39d 100644
--- a/main.js
+++ b/main.js
@@ -76,14 +76,53 @@ function login() {
      * @todo 1. Write code for form validation.
      * @todo 2. Fetch the auth token from backend and login the user.
      */
-}
+    const username = document.getElementById('inputUsername').value.trim();
+    const password = document.getElementById('inputPassword').value;
+
+    const dataForApiRequest = {
+        username: username,
+        password: password
+    }
+
+    $.ajax({
+        url: API_BASE_URL + 'auth/login/',
+        method: 'POST',
+        data: dataForApiRequest,
+        success: function(data, status, xhr) {
+            localStorage.setItem('token',data.token);
+            window.location.href = '/';
+        },
+        error: function(xhr, status, err) {
+            displayErrorToast('Either username or password is incorrect');
+        }
+    })
 
+}
+var flag=false;
 function addTask() {
     /**
      * @todo Complete this function.
      * @todo 1. Send the request to add the task to the backend server.
      * @todo 2. Add the task in the dom.
      */
+    
+    const intext=document.getElementById('ET').value.trim();
+    const dataForApiRequest={
+        title: intext
+    }
+    $.ajax({
+        headers: {
+            Authorization: 'Token ' + localStorage.getItem('token'),
+        },
+        url: API_BASE_URL + 'todo/create/',
+        method: 'POST',
+        data: dataForApiRequest,
+        success: function(data, status, xhr) {
+            document.getElementById('ET').value='';
+            flag=true;
+            getTasks();
+        }
+    })
 }
 
 function editTask(id) {
@@ -99,6 +138,20 @@ function deleteTask(id) {
      * @todo 1. Send the request to delete the task to the backend server.
      * @todo 2. Remove the task from the dom.
      */
+    dataForApiRequest={
+        id:id
+    }
+    $.ajax({
+        headers: {
+            Authorization: 'Token ' + localStorage.getItem('token'),
+        },
+        url: API_BASE_URL + 'todo/'+id+'/',
+        method: 'DELETE',
+        data:dataForApiRequest,
+        success: function(data, status, xhr) {
+           document.getElementById(id).remove();
+        }
+    })
 }
 
 function updateTask(id) {
@@ -107,4 +160,24 @@ function updateTask(id) {
      * @todo 1. Send the request to update the task to the backend server.
      * @todo 2. Update the task in the dom.
      */
+    const intext=document.getElementById('input-button-'+ id).value.trim();
+    const dataForApiRequest={
+        id: id,
+        title: intext
+    }
+    $.ajax({
+        headers: {
+            Authorization: 'Token ' + localStorage.getItem('token'),
+        },
+        url: API_BASE_URL + 'todo/'+id+'/',
+        method: 'PUT',
+        data: dataForApiRequest,
+        success: function(data, status, xhr) {
+            document.getElementById('task-' + id).classList.remove('hideme');
+            document.getElementById('task-actions-' + id).classList.remove('hideme');
+            document.getElementById('input-button-' + id).classList.add('hideme');
+            document.getElementById('done-button-' + id).classList.add('hideme');
+            document.getElementById('task-'+id).innerHTML=data.title;
+        }
+    })
 }
diff --git a/no_auth_required.js b/no_auth_required.js
index 82558d4..a7efd88 100644
--- a/no_auth_required.js
+++ b/no_auth_required.js
@@ -1,3 +1,14 @@
 /***
  * @todo Redirect the user to main page if token is present.
- */
\ No newline at end of file
+ */
+const UR = 'https://todo-app-csoc.herokuapp.com/';
+$.ajax({
+    headers: {
+        Authorization: 'Token ' + localStorage.getItem('token'),
+    },
+    url: UR + 'auth/profile/',
+    method: 'GET',
+    success: function(data, status, xhr) {
+        window.location.href='/';
+    }
+})
\ No newline at end of file
diff --git a/testing.txt b/testing.txt
new file mode 100644
index 0000000..e69de29