diff --git a/package.json b/package.json index f24d151..f8e0a2d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-website", - "version": "0.2.19", + "version": "0.2.20", "private": true, "dependencies": { "@fortawesome/fontawesome": "^1.1.8", diff --git a/src/components/Job/index.css b/src/components/Job/index.css new file mode 100644 index 0000000..13e0d19 --- /dev/null +++ b/src/components/Job/index.css @@ -0,0 +1,31 @@ +.job-container { + border-bottom: 2px solid rgb(139, 191, 209); + flex: 1 0 90%; + font-size: 0.9rem; + margin: auto 5%; + text-align: left; +} + +.job-company { + color: rgb(216, 221, 234); +} + +.job-title { + font-size: 1.2rem; + margin-top: 2%; +} + +.small-text { + margin-bottom: 1%; +} + +.job-container ul { + margin-top: 0; +} + +@media screen and (max-width: 500px) { + .job-container { + flex: 1 0 100%; + margin: auto; + } +} diff --git a/src/components/Job/index.js b/src/components/Job/index.js new file mode 100644 index 0000000..ea0ab17 --- /dev/null +++ b/src/components/Job/index.js @@ -0,0 +1,36 @@ +// @flow +import * as React from "react" + +import SmallText from "../../components/SmallText" +import "./index.css" + +type Props = { + title: string, + company: string, + timeSpan: string, + bullets: Array +} + +class Experience extends React.PureComponent { + listedBullets: Array> + + constructor(props: Props) { + super(props) + this.listedBullets = this.props.bullets.map((bullet, index) => ( +
  • {bullet}
    • + )) + } + + render() { + return ( +
    +
    {this.props.title}
    +
    {this.props.company}
    + {this.props.timeSpan} +
      {this.listedBullets}
    +
    + ) + } +} + +export default Experience diff --git a/src/components/Project/index.css b/src/components/Project/index.css new file mode 100644 index 0000000..5060714 --- /dev/null +++ b/src/components/Project/index.css @@ -0,0 +1,21 @@ +.project-container { + border-bottom: 2px solid rgb(139, 191, 209); + flex: 1 0 45%; + margin: 2.5%; + padding-bottom: 20px; + text-align: center; +} + +.project-container h4 { + margin-bottom: 0; +} + +.project-container p { + margin-top: 3%; +} + +@media screen and (max-width: 500px) { + .project-container { + flex: 1 0 95%; + } +} diff --git a/src/components/Project/index.js b/src/components/Project/index.js new file mode 100644 index 0000000..3f42d60 --- /dev/null +++ b/src/components/Project/index.js @@ -0,0 +1,26 @@ +// @flow +import React from "react" + +import ClearButton from "../../components/ClearButton" + +import "./index.css" + +type Props = { + title: string, + children: string, + repoUrl: string +} + +class Project extends React.PureComponent { + render() { + return ( +
    +

    {this.props.title}

    +

    {this.props.children}

    + Repository +
    + ) + } +} + +export default Project diff --git a/src/containers/Experience/index.css b/src/containers/Experience/index.css index 731ee8f..2f37326 100644 --- a/src/containers/Experience/index.css +++ b/src/containers/Experience/index.css @@ -3,35 +3,3 @@ flex-flow: column nowrap; margin: 2% 0; } - -.experience-container > div { - border-bottom: 2px solid rgb(139, 191, 209); - flex: 1 0 90%; - font-size: 0.9rem; - margin: auto 5%; - text-align: left; -} - -.experience-company { - color: rgb(216, 221, 234); -} - -.experience-title { - font-size: 1.2rem; - margin-top: 2%; -} - -.small-text { - margin-bottom: 1%; -} - -.experience-container ul { - margin-top: 0; -} - -@media screen and (max-width: 500px) { - .experience-container > div { - flex: 1 0 100%; - margin: auto; - } -} diff --git a/src/containers/Experience/index.js b/src/containers/Experience/index.js index 384ce43..552b957 100644 --- a/src/containers/Experience/index.js +++ b/src/containers/Experience/index.js @@ -1,8 +1,8 @@ // @flow import React from "react" -import SmallText from "../../components/SmallText" import "./index.css" +import Job from "../../components/Job" type Props = {} @@ -10,95 +10,56 @@ class Experience extends React.PureComponent { render() { return (
    -
    -
    Lead Backend Engineer
    -
    Hypremium.
    - - May 2018 - Present - -
      -
    • - Architect all new backend microservices using Serverless, AWS API - Gateway/Lambda/more, and Golang. -
      • -
    • - Lead backend development team in an Agile (scrumban) environment. -
      • -
    • Monitor and maintain all stages of hosted microservices.
      • -
    -
    -
    -
    DevOps Engineer
    -
    Hypremium.
    - - January 2018 - May 2018, 5 Months - -
      -
    • - Maintain & migrate Ruby on Rails API and backend application. -
      • -
    • - Oversee and assist with continuous integration for backend - development. -
      • -
    -
    -
    -
    Sales Associate
    -
    J. Crew
    - - October 2015 - January 2017, 1 Year 5 Months - -
      -
    • - Knowing the products and what products best suit the customers’ - needs. -
      • -
    • - Helping the customer with any manner of purchase, exchange, or - return. -
      • -
    -
    -
    -
    Intern
    -
    Zumasys
    - - June 2015 - August 2015, 3 Months - -
      -
    • - Main goal was to learn as much about the business and their - technology as possible -
      • -
    • Management and organization of customer correspondence.
      • -
    • Auditing of server space.
      • -
    • - Dispatching and filtering ticketing system and office computer - assistance. -
      • -
    -
    -
    -
    User Support Technician
    -
    - Point Loma Nazarene University, ITS Deptarment -
    - - Jan 2015 - May 2015, 5 Months - -
      -
    • - First in contact for email hotline, second in contact for phones. -
      • -
    • - Work with customers via email, phone, remote control, and in - person. -
      • -
    • Computer diagnosis, repair, and preparation for customer.
      • -
    • Special projects.
      • -
    -
    + + + + +
    ) } diff --git a/src/containers/Projects/index.css b/src/containers/Projects/index.css index f53182b..2510935 100644 --- a/src/containers/Projects/index.css +++ b/src/containers/Projects/index.css @@ -2,25 +2,3 @@ display: flex; flex-flow: row wrap; } - -.projects-container div { - border-bottom: 2px solid rgb(139, 191, 209); - flex: 1 0 45%; - margin: 2.5%; - padding-bottom: 20px; - text-align: center; -} - -.projects-container h4 { - margin-bottom: 0; -} - -.projects-container p { - margin-top: 3%; -} - -@media screen and (max-width: 500px) { - .projects-container div { - flex: 1 0 95%; - } -} diff --git a/src/containers/Projects/index.js b/src/containers/Projects/index.js index 1b55a9b..5e75fff 100644 --- a/src/containers/Projects/index.js +++ b/src/containers/Projects/index.js @@ -1,7 +1,7 @@ // @flow import React from "react" -import ClearButton from "../../components/ClearButton" +import Project from "../../components/Project" import "./index.css" @@ -11,58 +11,49 @@ class Projects extends React.PureComponent { render() { return (
    -
    -

    mjfs.us

    -

    - This website has taken many forms over the years, as my frontend and - design skills increase. It has been simple HTML, CSS, and JS, and a - Ruby Sinatra web app. Currently it takes the form of a React.js app. - I enjoy React.js (and similar frontend frameworks) as they can be - used to make even the simplest projects modular and extensible. -

    - - Repository - -
    -
    -

    lambdarouter

    -

    - This package will become a fully featured AWS Lambda function - router, able to respond to HTTP, Schedule, Cognito, and SNS events. - It will also support middleware interfacing. So far it includes - functionality for API Gateway. Check out the GoDoc Reference to see - how to instantiate a router and create endpoints. -

    - - Repository - -
    -
    -

    destinate

    -

    - destinate is a react-native, iOS (and Android) app. Its main - objective is to suggest places or activities to the user based on - their past choices. It utilizes a serverless backend, written in Go - and hosted on AWS API Gateway/Lambda. It is still under development, - as a side project of Arash Lari and I. -

    - - Repository - -
    -
    -

    sys-mgmt

    -

    - A minimal, cross-platform, unix-like-system management program. This - program is designed to detect which programs are affiliated with the - unix-like system, whether it be Debian or macOS. There are various - shortcuts to common unix-like commands, such as update and upgrade - (for package managers), another is poweroff or reboot. -

    - - Repository - -
    + + This website has taken many forms over the years, as my frontend and + design skills increase. It has been simple HTML, CSS, and JS, and a + Ruby Sinatra web app. Currently it takes the form of a React.js app. I + enjoy React.js (and similar frontend frameworks) as they can be used + to make even the simplest projects modular and extensible. + + + + This package will become a fully featured AWS Lambda function router, + able to respond to HTTP, Schedule, Cognito, and SNS events. It will + also support middleware interfacing. So far it includes functionality + for API Gateway. Check out the GoDoc Reference to see how to + instantiate a router and create endpoints. + + + + destinate is a react-native, iOS (and Android) app. Its main objective + is to suggest places or activities to the user based on their past + choices. It utilizes a serverless backend, written in Go and hosted on + AWS API Gateway/Lambda. It is still under development, as a side + project of Arash Lari and I. + + + + A minimal, cross-platform, unix-like-system management program. This + program is designed to detect which programs are affiliated with the + unix-like system, whether it be Debian or macOS. There are various + shortcuts to common unix-like commands, such as update and upgrade + (for package managers), another is poweroff or reboot. +
    ) }