diff --git a/attendancetracker/API/attendance.route.js b/attendancetracker/API/attendance.route.js
index b1093fc..0f9a262 100644
--- a/attendancetracker/API/attendance.route.js
+++ b/attendancetracker/API/attendance.route.js
@@ -5,12 +5,15 @@ let Att = require('./attendee.model');
 
   attendanceRoute.route('/add').post(function (req, res) {
     let post = new Att(req.body);
+    //console.log(post);
     post.save()
       .then(() => {
         res.status(200).send("account created");
+        //console.log("success");
       })
       .catch(() => {
         res.status(400).send("unable to save to database");
+        //console.log("fail")
       });
   });
 
@@ -40,7 +43,7 @@ let Att = require('./attendee.model');
 
 
   attendanceRoute.route('/getarr').post(function (req, res) {
-    console.log(req.body.number);
+    //console.log(req.body.number);
     var id = req.body.number;
     //console.log(id)
     Att.findById(id, function (err, arr){
diff --git a/attendancetracker/API/club.model.js b/attendancetracker/API/club.model.js
new file mode 100644
index 0000000..88c92ea
--- /dev/null
+++ b/attendancetracker/API/club.model.js
@@ -0,0 +1,13 @@
+const mongoose = require('mongoose');
+const Schema  = mongoose.Schema;
+
+let CInfo = new Schema({
+    user: { type: String, required: true },
+    clubname: { type: String, required: true },
+    dates: {type: Array, required: false}
+},{
+    collection: 'cinfo'
+}
+);
+
+module.exports = mongoose.model('Club', CInfo);
\ No newline at end of file
diff --git a/attendancetracker/API/club.route.js b/attendancetracker/API/club.route.js
new file mode 100644
index 0000000..118a46d
--- /dev/null
+++ b/attendancetracker/API/club.route.js
@@ -0,0 +1,96 @@
+const express = require('express');
+const clubRoute = express.Router();
+
+let CInfo = require('./club.model');
+
+clubRoute.route('/clubs').post(function (req, res) {
+    let username = req.body.user;
+    //console.log(username)
+    CInfo.find({user: username}, function (err, posts){
+        if(err) {
+          res.json(err);
+        }
+        res.json(posts);
+    });
+  });
+
+  clubRoute.route('/add').post(function (req, res) {
+    let post = new CInfo(req.body);
+    console.log(req.body);
+    post.save()
+      .then(() => {
+        res.status(200).send("account created");
+        
+      })
+      .catch(() => {
+        res.status(400).send("unable to save to database");
+        
+      });
+  });
+
+  clubRoute.route('/delete').post(function (req, res) {
+    //console.log(req.body.id);
+    CInfo.findByIdAndRemove({_id: req.body.id}, function(err){
+        if(err) res.json(err);
+        else res.json('Successfully removed');
+    });
+  });
+
+  clubRoute.route('/getone').post(function (req, res) {
+    let username = req.body.user;
+    console.log(username)
+    CInfo.findOne({user: username}, function (err, posts){
+        if(err) {
+          res.json(err);
+        }
+        console.log(posts);
+        res.json(posts);
+    });
+  });
+
+  clubRoute.route('/getbyID').post(function (req, res) {
+    //console.log(req.body.number);
+    var id = req.body.number;
+    //console.log(id)
+    CInfo.findById(id, function (err, arr){
+        if(err) {
+          res.json(err);
+        }
+        res.json(arr);
+        //console.log(arr);
+    });
+  });
+
+  clubRoute.route('/getdates').post(function (req, res) {
+    var username = req.body.user;
+    console.log(username);
+    CInfo.findOne({_id: username}, function (err, post){
+        if(err) {
+          res.json(err);
+        }
+        res.json(post);
+    });
+  });
+
+  clubRoute.route('/update').post(function (req, res){
+
+    var username = req.body.user;
+    var dates = req.body.dates;
+
+    CInfo.findOne({_id: username}, function(err, post) {
+      if (!post)
+        res.status(404).send("data is not found");
+      else {
+          //console.log(post);
+          post.dates = dates;
+          post.save().then(() => {
+            res.json('Update complete');
+        })
+        .catch(() => {
+              res.status(400).send("unable to update the database");
+        });
+      }
+  });
+});
+
+module.exports = clubRoute;
\ No newline at end of file
diff --git a/attendancetracker/API/server.js b/attendancetracker/API/server.js
index e384255..dfcc4fb 100644
--- a/attendancetracker/API/server.js
+++ b/attendancetracker/API/server.js
@@ -7,7 +7,7 @@ const mongoose = require('mongoose');
 const config = require('./DB.js');
 const attendanceRoute = require('./attendance.route');
 const loginRoute = require('./login.route');
-
+const clubsRoute = require('./club.route');
 
 
 mongoose.Promise = global.Promise;
@@ -22,6 +22,7 @@ app.use(bodyParser.json());
 
 app.use('/login', loginRoute);
 app.use('/attendance', attendanceRoute);
+app.use('/clubs', clubsRoute);
 
 
 app.listen(PORT, function(){
diff --git a/attendancetracker/src/components/Attendance.vue b/attendancetracker/src/components/Attendance.vue
index 7c5eb70..0069129 100644
--- a/attendancetracker/src/components/Attendance.vue
+++ b/attendancetracker/src/components/Attendance.vue
@@ -2,7 +2,7 @@
     <div v-if="attendees.length == 0" id="none">
     <div>
   <b-navbar toggleable="lg" type="light" variant="light">
-    <b-navbar-brand href="#" style="margin-top: 8px;">Attendance Tracker®</b-navbar-brand>
+    <b-navbar-brand href="#" style="margin-top: 8px;">Attendance Tracker</b-navbar-brand>
 
     <b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
 
@@ -15,6 +15,7 @@
           <b-dropdown-item href="/insights/absences">By Absences</b-dropdown-item>
         </b-nav-item-dropdown>
         <b-nav-item href="/attendees">Manage Club Members</b-nav-item>
+        <b-nav-item href="/clubs">Select Club</b-nav-item>
       </b-navbar-nav>
 
       <!-- Right aligned nav items -->
@@ -45,7 +46,7 @@
 
     <div>
   <b-navbar toggleable="lg" type="light" variant="light">
-    <b-navbar-brand href="#" style="margin-top: 8px;">Attendance Tracker®</b-navbar-brand>
+    <b-navbar-brand href="#" style="margin-top: 8px;">Attendance Tracker</b-navbar-brand>
 
     <b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
 
@@ -76,7 +77,7 @@
 </div>
 
 
-      <h1 id="title">Attendance for {{this.$route.params.id}}</h1> 
+      <h1 id="title">{{club.clubname}} Attendance for {{this.$route.params.id}}</h1> 
       <center style="padding-bottom: 1vh; ">*Note: changes are denoted by a darker coloured row.
   </center>
         <div class="attendance">    
@@ -111,8 +112,9 @@
           <tr>
               <td class="buttone" colspan="3">
                 <form @submit.prevent="postAttendance">
-                   <button ><span>Take Attendance</span></button>
+                   <center><button class="button btn btn-success"><span>Take Attendance</span></button> <a href="/calendar" class="button btn btn-danger">Cancel</a></center>
                 </form>
+                
               </td>
           </tr>
         </table>
@@ -192,26 +194,6 @@
   .absentcheckbox {
     background-color: #FF7F7F; 
   }
-
-  .buttone {
-    text-align: center; 
-    border-bottom: none; 
-  }
-
-  .buttone button {
-    background-color: #3D5A80; 
-    border: 1px #3D5A80; 
-    border-radius: 5px; 
-    padding: 1vh; 
-    padding-left: 2vh; 
-    padding-right: 2vh; 
-    color: white;
-    font-family: Roboto, Open Sans, sans-serif;  
-  }
-
-  .buttone button:hover {
-    background-color: #293D56;
-  }
 </style>
   
   <script>
@@ -219,12 +201,20 @@
 
     export default {
         mounted() {
-          this.user = document.cookie.substring(document.cookie.indexOf("=")+1);
+          this.user = document.cookie.substring(document.cookie.indexOf("=")+1, document.cookie.indexOf(";"));
+          this.selected = document.cookie.substring(document.cookie.indexOf(";")+7);
           if(document.cookie == ""){
               this.$router.push({name: 'login'});
           }else{
-          this.post.user = this.user;
-          let uri = 'http://localhost:4000/attendance/attendees';
+          
+          let url9 = 'http://192.168.1.11:4000/clubs/getbyID';
+          this.post2.number = this.selected;
+
+          this.axios.post(url9, this.post2).then(res => {
+          this.club = res.data;
+
+          this.post.user = this.club._id;
+          let uri = 'http://192.168.1.11:4000/attendance/attendees';
           this.axios.post(uri, this.post).then(res => {
           this.attendees = res.data;
           for(var element of this.attendees){
@@ -235,6 +225,9 @@
             }
           }
         });
+          })
+          
+          
       }
         },
         updated(){
@@ -247,6 +240,9 @@
           attendees: [],
           att: {},
           absentNames: [],
+          selected: {},
+          club: {},
+          post2: {},
           presentNames: [],
           checked: true,
           post: {},
@@ -256,13 +252,14 @@
       methods: {
         logout() {
             document.cookie = "user= ; expires=Sun, 29 Dec 2019 00:00:00 UTC; path=/;";
+            document.cookie = "club= ; expires=Sun, 29 Dec 2019 00:00:00 UTC; path=/;";
             this.$router.push({name: 'login'});
         },
         postAttendance(){
           //iterate through all present, then all absent, and get array of that id user, then check for the current day, if it contains delete, and append the date to the correct array
           for(var element of this.presentNames){
             var test = {number: element};
-            let uri = 'http://localhost:4000/attendance/getarr';
+            let uri = 'http://192.168.1.11:4000/attendance/getarr';
             this.axios.post(uri, test).then(res => {
               var arr = res.data.presences;
               arr = arr.filter(e => e !== this.$route.params.id);
@@ -278,14 +275,14 @@
 
               var test2 = {id: res.data._id, presences: arr, absenses: arr2};
 
-              let url = 'http://localhost:4000/attendance/post';
+              let url = 'http://192.168.1.11:4000/attendance/post';
               this.axios.post(url, test2).then(res => {
                 console.log("Arr: " + res);
                 
                 // start of user updating
             
-                var ldata = {user: this.user};
-                let url2 = 'http://localhost:4000/login/getdates';
+                var ldata = {user: this.club._id};
+                let url2 = 'http://192.168.1.11:4000/clubs/getdates';
                 this.axios.post(url2, ldata).then(res => {
                   //console.log(res.data);
                   var arrd = res.data.dates;
@@ -304,9 +301,9 @@
                   arrd.push(ddata);
                   //console.log(arrd);
 
-                  var userPostData = {dates: arrd, user: this.user}
+                  var userPostData = {dates: arrd, user: this.club._id}
 
-                  let url3 = 'http://localhost:4000/login/update';
+                  let url3 = 'http://192.168.1.11:4000/clubs/update';
                   this.axios.post(url3, userPostData).then(res => {
                     //console.log("URL 3");
                     console.log(res);
@@ -323,7 +320,7 @@
             //alert("absences")
             for(var element1 of this.absentNames){
             var test1 = {number: element1};
-            let uri1 = 'http://localhost:4000/attendance/getarr';
+            let uri1 = 'http://192.168.1.11:4000/attendance/getarr';
             this.axios.post(uri1, test1).then(res => {
               var arrr = res.data.absenses;
               arrr = arrr.filter(e => e !== this.$route.params.id);
@@ -337,7 +334,7 @@
 
               var testt2 = {id: res.data._id, presences: arrr2, absenses: arrr};
 
-              let url1 = 'http://localhost:4000/attendance/post';
+              let url1 = 'http://192.168.1.11:4000/attendance/post';
               this.axios.post(url1, testt2).then(res => {
                 console.log("Arr2: " + res);
                 
@@ -347,8 +344,8 @@
           }
             // start of user updating
             
-                var ldata = {user: this.user};
-                let url2 = 'http://localhost:4000/login/getdates';
+                var ldata = {user: this.club._id};
+                let url2 = 'http://192.168.1.11:4000/clubs/getdates';
                 this.axios.post(url2, ldata).then(res => {
                   //console.log(res.data);
                   var arrd = res.data.dates;
@@ -367,9 +364,9 @@
                   arrd.push(ddata);
                   console.log(arrd);
 
-                  var userPostData = {dates: arrd, user: this.user}
+                  var userPostData = {dates: arrd, user: this.club._id}
 
-                  let url3 = 'http://localhost:4000/login/update';
+                  let url3 = 'http://192.168.1.11:4000/clubs/update';
                   this.axios.post(url3, userPostData).then(res => {
                     console.log("URL 3");
                     console.log(res);
diff --git a/attendancetracker/src/components/Attendees.vue b/attendancetracker/src/components/Attendees.vue
index cc2dcc1..e6fabf5 100644
--- a/attendancetracker/src/components/Attendees.vue
+++ b/attendancetracker/src/components/Attendees.vue
@@ -3,7 +3,7 @@
 
     <div>
   <b-navbar toggleable="lg" type="light" variant="light">
-    <b-navbar-brand href="#" style="margin-top: 8px;">Attendance Tracker®</b-navbar-brand>
+    <b-navbar-brand href="#" style="margin-top: 8px;">Attendance Tracker</b-navbar-brand>
 
     <b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
 
@@ -16,6 +16,7 @@
           <b-dropdown-item href="/insights/absences">By Absences</b-dropdown-item>
         </b-nav-item-dropdown>
         <b-nav-item href="/attendees">Manage Club Members</b-nav-item>
+        <b-nav-item href="/clubs">Select Club</b-nav-item>
       </b-navbar-nav>
 
       <!-- Right aligned nav items -->
@@ -36,7 +37,7 @@
 
 
 
-      <h1 style="margin-top: 10px;"> Manage Club Members</h1>
+      <h1 style="margin-top: 10px;"> Manage  {{club.clubname}} Members</h1>
         <table>
 
             <tr>
@@ -120,14 +121,24 @@ th{
 <script>
 export default {
         mounted() {
-            this.checkAccount();
-          this.post.user = this.user;
-          //alert(this.post.user);
-          let uri = 'http://localhost:4000/attendance/attendees';
-          this.axios.post(uri, this.post).then(res => {
-          this.attendees = res.data;
-          console.log(this.attendees);
+          this.checkAccount();
+              let url9 = 'http://192.168.1.11:4000/clubs/getbyID';
+              this.post2.number = this.selected;
+
+              this.axios.post(url9, this.post2).then(res => {
+              this.club = res.data;
+
+              this.post.user = this.club._id;
+              //alert(this.post.user);
+              let uri = 'http://192.168.1.11:4000/attendance/attendees';
+              this.axios.post(uri, this.post).then(res => {
+              this.attendees = res.data;
+              console.log(this.attendees);
           });
+        })
+
+
+          
 
         },
       data() {
@@ -135,16 +146,21 @@ export default {
           user: null,
           attendees: [],
           post: {},
+          post2: {},
+          selected: {},
+          club: {},
           attendee: {}
         }
       },
       methods: {
           logout() {
             document.cookie = "user= ; expires=Sun, 29 Dec 2019 00:00:00 UTC; path=/;";
+            document.cookie = "club= ; expires=Sun, 29 Dec 2019 00:00:00 UTC; path=/;";
             this.$router.push({name: 'login'});
         },
         checkAccount(){
-            this.user = document.cookie.substring(document.cookie.indexOf("=")+1);
+            this.user = document.cookie.substring(document.cookie.indexOf("=")+1, document.cookie.indexOf(";"));
+            this.selected = document.cookie.substring(document.cookie.indexOf(";")+7);
             if(document.cookie == ""){
                 this.$router.push({name: 'login'});
         }
@@ -152,16 +168,16 @@ export default {
         del(id){
             this.post.id = id;
             //alert(id);
-            let uri = 'http://localhost:4000/attendance/delete';
+            let uri = 'http://192.168.1.11:4000/attendance/delete';
             this.axios.post(uri, this.post).then(() => {
                 location.reload();
             });
         },
         addUser(){
           //alert(this.attendee.name);
-          this.attendee.user = this.user;
-          
-          let uri = 'http://localhost:4000/attendance/add';
+          this.attendee.user = this.club._id;
+          console.log(this.attendee);
+          let uri = 'http://192.168.1.11:4000/attendance/add';
           this.axios.post(uri, this.attendee).then(() => {
               location.reload();
           });
diff --git a/attendancetracker/src/components/Calendar.vue b/attendancetracker/src/components/Calendar.vue
index c788d37..c663114 100644
--- a/attendancetracker/src/components/Calendar.vue
+++ b/attendancetracker/src/components/Calendar.vue
@@ -5,7 +5,7 @@
 
       <div>
   <b-navbar toggleable="lg" type="light" variant="light">
-    <b-navbar-brand href="#" style="margin-top: 8px;">Attendance Tracker®</b-navbar-brand>
+    <b-navbar-brand href="#" style="margin-top: 8px;">Attendance Tracker</b-navbar-brand>
 
     <b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
 
@@ -18,6 +18,7 @@
           <b-dropdown-item href="/insights/absences">By Absences</b-dropdown-item>
         </b-nav-item-dropdown>
         <b-nav-item href="/attendees">Manage Club Members</b-nav-item>
+        <b-nav-item href="/clubs">Select Club</b-nav-item>
       </b-navbar-nav>
 
       <!-- Right aligned nav items -->
@@ -37,11 +38,13 @@
         <center>
         <div class="container">
         <div id="" style="width: 35%; float:left; margin:10px;" class="box">
-        <h3>Attendance Calendar for {{user}}</h3>
+        <h3>Welcome to Attendance Tracker, {{user}}!</h3>
         <ul style="text-align: left;">
-          <li><b>-</b> Get started by creating some club members on the <a href="/attendees">"Manage Club Members"</a> page. </li>
+          <li><b>-</b> Get started by adding clubs on the <a href="/clubs">"Select Club"</a> page. </li>
           <br>
-          <li><b>-</b> Use the calendar below to select a date to take attendance.</li>
+          <li><b>-</b> Create some club members on the <a href="/attendees">"Manage Club Members"</a> page. </li>
+          <br>
+          <li><b>-</b> Use the calendar to select a date to take attendance.</li>
           <br>
           <li><b>-</b> A day with attendance taken will be highlighted in blue. </li>
         </ul>
@@ -53,7 +56,7 @@
         <div id="cal">
         <div v-if="!dates"><center>Calendar loading please wait...</center></div>
         <div v-else>
-          
+          <h2>Calendar for {{club.clubname}}</h2>
           <b-calendar v-model="value" locale="en-US" class="cal" selected-variant="primary" width="30vw" :date-info-fn="dateClass">
           <div class="d-flex" dir="ltr">
             <b-button
@@ -88,8 +91,8 @@
         <br>
         </div>
 
-        <div id="calcontainer" style="border: 0.25px solid grey;">
-        <h3>Club Attendance</h3>
+        <div id="calcontainer" style="width: 70%">
+        <h3>{{club.clubname}} Attendance</h3>
         <div v-if="chartData.length == 1"><center>You haven't taken any attendance yet! Take some to view club performance.</center></div>
         <div v-else>
         <GChart type="LineChart" :data="chartData" :options="chartOptions" id="graph" style=""/>
@@ -140,7 +143,6 @@
       display: inline-block;
     }
     .box{
-      border: 0.25px solid grey;
     }
     
 
@@ -151,9 +153,15 @@
         created() {
             this.checkAccount()
 
-            var ldata = {user: this.user};
-            let url2 = 'http://localhost:4000/login/getdates';
-            this.axios.post(url2, ldata).then(res => {
+            let url9 = 'http://192.168.1.11:4000/clubs/getbyID';
+            this.post.number = this.selected;
+
+            this.axios.post(url9, this.post).then(res => {
+              this.club = res.data;
+
+              var ldata = {user: this.club._id};
+              let url2 = 'http://192.168.1.11:4000/clubs/getdates';
+              this.axios.post(url2, ldata).then(res => {
               
               var datearr = res.data.dates;
               console.log(res.data.dates)
@@ -163,6 +171,9 @@
                 this.chartData[i+1] = [this.dates[i], datearr[i].numPresent];
               }
             })
+            })
+
+            
         },
         updated(){
           var body = document.body, html = document.documentElement;
@@ -173,6 +184,9 @@
         return {
           value: '',
           context: null,
+          selected: {},
+          club: {},
+          post: {},
           user: null,
           attendee: {}, 
           modal: null, 
@@ -194,10 +208,13 @@
       methods: {
         logout() {
             document.cookie = "user= ; expires=Sun, 29 Dec 2019 00:00:00 UTC; path=/;";
+            document.cookie = "club= ; expires=Sun, 29 Dec 2019 00:00:00 UTC; path=/;";
             this.$router.push({name: 'login'});
         },
         checkAccount(){
-            this.user = document.cookie.substring(document.cookie.indexOf("=")+1);
+          console.log(document.cookie);
+            this.user = document.cookie.substring(document.cookie.indexOf("=")+1, document.cookie.indexOf(";"));
+            this.selected = document.cookie.substring(document.cookie.indexOf(";")+7);
             if(document.cookie == ""){
                 this.$router.push({name: 'login'});
             }
diff --git a/attendancetracker/src/components/Clubs.vue b/attendancetracker/src/components/Clubs.vue
new file mode 100644
index 0000000..684fb99
--- /dev/null
+++ b/attendancetracker/src/components/Clubs.vue
@@ -0,0 +1,189 @@
+<template>
+    <div id="whole-page">
+
+    <div>
+  <b-navbar toggleable="lg" type="light" variant="light">
+    <b-navbar-brand href="#" style="margin-top: 8px;">Attendance Tracker</b-navbar-brand>
+
+    <b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
+
+    <b-collapse id="nav-collapse" is-nav>
+      <b-navbar-nav>
+        <b-nav-item href="/calendar">Calendar</b-nav-item>
+        <b-nav-item-dropdown text="Insights">
+          <b-dropdown-item href="/insights/id">By Join Date</b-dropdown-item>
+          <b-dropdown-item href="/insights/presences">By Presences</b-dropdown-item>
+          <b-dropdown-item href="/insights/absences">By Absences</b-dropdown-item>
+        </b-nav-item-dropdown>
+        <b-nav-item href="/attendees">Manage Club Members</b-nav-item>
+        <b-nav-item href="/clubs">Select Club</b-nav-item>
+      </b-navbar-nav>
+
+      <!-- Right aligned nav items -->
+      <b-navbar-nav class="ml-auto">       
+
+        <b-nav-item-dropdown right>
+          <!-- Using 'button-content' slot -->
+          <template v-slot:button-content>
+            <em>{{user}}</em>
+          </template>
+          <b-dropdown-item @click.prevent="logout">Sign Out</b-dropdown-item>
+        </b-nav-item-dropdown>
+      </b-navbar-nav>
+    </b-collapse>
+  </b-navbar>
+</div>
+
+
+
+
+      <h1 style="margin-top: 10px;"> Manage Clubs</h1>
+        <table>
+
+            <tr>
+                <th>Club Name (# Days)</th>
+            </tr>
+
+            <tr  v-for="club in clubs" :key="club._id">
+                <td><span v-if="selected == club._id"><b>{{club.clubname}} ({{club.dates.length}})</b></span> <span v-else>{{club.clubname}} ({{club.dates.length}})</span> </td>
+                <td id= "deletebuttone"><button class="btn btn-success" @click.prevent="sel(club._id)">Select</button> <button class="btn btn-danger" @click.prevent="del(club._id)">Delete</button></td>
+            </tr>
+            <tr>
+              <td colspan="2" id="buttone">
+                <span><b>Add a Club: </b></span>
+                <form @submit.prevent="addUser"> 
+                <input type="text" id="name" v-model="club.name" class="text-input">
+                <button id="buttone" class="btn btn-lg btn-primary">Add Club</button>
+                </form>
+              </td>
+            </tr>
+        </table>
+    </div>
+</template>
+
+<style scoped>
+#whole-page {
+    font-family: Open Sans, 'Source Sans Pro', sans-serif;
+    height: 100vh;
+    width: auto;
+    padding: 0;
+    margin: 0;
+    background-color: #f1f5f2;
+    background-attachment: fixed;
+
+  }
+
+h1 {
+  font-family: Roboto, Open Sans, sans-serif; 
+  color: #3d5a80; 
+  text-align: center; 
+}
+table {
+    table-layout: fixed; 
+    border-collapse: collapse; 
+    width: 50%; 
+    position: absolute; 
+    left: 25vw; 
+    background-color: white; 
+    border-radius: 10px; 
+  }
+
+td{
+  padding: 1vh;
+  border-top: 1px solid #ddd;
+}
+
+th{
+  padding: 1vh;
+}
+
+#deletebuttone {
+  text-align: right; 
+}
+
+.text-input{
+  padding: 10px;
+  font-size: 17px;
+  border: 1px solid grey;
+  border-radius: 5px;
+  float: left;
+  width: 66%;
+  background: #f1f1f1;
+}
+
+#buttone {
+  margin-left: 0.5vw; 
+}
+
+
+</style>
+
+<script>
+export default {
+        mounted() {
+            this.checkAccount();
+          this.post.user = this.user;
+          //alert(this.post.user);
+          let uri = 'http://192.168.1.11:4000/clubs/clubs';
+          this.axios.post(uri, this.post).then(res => {
+          this.clubs = res.data;
+          //console.log(this.clubs);
+          });
+
+        },
+      data() {
+        return {
+          user: null,
+          clubs: [],
+          post: {},
+          club: {},
+          selected: {},
+        }
+      },
+      methods: {
+          logout() {
+            document.cookie = "user= ; expires=Sun, 29 Dec 2019 00:00:00 UTC; path=/;";
+            document.cookie = "club= ; expires=Sun, 29 Dec 2019 00:00:00 UTC; path=/;";
+            this.$router.push({name: 'login'});
+        },
+        checkAccount(){
+            this.user = document.cookie.substring(document.cookie.indexOf("=")+1, document.cookie.indexOf(";"));
+            this.selected = document.cookie.substring(document.cookie.indexOf(";")+7);
+            console.log(this.selected);
+            if(document.cookie == ""){
+                this.$router.push({name: 'login'});
+        }
+        },
+        del(id){
+            this.post.id = id;
+            //alert(id);
+            if(this.post.id == this.selected){
+                alert("You cannot delete your selected club!")
+            }else{
+            let uri = 'http://192.168.1.11:4000/clubs/delete';
+            if(this.clubs.length != 1){
+            this.axios.post(uri, this.post).then(() => {
+                location.reload();
+            });
+            }else{
+                alert("You must have at least one club!");
+            }
+            }
+        },
+        addUser(){
+          //alert(this.attendee.name);
+          this.club.user = this.user;
+          this.club.clubname = this.club.name;
+          
+          let uri = 'http://192.168.1.11:4000/clubs/add';
+          this.axios.post(uri, this.club).then(() => {
+              location.reload();
+          });
+        },
+        sel(id){
+            document.cookie = "club= " + id + ";";
+            location.reload();
+        },
+      }
+}
+</script>
\ No newline at end of file
diff --git a/attendancetracker/src/components/Insights.vue b/attendancetracker/src/components/Insights.vue
index 2e43460..202c089 100644
--- a/attendancetracker/src/components/Insights.vue
+++ b/attendancetracker/src/components/Insights.vue
@@ -4,7 +4,7 @@
 
     <div>
   <b-navbar toggleable="lg" type="light" variant="light">
-    <b-navbar-brand href="#" style="margin-top: 8px;">Attendance Tracker®</b-navbar-brand>
+    <b-navbar-brand href="#" style="margin-top: 8px;">Attendance Tracker</b-navbar-brand>
 
     <b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
 
@@ -17,6 +17,7 @@
           <b-dropdown-item href="/insights/absences">By Absences</b-dropdown-item>
         </b-nav-item-dropdown>
         <b-nav-item href="/attendees">Manage Club Members</b-nav-item>
+        <b-nav-item href="/clubs">Select Club</b-nav-item>
       </b-navbar-nav>
 
       <!-- Right aligned nav items -->
@@ -35,8 +36,8 @@
 </div>
 
 
-
-    <h1 style="margin-top: 10px;">{{ header }}</h1>
+  <h1 style="margin-top: 10px;">{{club.clubname}} Insights Page</h1>
+    <h2 style="margin-top: 10px; text-align: center;">{{ header }}</h2>
         <div v-if="chartData.length == 1"><center>You have no members yet! Add some to get insights. <br>Chart Loading, please wait...</center></div>
         <div v-else>
         <center>
@@ -115,8 +116,15 @@ th{
 
 export default {
         mounted() {
-            this.user = document.cookie.substring(document.cookie.indexOf("=")+1);
-            if(document.cookie == ""){
+            this.user = document.cookie.substring(document.cookie.indexOf("=")+1, document.cookie.indexOf(";"));
+            this.selected = document.cookie.substring(document.cookie.indexOf(";")+7);
+            let url = 'http://192.168.1.11:4000/clubs/getbyID';
+            let temp = {number: this.selected};
+            this.axios.post(url, temp).then(res => {
+              this.club = res.data;
+              //console.log(this.clubs);
+
+              if(document.cookie == ""){
                 this.$router.push({name: 'login'});
            }
             
@@ -132,7 +140,10 @@ export default {
                 this.getAttByAbsenses();
                 
             }
-            console.log(this.$route.params.method)
+            //console.log(this.$route.params.method)
+          })
+
+            
 
             
         },
@@ -141,6 +152,7 @@ export default {
           attendees: [],
           user: "",
           header: "",
+          club: {},
           chartData: [
               ["User", "Attendances"]
           ],
@@ -155,8 +167,8 @@ export default {
       },
       methods: {
           getAttById(){
-            var data = {user: this.user};
-            let uri = 'http://localhost:4000/attendance/getById';
+            var data = {user: this.selected};
+            let uri = 'http://192.168.1.11:4000/attendance/getById';
             this.axios.post(uri, data).then(res => {
                 console.log(res);
                 this.attendees = res.data;
@@ -168,8 +180,8 @@ export default {
           });
           },
           getAttByPresences(){
-              var data = {user: this.user};
-            let uri = 'http://localhost:4000/attendance/getById';
+              var data = {user: this.selected};
+            let uri = 'http://192.168.1.11:4000/attendance/getById';
             this.axios.post(uri, data).then(res => {
                 console.log(res);
                 this.attendees = res.data;
@@ -182,8 +194,8 @@ export default {
           });
           },
           getAttByAbsenses(){
-              var data = {user: this.user};
-            let uri = 'http://localhost:4000/attendance/getById';
+              var data = {user: this.selected};
+            let uri = 'http://192.168.1.11:4000/attendance/getById';
             this.axios.post(uri, data).then(res => {
                 console.log(res);
                 this.attendees = res.data;
diff --git a/attendancetracker/src/components/Login.vue b/attendancetracker/src/components/Login.vue
index 6335a23..beeb9e8 100644
--- a/attendancetracker/src/components/Login.vue
+++ b/attendancetracker/src/components/Login.vue
@@ -155,7 +155,7 @@ input:focus {
           },
         methods: {
             add(){
-            let uri = 'http://localhost:4000/login/post';
+            let uri = 'http://192.168.1.11:4000/login/post';
             this.axios.post(uri, this.post).then(res => {
               if(!res.data){
                  document.getElementById("incorrect").style.display = "block"; 
@@ -163,8 +163,15 @@ input:focus {
                  document.getElementsByClassName("text-input")[1].style.border = "3px solid red"; 
               }else{
                 document.getElementById("incorrect").style.display = "none"; 
-                this.$router.push({name: 'calendar'});
+                
                 document.cookie = "user="+res.data.user;
+
+                let url = 'http://192.168.1.11:4000/clubs/getone';
+                  this.axios.post(url, this.post).then(res2 => {
+                    console.log(res2);
+                    document.cookie = "club=" + res2.data._id + ";";
+                    this.$router.push({name: 'calendar'});
+                })
               }
             });
           }
diff --git a/attendancetracker/src/components/Register.vue b/attendancetracker/src/components/Register.vue
index 8f76210..e3ddb8e 100644
--- a/attendancetracker/src/components/Register.vue
+++ b/attendancetracker/src/components/Register.vue
@@ -5,7 +5,7 @@
         <div class="login-form">
           <h1 class="title">Register</h1>
           <div class="field">
-          <label class="label">Club Name (No spaces)</label>
+          <label class="label">Username</label>
             <div class="control">
               <input type="text" v-model="post.user" class="text-input">
             </div> 
@@ -36,6 +36,46 @@
 </div>
   </template>
 
+<script>
+    export default {
+      data() {
+            return {
+              post: {},
+              club: {},
+            }
+          },
+        methods: {
+            add(){
+            if(this.post.user != "" || this.post.email != "" || this.post.pass != ""){ 
+            let uri = 'http://192.168.1.11:4000/login/add';
+            this.axios.post(uri, this.post).then(res => {
+              console.log(res);
+              if(!res.data.user){
+                alert("Success! Account Created!");
+
+                this.club.user = this.post.user;
+                this.club.clubname = "First";
+          
+                let url = 'http://192.168.1.11:4000/clubs/add';
+                this.axios.post(url, this.club).then(() => {
+                  console.log("Added First Club")
+                })
+
+                this.$router.push({name: 'login'});
+              }else{
+                alert("Error username already in use!")
+              }
+            });
+            
+            }else{
+              alert("Fields must not be empty!")
+            }
+        }
+    }
+  }
+  </script>
+
+
   <style scoped>
   #whole-page {
     font-family: Open Sans, 'Source Sans Pro', sans-serif;
@@ -154,31 +194,4 @@ input:focus {
     
   </style>
 
-  <script>
-    export default {
-      data() {
-            return {
-              post: {}
-            }
-          },
-        methods: {
-            add(){
-            if(this.post.user != "" || this.post.email != "" || this.post.pass != ""){ 
-            let uri = 'http://localhost:4000/login/add';
-            this.axios.post(uri, this.post).then(res => {
-              console.log(res);
-              if(!res.data.user){
-                alert("Success! Account Created!");
-                this.$router.push({name: 'login'});
-              }else{
-                alert("Error username already in use!")
-              }
-            });
-            
-            }else{
-              alert("Fields must not be empty!")
-            }
-        }
-    }
-  }
-  </script>
+  
\ No newline at end of file
diff --git a/attendancetracker/src/main.js b/attendancetracker/src/main.js
index 7cb6336..c133f2d 100644
--- a/attendancetracker/src/main.js
+++ b/attendancetracker/src/main.js
@@ -32,7 +32,7 @@ import Register from './components/Register.vue';
 import Attendance from './components/Attendance.vue';
 import Insights from './components/Insights.vue';
 import Attendees from './components/Attendees.vue';
-
+import Clubs from './components/Clubs.vue';
 
 const routes = [
   {
@@ -65,6 +65,11 @@ const routes = [
     path: '/attendees',
     component: Attendees
   },
+  {
+    name: 'Clubs',
+    path: '/clubs',
+    component: Clubs
+  },
 ];
 
 const router = new VueRouter({ mode: 'history', routes: routes});