Add new component InfoSection to reusability, and replace Education and Experience components

This commit is contained in:
Murtadha 2024-07-12 17:41:25 -04:00
parent 1a19bb2a8f
commit 93d886f7a4
4 changed files with 222 additions and 25 deletions

View file

@ -3,11 +3,44 @@ import React from "react";
import Header from "./components/header/Header";
import Footer from "./components/footer/Footer";
import Hero from "./components/hero/Hero";
import Education from "./components/education/Education";
import Experience from "./components/experience/Experience";
// import Education from "./components/education/Education";
// import Experience from "./components/experience/Experience";
import InfoSection from "./components/info/InfoSection";
import styles from "./App.module.css";
// Temp data
const educationData = [
{
title: "BACHELOR OF COMPUTER ENGINEERING",
organization: "University of Guelph",
logo: "/university-logo.png",
location: "Guelph, ON",
duration: "2018 - 2023",
description: "Completed a comprehensive program in Computer Engineering, focusing on both hardware and software aspects of computing systems.",
skills: ["Problem Solving", "Critical Thinking", "Team Collaboration", "Technical Writing"],
techStack: ["C++", "Java", "Python", "VHDL", "MATLAB"],
skillsTitle: "Key Skills",
techStackTitle: "Core Technologies",
},
// Add more education entries as needed
];
const experienceData = [
{
title: "SOFTWARE DEVELOPMENT ENGINEER",
organization: "Amazon",
logo: "/amazon-logo.png",
location: "Vancouver, BC",
duration: "June 2022 - September 2022",
description:
"Conducted a thorough investigation, proposing solutions to streamline the resolution of manual conflicts for on-call teams. I then designed and developed a comprehensive full-stack solution to automate their workflow, which I presented to upper management as the ideal dashboard solution for on-call operations. To ensure its effectiveness, I conducted rigorous end-to-end testing and maintained the feature for ongoing success.",
skills: ["Full-stack development", "Workflow automation", "End-to-end testing", "Project management"],
techStack: ["React", "Node.js", "AWS Lambda", "DynamoDB", "Jest"],
},
// Add more experience entries as needed
];
function App() {
return (
<div className={styles.app}>
@ -26,8 +59,8 @@ function App() {
<p>This section has a different background color.</p>
</div>
</section> */}
<Experience />
<Education />
<InfoSection title="Education" data={educationData} />
<InfoSection title="Experience" data={experienceData} />
{/* Add more sections as needed */}
</main>
<Footer />