Reformat html and css files
This commit is contained in:
parent
7da858fea7
commit
b56415f2bb
709
src/index.html
709
src/index.html
@ -1,346 +1,371 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="icon" type="image/x-icon" href="pictures/thedeer.ico">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Ethan's Portfolio</title>
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<div class="header">
|
||||
<div class="profile-name">
|
||||
<img src="./pictures/thedeer.ico" alt="Deer Profile Picture" class="profile-picture">
|
||||
<h1>Ethan Cook</h1>
|
||||
</div>
|
||||
<div class="social-media">
|
||||
<a href="mailto:ecook2489@gmail.com" target="_blank">
|
||||
<img src="./pictures/gmail.svg" alt="gmail logo">
|
||||
</a>
|
||||
<a href="https://www.linkedin.com/in/ethan-cook-76b9b81a5/" target="_blank">
|
||||
<img src="./pictures/linkedin.svg" alt="linkedin logo">
|
||||
</a>
|
||||
<a href="https://git.thingsnstuff.xyz/ethanglide" target="_blank">
|
||||
<img src="./pictures/git.svg" alt="git logo">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<head>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="icon" type="image/x-icon" href="pictures/thedeer.ico">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap"
|
||||
rel="stylesheet">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Ethan's Portfolio</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<main>
|
||||
<div class="header">
|
||||
<div class="profile-name">
|
||||
<img src="./pictures/thedeer.ico" alt="Deer Profile Picture" class="profile-picture">
|
||||
<h1>Ethan Cook</h1>
|
||||
</div>
|
||||
<div class="social-media">
|
||||
<a href="mailto:ecook2489@gmail.com" target="_blank">
|
||||
<img src="./pictures/gmail.svg" alt="gmail logo">
|
||||
</a>
|
||||
<a href="https://www.linkedin.com/in/ethan-cook-76b9b81a5/" target="_blank">
|
||||
<img src="./pictures/linkedin.svg" alt="linkedin logo">
|
||||
</a>
|
||||
<a href="https://git.thingsnstuff.xyz/ethanglide" target="_blank">
|
||||
<img src="./pictures/git.svg" alt="git logo">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div>
|
||||
<div class="side-by-side">
|
||||
<div class="section">
|
||||
<h2>About</h2>
|
||||
<p>I am a 4th year Computer Science student at University of Toronto Scarborough with a focus on Software
|
||||
Development.</p>
|
||||
<p>Passionate in developing scalable, high quality web and games software with readable, optimized, and well
|
||||
tested code.</p>
|
||||
<p>In my spare time, my main hobby is music. I play Trombone and Piano, and enjoy most to play jazz music.
|
||||
</p>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h2>Skills</h2>
|
||||
<ul>
|
||||
<li style="margin: 0;">
|
||||
6+ years experience programming in C/C++, C#, Java, Python, HTML/CSS, JavaScript
|
||||
</li>
|
||||
<li>
|
||||
Solid Full-Stack Web Development experience with React/Next.js frontend, Express.js backend API
|
||||
</li>
|
||||
<li>
|
||||
Experienced in SQL (PostgreSQL, SQLite) and NoSQL (MongoDB, Firebase Realtime DB) databases
|
||||
</li>
|
||||
<li>
|
||||
Strong DevOps skills with AWS: API Gateway, Lambda, EC2, S3, CodePipeline
|
||||
</li>
|
||||
<li>
|
||||
Effective communication for working in collaborative groups
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h2>Work Experience</h2>
|
||||
<div class="experience">
|
||||
<div class="advertience-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/adverience.png" alt="adverience logo">
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div>
|
||||
<div class="side-by-side">
|
||||
<div class="section">
|
||||
<h2>About</h2>
|
||||
<p>I am a 4th year Computer Science student at University of Toronto Scarborough with a focus on Software Development.</p>
|
||||
<p>Passionate in developing scalable, high quality web and games software with readable, optimized, and well tested code.</p>
|
||||
<p>In my spare time, my main hobby is music. I play Trombone and Piano, and enjoy most to play jazz music.</p>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h2>Skills</h2>
|
||||
<ul>
|
||||
<li style="margin: 0;">
|
||||
6+ years experience programming in C/C++, C#, Java, Python, HTML/CSS, JavaScript
|
||||
</li>
|
||||
<li>
|
||||
Solid Full-Stack Web Development experience with React/Next.js frontend, Express.js backend API
|
||||
</li>
|
||||
<li>
|
||||
Experienced in SQL (PostgreSQL, SQLite) and NoSQL (MongoDB, Firebase Realtime DB) databases
|
||||
</li>
|
||||
<li>
|
||||
Strong DevOps skills with AWS: API Gateway, Lambda, EC2, S3, CodePipeline
|
||||
</li>
|
||||
<li>
|
||||
Effective communication for working in collaborative groups
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h2>Work Experience</h2>
|
||||
<div class="experience">
|
||||
<div class="advertience-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/adverience.png" alt="adverience logo">
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2>advertience Inc. | Ad Analytics Developer</h2>
|
||||
<p>05/2023 - 12/2023</p>
|
||||
</div>
|
||||
<p>Toronto, ON.</p>
|
||||
<ul>
|
||||
<li>
|
||||
Implemented analytics tracking via Google Tag Manager and gtag.js on client's websites, resulting in a 30%
|
||||
improvement in data accuracy, empowering clients to execute data-driven marketing strategies
|
||||
</li>
|
||||
<li>
|
||||
Developed a unique attribution system to differentiate my agency from the competition, which led to the
|
||||
agency taking on several new clients, beating last year's profit records by 10%
|
||||
</li>
|
||||
<li>
|
||||
Created a full-stack CRM web application to help our nonprofit clients leverage their geographical analytics, resulting in an over 25% increase in donation conversions for our clients
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="square-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/jumpplus.jpeg" alt="jump+ logo">
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2>Jump+ | Sales Associate</h2>
|
||||
<p>05/2021 - 01/2023</p>
|
||||
</div>
|
||||
<p>Hamilton, ON.</p>
|
||||
<ul>
|
||||
<li>
|
||||
Collaborated within a sales team to achieve a 20% increase in Apple product sales, leveraging effective
|
||||
communication and product knowledge to drive customer engagement and satisfaction
|
||||
</li>
|
||||
<li>
|
||||
Orchestrated seamless store operations by coordinating with team members to assign tasks and optimize workflow on the sales floor, contributing to a 15% boost in overall store efficiency
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h2>Projects</h2>
|
||||
<div class="experience">
|
||||
<div class="rectangular-wrapper">
|
||||
<div>
|
||||
<iframe
|
||||
src="https://www.youtube.com/embed/HS9tsFQpMUA?si=8mIM_T5hKvkPNSYb&controls=0&autoplay=1&mute=1&loop=1&playlist=HS9tsFQpMUA"
|
||||
title="YouTube video player" frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2> <a href="https://store.steampowered.com/app/2117410/Cosmotica/" target="_blank">Cosmotica</a> | Unity 3D Game</h2>
|
||||
<p>01/2022 - 09/2022</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Led a team of 6 to program, design, compose, model, and market a full video game
|
||||
</li>
|
||||
<li>
|
||||
Programmed a game written in C# for the Unity game engine, with a focus on readable and scalable code
|
||||
and systems design for future additions and bug fixes
|
||||
</li>
|
||||
<li>
|
||||
Designed levels and UI while applying user feedback to get the best user experience
|
||||
</li>
|
||||
<li>
|
||||
Published the finished product on Steam, the world's largest online game storefront
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="rectangular-wrapper">
|
||||
<div>
|
||||
<iframe
|
||||
src="https://www.youtube.com/embed/rsZMfWVyc90?si=jERn5iKCQvnH3Y_g&controls=0&autoplay=1&mute=1&loop=1&playlist=rsZMfWVyc90"
|
||||
title="YouTube video player" frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2><a href="https://ethanglide.itch.io/solitude-echoes" target="_blank">Solitude Echoes</a> | Unity 2D Game</h2>
|
||||
<p>12/2023</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>Developed in 9 days for the Unity Developer Community Game Jam #28, with the theme "Silence"</li>
|
||||
<li>Puzzle/Horror game where you wake up in a decrepid dungeon and have to find your way out, while being stalked by the monsters within</li>
|
||||
<li>Led an international team of 5 people, with programmers, artists, musicians, and level designers</li>
|
||||
<li>Game is playable completely within the browser</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="rectangular-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/grantors.png" alt="grantors web app dashboard">
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2><a href="https://github.com/GlassesNoGlasses/c01w24-project-grantors" target="_blank">Grantors</a> | React Web App</h2>
|
||||
<p>02/2024 - 04/2024</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Worked in a team of 7 to create an accessibility-focused grant platform
|
||||
</li>
|
||||
<li>
|
||||
Developed with industry standard stack of React frontend, Express.js backend, and MongoDB database
|
||||
</li>
|
||||
<li>
|
||||
Web Content Accessibility Guidelines (WCAG) compliant, with a focus on user experience and accessibility for grantors and applicants alike
|
||||
</li>
|
||||
<li>
|
||||
Automated CI/CD with Jest, GitHub Actions, and Docker
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="course-planner-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/courseplanner.jpg" alt="course planner demo">
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2>UTSC Course Planner | Android App</h2>
|
||||
<p>11/2022 - 12/2022</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Collaborated with a team of 5 to develop an android app to help students plan their university courses
|
||||
</li>
|
||||
<li>
|
||||
Used Google's Firebase Realtime Database to store course and user data and authenticate users
|
||||
</li>
|
||||
<li>
|
||||
Followed industry best practices using agile methodologies (scrum)
|
||||
</li>
|
||||
<li>
|
||||
Received a grade of 95 though good planning, teamwork, and execution
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="rectangular-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/telepuzzle.png" alt="telepuzzle demo">
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2> <a href="https://ethanglide.itch.io/telepuzzle1" target="_blank">Telepuzzle</a> | Unity 3D Game</h2>
|
||||
<p>12/2022</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Developed in 4 days for the Unity Developer Community Game Jam #16, with the theme "Teleportation"
|
||||
</li>
|
||||
<li>
|
||||
Puzzle game where your goal is to get to the end of the level by manipulating the objects around you with your teleportation gun
|
||||
</li>
|
||||
<li>
|
||||
Worked together with a 3D artist to create the game with fun gameplay and a unique art style
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="square-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/cpp-console-game.png" alt="cpp-console-game demo">
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2> <a href="https://git.thingsnstuff.xyz/ethanglide/cpp-console-game" target="_blank">cpp-console-game</a> | C++ Multiplayer Terminal Game</h2>
|
||||
<p>07/2024</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Developed as a side project to learn the C++ programming language, CMake build automation system, and RPC basics
|
||||
</li>
|
||||
<li>
|
||||
Simple terminal-based game where you can move around a map and see other players moving in real-time
|
||||
</li>
|
||||
<li>
|
||||
Uses a custom RPC library to communicate between the server and clients, which uses TCP sockets
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="rectangular-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/rhdc.png" alt="Romhacking.com home page">
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2> <a href="https://romhacking.com/" target="_blank">Romhacking.com</a> | Full-Stack Web Development</h2>
|
||||
<p>08/2024 - Present</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Joined group of developers to add features to an existing production-level project
|
||||
</li>
|
||||
<li>
|
||||
Navigated the large codebases, frontend and backend, and learned the new technologies required to make extensions to the functionality
|
||||
</li>
|
||||
<li>
|
||||
Worked cloesly with maintainers to make sure code additions were consistent in quality and style with the rest of the codebase
|
||||
</li>
|
||||
<li>
|
||||
Added a live-updating activity feed to the home page to make the site more lively
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h2>Programming Languages, Tools, and Frameworks</h2>
|
||||
<div style="display: flex; flex-wrap: wrap; gap: 2rem; justify-content: space-between; padding-right: 2rem;">
|
||||
<div class="languages-images">
|
||||
<div>
|
||||
<img src="./pictures/c.png" alt="c logo">
|
||||
<img src="./pictures/csharp.png" alt="c# logo">
|
||||
<img src="./pictures/python.webp" alt="python logo">
|
||||
<img src="./pictures/java.png" alt="java logo">
|
||||
<img src="./pictures/htmlcss.png" alt="html and css logo">
|
||||
<img src="./pictures/javascript.png" alt="javascript logo" style="overflow: hidden; border-radius: 0.5rem;">
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; flex-grow: 1; flex-wrap: wrap; justify-content: space-between;">
|
||||
<ul class="large-list">
|
||||
<li>C/C++</li>
|
||||
<li>C#</li>
|
||||
<li>Python</li>
|
||||
<li>Java</li>
|
||||
<li>HTML & CSS</li>
|
||||
<li>Javascript</li>
|
||||
</ul>
|
||||
<ul class="large-list">
|
||||
<li>React</li>
|
||||
<li>Next.js</li>
|
||||
<li>Express.js</li>
|
||||
<li>Firebase</li>
|
||||
<li>SQL</li>
|
||||
<li>Unity</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="languages-images">
|
||||
<div>
|
||||
<img src="./pictures/react.png" alt="react logo">
|
||||
<img src="./pictures/nextjs.svg" alt="next.js logo">
|
||||
<img src="./pictures/express.png" alt="express.js logo">
|
||||
<img src="./pictures/firebase.png" alt="firebase logo">
|
||||
<img src="./pictures/sql.svg" alt="sql logo">
|
||||
<img src="./pictures/unity.png" alt="unity logo">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2>advertience Inc. | Ad Analytics Developer</h2>
|
||||
<p>05/2023 - 12/2023</p>
|
||||
</div>
|
||||
<p>Toronto, ON.</p>
|
||||
<ul>
|
||||
<li>
|
||||
Implemented analytics tracking via Google Tag Manager and gtag.js on client's websites, resulting in a
|
||||
30%
|
||||
improvement in data accuracy, empowering clients to execute data-driven marketing strategies
|
||||
</li>
|
||||
<li>
|
||||
Developed a unique attribution system to differentiate my agency from the competition, which led to
|
||||
the
|
||||
agency taking on several new clients, beating last year's profit records by 10%
|
||||
</li>
|
||||
<li>
|
||||
Created a full-stack CRM web application to help our nonprofit clients leverage their geographical
|
||||
analytics, resulting in an over 25% increase in donation conversions for our clients
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="square-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/jumpplus.jpeg" alt="jump+ logo">
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2>Jump+ | Sales Associate</h2>
|
||||
<p>05/2021 - 01/2023</p>
|
||||
</div>
|
||||
<p>Hamilton, ON.</p>
|
||||
<ul>
|
||||
<li>
|
||||
Collaborated within a sales team to achieve a 20% increase in Apple product sales, leveraging
|
||||
effective communication and product knowledge to drive customer engagement and satisfaction
|
||||
</li>
|
||||
<li>
|
||||
Orchestrated seamless store operations by coordinating with team members to assign tasks and optimize
|
||||
workflow on the sales floor, contributing to a 15% boost in overall store efficiency
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h2>Projects</h2>
|
||||
<div class="experience">
|
||||
<div class="rectangular-wrapper">
|
||||
<div>
|
||||
<iframe
|
||||
src="https://www.youtube.com/embed/HS9tsFQpMUA?si=8mIM_T5hKvkPNSYb&controls=0&autoplay=1&mute=1&loop=1&playlist=HS9tsFQpMUA"
|
||||
title="YouTube video player" frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2> <a href="https://store.steampowered.com/app/2117410/Cosmotica/" target="_blank">Cosmotica</a> |
|
||||
Unity 3D Game</h2>
|
||||
<p>01/2022 - 09/2022</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Led a team of 6 to program, design, compose, model, and market a full video game
|
||||
</li>
|
||||
<li>
|
||||
Programmed a game written in C# for the Unity game engine, with a focus on readable and scalable code
|
||||
and systems design for future additions and bug fixes
|
||||
</li>
|
||||
<li>
|
||||
Designed levels and UI while applying user feedback to get the best user experience
|
||||
</li>
|
||||
<li>
|
||||
Published the finished product on Steam, the world's largest online game storefront
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="rectangular-wrapper">
|
||||
<div>
|
||||
<iframe
|
||||
src="https://www.youtube.com/embed/rsZMfWVyc90?si=jERn5iKCQvnH3Y_g&controls=0&autoplay=1&mute=1&loop=1&playlist=rsZMfWVyc90"
|
||||
title="YouTube video player" frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2><a href="https://ethanglide.itch.io/solitude-echoes" target="_blank">Solitude Echoes</a> | Unity 2D
|
||||
Game</h2>
|
||||
<p>12/2023</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>Developed in 9 days for the Unity Developer Community Game Jam #28, with the theme "Silence"</li>
|
||||
<li>Puzzle/Horror game where you wake up in a decrepid dungeon and have to find your way out, while
|
||||
being stalked by the monsters within</li>
|
||||
<li>Led an international team of 5 people, with programmers, artists, musicians, and level designers
|
||||
</li>
|
||||
<li>Game is playable completely within the browser</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="rectangular-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/grantors.png" alt="grantors web app dashboard">
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2><a href="https://github.com/GlassesNoGlasses/c01w24-project-grantors" target="_blank">Grantors</a> |
|
||||
React Web App</h2>
|
||||
<p>02/2024 - 04/2024</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Worked in a team of 7 to create an accessibility-focused grant platform
|
||||
</li>
|
||||
<li>
|
||||
Developed with industry standard stack of React frontend, Express.js backend, and MongoDB database
|
||||
</li>
|
||||
<li>
|
||||
Web Content Accessibility Guidelines (WCAG) compliant, with a focus on user experience and
|
||||
accessibility for grantors and applicants alike
|
||||
</li>
|
||||
<li>
|
||||
Automated CI/CD with Jest, GitHub Actions, and Docker
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="course-planner-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/courseplanner.jpg" alt="course planner demo">
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2>UTSC Course Planner | Android App</h2>
|
||||
<p>11/2022 - 12/2022</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Collaborated with a team of 5 to develop an android app to help students plan their university courses
|
||||
</li>
|
||||
<li>
|
||||
Used Google's Firebase Realtime Database to store course and user data and authenticate users
|
||||
</li>
|
||||
<li>
|
||||
Followed industry best practices using agile methodologies (scrum)
|
||||
</li>
|
||||
<li>
|
||||
Received a grade of 95 though good planning, teamwork, and execution
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="rectangular-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/telepuzzle.png" alt="telepuzzle demo">
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2> <a href="https://ethanglide.itch.io/telepuzzle1" target="_blank">Telepuzzle</a> | Unity 3D Game
|
||||
</h2>
|
||||
<p>12/2022</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Developed in 4 days for the Unity Developer Community Game Jam #16, with the theme "Teleportation"
|
||||
</li>
|
||||
<li>
|
||||
Puzzle game where your goal is to get to the end of the level by manipulating the objects around you
|
||||
with your teleportation gun
|
||||
</li>
|
||||
<li>
|
||||
Worked together with a 3D artist to create the game with fun gameplay and a unique art style
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="square-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/cpp-console-game.png" alt="cpp-console-game demo">
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2> <a href="https://git.thingsnstuff.xyz/ethanglide/cpp-console-game"
|
||||
target="_blank">cpp-console-game</a> | C++ Multiplayer Terminal Game</h2>
|
||||
<p>07/2024</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Developed as a side project to learn the C++ programming language, CMake build automation system, and
|
||||
RPC basics
|
||||
</li>
|
||||
<li>
|
||||
Simple terminal-based game where you can move around a map and see other players moving in real-time
|
||||
</li>
|
||||
<li>
|
||||
Uses a custom RPC library to communicate between the server and clients, which uses TCP sockets
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience">
|
||||
<div class="rectangular-wrapper">
|
||||
<div>
|
||||
<img src="./pictures/rhdc.png" alt="Romhacking.com home page">
|
||||
</div>
|
||||
</div>
|
||||
<div class="experience-text">
|
||||
<div class="experience-header">
|
||||
<h2> <a href="https://romhacking.com/" target="_blank">Romhacking.com</a> | Full-Stack Web Development
|
||||
</h2>
|
||||
<p>08/2024 - Present</p>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Joined group of developers to add features to an existing production-level project
|
||||
</li>
|
||||
<li>
|
||||
Navigated the large codebases, frontend and backend, and learned the new technologies required to make
|
||||
extensions to the functionality
|
||||
</li>
|
||||
<li>
|
||||
Worked cloesly with maintainers to make sure code additions were consistent in quality and style with
|
||||
the rest of the codebase
|
||||
</li>
|
||||
<li>
|
||||
Added a live-updating activity feed to the home page to make the site more lively
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h2>Programming Languages, Tools, and Frameworks</h2>
|
||||
<div style="display: flex; flex-wrap: wrap; gap: 2rem; justify-content: space-between; padding-right: 2rem;">
|
||||
<div class="languages-images">
|
||||
<div>
|
||||
<img src="./pictures/c.png" alt="c logo">
|
||||
<img src="./pictures/csharp.png" alt="c# logo">
|
||||
<img src="./pictures/python.webp" alt="python logo">
|
||||
<img src="./pictures/java.png" alt="java logo">
|
||||
<img src="./pictures/htmlcss.png" alt="html and css logo">
|
||||
<img src="./pictures/javascript.png" alt="javascript logo"
|
||||
style="overflow: hidden; border-radius: 0.5rem;">
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; flex-grow: 1; flex-wrap: wrap; justify-content: space-between;">
|
||||
<ul class="large-list">
|
||||
<li>C/C++</li>
|
||||
<li>C#</li>
|
||||
<li>Python</li>
|
||||
<li>Java</li>
|
||||
<li>HTML & CSS</li>
|
||||
<li>Javascript</li>
|
||||
</ul>
|
||||
<ul class="large-list">
|
||||
<li>React</li>
|
||||
<li>Next.js</li>
|
||||
<li>Express.js</li>
|
||||
<li>Firebase</li>
|
||||
<li>SQL</li>
|
||||
<li>Unity</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="languages-images">
|
||||
<div>
|
||||
<img src="./pictures/react.png" alt="react logo">
|
||||
<img src="./pictures/nextjs.svg" alt="next.js logo">
|
||||
<img src="./pictures/express.png" alt="express.js logo">
|
||||
<img src="./pictures/firebase.png" alt="firebase logo">
|
||||
<img src="./pictures/sql.svg" alt="sql logo">
|
||||
<img src="./pictures/unity.png" alt="unity logo">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</body>
|
||||
|
||||
</html>
|
@ -10,7 +10,14 @@ main {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
p, h1, h2, h3, h4, h5, h6, li {
|
||||
p,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
li {
|
||||
color: #fff;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 500;
|
||||
@ -18,7 +25,8 @@ p, h1, h2, h3, h4, h5, h6, li {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
p, li {
|
||||
p,
|
||||
li {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
@ -101,7 +109,7 @@ div.content {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
div.content > div {
|
||||
div.content>div {
|
||||
display: flex;
|
||||
width: 70%;
|
||||
flex-flow: column;
|
||||
@ -178,13 +186,13 @@ div.advertience-wrapper {
|
||||
max-width: 7rem;
|
||||
}
|
||||
|
||||
div.advertience-wrapper > div {
|
||||
div.advertience-wrapper>div {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding-bottom: 140%;
|
||||
}
|
||||
|
||||
div.advertience-wrapper > div > img {
|
||||
div.advertience-wrapper>div>img {
|
||||
position: absolute;
|
||||
top: -0.6rem;
|
||||
left: -0.6rem;
|
||||
@ -202,13 +210,13 @@ div.square-wrapper {
|
||||
max-width: 10rem;
|
||||
}
|
||||
|
||||
div.square-wrapper > div {
|
||||
div.square-wrapper>div {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding-bottom: 100%;
|
||||
}
|
||||
|
||||
div.square-wrapper > div > img {
|
||||
div.square-wrapper>div>img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
@ -224,13 +232,14 @@ div.rectangular-wrapper {
|
||||
max-width: 20rem;
|
||||
}
|
||||
|
||||
div.rectangular-wrapper > div {
|
||||
div.rectangular-wrapper>div {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding-bottom: 56.25%;
|
||||
}
|
||||
|
||||
div.rectangular-wrapper > div > iframe, div.rectangular-wrapper > div > img {
|
||||
div.rectangular-wrapper>div>iframe,
|
||||
div.rectangular-wrapper>div>img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
@ -246,13 +255,13 @@ div.course-planner-wrapper {
|
||||
min-width: 10rem;
|
||||
}
|
||||
|
||||
div.course-planner-wrapper > div {
|
||||
div.course-planner-wrapper>div {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding-bottom: 197%;
|
||||
}
|
||||
|
||||
div.course-planner-wrapper > div > img {
|
||||
div.course-planner-wrapper>div>img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
@ -327,7 +336,9 @@ div.experience-header {
|
||||
grid-template-columns: repeat(3, min(33%));
|
||||
}
|
||||
|
||||
div.rectangular-wrapper, div.square-wrapper, div.advertience-wrapper {
|
||||
div.rectangular-wrapper,
|
||||
div.square-wrapper,
|
||||
div.advertience-wrapper {
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
}
|
||||
@ -342,7 +353,7 @@ div.experience-header {
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
div.content > div {
|
||||
div.content>div {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user