diff --git a/nginx/nginx.conf b/nginx/nginx.conf index a443c92..1fc37e7 100644 --- a/nginx/nginx.conf +++ b/nginx/nginx.conf @@ -26,7 +26,7 @@ keepalive_timeout 65; location / { root /usr/share/nginx/html; index index.html index.htm; - try_files $uri $uri/ /index.html; + try_files $uri /index.html; } location ~ ^/$ { diff --git a/public/resume/About.jpeg b/public/resume/About.jpeg new file mode 100644 index 0000000..5751437 Binary files /dev/null and b/public/resume/About.jpeg differ diff --git a/src/Navbar.jsx b/src/Navbar.jsx index 3b070fb..fc5b142 100644 --- a/src/Navbar.jsx +++ b/src/Navbar.jsx @@ -17,10 +17,12 @@ import { useTheme } from "@mui/material/styles"; import MenuIcon from "@mui/icons-material/Menu"; const links = [ + // { url: "/", title: "Home" }, { url: "/#portfolio", title: "Portfolio" }, - { url: "/#achievements", title: "Achivements" }, + // { url: "/#achievements", title: "Achievements" }, + { url: "/#about", title: "About" }, { url: "/#contact", title: "Contact" }, - //{ url: "/references", title: "References" }, + // { url: "/resume", title: "Resume" }, ]; export default function Navbar() { diff --git a/src/Routing.jsx b/src/Routing.jsx index 19725ed..f212955 100644 --- a/src/Routing.jsx +++ b/src/Routing.jsx @@ -1,8 +1,14 @@ import { Routes, Route, Navigate } from "react-router-dom"; import Toolbar from "@mui/material/Toolbar"; import Delta from "./pages/delta/Delta.jsx"; -import References from "./pages/references/References.jsx"; +import Resume from "./pages/resume/Resume.jsx"; import { useScrollToLocation } from "./hooks.jsx"; + +const redirects = [ + { path: "/r1", rewrite: "/resume" }, + { path: "/r2", rewrite: "/resume" }, + { path: "/r3", rewrite: "/resume" }, +]; export default function Routing() { useScrollToLocation(); return ( @@ -10,7 +16,10 @@ export default function Routing() { } /> - {/*} />*/} + {/* } /> */} + {redirects.map((r, i) => ( + } /> + ))} } /> } /> diff --git a/src/components/ExperienceDisplay.jsx b/src/components/ExperienceDisplay.jsx new file mode 100644 index 0000000..0b4df1d --- /dev/null +++ b/src/components/ExperienceDisplay.jsx @@ -0,0 +1,18 @@ +import Box from "@mui/material/Box"; +import Typography from "@mui/material/Typography"; +import "@css/experience-display.css"; +export default function ExperienceDisplay(props) { + const { title, subtitle, children } = props; + return ( + + {title} + + {subtitle} + + {children} + + ); +} diff --git a/src/components/PageNav.jsx b/src/components/PageNav.jsx new file mode 100644 index 0000000..53279ff --- /dev/null +++ b/src/components/PageNav.jsx @@ -0,0 +1,3 @@ +export default function PageNav(props) { + const { links } = props; +} diff --git a/src/css/experience-display.css b/src/css/experience-display.css new file mode 100644 index 0000000..4b812bc --- /dev/null +++ b/src/css/experience-display.css @@ -0,0 +1,9 @@ +.experience-display::before { + content: ""; + position: absolute; + padding: 6px; + border: 2px solid #f3ac20; + border-radius: 50%; + margin-left: -28px; + margin-top: -16px; +} diff --git a/src/hooks.jsx b/src/hooks.jsx index ec39ce1..1a229a7 100644 --- a/src/hooks.jsx +++ b/src/hooks.jsx @@ -19,7 +19,11 @@ export function useScrollToLocation() { const id = hash.replace("#", ""); const element = document.getElementById(id); if (!element) return; - element.scrollIntoView({ behavior: "smooth", block: "start" }); + element.scrollIntoView({ + behavior: "smooth", + block: "start", + inline: "nearest", + }); scrolledRef.current = true; }); } diff --git a/src/pages/delta/About.jsx b/src/pages/delta/About.jsx index 98abc2b..edc22df 100644 --- a/src/pages/delta/About.jsx +++ b/src/pages/delta/About.jsx @@ -1,28 +1,135 @@ import Box from "@mui/material/Box"; import Typography from "@mui/material/Typography"; +import useMediaQuery from "@mui/material/useMediaQuery"; +import { useTheme } from "@mui/material/styles"; -export default function Projects() { +const dob = new Date(2002, 4, 3); +const age = Math.abs( + new Date(Date.now() - dob.getTime()).getUTCFullYear() - 1970, +); + +function AboutContact(props) { + const { title, info } = props; + return ( + + {`${title}:`} + + {info} + + + ); +} + +export default function About() { + const theme = useTheme(); + const fullSizePhoto = useMediaQuery(theme.breakpoints.down("md")); return ( - - - React Fullstack Software Engineer - - - Specializing in DevOps tools and code reliability. If you're a - business seeking to improve developer velocity or are looking to hire, - contact me{" "} - +
+ + About + +
+ + {!fullSizePhoto && ( + + )} + {fullSizePhoto && ( + + )} + - here - - + + React Fullstack Software Engineer + + + Hello! I'm Elijah Parker, a fullstack software engineer from Utah. + I have a passion for developing software that achieves "the + impossible". I have experience using a wide variety of + technologies including React, Python, Java, and Kubernetes. I'm + currently seeking an entry-level part time position or internship + with flexible hours to accommodate pursuit of a bachelorette + degree. + + + + + elijahglennparker@outlook.com + + } + /> + + + + + + + + + Additionally, I have worked with a wide range of tools and + frameworks including Git, PostgreSQL, MongoDB, Docker, Kubernetes, + Garden, JavaFX, MaterialUI, Spring Boot, Express, Gitlab, Gitea + CI/CD. + + + ); diff --git a/src/pages/delta/Contact.jsx b/src/pages/delta/Contact.jsx index 0b5ad14..1c5d865 100644 --- a/src/pages/delta/Contact.jsx +++ b/src/pages/delta/Contact.jsx @@ -1,12 +1,39 @@ +import { useState } from "react"; +import { Link } from "react-router-dom"; import Box from "@mui/material/Box"; +import Button from "@mui/material/Button"; import Typography from "@mui/material/Typography"; import TextField from "@mui/material/TextField"; import MailIcon from "@mui/icons-material/Mail"; import LocationOnIcon from "@mui/icons-material/LocationOn"; import PhoneIphoneIcon from "@mui/icons-material/PhoneIphone"; import ContactStrip from "./ContactStrip.jsx"; +import useMediaQuery from "@mui/material/useMediaQuery"; +import { useTheme, styled } from "@mui/material/styles"; import "@css/contact.css"; + +const ContactMessageButton = styled(Button)({ + backgroundColor: "white", + color: "#F3AC20", + borderColor: "#F3AC20", + + "&:hover": { + backgroundColor: "#F3AC20", + color: "white", + borderColor: "#F3AC20", + }, +}); + export default function Contact() { + const theme = useTheme(); + const minifyContact = useMediaQuery(theme.breakpoints.down("md")); + const [contactName, setContactName] = useState(); + const [contactEmail, setContactEmail] = useState(); + const [contactSubject, setContactSubject] = useState(); + const [contactBody, setContactBody] = useState(); + + const fillForm = (form) => (e) => form(e.target.value); + return ( */} - {/* - - - - - */} + + + + + + + + + Send Message + + diff --git a/src/pages/delta/Delta.jsx b/src/pages/delta/Delta.jsx index 7b8b250..fdbc833 100644 --- a/src/pages/delta/Delta.jsx +++ b/src/pages/delta/Delta.jsx @@ -1,23 +1,33 @@ import React, { Suspense } from "react"; -import About from "./About.jsx"; +import Box from "@mui/material/Box"; +import Header from "./Header.jsx"; import Projects from "./Projects.jsx"; +import Contact from "./Contact.jsx"; //import Environments from "./Environments.jsx"; import ContentWrapper from "@components/ContentWrapper.jsx"; const Skills = React.lazy(() => import("./Skills.jsx")); const Social = React.lazy(() => import("./Social.jsx")); -const Contact = React.lazy(() => import("./Contact.jsx")); +const Education = React.lazy(() => import("./Education.jsx")); +const Experience = React.lazy(() => import("./Experience.jsx")); +const About = React.lazy(() => import("./About.jsx")); export default function Delta() { return ( - +
+ + + + + + - + ); } diff --git a/src/pages/delta/Education.jsx b/src/pages/delta/Education.jsx new file mode 100644 index 0000000..0ec5134 --- /dev/null +++ b/src/pages/delta/Education.jsx @@ -0,0 +1,67 @@ +import Box from "@mui/material/Box"; +import Typography from "@mui/material/Typography"; +import ExperienceDisplay from "@components/ExperienceDisplay.jsx"; + +export default function Education() { + return ( + + + Education + + + + + Pursuing B.S. in Computer Science: Software Engineering program, + completed 7 credits. Anticipated graduation December 2027 + + + + + Certificate of Competency in advanced Python, database foundations, + system analysis, UML, and advanced web development using HTML, + JavaScript, React, XML, and JSON + + + + + GPA 3.9, CS Department Choice Award, Co-founder and President + Computer Science Club, 4 years programming, student tutor, AP + courses in Computer Science, Calculus, Mechanics, and Government + + + + + 2nd Place state networking security challenge, curriculum included + Ubuntu security policies and PAM, networking, init systems, advanced + command line, processes, and scheduled tasks + + + + + ); +} diff --git a/src/pages/delta/Experience.jsx b/src/pages/delta/Experience.jsx new file mode 100644 index 0000000..ec61a39 --- /dev/null +++ b/src/pages/delta/Experience.jsx @@ -0,0 +1,74 @@ +import Box from "@mui/material/Box"; +import Typography from "@mui/material/Typography"; +import ExperienceDisplay from "@components/ExperienceDisplay.jsx"; + +export default function Experience() { + return ( + + + Experience + + + + + Technologies used:{" "} + + React, Python, Java, RabbitMQ + + +
    +
  • + + Developed automated end to end UI & API tests and automated + collection of test coverage + +
    • +
  • + + Modularized API testing resources as project lead + +
    • +
  • + + Automated scripting framework to gauge product reliability as + project lead + +
    • +
  • + + Improved performance of core QA services by 20% + +
    • +
  • + + Created fullstack application using React and Express to manage + QA data as solo developer + +
    • +
+ + + + ); +} diff --git a/src/pages/delta/Header.jsx b/src/pages/delta/Header.jsx new file mode 100644 index 0000000..c8ad14e --- /dev/null +++ b/src/pages/delta/Header.jsx @@ -0,0 +1,29 @@ +import Box from "@mui/material/Box"; +import Typography from "@mui/material/Typography"; + +export default function Header() { + return ( + + + + React Fullstack Software Engineer + + + Specializing in DevOps tools and code reliability. If you're a + business seeking to improve developer velocity or are looking to hire, + contact me{" "} + + here + + + + + ); +} diff --git a/src/pages/references/ContactCard.jsx b/src/pages/resume/ContactCard.jsx similarity index 100% rename from src/pages/references/ContactCard.jsx rename to src/pages/resume/ContactCard.jsx diff --git a/src/pages/references/References.jsx b/src/pages/resume/References.jsx similarity index 61% rename from src/pages/references/References.jsx rename to src/pages/resume/References.jsx index 54d09a5..ab73fd2 100644 --- a/src/pages/references/References.jsx +++ b/src/pages/resume/References.jsx @@ -1,7 +1,6 @@ import React from "react"; import Box from "@mui/material/Box"; import Typography from "@mui/material/Typography"; -import ContentWrapper from "../../components/ContentWrapper"; import ContactCard from "./ContactCard.jsx"; const people = [ @@ -36,35 +35,32 @@ const people = [ export default function References() { return ( - - - - - - References{" "} - {" "} - - - {people.map((p, i) => ( - - ))} - - - + +
+ + References + +
+ + + {people.map((p, i) => ( + + ))} + ); } diff --git a/src/pages/resume/Resume.jsx b/src/pages/resume/Resume.jsx new file mode 100644 index 0000000..072b3f3 --- /dev/null +++ b/src/pages/resume/Resume.jsx @@ -0,0 +1,14 @@ +import React from "react"; +import Box from "@mui/material/Box"; +import ContentWrapper from "../../components/ContentWrapper"; +import References from "./References.jsx"; + +export default function Resume() { + return ( + + + + + + ); +}