Add this repository to the official GitHub organization.

Author: Brooke Fisher

.gitignore

@@ -0,0 +1,4 @@
+.DS_Store
+node_modules
+package-lock.json
+.env

README.md

@@ -0,0 +1,26 @@
+# Welcome to the Integrating With HubSpot I: Foundations Practicum
+
+This repository is for the Integrating With HubSpot I: Foundations course. This practicum is one of two requirements for receiving your Integrating With HubSpot I: Foundations certification. You must also take the exam and receive a passing grade (at least 75%).
+
+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:**
+
+___
+## Tips:
+- Commit to your repository often. Even if you make small tweaks to your code, it’s best to be committing to your repository frequently.
+- The subject of the custom object is up to you. Feel free to get creative!
+- Don’t include your private app access token in your repo. We’ll grab this from your test account private app.
+
+## Pre-requisites:
+- Using [Node](https://nodejs.org/en/download) and node packages
+- Using [Express](https://expressjs.com/en/starter/installing.html)
+- Using [Axios](https://axios-http.com/docs/intro)
+- Using [Pug templating system](https://pugjs.org/api/getting-started.html)
+- Using the command line
+- Using [Git and GitHub](https://product.hubspot.com/blog/git-and-github-tutorial-for-beginners)
+
+## 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.

index.js

@@ -0,0 +1,71 @@
+const express = require('express');
+const axios = require('axios');
+const app = express();
+
+app.set('view engine', 'pug');
+app.use(express.static(__dirname + '/public'));
+app.use(express.urlencoded({ extended: true }));
+app.use(express.json());
+
+// * Please include the private app access token in your repo BUT only an access token built in a TEST ACCOUNT. Don't do this practicum in your normal account.
+const PRIVATE_APP_ACCESS = '';
+
+// 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
+
+// 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 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 });      
+    } catch (error) {
+        console.error(error);
+    }
+});
+
+* * App.post sample
+app.post('/update', async (req, res) => {
+    const update = {
+        properties: {
+            "favorite_book": req.body.newVal
+        }
+    }
+
+    const email = req.query.email;
+    const updateContact = `https://api.hubapi.com/crm/v3/objects/contacts/${email}?idProperty=email`;
+    const headers = {
+        Authorization: `Bearer ${PRIVATE_APP_ACCESS}`,
+        'Content-Type': 'application/json'
+    };
+
+    try { 
+        await axios.patch(updateContact, update, { headers } );
+        res.redirect('back');
+    } catch(err) {
+        console.error(err);
+    }
+
+});
+*/
+
+
+// * Localhost
+app.listen(3000, () => console.log('Listening on http://localhost:3000'));

package.json

@@ -0,0 +1,16 @@
+{
+    "name": "integrating-with-hubspot-i-foundations-practicum",
+    "version": "1.0.0",
+    "description": "",
+    "main": "index.js",
+    "scripts": {
+        "test": "echo \"Error: no test specified\" && exit 1"
+    },
+    "author": "HubSpot Academy learner",
+    "license": "ISC",
+    "dependencies": {
+        "axios": "^1.3.5",
+        "express": "^4.18.2",
+        "pug": "^3.0.2"
+    }
+}

public/css/style.css

@@ -0,0 +1,58 @@
+@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
+
+body, * {
+    font-family: 'Roboto', sans-serif;
+    margin: 0;
+    padding: 0;
+}
+
+h1 {
+    margin: 1rem;
+}
+
+.cards {
+    display: flex;
+    align-items: center;
+    justify-content: space-evenly;
+    flex-wrap: wrap;
+}
+
+.card {
+    flex-basis: 31%;
+    margin: 1rem 0.4rem;
+    padding: 1rem 0.4rem 2.5rem 0.4rem;
+    border: solid 1px lightgrey;
+    border-radius: 15px;
+    box-shadow: 3px 2px 6px lightgrey;
+}
+
+.card__email {
+    font-size: 1rem;
+}
+
+.form-wrapper {
+    font-size: 18px;
+    max-width: 768px;
+    margin: 2rem auto;
+    padding: 2rem;
+    border: solid 1px lightgrey;
+    border-radius: 15px;
+    box-shadow: 3px 2px 6px lightgrey;
+}
+
+label, input {
+    margin-top: 5px;
+    display: block;
+    font-size: inherit;
+}
+
+input[type="text"] {
+    padding: .25rem;
+}
+
+input[type="submit"] {
+    background-color: lightgrey;
+    border: none;
+    padding: .375rem 1rem;
+    margin-top: 10px;
+}

views/contacts.pug

@@ -0,0 +1,15 @@
+//- ** This is a sample of a pug template and how it uses the data passed to it from index.js.
+
+//- 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 Contacts
+//-         .cards 
+//-             each contact in data
+//-                 .card 
+//-                     h2.card__name #{contact.properties.firstname}  #{contact.properties.lastname}
+//-                     p.card__email #{contact.properties.email}