Resume now can print from PDF, and added cover letter.
This commit is contained in:
parent
260251ffc3
commit
c8fa3b2988
BIN
cover/favicon.ico
Executable file
BIN
cover/favicon.ico
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
52
cover/index.html
Executable file
52
cover/index.html
Executable file
@ -0,0 +1,52 @@
|
||||
<!DOCTYPE html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
||||
<title>Kenneth Jao</title>
|
||||
<link rel="icon" href="./favicon.ico?v=2">
|
||||
<link rel="stylesheet" href="./main.css?v=2">
|
||||
<link href="https://fonts.googleapis.com/css?family=Josefin+Sans:400,700|Dosis:300,700" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<div id="sidebar">
|
||||
<div class="topCont">
|
||||
</div>
|
||||
<div class="midCont">
|
||||
</div>
|
||||
</div>
|
||||
<div id="mainCont">
|
||||
<div class="topCont">
|
||||
</div>
|
||||
<div class="midCont">
|
||||
<p>
|
||||
<br><br><br><br>
|
||||
To whom it may concern,<br><br>
|
||||
My name is Kenneth Jao. My interests and expertise lie in both software and hardware design, supported by all relevant underlying mathematics. With experience in both front-end user interface design, implementing optimized and secure back-end algorithms, as well as an understanding of Unix system administration, I believe I would be a valuable asset to your software development team.
|
||||
<br><br>
|
||||
In my 6 years of programming experience, I have worked with several others on projects. We created a web application, Hourglass, to help students organize schoolwork collectively and more efficiently. Besides programming itself, I have taken the role of a project leader. I organize and structure the environment and requirements, to keep the workflow as smooth as possible. By having experienced the importance of standardization and documentation for projects, I believe I will easily adapt to far larger projects in the field, no matter what your team may be working on.
|
||||
<br><br>
|
||||
With regards to programming, I also have the following skills:
|
||||
</p>
|
||||
<ul>
|
||||
<li>Abstraction for object oriented programming</li>
|
||||
<li>Developing algorithms for mathematical concepts</li>
|
||||
<li>Understanding of network structures</li>
|
||||
<li>Data analysis and aggregation through scripting and scraping</li>
|
||||
</ul>
|
||||
<br>
|
||||
<p>
|
||||
Most importantly, I am confident in my ability to work with others in a high-paced environment, and will be a positive impact in the work that is done. Thank you for your time for reviewing my application among hundreds of others. I look forward to your response.
|
||||
<br><br>
|
||||
|
||||
Sincerely,<br>
|
||||
Kenneth Jao
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="./main.js"></script>
|
||||
</html>
|
||||
206
cover/main.css
Executable file
206
cover/main.css
Executable file
@ -0,0 +1,206 @@
|
||||
html, body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: 'Josefin Sans', sans-serif;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: 'Josefin Sans', sans-serif;
|
||||
font-weight: 400;
|
||||
letter-spacing: 4px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-family: 'Dosis', sans-serif;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
p, li {
|
||||
font-family: 'Dosis', sans-serif;
|
||||
font-weight: 300;
|
||||
font-size: 140%;
|
||||
margin: 0 10% 0 10%;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style-type: circle;
|
||||
}
|
||||
|
||||
#wrapper {
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
display: grid;
|
||||
grid-template-columns: 3fr 7fr;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#sidebar {
|
||||
height: 100%;
|
||||
grid-column: 1;
|
||||
grid-row: 1;
|
||||
background-color: #1F1F1F;
|
||||
}
|
||||
|
||||
#mainCont {
|
||||
height: 100%;
|
||||
grid-column: 2;
|
||||
grid-row: 1;
|
||||
background-color: #E5E5E5;
|
||||
}
|
||||
|
||||
.topCont {
|
||||
width: 100%;
|
||||
height: 20vw;
|
||||
}
|
||||
|
||||
.midCont {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#mainCont .topCont h1 {
|
||||
padding: 13% 0 0 10%;
|
||||
font-size: 300%;
|
||||
}
|
||||
|
||||
#mainCont .topCont h2 {
|
||||
padding: 0 0 0 10%;
|
||||
font-size: 95%;
|
||||
color: #939393;
|
||||
}
|
||||
|
||||
#sidebar .midCont .subsection {
|
||||
padding: 0 0 10% 10%;
|
||||
}
|
||||
|
||||
#sidebar .midCont .subsection h2 {
|
||||
color: #E5E5E5;
|
||||
padding: 3%;
|
||||
border-bottom: 4px solid #E5E5E5;
|
||||
}
|
||||
|
||||
#sidebar .midCont .subsection .subValue {
|
||||
display: grid;
|
||||
padding: 2.5% 0 2.5% 0;
|
||||
grid-template-columns: 15fr 75fr;
|
||||
grid-template-rows: 1fr 1fr;
|
||||
}
|
||||
|
||||
#sidebar .midCont .subsection div:nth-child(2) {
|
||||
padding-top: 5%;
|
||||
}
|
||||
|
||||
#sidebar .midCont .subValue i {
|
||||
grid-column: 1;
|
||||
grid-row: 1/3;
|
||||
color: #E5E5E5;
|
||||
margin: auto;
|
||||
font-size: 120%;
|
||||
}
|
||||
|
||||
#sidebar .midCont .subValue h3:nth-child(2) {
|
||||
grid-column: 2;
|
||||
grid-row: 1;
|
||||
color: #E5E5E5;
|
||||
font-size: 90%;
|
||||
padding-left: 5%;
|
||||
}
|
||||
|
||||
#sidebar .midCont .subValue h3:nth-child(n+3) {
|
||||
grid-column: 2;
|
||||
color: #939393;
|
||||
font-size: 90%;
|
||||
padding-left: 5%;
|
||||
}
|
||||
|
||||
#mainCont .midCont {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
#mainCont .midCont .subsection {
|
||||
padding: 0 10% 2% 10%;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 9fr;
|
||||
grid-template-rows: 1fr;
|
||||
}
|
||||
|
||||
#mainCont .midCont .subsection .subCircle {
|
||||
display: grid;
|
||||
grid-column: 1;
|
||||
grid-row: 1;
|
||||
margin: auto;
|
||||
width: 4vw;
|
||||
height: 4vw;
|
||||
border: 3px solid #1F1F1F;
|
||||
border-radius: 50px
|
||||
}
|
||||
|
||||
.subCircle i {
|
||||
margin: auto;
|
||||
color: #1F1F1F;
|
||||
font-size: 120%;
|
||||
}
|
||||
|
||||
#mainCont .midCont .subsection h2 {
|
||||
color: #1F1F1F;
|
||||
padding: 3%;
|
||||
border-bottom: 4px solid #1F1F1F;
|
||||
}
|
||||
|
||||
#mainCont .midCont .subValue {
|
||||
padding: 2.5% 0 0 0;
|
||||
display: grid;
|
||||
grid-column: 2;
|
||||
grid-template-columns: 2fr 8fr;
|
||||
grid-template-rows: 1fr;
|
||||
}
|
||||
|
||||
#mainCont .midCont .subValue h3:nth-child(1) {
|
||||
grid-column: 1;
|
||||
grid-row: 1;
|
||||
color: #939393;
|
||||
}
|
||||
|
||||
#mainCont .midCont .subValue h3:nth-child(2) {
|
||||
grid-column: 2;
|
||||
font-weight: 700;
|
||||
font-style: bold;
|
||||
}
|
||||
|
||||
#mainCont .midCont .subValue h3:nth-child(3) {
|
||||
grid-column: 2;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
#mainCont .midCont .subValue h3:nth-child(4) {
|
||||
grid-column: 2;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
#mainCont .midCont .subLine {
|
||||
background-color: #1F1F1F;
|
||||
margin: auto;
|
||||
height: 100%;
|
||||
width: 4px;
|
||||
}
|
||||
|
||||
#mainCont .midCont .subLine i {
|
||||
color: #1F1F1f;
|
||||
margin: 0 auto 0 auto;
|
||||
padding: 10%;
|
||||
}
|
||||
|
||||
@media print {
|
||||
|
||||
.subsection div{ page-break-before: always; }
|
||||
}
|
||||
110
cover/main.js
Executable file
110
cover/main.js
Executable file
@ -0,0 +1,110 @@
|
||||
var titleInfo = {
|
||||
name: "Kenneth Jao",
|
||||
caption: "Engineer and Developer",
|
||||
image: null
|
||||
};
|
||||
|
||||
var sidebarInfo = [
|
||||
{
|
||||
name: "Info",
|
||||
subsections: [
|
||||
{
|
||||
name: "Name",
|
||||
value: "Kenneth Jao",
|
||||
icon: "fas fa-user"
|
||||
},
|
||||
{
|
||||
name: "Address",
|
||||
value: ["Lansing", "Michigan USA"],
|
||||
icon: "fas fa-map-marker-alt"
|
||||
},
|
||||
{
|
||||
name: "Phone",
|
||||
value: "+1-(248)-749-3439",
|
||||
icon: "fas fa-phone"
|
||||
},
|
||||
{
|
||||
name: "Email",
|
||||
value: ["kennethjao01 at gmail.com", "jaokenne at msu.edu"],
|
||||
icon: "fas fa-envelope"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: "Social",
|
||||
subsections: [
|
||||
{
|
||||
name: "GitHub",
|
||||
value: "https://github.com/ksjdragon",
|
||||
icon: "fab fa-github"
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
var sidebarTop = document.querySelectorAll("#sidebar .topCont")[0];
|
||||
var sidebarMid = document.querySelectorAll("#sidebar .midCont")[0];
|
||||
var mainTop = document.querySelectorAll("#mainCont .topCont")[0];
|
||||
var mainMid = document.querySelectorAll("#mainCont .midCont")[0];
|
||||
|
||||
function titleItems() {
|
||||
var name = el("h1", titleInfo.name.toUpperCase());
|
||||
mainTop.appendChild(name);
|
||||
var caption = el("h2", titleInfo.caption.toUpperCase());
|
||||
mainTop.appendChild(caption);
|
||||
}
|
||||
|
||||
function mainItems() {
|
||||
mainContInfo.forEach(function(ele) {
|
||||
var subsection = el("div", "", "", "subsection");
|
||||
var circle = el("div", "", "", "subCircle");
|
||||
circle.appendChild(el("i", "", "", "fas " + ele.icon));
|
||||
subsection.appendChild(circle);
|
||||
subsection.appendChild(el("h2", ele.name.toUpperCase(), "", "subTitle"));
|
||||
ele.values.forEach(function(item) {
|
||||
var subValue = el("div", "", "", "subValue");
|
||||
subValue.appendChild(el("h3", item.date, "", ""));
|
||||
subValue.appendChild(el("h3", item.name, "", ""));
|
||||
subValue.appendChild(el("h3", item.caption, "", ""));
|
||||
subValue.appendChild(el("h3", item.desc, "", ""));
|
||||
subsection.appendChild(subValue);
|
||||
});
|
||||
mainMid.appendChild(subsection);
|
||||
});
|
||||
}
|
||||
|
||||
function sidebarItems() {
|
||||
sidebarInfo.forEach(function(ele) {
|
||||
var subsection = el("div", "", "", "subsection");
|
||||
subsection.appendChild(el("h2", ele.name.toUpperCase(), "", "subTitle"));
|
||||
ele.subsections.forEach(function(item) {
|
||||
var subValue = el("div", "", "", "subValue");
|
||||
subValue.appendChild(el("i", "", "", item.icon));
|
||||
subValue.appendChild(el("h3", item.name, "", ""));
|
||||
if(Array.isArray(item.value)) {
|
||||
item.value.forEach(function(val, index) {
|
||||
subValue.appendChild(el("h3", val, "", ""));
|
||||
if(item.value.length != index+1) subValue.appendChild(el("br"));
|
||||
});
|
||||
} else {
|
||||
subValue.appendChild(el("h3", item.value, "", ""));
|
||||
}
|
||||
subsection.appendChild(subValue);
|
||||
});
|
||||
sidebarMid.appendChild(subsection);
|
||||
});
|
||||
}
|
||||
|
||||
function el(DOM, textNode, id, className) {
|
||||
id = id || "";
|
||||
className = className || "";
|
||||
textNode = textNode || "";
|
||||
var element = document.createElement(DOM);
|
||||
if(id.length != 0) element.id = id;
|
||||
if(className.length != 0) element.className = className;
|
||||
if(textNode.length != 0) element.appendChild(document.createTextNode(textNode));
|
||||
return element;
|
||||
}
|
||||
|
||||
titleItems();
|
||||
sidebarItems();
|
||||
@ -59,12 +59,12 @@ h3 {
|
||||
|
||||
#mainCont .topCont h1 {
|
||||
padding: 13% 0 0 10%;
|
||||
font-size: 300%;
|
||||
font-size: 220%;
|
||||
}
|
||||
|
||||
#mainCont .topCont h2 {
|
||||
padding: 0 0 0 10%;
|
||||
font-size: 95%;
|
||||
font-size: 75%;
|
||||
color: #939393;
|
||||
}
|
||||
|
||||
@ -113,9 +113,13 @@ h3 {
|
||||
}
|
||||
|
||||
#mainCont .midCont {
|
||||
font-size: 80%;
|
||||
font-size: 50%;
|
||||
}
|
||||
|
||||
#sidebar .midCont {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
#mainCont .midCont .subsection {
|
||||
padding: 0 10% 2% 10%;
|
||||
display: grid;
|
||||
@ -137,7 +141,7 @@ h3 {
|
||||
.subCircle i {
|
||||
margin: auto;
|
||||
color: #1F1F1F;
|
||||
font-size: 120%;
|
||||
font-size: 140%;
|
||||
}
|
||||
|
||||
#mainCont .midCont .subsection h2 {
|
||||
|
||||
@ -37,6 +37,11 @@ var sidebarInfo = [
|
||||
name: "GitHub",
|
||||
value: "https://github.com/ksjdragon",
|
||||
icon: "fab fa-github"
|
||||
},
|
||||
{
|
||||
name: "LinkedIn",
|
||||
value: "https://linkedin.com/in/kjao",
|
||||
icon: "fab fa-linkedin"
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -48,13 +53,38 @@ var mainContInfo = [
|
||||
icon: "fa-book-open",
|
||||
values: [
|
||||
{
|
||||
name: "Michigan State University, East Lansing",
|
||||
name: "Michigan State University (MSU), East Lansing",
|
||||
caption: "Majoring in Computational Mathematics, Mathematics.\nMinoring in Computer Science",
|
||||
date: "2018-2022",
|
||||
desc: "Cumulative GPA: 3.91"
|
||||
desc: "Cumulative GPA: 3.9401"
|
||||
},
|
||||
{
|
||||
name: "Dean's List",
|
||||
caption: "Michigan State University",
|
||||
date: "2018-2021",
|
||||
desc: "Cumulative GPA higher than 3.5 for the year. Achieved for 3 years."
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: "Work Experience",
|
||||
icon: "fa-briefcase",
|
||||
values: [
|
||||
{
|
||||
name: "Undergraduate Learning Assistant (ULA)",
|
||||
caption: "Assistant to the professor (10 hours per week)",
|
||||
date: "Fall 2021",
|
||||
desc: "For the class 'CMSE/MTH 314 Matrix Algebra with Computational Applications', I aided in facilliating an interactive classroom, alongside grading assignments and hosting office hours."
|
||||
},
|
||||
{
|
||||
name: "Undergraduate Researcher in Mathematics",
|
||||
caption: "Researched with Keith Promislow, chairperson of the Mathematics Department at MSU.",
|
||||
date: "2021-2022",
|
||||
desc: "Conducted theoretical mathematical research into soft packing problems, modeling with Partial Differential Equations.\n Wrote programs for all of the numerical simulations and analysis, along with a Python package. [https://github.com/ksjdragon/squish]"
|
||||
}
|
||||
|
||||
]
|
||||
},
|
||||
{
|
||||
name: "Skills",
|
||||
icon: "fa-wrench",
|
||||
@ -63,31 +93,30 @@ var mainContInfo = [
|
||||
name: "Programming",
|
||||
caption: "Software engineering",
|
||||
date: "Since 2014",
|
||||
desc: "Fluent in HTML, CSS, JavaScript, Python, C, C++. Can pick up languages and libraries with ease. Full-stack web app developer, experience in bash scripting, and deep learning."
|
||||
desc: "Fluent in Python, C, C++, HTML, CSS, and JavaScript. Can pick up languages and libraries with ease. Full-stack web app developer, experience in bash scripting, and deep learning."
|
||||
},
|
||||
{
|
||||
name: "System Administrator",
|
||||
caption: "Server setup and maintenance.",
|
||||
date: "Since 2014",
|
||||
desc: "Proficient in maintaining and configuring up servers, and organizing network systems. Can secure implementations of server applications with industry standard cybersecurity."
|
||||
},
|
||||
{
|
||||
name: "User Interface Design",
|
||||
caption: "Interface, logo, and background design",
|
||||
date: "Since 2012",
|
||||
desc: "Proficient with GIMP and Blender for front-end web interfaces"
|
||||
}
|
||||
]
|
||||
} ]
|
||||
},
|
||||
{
|
||||
name: "Projects",
|
||||
icon: "fa-list-ol",
|
||||
values: [
|
||||
{
|
||||
name: "Video Compression Research",
|
||||
caption: "Compression through multi-dimensional transform analysis.",
|
||||
date: "Since 2018",
|
||||
desc: "Personal research into new compression techniques through extended applications of wave transforms, spatial and temporal data rearrangement, and component analysis."
|
||||
name: "Google FooBar Challenge",
|
||||
caption: "Coding challenge hosted by Google.",
|
||||
date: "Summer 2020",
|
||||
desc: "Completed all 5 levels of Google Foobar challenge."
|
||||
},
|
||||
{
|
||||
name: "Virtual Synthesizer",
|
||||
caption: "Designed custom synthesizer programs for self-use in music production",
|
||||
date: "Fall 2020",
|
||||
desc: "Using signal processing concepts and studying historical circuits, recreated virtual synthesizers."
|
||||
},
|
||||
{
|
||||
name: "VR Arm Tracking Device",
|
||||
@ -99,19 +128,19 @@ var mainContInfo = [
|
||||
name: "Haptic Feedback Through Wave Interference",
|
||||
caption: "Mathematical investigation of applications of wave interference",
|
||||
date: "2017",
|
||||
desc: "A mathematical proof and experimentation of controllable wave interference to induce correct superposition. Explored multiple applications including a possibility of simulating highly accurate haptic feedback."
|
||||
desc: "Investigated more complex haptic feedback through wave interference using linear resonant actuators."
|
||||
},
|
||||
{
|
||||
name: "BinBin",
|
||||
caption: "Cloud storage web interface application",
|
||||
name: "Cloud Storage Web Application",
|
||||
caption: "Server side programming and account management with file security",
|
||||
date: "2016",
|
||||
desc: "Cloud database web app created to ease file downloading and storage for servers, with accounts and sharing systems."
|
||||
desc: "Cloud database web app created to ease file downloading and storage for servers, with accounts and sharing systems. [https://github.com/ksjdragon/binbin]"
|
||||
},
|
||||
{
|
||||
name: "Hourglass",
|
||||
caption: "Collaborative school-wide online planner",
|
||||
name: "Collaborative Online Planner",
|
||||
caption: "Database management and responsive and reactive web design",
|
||||
date: "2017",
|
||||
desc: "Online planning web app designed for academic use. Enabled users to have a collaborative planner specific to individual classes and teachers. "
|
||||
desc: "Online planning web app designed for academic use. Enabled users to have a collaborative planner specific to individual classes and teachers. [https://github.com/ksjdragon/hourglass]"
|
||||
}
|
||||
|
||||
]
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user