frontend: add current workplace and update skills

This commit is contained in:
2024-11-02 09:13:27 +02:00
parent 95ef362131
commit 731d943997
5 changed files with 71 additions and 56 deletions

View File

@ -1,26 +1,44 @@
import {
AiFillGithub,
AiFillLinkedin
} from "react-icons/ai";
import { AiFillGithub, AiFillLinkedin } from "react-icons/ai";
const Introduction = () => {
const BoldStyle = "text-blue-900 dark:text-blue-400"
const BoldStyle = "text-blue-900 dark:text-blue-400";
return (
<div className="text-center p-2">
<h2 className="text-5xl text-blue-900 dark:text-blue-400 py-2 font-medium font-burtons">Taqi Tahmid</h2>
<h3 className="text-2xl py-2 font-burtons dark:text-blue-200">Test Automation and DevOps Engineer</h3>
<h2 className="text-5xl text-blue-900 dark:text-blue-400 py-2 font-medium font-burtons">
Taqi Tahmid
</h2>
<h3 className="text-2xl py-2 font-burtons dark:text-blue-200">
Test Automation and DevOps Engineer
</h3>
<p className="text-md py-5 leading-8 text-gray-800 dark:text-gray-300 mx-auto max-w-2xl md:text-xl">
I am a <span className={BoldStyle}>Test Automation</span> and <span className={BoldStyle}>DevOps Engineer </span>
with a Bachelors from Khulna University of Engineering & Technology (KUET) and a Masters from Tampere University.
<br/><br/>I specialize in designing CI/CD pipelines and test automation for diverse applications and architectures
with four years of industry experience.
I am a <span className={BoldStyle}>Test Automation</span> and{" "}
<span className={BoldStyle}>DevOps Engineer </span>
with a Bachelors from Khulna University of Engineering & Technology
(KUET) and a Masters from Tampere University. I am currently working at
Ericsson in Finland as a DevOps Engineer.
<br />
<br />I specialize in designing CI/CD pipelines and test automation for
diverse applications and architectures with four years of industry
experience.
</p>
<div className="text-5xl flex justify-center gap-16 py-3 text-blue-900">
<a href="https://www.linkedin.com/in/taqi-tahmid/" target="_blank" rel="noreferrer"><AiFillLinkedin className="hover:text-sky-600"/></a>
<a href="https://github.com/TheTaqiTahmid" target="_blank" rel="noreferrer"><AiFillGithub className="hover:text-sky-600"/></a>
<a
href="https://www.linkedin.com/in/taqi-tahmid/"
target="_blank"
rel="noreferrer"
>
<AiFillLinkedin className="hover:text-sky-600" />
</a>
<a
href="https://github.com/TheTaqiTahmid"
target="_blank"
rel="noreferrer"
>
<AiFillGithub className="hover:text-sky-600" />
</a>
</div>
</div>
)
}
</div>
);
};
export default Introduction
export default Introduction;

View File

@ -1,44 +1,45 @@
import pythonIcon from "../assets/python.svg"
import bashIcon from "../assets/bash-icon.svg"
import goIcon from "../assets/go-original.svg"
import reactIcon from "../assets/react.svg"
import ansibleIcon from "../assets/ansible.svg"
import terraformIcon from "../assets/terraform-icon.svg"
import jenkinsIcon from "../assets/jenkins.svg"
import gitIcon from "../assets/git-icon.svg"
import dockerIcon from "../assets/docker-icon.svg"
import kubernetesIcon from "../assets/kubernetes.svg"
import prometheusIcon from "../assets/prometheus.svg"
import grafanaIcon from "../assets/grafana.svg"
import pythonIcon from "../assets/python.svg";
import robotIcon from "../assets/robotframework-svgrepo-com.svg";
import goIcon from "../assets/go-original.svg";
import reactIcon from "../assets/react.svg";
import ansibleIcon from "../assets/ansible.svg";
import terraformIcon from "../assets/terraform-icon.svg";
import jenkinsIcon from "../assets/jenkins.svg";
import gitIcon from "../assets/git-icon.svg";
import dockerIcon from "../assets/docker-icon.svg";
import kubernetesIcon from "../assets/kubernetes.svg";
import prometheusIcon from "../assets/prometheus.svg";
import grafanaIcon from "../assets/grafana.svg";
const Skills = () => {
const skills = [
{ name: 'Python', icon: pythonIcon},
{ name: 'Golang', icon: goIcon },
{ name: 'React', icon: reactIcon },
{ name: 'Bash', icon: bashIcon},
{ name: 'Ansible', icon: ansibleIcon},
{ name: 'Terraform', icon: terraformIcon },
{ name: 'Jenkins', icon: jenkinsIcon},
{ name: 'Git', icon: gitIcon},
{ name: 'Docker', icon: dockerIcon },
{ name: 'Kubernetes', icon: kubernetesIcon},
{ name: 'Prometheus', icon: prometheusIcon},
{ name: 'Grafana', icon: grafanaIcon},
{ name: "Python", icon: pythonIcon },
{ name: "Golang", icon: goIcon },
{ name: "React", icon: reactIcon },
{ name: "Robot Framework", icon: robotIcon },
{ name: "Ansible", icon: ansibleIcon },
{ name: "Terraform", icon: terraformIcon },
{ name: "Jenkins", icon: jenkinsIcon },
{ name: "Git", icon: gitIcon },
{ name: "Docker", icon: dockerIcon },
{ name: "Kubernetes", icon: kubernetesIcon },
{ name: "Prometheus", icon: prometheusIcon },
{ name: "Grafana", icon: grafanaIcon },
];
return (
<div>
<h1 className="text-2xl py-5 font-burtons dark:text-blue-200">Tools and Languages</h1>
<div className="grid grid-cols-4 gap-6 text-md py-5 leading-8 text-gray-800 dark:text-gray-300 mx-auto max-w-2xl md:text-xl">
<h1 className="text-2xl py-5 font-burtons dark:text-blue-200">
Tools and Languages
</h1>
<div className="grid grid-cols-4 gap-6 text-md py-5 leading-8 text-gray-800 dark:text-gray-300 mx-auto max-w-2xl md:text-xl">
{skills.map((skill) => (
<div key={skill.name} className="flex flex-col items-center">
<img src={skill.icon} alt={skill.name} className="h-10 w-10" />
<p className="mt-2 text-center">{skill.name}</p>
</div>
<div key={skill.name} className="flex flex-col items-center">
<img src={skill.icon} alt={skill.name} className="h-10 w-10" />
<p className="mt-2 text-center">{skill.name}</p>
</div>
))}
</div>
</div>
</div>
);
};