Jans task

README.md

@@ -4,7 +4,7 @@ This repository is for the Integrating With HubSpot I: Foundations course. This
 
 To read the full directions, please go to the [practicum instructions](https://app.hubspot.com/academy/l/tracks/1092124/1093824/5493?language=en).
 
-**Put your HubSpot developer test account custom objects URL link here:** https://app.hubspot.com/contacts/l/objects/${custom-obj-number}/views/all/list
+**Put your HubSpot developer test account custom objects URL link here:** https://app-eu1.hubspot.com/contacts/144167261/objects/2-123421566/views/all/list
 
 ___
 ## Tips:
@@ -25,4 +25,4 @@ ___
 ## Requirements
 - All work must be your own. During the grading process we will check the revision history. Submissions that do not meet this requirement will not be considered.
 - You must have at least two new routes in your index.js file and one new pug template for the homepage.
-- You must create a developer test account and link to it in your README.md file. Submissions that do not meet this requirement will not be considered.
+- You must create a developer test account and link to it in your README.md file. Submissions that do not meet this requirement will not be considered.

index.js

@@ -1,3 +1,4 @@
+require('dotenv').config();
 const express = require('express');
 const axios = require('axios');
 const app = express();
@@ -8,63 +9,64 @@ app.use(express.urlencoded({ extended: true }));
 app.use(express.json());
 
 // * Please DO NOT INCLUDE the private app access token in your repo. Don't do this practicum in your normal account.
-const PRIVATE_APP_ACCESS = '';
+const PRIVATE_APP_ACCESS = process.env.ACCESS_TOKEN;
 
 // TODO: ROUTE 1 - Create a new app.get route for the homepage to call your custom object data. Pass this data along to the front-end and create a new pug template in the views folder.
 
-// * Code for Route 1 goes here
+app.get( '/' , async (req, res) => {
 
-// TODO: ROUTE 2 - Create a new app.get route for the form to create or update new custom object data. Send this data along in the next route.
-
-// * Code for Route 2 goes here
-
-// TODO: ROUTE 3 - Create a new app.post route for the custom objects form to create or update your custom object data. Once executed, redirect the user to the homepage.
-
-// * Code for Route 3 goes here
-
-/** 
-* * This is sample code to give you a reference for how you should structure your calls. 
-
-* * App.get sample
-app.get('/contacts', async (req, res) => {
-    const contacts = 'https://api.hubspot.com/crm/v3/objects/contacts';
+    const requestUrl = 'https://api.hubspot.com/crm/v3/objects/dogs?limit=50&properties=name,breed,birth_date';
     const headers = {
         Authorization: `Bearer ${PRIVATE_APP_ACCESS}`,
         'Content-Type': 'application/json'
     }
+
     try {
-        const resp = await axios.get(contacts, { headers });
-        const data = resp.data.results;
-        res.render('contacts', { title: 'Contacts | HubSpot APIs', data });      
+        const resp = await axios.get(requestUrl, { headers });
+        const dogs = resp.data.results;
+        res.render('homepage', { title: 'Dog directory', dogs });    
     } catch (error) {
         console.error(error);
     }
+
 });
 
-* * App.post sample
-app.post('/update', async (req, res) => {
-    const update = {
+
+
+// TODO: ROUTE 2 - Create a new app.get route for the form to create or update new custom object data. Send this data along in the next route.
+
+app.get( '/update-cobj' , async (req, res) => {
+
+    res.render('updates', { title: 'Update Custom Object Form | Integrating With HubSpot I Practicum' });
+
+});
+
+// TODO: ROUTE 3 - Create a new app.post route for the custom objects form to create or update your custom object data. Once executed, redirect the user to the homepage.
+
+app.post( '/update-cobj' , async (req, res) => {
+
+    const requestBody = {
         properties: {
-            "favorite_book": req.body.newVal
+            "name": req.body.dogname,
+            "breed": req.body.dogbreed,
+            "birth_date": req.body.birthdate
         }
-    }
+    };
 
-    const email = req.query.email;
-    const updateContact = `https://api.hubapi.com/crm/v3/objects/contacts/${email}?idProperty=email`;
+    const requestUrl = `https://api.hubapi.com/crm/v3/objects/dogs`;
     const headers = {
         Authorization: `Bearer ${PRIVATE_APP_ACCESS}`,
         'Content-Type': 'application/json'
     };
 
     try { 
-        await axios.patch(updateContact, update, { headers } );
-        res.redirect('back');
+        await axios.post(requestUrl, requestBody, { headers } );
+        res.redirect('/');
     } catch(err) {
         console.error(err);
     }
 
 });
-*/
 
 
 // * Localhost

package.json

@@ -9,7 +9,8 @@
     "author": "HubSpot Academy learner",
     "license": "ISC",
     "dependencies": {
-        "axios": "^1.3.5",
+        "axios": "^1.6.7",
+        "dotenv": "^16.4.4",
         "express": "^4.18.2",
         "pug": "^3.0.2"
     }

public/css/style.css

@@ -40,7 +40,7 @@ h1 {
     box-shadow: 3px 2px 6px lightgrey;
 }
 
-label, input {
+label, input, select {
     margin-top: 5px;
     display: block;
     font-size: inherit;
@@ -55,4 +55,14 @@ input[type="submit"] {
     border: none;
     padding: .375rem 1rem;
     margin-top: 10px;
+}
+
+th, td {
+    padding: 20px;
+    text-align: left;
+    border-bottom: 1px solid #ddd;
+}
+
+ul {
+    margin: 2rem;
 }

views/homepage.pug

@@ -0,0 +1,23 @@
+doctype html
+html 
+    head 
+        title= `${title}`
+        meta(name="viewport" content="width=device-width, initial-scale=1")
+        link(rel="stylesheet", href="/css/style.css")
+    body    
+        h1= `${title}`
+        ul
+            li
+                a(href="/update-cobj") Add to this table
+        table
+            thead
+            tr
+                th Name
+                th Breed
+                th Birth Date
+            tbody
+            each dog in dogs
+                tr
+                td #{dog.properties.name}
+                td #{dog.properties.breed}
+                td #{dog.properties.birth_date}

views/updates.pug

@@ -0,0 +1,28 @@
+doctype html
+html 
+    head 
+        title= `${title}`
+        meta(name="viewport" content="width=device-width, initial-scale=1")
+        link(rel="stylesheet", href="/css/style.css")
+    body          
+        .form-wrapper
+            h1= `${title}`
+            ul
+                li
+                    a(href="/") Return to the homepage
+            form(method="POST")
+                label(for="dogname") Dog name
+                input(type="text" name="dogname" required)
+                label(for="dogbreed") Dog breed
+                select(name="dogbreed" required) 
+                    option(value="Shiba") Shiba
+                    option(value="Akita") Akita
+                    option(value="Pug") Pug
+                    option(value="Corgi") Corgi
+                    option(value="Border Collie") Border Collie
+                    option(value="Bulldog") Bulldog
+                    option(value="Poodle") Poodle
+                    option(value="Chihuahua") Chihuahua
+                label(for="birthdate") Birth date 
+                input(type="date" name="birthdate")
+                input(type="submit" value="Submit")