Put the content in the JS like some horrible savage

4 files changed, 109 insertions, 60 deletions

diff --git a/src/pages/about.js b/src/pages/about.js
index ab91a00..c5b1029 100644
--- a/src/pages/about.js
+++ b/src/pages/about.js
@@ -1,11 +1,26 @@
 import React from 'react'
+import { css } from 'react-emotion'
 
 import Layout from '../components/layout'
 import { AboutEntry } from '../components/about-entry'
+import { Personal } from '../components/personal'
+import { SplitContainer } from '../components/split-container'
+import { margins } from '../components/globals'
+
+import profilePic from '../images/profile.jpg'
+
+const botStyle = css`
+  margin: ${margins.sm}px 0 0 0;
+  font-size: 10px;
+`
 
 const aboutLists = [
   {
-    header: `Values and Ethics`,
+    header: (
+      <>
+        Values and Ethics <i className="fa fa-heart" />
+      </>
+    ),
     listItems: [
       `Above all, we must use technology for good (not to be confused with commercial success)`,
       'People are most important',
@@ -13,7 +28,11 @@ const aboutLists = [
     ]
   },
   {
-    header: 'Skills and Experience',
+    header: (
+      <>
+        Skills and Experience <i className="fa fa-map" />
+      </>
+    ),
     listItems: [
       'Building beautiful user applications using web technology',
       'Deploying function based infrastructure',
@@ -23,27 +42,62 @@ const aboutLists = [
     ]
   },
   {
-    header: 'Tools',
+    header: (
+      <>
+        Tools <i className="fa fa-wrench" />
+      </>
+    ),
     listItems: [
+      `Languages: Expert in TypeScript/JavaScript, fluent in C, working knowledge of Python and Shell`,
       'Frontend: React, Angular, Ionic, RxJS',
       'Infrastructure: Node, Firebase, Google Cloud (Cloud Functions, Pubsub, Stackdriver)',
-      'Embedded: C, Linux, Legato, Yocto, AirVantage'
+      'Embedded: Linux, Legato, Yocto, AirVantage'
     ]
   },
   {
-    header: `Future Learning Ideas`,
+    header: (
+      <>
+        Future Learning Ideas <i className="fa fa-flask" />
+      </>
+    ),
     listItems: [
-      'Ruby, Go, Rust, Smalltalk, ReasonML',
-      'Linux framebuffer API',
-      'Implement TCP from scratch'
+      `Learn more languages. I love deriving influence from all languages. I would love to learn more
+      about Ruby, Go, Rust, Smalltalk, ReasonML, and Elixir.`,
+      `Write a drvier using the Linux framebuffer API. Although I never want to
+      specialize in operating sytems, learning about them is fascinating and
+      helps me write better code at all levels of abstraction.`,
+      `Implement TCP from scratch in C (bonus for x86 Assembly). We send a lot of data over the network
+      so I want to zoom in on how it's done.`,
+      `Maybe write my own kernel with some basic threading (RTOS style)?`
     ]
   }
 ]
 
+const personalProps = {
+  name: <h2>Me</h2>,
+  tagline: `Get in touch`,
+  imgAlt: `Portrait photo of Nicholas Van Doorn`,
+  imgUrl: profilePic,
+  email: (
+    <>
+      <p>
+        <i className="fa fa-envelope-o" /> nick <em>at</em> nv <em>dot</em>{' '}
+        delivery
+      </p>
+      <p className={botStyle}>(be gone, bots)</p>
+    </>
+  )
+}
+
 export default () => (
   <Layout>
-    {aboutLists.map((entry, i) => (
-      <AboutEntry {...entry} key={entry.header} />
-    ))}
+    <SplitContainer>
+      <Personal {...personalProps} />
+      <div>
+        {aboutLists.map((entry, i) => (
+          <AboutEntry {...entry} key={`about-entry-${i}`} />
+        ))}
+      </div>
+    </SplitContainer>
   </Layout>
 )
diff --git a/src/pages/index.js b/src/pages/index.js
index 4125399..1737774 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -6,7 +6,7 @@ import { Splash } from '../components/splash'
 
 const indexData = {
   heading: 'Hello world',
-  subHeadings: [`Let's build ethical technology for reasons that matter`],
+  subHeadings: [`Let's build ethical technology for reasons that matter*`],
   emojiList: ['💻', '🖥', '🌎', '🚀', '💾'],
   heroBtnTo: '/about',
   heroBtnText: (
diff --git a/src/pages/projects.js b/src/pages/projects.js
index 6310022..edd3346 100644
--- a/src/pages/projects.js
+++ b/src/pages/projects.js
@@ -1,7 +1,6 @@
 import React from 'react'
 import Layout from '../components/layout'
 import { Project } from '../components/project'
-import { DefaultButton as Button } from '../components/button'
 import functional from '../images/functional.png'
 import camera from '../images/camera.png'
 import storageService from '../images/storage-service.png'
@@ -12,6 +11,14 @@ import ie from '../images/ie.png'
 
 const projects = [
   {
+    name: 'Pipefitter',
+    brief: 'Automated audits and monitioring for your ISP',
+    date: 'Nov 2018 - Present',
+    desc: `My home internet performance is really bad and my ISP never believes me.
+          Hopefully they will soon. Designed for maxium plug-ability`,
+    url: '//github.com/nvandoorn/pipefitter'
+  },
+  {
     name: 'funCtional',
     brief: 'Functional programming in C with statically allocated memory',
     date: 'Aug 2018',
@@ -19,7 +26,7 @@ const projects = [
           In  reality, a simple for loop is better, but I had fun trying this.`,
     imgUrl: functional,
     inProd: true,
-    url: ''
+    url: '//github.com/nvandoorn/functional'
   },
   {
     name: 'Legato Storage Service',
@@ -29,7 +36,7 @@ const projects = [
     desc: `The Legato Linux framework offers out of the box support for
           uploading time series data, but not storing it locally. For this reason,
           we created this service to persist data for offline cases.`,
-    url: ''
+    url: '//github.com/brnkl/legato-storage-service'
   },
   {
     name: 'Legato GPS Monitor',
@@ -42,7 +49,7 @@ const projects = [
           and allows users to retrieve it using an inter process API
           (see more about Legato IPC APIs here).`,
     inProd: true,
-    url: ''
+    url: '//github.com/brnkl/gps-monitor'
   },
   {
     name: 'CF3 Config App',
@@ -68,7 +75,7 @@ const projects = [
           not included in Linux (with the exception of a few Legato specific macros).`,
     imgUrl: camera,
     inProd: true,
-    url: ''
+    url: '//github.com/brnkl/VC0706-cam-lib'
   },
   {
     name: 'Cookbook',
@@ -78,7 +85,7 @@ const projects = [
           has an idea to fix it. I propose we simply limit peoples conversations options
           to the bare essentials.`,
     imgUrl: cookBook,
-    url: ''
+    url: '//github.com/nvandoorn/cookbook'
   },
   {
     name: 'ccss',
@@ -91,7 +98,7 @@ const projects = [
           !not-that-important), complex vertical alignment algorithms (flex and grid kindof
           ruined this one), and mixins for 1980s style typography.`,
     imgUrl: '',
-    url: ''
+    url: '//github.com/nvandoorn/ccss'
   },
   {
     name: 'slask',
@@ -107,7 +114,7 @@ const projects = [
       </>
     ),
     imgUrl: slask,
-    url: ''
+    url: '//github.com/nvandoorn/slask'
   },
   {
     name: 'IE Media Queries',
@@ -117,7 +124,7 @@ const projects = [
           media query support. IE8 is more or less dead and unsupported, but I still
           enjoyed re-creating unsupported functionality`,
     imgUrl: ie,
-    url: ''
+    url: '//github.com/nvandoorn/IEMediaQueries'
   }
 ]
 
diff --git a/src/pages/work.js b/src/pages/work.js
index 372aa1e..0fbfd2c 100644
--- a/src/pages/work.js
+++ b/src/pages/work.js
@@ -9,55 +9,43 @@ const workHistory = [
     brief: 'BRNKL by Barnacle Systems',
     date: 'Sept 2017 - Present',
     desc: '',
-    imgUrl: ''
+    imgUrl: '',
+    url: '//brnkl.io'
   },
   {
     name: 'Software Developer, Contract',
     brief: 'BRNKL by Barnacle Systems',
     date: 'Jul 2017 - Sept 2017',
-    desc: `After leaving FTS, one of my colleagues shared some details about a side project
-          he was working on. His boat broke moorage earlier that year, so he got to work
-          building a product to remotely monitor and track boats. From a customer perspective,
-          this product, the BRNKL, allows users to monitor the health of their boat by monitoring batteries,
-          bilge activity, and GPS location, and the ability to configure alert rules to let
-          them know when something has gone wrong. From a technical perspective, this product consists of
-          a small piece of cellular based hardware placed on the vessel, back-end infrastructure,
-          and a user facing application where users can see all of their data.
-          Eventually, the product became serious enough that he quit his job at FTS
-          to work full time on this new product. He approached me about joining as a contractor to
-          help build the initial version of the user application.
-
-          I was given a set of requirements for the application
-          and the rest was up to me. I decided to build the app using progressive web app technologies (PWA)
-          along with a layer to support native app functionality (Ionic and Cordova). This decision has served us
-          well as we deploy to web, iOS, and Android all from the same codebase. In terms of integration
-          into a back-end, our founder had already started using Google Firebase to store data collected from the boats,
-          so I started integrating the app with this existing infrastructure.
-
-          I completed two 80 hour contracts for Barnacle Systems, each focused on the app, with some work
-          on the infrastructure and integration, but no work on the hardware itself (i.e firmware).
-          This time was sufficient to deliver the complete set of features required for the minimum viable product.`,
-    imgUrl: ''
+    desc: (
+      <>
+        After leaving FTS, one of my colleagues shared some details about a side
+        project he was working on. His boat broke moorage earlier that year, so
+        he got to work building a product to remotely monitor and track boats. I
+        completed two 80 hour contracts for Barnacle Systems, each focused on
+        the app, with some work on the infrastructure and integration, but no
+        work on the hardware itself (i.e firmware). This time was sufficient to
+        deliver the complete set of features required for the minimum viable
+        product.
+      </>
+    ),
+    imgUrl: '',
+    url: '//brnkl.io'
   },
   {
     name: 'Software Developer, Co-op',
     brief: 'Forest Technology Systems',
     date: 'Sept 2016 - April 2017',
-    desc: `During my time at FTS, I worked with a small team of engineers,
-          product managers, and sales staff to launch a remote weather station
-          targeted at the fire weather market. The system came equipped
-          with up to four cameras that uploaded photos and videos over cellular to give
-          customers complete situational awareness in hard to reach areas.
-          The system was released as the Remove Automated Observation System (RAOS).
-          The RAOS comes fully integrated with the FTS360 service
-          which allows users to review uploaded data and set station configuration
-          I was responsible for implementing a series of services to:
-          receive configuration from the front-end,
-          transmit captured photos and videos,
-          monitor system health (battery condition, storage space,
-          cell strength), and handle local logging. The services were implemented in
-          JavaScript running in Node on Yocto Linux and
-          communicated over a local messaging protocol.`
+    desc: (
+      <>
+        During my time at FTS, I worked with a small team of engineers, product
+        managers, and sales staff to launch a remote weather station targeted at
+        the fire weather market. The system came equipped with up to four
+        cameras that uploaded photos and videos over cellular to give customers
+        complete situational awareness in hard to reach areas. The system was
+        released as the Remove Automated Observation System (RAOS).
+      </>
+    ),
+    url: '//ftsinc.com/'
   }
 ]