-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
6 lines (6 loc) · 8.71 KB
/
index.html
File metadata and controls
6 lines (6 loc) · 8.71 KB
1
2
3
4
5
6
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="description" content="Chad Probert - Full Stack Developer specializing in React, Node.js, and Python. Expert in web development, software engineering, and coding mentorship. View my portfolio and contact me for collaboration opportunities."><meta name="keywords" content="full stack developer, software engineer, web development, React, Node.js, Python, JavaScript, MongoDB, coding mentor"><meta name="robots" content="noindex"><!-- Open Graph Tags --><meta property="og:type" content="website"><meta property="og:title" content="Chad Probert | Full Stack Developer & Software Engineer Portfolio"><meta property="og:description" content="Experienced full stack developer and coding mentor specialising in React, Node.js, and Python. View my projects and get in touch for collaboration opportunities."><meta property="og:image" content="https://chadprobert.github.io/images/me3.avif"><meta property="og:url" content="https://chadprobert.github.io/"><meta property="og:site_name" content="Chad Probert Portfolio"><!-- Enhanced Twitter Sharing Cards --><meta name="twitter:card" content="summary_large_image"><meta name="twitter:title" content="Chad Probert | Full Stack Developer & Software Engineer"><meta name="twitter:description" content="Full stack developer and coding mentor specializing in React, Node.js, and Python. Explore my portfolio and projects."><meta name="twitter:image" content="https://chadprobert.github.io/images/me3.avif"><link rel="canonical" href="https://chadprobert.github.io/"><!-- Favicon with different icons --><link rel="icon" type="image/png" sizes="32x32" href="../images/cp-logo.png"><link rel="icon" type="image/png" sizes="16x16" href="../images/cp-logo.png"><link rel="apple-touch-icon" sizes="180x180" href="../images/cp-logo.png"><title>Chad Probert | Full Stack Web Developer & Software Engineer | Portfolio</title><!-- Preconnect to external domains --><link rel="preconnect" href="https://fonts.googleapis.com" crossorigin><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin><link rel="preconnect" href="https://cdnjs.cloudflare.com" crossorigin><!-- Loading CSS files --><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"><link rel="stylesheet" href="./css/index/index.min.css"><link rel="stylesheet" href="./css/index/features/mobile.min.css"><link rel="stylesheet" href="./css/index/features/dark-mode.min.css"><link rel="stylesheet" href="./css/index/features/animations.min.css"><!-- Inline critical CSS --><style>body{padding-top:50px;text-align:center;background-color:#f5f6f7;color:#222;font-family:Poppins,sans-serif;margin:0}h1{font-family:Inter,sans-serif;font-weight:800;line-height:99px;font-size:80px;letter-spacing:-1px}</style></head><body><div class="con"><!-- dark mode toggle --> <input type="checkbox" id="dark-mode-toggle" aria-label="Toggle dark mode"> <label for="dark-mode-toggle" id="dark-mode-label" class="dark-mode-label">Dark Mode</label><!-- header --><header role="banner"><h1>Chad Probert</h1><h2 class="roleHeading">Full Stack Web Developer & Software Engineer</h2></header><!-- social icons --><nav aria-label="Social media links"><ul class="socialIcons"><li class="githubIcon socialIcon"><a href="https://github.com/ChadProbert" target="_blank" rel="noopener noreferrer" aria-label="GitHub Profile" class="githubIcon"><iconify-icon icon="jam:github" aria-hidden="true"></iconify-icon></a></li><li class="whatsappIcon socialIcon"><a href="https://wa.me/+27609849667" target="_blank" rel="noopener noreferrer" aria-label="WhatsApp Contact" class="whatsappIcon"><iconify-icon icon="uim:whatsapp" aria-hidden="true"></iconify-icon></a></li><li class="linkedinIcon socialIcon"><a href="https://www.linkedin.com/in/chad-probert-6421b321b/" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn Profile" class="linkedinIcon"><iconify-icon icon="uil:linkedin" aria-hidden="true"></iconify-icon></a></li></ul></nav><!-- avatar image --> <img src="./images/me.jpeg" alt="Chad Probert's portfolio picture" width="150" height="150" class="avatar" loading="lazy"><!-- navigation bar--><div class="row navWrapper"><nav aria-label="Social media links"><ul class="routes"><li class="navItem"><a href="./index.html" class="navLink" aria-current="page"><i class="fa-solid fa-person-rays fa-flip" aria-hidden="true"></i> ABOUT ME</a></li><li class="navItem"><a href="./projects.html" class="navLink"><i class="fa-solid fa-folder" aria-hidden="true"></i> PROJECTS</a></li><li class="navItem"><a href="./contact.html" class="navLink"><i class="fa-solid fa-address-book" aria-hidden="true"></i> CONTACT ME</a></li></ul></nav></div><main id="main-content"><!-- about me section --><section class="aboutMeDiv"><div class="aboutMeContent"><h3 class="aboutMeHeading">About Me</h3><p class="aboutMeText">I am a full-stack web developer, coding mentor and software engineer with a passion for learning and creating. I aspire to combine my passions and understanding of technological advancement to develop and maintain websites, web applications and software that people can become fully immersed in and will find joy in utilising.</p></div></section><!-- education, skills & experience section --><div class="row extraInfo"><!-- left column --><div class="col-md-4 education"><h3 class="educationHeading">Education</h3><h4 class="educationItem">Software Engineering</h4><p>HyperionDev<br>Online Bootcamp<br>Completed in October 2024</p><br><h4 class="educationItem">Full Stack Web Development</h4><p>HyperionDev<br>Online Bootcamp<br>Completed in January 2023</p><br><h4 class="educationItem">Basic Fire Fighting</h4><p>Online Course<br>Completed in 2021</p><br><h4 class="educationItem">Pearson High School</h4><p>Summerstrand, Port Elizabeth, South Africa<br>2015 - 2019</p></div><!-- middle column --><div class="col-md-4 skills"><h3 class="skillsHeading"><i class="fa-solid fa-code"></i> Skills & Competencies</h3><ul class="skillsItem"><li class="slide-left"><iconify-icon icon="skill-icons:html" class="skill-icon"></iconify-icon>HTML</li><li class="slide-left"><iconify-icon icon="skill-icons:css" class="skill-icon"></iconify-icon>CSS</li><li class="slide-left"><iconify-icon icon="skill-icons:javascript" class="skill-icon"></iconify-icon>JavaScript</li><li class="slide-left"><iconify-icon icon="skill-icons:react-dark" class="skill-icon"></iconify-icon>React</li><li class="slide-left"><iconify-icon icon="skill-icons:expressjs-light" class="skill-icon"></iconify-icon>Express.js</li><li class="slide-left"><iconify-icon icon="logos:nodejs-icon-alt" class="skill-icon"></iconify-icon>Node.js</li><li class="slide-left"><iconify-icon icon="skill-icons:mongodb" class="skill-icon"></iconify-icon>MongoDB</li><li class="slide-left"><iconify-icon icon="logos:python" class="skill-icon"></iconify-icon>Python</li><li class="slide-left"><i class="fa-solid fa-database" class="skill-icon"></i> SQL</li><li class="slide-right"><iconify-icon icon="skill-icons:git" class="skill-icon"></iconify-icon>Git</li><li class="slide-right"><iconify-icon icon="teenyicons:nextjs-solid" class="skill-icon"></iconify-icon>Next.js</li><li class="slide-right"><iconify-icon icon="skill-icons:bootstrap" class="skill-icon"></iconify-icon>Bootstrap</li><li class="slide-right"><iconify-icon icon="skill-icons:materialui-dark" class="skill-icon"></iconify-icon>Material UI</li><li class="slide-right"><iconify-icon icon="skill-icons:figma-dark" class="skill-icon"></iconify-icon>Figma</li><li class="slide-right"><iconify-icon icon="vscode-icons:file-type-drawio" class="skill-icon"></iconify-icon>Draw.io</li><li class="slide-right">Proactive thinking</li><li class="slide-right">Effective communication</li><li class="slide-right">Problem solving</li></ul></div><!-- right column --><div class="col-md-4 experience"><h3 class="experienceHeading">Experience</h3><h4 class="experienceItem">Coding Mentor &<br>Code Reviewer</h4><p class=""><a href="https://www.hyperiondev.com/" target="_blank" class="hyperionDevLink">HyperionDev</a><br>March 2023 - Present</p><br><h4 class="experienceItem">Merchandiser</h4><p><a href="https://www.buildit.co.za/" target="_blank" class="buildItLink">Build It</a><br>March 2020 - June 2021</p></div></div></main></div><!-- Deferred non-critical scripts --><script src="https://code.iconify.design/iconify-icon/1.0.7/iconify-icon.min.js" defer></script><script src="./js/dark-mode.js" defer></script><script src="./js/on-scroll-fade.js" defer></script></body></html><!--
references:
https://getbootstrap.com/
https://iconify.design/
https://fontawesome.com/v5/search
-->