Compare commits

...

6 Commits

Author SHA1 Message Date
17586ae648 Add cscc43 project 2025-04-22 12:13:53 -04:00
ce7018251a Add d-ticketmaster project 2025-04-22 11:53:08 -04:00
c2e06b87bc Remove unneeded images 2025-04-22 11:29:38 -04:00
f6290b28b1 Add rust project
Also reorder projects
2024-12-27 21:12:05 -05:00
542b353f27 Add smartli experience
Also change some sizes of the top menu on mobile
2024-12-05 14:20:02 -05:00
b56415f2bb Reformat html and css files 2024-12-05 13:53:08 -05:00
11 changed files with 531 additions and 365 deletions

View File

@ -1,14 +1,17 @@
<!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">
<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">
@ -33,15 +36,18 @@
<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>
<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
7+ years experience programming in C/C++, C#, Java, Python, HTML/CSS, JavaScript, Rust
</li>
<li>
Solid Full-Stack Web Development experience with React/Next.js frontend, Express.js backend API
@ -60,6 +66,34 @@
</div>
<div class="section">
<h2>Work Experience</h2>
<div class="experience">
<div class="smartli-wrapper">
<div>
<img src="./pictures/smartli.png" alt="smartli logo">
</div>
</div>
<div class="experience-text">
<div class="experience-header">
<h2>SmartLi Inc. | Analytics Developer</h2>
<p>05/2024 - Present</p>
</div>
<p>Toronto, ON.</p>
<ul>
<li>
Configured and maintained analytics tracking on client's websites through Google Tag Manager
for Google Analytics, Facebook Pixel, StackAdapt, Microsoft Clarity, and more
</li>
<li>
Implemented custom tracking solutions on a per-client basis to track specific user interactions
on custom web applications, resulting in a 20% increase in data accuracy
</li>
<li>
Developed a full-stack web application to automate lead generation with automatic reporting and
email notifications, resulting in a 50% increase in team efficiency for lead generation
</li>
</ul>
</div>
</div>
<div class="experience">
<div class="advertience-wrapper">
<div>
@ -74,15 +108,16 @@
<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
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%
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
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>
@ -101,11 +136,12 @@ agency taking on several new clients, beating last year's profit records by 10%
<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
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
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>
@ -124,7 +160,8 @@ communication and product knowledge to drive customer engagement and satisfactio
</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>
<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>
@ -155,17 +192,79 @@ and systems design for future additions and bug fixes
</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>
<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>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/cscc43-project.png" alt="D-Ticketmaster demo">
</div>
</div>
<div class="experience-text">
<div class="experience-header">
<h2><a href="https://github.com/ethanglide/cscc43-project" target="_blank">Social Investment
Platform</a> |
Full-Stack Web Application</h2>
<p>03/2025-04/2025</p>
</div>
<ul>
<li>
Social platform where users can manage stock portfolios, analyze market trends, and share investment
strategies with friends
</li>
<li>
Developed as a project for my university's database course, with a focus on smart schema design and
efficient queries
</li>
<li>
Built with React frontend, Express.js backend, and PostgreSQL database
</li>
</ul>
</div>
</div>
<div class="experience">
<div class="rectangular-wrapper">
<div>
<img src="./pictures/dticketmaster.png" alt="D-Ticketmaster demo">
</div>
</div>
<div class="experience-text">
<div class="experience-header">
<h2>D-Ticketmaster | Web3 Blockchain dApp</h2>
<p>03/2025</p>
</div>
<ul>
<li>
Decentralized ticket marketplace powered by the Ethereum blockchain, allowing users to buy, sell, and
trade tickets securely and transparently
</li>
<li>
Developed for my university's blockchain course for learning about smart contracts, wallet
connections, and decentralized applications
</li>
<li>
Ticket purchases are done using the platform's custom ERC-20 tokens, and tickets themselves are
ERC-721 NFTs with royalties built-in so that the original seller/artist gets a cut of all resales
</li>
<li>
Built with React frontend, Solidity smart contracts, and <a href="https://viem.sh/"
target="_blank">viem</a> for interacting with the Ethereum blockchain
</li>
</ul>
</div>
</div>
<div class="experience">
<div class="rectangular-wrapper">
<div>
@ -174,7 +273,8 @@ and systems design for future additions and bug fixes
</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>
<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>
@ -185,7 +285,8 @@ and systems design for future additions and bug fixes
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
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
@ -193,6 +294,91 @@ and systems design for future additions and bug fixes
</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 class="experience">
<div class="rectangular-wrapper">
<div>
<img src="./pictures/groq-model-comparison.png" alt="Groq Model Comparison demo">
</div>
</div>
<div class="experience-text">
<div class="experience-header">
<h2> <a href="https://git.thingsnstuff.xyz/ethanglide/groq-model-comparison" target="_blank">Groq Model
Comparison</a> | Rust Desktop App
</h2>
<p>12/2024</p>
</div>
<ul>
<li>
Desktop application for easily comparing LLM responses and response times to find the one
best suited for your project
</li>
<li>
Developed as a side project to learn the Rust programming language after becoming interested in memory
safety from a cybersecurity course
</li>
<li>
Uses the <code>egui</code> library for the GUI, <code>reqwest</code> for making HTTP requests, and
<code>tokio</code> for concurrency
</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="course-planner-wrapper">
<div>
@ -220,30 +406,6 @@ and systems design for future additions and bug fixes
</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>
@ -252,12 +414,14 @@ and systems design for future additions and bug fixes
</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>
<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
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
@ -268,33 +432,6 @@ and systems design for future additions and bug fixes
</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>
@ -306,7 +443,8 @@ and systems design for future additions and bug fixes
<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;">
<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;">
@ -343,4 +481,5 @@ and systems design for future additions and bug fixes
</div>
</main>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 110 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 161 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 37 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 47 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 361 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 99 KiB

BIN
src/pictures/smartli.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 39 KiB

View File

@ -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;
}
@ -118,7 +126,7 @@ div.side-by-side {
div.section {
display: flex;
flex-flow: column;
gap: 1.5rem;
gap: 1.7rem;
padding: 2rem;
border-radius: 0.5rem;
border: #151920 0.15rem solid;
@ -172,6 +180,27 @@ li li {
font-size: 90%;
}
div.smartli-wrapper {
width: 20%;
max-width: 10rem;
}
div.smartli-wrapper>div {
position: relative;
width: 100%;
padding-bottom: 25%;
}
div.smartli-wrapper>div>img {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
height: 100%;
width: 100%;
}
div.advertience-wrapper {
width: 20%;
padding: 1rem;
@ -230,7 +259,8 @@ div.rectangular-wrapper > div {
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;
@ -297,7 +327,7 @@ div.experience-header {
}
div.profile-name h1 {
font-size: 1.1rem;
font-size: 1.2rem;
}
div.social-media {
@ -305,14 +335,8 @@ div.experience-header {
}
div.social-media a img {
width: 1.5rem;
height: 1.5rem;
}
div.social-media a img[src="./Pictures/gmail.png"] {
width: 2.5rem;
height: 2rem;
border-radius: 0.2rem;
width: 1.75rem;
height: 1.75rem;
}
div.experience {
@ -327,7 +351,10 @@ 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,
div.smartli-wrapper {
width: 100%;
min-width: 0;
}