Updated Website
This commit is contained in:
36
package-lock.json
generated
36
package-lock.json
generated
@@ -3365,9 +3365,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/async": {
|
"node_modules/async": {
|
||||||
"version": "2.6.3",
|
"version": "2.6.4",
|
||||||
"resolved": "https://registry.npmjs.org/async/-/async-2.6.3.tgz",
|
"resolved": "https://registry.npmjs.org/async/-/async-2.6.4.tgz",
|
||||||
"integrity": "sha512-zflvls11DCy+dQWzTW2dzuilv8Z5X/pjfmZOWba6TNIVDm+2UDaJmXSOXlasHKfNBs8oo3M0aT50fDEWfKZjXg==",
|
"integrity": "sha512-mzo5dfJYwAn29PeiJ0zvwTo04zj8HDJj0Mn8TD7sno7q12prdbnasKJHhkm2c1LgrhlJ0teaea8860oxi51mGA==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"lodash": "^4.17.14"
|
"lodash": "^4.17.14"
|
||||||
@@ -7521,9 +7521,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/log-update/node_modules/ansi-regex": {
|
"node_modules/log-update/node_modules/ansi-regex": {
|
||||||
"version": "3.0.0",
|
"version": "3.0.1",
|
||||||
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.1.tgz",
|
||||||
"integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
|
"integrity": "sha512-+O9Jct8wf++lXxxFc4hc8LsjaSq0HFzzL7cVsw8pRDIPdjKD2mT4ytDZlLuSBZ4cLKZFXIrMGO7DbQCtMJJMKw==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": ">=4"
|
"node": ">=4"
|
||||||
@@ -7887,9 +7887,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/minimist": {
|
"node_modules/minimist": {
|
||||||
"version": "1.2.5",
|
"version": "1.2.6",
|
||||||
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz",
|
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz",
|
||||||
"integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==",
|
"integrity": "sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"node_modules/minipass": {
|
"node_modules/minipass": {
|
||||||
@@ -14614,9 +14614,9 @@
|
|||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"async": {
|
"async": {
|
||||||
"version": "2.6.3",
|
"version": "2.6.4",
|
||||||
"resolved": "https://registry.npmjs.org/async/-/async-2.6.3.tgz",
|
"resolved": "https://registry.npmjs.org/async/-/async-2.6.4.tgz",
|
||||||
"integrity": "sha512-zflvls11DCy+dQWzTW2dzuilv8Z5X/pjfmZOWba6TNIVDm+2UDaJmXSOXlasHKfNBs8oo3M0aT50fDEWfKZjXg==",
|
"integrity": "sha512-mzo5dfJYwAn29PeiJ0zvwTo04zj8HDJj0Mn8TD7sno7q12prdbnasKJHhkm2c1LgrhlJ0teaea8860oxi51mGA==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"lodash": "^4.17.14"
|
"lodash": "^4.17.14"
|
||||||
@@ -17706,9 +17706,9 @@
|
|||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"ansi-regex": {
|
"ansi-regex": {
|
||||||
"version": "3.0.0",
|
"version": "3.0.1",
|
||||||
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.1.tgz",
|
||||||
"integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
|
"integrity": "sha512-+O9Jct8wf++lXxxFc4hc8LsjaSq0HFzzL7cVsw8pRDIPdjKD2mT4ytDZlLuSBZ4cLKZFXIrMGO7DbQCtMJJMKw==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"cli-cursor": {
|
"cli-cursor": {
|
||||||
@@ -17982,9 +17982,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"minimist": {
|
"minimist": {
|
||||||
"version": "1.2.5",
|
"version": "1.2.6",
|
||||||
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz",
|
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz",
|
||||||
"integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==",
|
"integrity": "sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"minipass": {
|
"minipass": {
|
||||||
|
|||||||
@@ -5,11 +5,17 @@
|
|||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
<title>Johnathon Slightham</title>
|
||||||
|
<style>
|
||||||
|
html {
|
||||||
|
background: #111827;
|
||||||
|
|
||||||
|
}
|
||||||
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<noscript>
|
<noscript>
|
||||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
<strong>Sorry, but my website was written with the Vue framework, and thus requires JavaScript enabled! Please enable JavaScript in order to view my website.</strong>
|
||||||
</noscript>
|
</noscript>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
<!-- built files will be auto injected -->
|
<!-- built files will be auto injected -->
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<div class="md:container md:mx-auto">
|
||||||
<div class="text-gray-400 bg-gray-900 body-font app">
|
<div class="text-gray-400 bg-gray-900 body-font app">
|
||||||
<header class="text-gray-400 bg-gray-900 body-font">
|
<header class="text-gray-400 bg-gray-900 body-font">
|
||||||
<div
|
<div
|
||||||
@@ -79,6 +80,7 @@
|
|||||||
<router-view />
|
<router-view />
|
||||||
</transition>
|
</transition>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
@@ -13,12 +13,14 @@
|
|||||||
"
|
"
|
||||||
>
|
>
|
||||||
<div class="lg:max-w-lg lg:w-full md:w-1/2 w-5/6 md:mb-0 mb-10">
|
<div class="lg:max-w-lg lg:w-full md:w-1/2 w-5/6 md:mb-0 mb-10">
|
||||||
|
<center>
|
||||||
<img
|
<img
|
||||||
class="object-cover object-center rounded"
|
class="object-cover object-center rounded"
|
||||||
style="max-height: 350px;"
|
style="max-height: 350px;"
|
||||||
alt="hero"
|
alt="hero"
|
||||||
:src="profile"
|
:src="profile"
|
||||||
/>
|
/>
|
||||||
|
</center>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="
|
class="
|
||||||
@@ -36,9 +38,9 @@
|
|||||||
Johnathon Slightham
|
Johnathon Slightham
|
||||||
</h1>
|
</h1>
|
||||||
<p class="mb-8 leading-relaxed">
|
<p class="mb-8 leading-relaxed">
|
||||||
I am a computer engineering student at the University of Waterloo. I have a passion for machine learning, and love working on open source projects.
|
I am an undergraduate student studying Computer Engineering at the University of Waterloo. I love open source projects, and working on useful applications that are used by the public. The majority of my work so far has been in Full-Stack development, with a focus on Back End develoment. I also have a passion for machine learning, which I am currently working towards developing my skills in.
|
||||||
<br><br>
|
<br><br>
|
||||||
Browse my website to check out some of my projects or connect with me!
|
Browse my website to check out some of my projects or connect with me. I am always open to working on new projects!
|
||||||
</p>
|
</p>
|
||||||
<div class="flex justify-center">
|
<div class="flex justify-center">
|
||||||
<router-link to="/resume">
|
<router-link to="/resume">
|
||||||
|
|||||||
@@ -121,7 +121,7 @@ export default {
|
|||||||
methods: {
|
methods: {
|
||||||
async runCode() {
|
async runCode() {
|
||||||
this.data = [];
|
this.data = [];
|
||||||
let res = await fetch("http://localhost:8000/run/run", {
|
let res = await fetch("http://jslightham.com:8000/run/run", {
|
||||||
method: "POST",
|
method: "POST",
|
||||||
headers: {
|
headers: {
|
||||||
Accept: "application/json",
|
Accept: "application/json",
|
||||||
@@ -152,7 +152,7 @@ export default {
|
|||||||
return highlight(code, languages.js); // languages.<insert language> to return html with markup
|
return highlight(code, languages.js); // languages.<insert language> to return html with markup
|
||||||
},
|
},
|
||||||
async getLanguages() {
|
async getLanguages() {
|
||||||
let res = await fetch("http://localhost:8000/run/languages");
|
let res = await fetch("http://jslightham:8000/run/languages");
|
||||||
this.languages = await res.json();
|
this.languages = await res.json();
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -1,7 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
|
||||||
<ProfileComponent></ProfileComponent>
|
<ProfileComponent></ProfileComponent>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
@@ -1,371 +1,401 @@
|
|||||||
<template>
|
<template>
|
||||||
<section class="text-gray-400 bg-gray-900 body-font overflow-hidden">
|
<section class="text-gray-400 bg-gray-900 body-font overflow-hidden">
|
||||||
<div class="container px-5 py-24 mx-auto">
|
<div class="container px-5 py-24 mx-auto">
|
||||||
<p>Check out some of my projects! I'm not yet done setting up each project on my VPS yet, so not every project is hosted.</p>
|
<p>Check out some of my projects! I'm not yet done setting up each project on my VPS yet, so not every project is hosted.</p>
|
||||||
<br>
|
<br>
|
||||||
<div class="-my-8 divide-y-2 divide-gray-800">
|
|
||||||
|
<div class="-my-8 divide-y-2 divide-gray-800">
|
||||||
<div class="py-8 flex flex-wrap md:flex-nowrap">
|
<div class="py-8 flex flex-wrap md:flex-nowrap">
|
||||||
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
||||||
<span class="font-semibold title-font text-white">Vue, TailwindCSS</span>
|
<span class="font-semibold title-font text-white">Unity, C#</span>
|
||||||
<span class="mt-1 text-gray-500 text-sm">March 2022</span>
|
<span class="mt-1 text-gray-500 text-sm">April 2022</span>
|
||||||
|
</div>
|
||||||
|
<div class="md:flex-grow">
|
||||||
|
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
||||||
|
Row Game
|
||||||
|
</h2>
|
||||||
|
<p class="leading-relaxed">
|
||||||
|
Worked with a team to create a 2D game in unity for a Game Jam.
|
||||||
|
</p>
|
||||||
|
<a href="https://canarybenn.itch.io/row" class="text-blue-400 inline-flex items-center mt-4"
|
||||||
|
>Play on itch.io
|
||||||
|
<svg
|
||||||
|
class="w-4 h-4 ml-2"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="2"
|
||||||
|
fill="none"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
>
|
||||||
|
<path d="M5 12h14"></path>
|
||||||
|
<path d="M12 5l7 7-7 7"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="md:flex-grow">
|
<div class="py-8 flex flex-wrap md:flex-nowrap">
|
||||||
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
||||||
Personal Website
|
<span class="font-semibold title-font text-white">Vue, TailwindCSS</span>
|
||||||
</h2>
|
<span class="mt-1 text-gray-500 text-sm">March 2022</span>
|
||||||
<p class="leading-relaxed">
|
</div>
|
||||||
Used VueJS, and TailwindCSS to build a personal website to showcase my work experience and projects.
|
<div class="md:flex-grow">
|
||||||
</p>
|
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
||||||
<a href="https://github.com/jslightham/jslightham.github.io" class="text-blue-400 inline-flex items-center mt-4"
|
Personal Website
|
||||||
>View on GitHub
|
</h2>
|
||||||
<svg
|
<p class="leading-relaxed">
|
||||||
class="w-4 h-4 ml-2"
|
Used VueJS, and TailwindCSS to build a personal website to showcase my work experience and projects.
|
||||||
viewBox="0 0 24 24"
|
</p>
|
||||||
stroke="currentColor"
|
<a href="https://github.com/jslightham/jslightham.github.io" class="text-blue-400 inline-flex items-center mt-4"
|
||||||
stroke-width="2"
|
>View on GitHub
|
||||||
fill="none"
|
<svg
|
||||||
stroke-linecap="round"
|
class="w-4 h-4 ml-2"
|
||||||
stroke-linejoin="round"
|
viewBox="0 0 24 24"
|
||||||
>
|
stroke="currentColor"
|
||||||
<path d="M5 12h14"></path>
|
stroke-width="2"
|
||||||
<path d="M12 5l7 7-7 7"></path>
|
fill="none"
|
||||||
</svg>
|
stroke-linecap="round"
|
||||||
</a>
|
stroke-linejoin="round"
|
||||||
|
>
|
||||||
|
<path d="M5 12h14"></path>
|
||||||
|
<path d="M12 5l7 7-7 7"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div
|
||||||
<div
|
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
||||||
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
>
|
||||||
>
|
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
||||||
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
<span class="font-semibold title-font text-white">NodeJS, Express, Docker</span>
|
||||||
<span class="font-semibold title-font text-white">NodeJS, Express, Docker</span>
|
<span class="mt-1 text-gray-500 text-sm">March 2022</span>
|
||||||
<span class="mt-1 text-gray-500 text-sm">March 2022</span>
|
</div>
|
||||||
|
<div class="md:flex-grow">
|
||||||
|
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
||||||
|
REST Remote Code Server
|
||||||
|
</h2>
|
||||||
|
<p class="leading-relaxed">
|
||||||
|
Built a RESTful API that can compile and run code on a remote server in isolated docker containers. Easily add support for any language that can be compiled and run from a bash script.
|
||||||
|
</p>
|
||||||
|
<router-link to="/codeserver">
|
||||||
|
<a class="text-blue-400 inline-flex items-center mt-4"
|
||||||
|
>See Project
|
||||||
|
<svg
|
||||||
|
class="w-4 h-4 ml-2"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="2"
|
||||||
|
fill="none"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
>
|
||||||
|
<path d="M5 12h14"></path>
|
||||||
|
<path d="M12 5l7 7-7 7"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</router-link>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="md:flex-grow">
|
<div
|
||||||
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
||||||
REST Remote Code Server
|
>
|
||||||
</h2>
|
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
||||||
<p class="leading-relaxed">
|
<span class="font-semibold title-font text-white">NodeJS, Express, MongoDB</span>
|
||||||
Built a RESTful API that can compile and run code on a remote server in isolated docker containers. Easily add support for any language that can be compiled and run from a bash script.
|
<span class="mt-1 text-gray-500 text-sm">Oct 2021</span>
|
||||||
</p>
|
</div>
|
||||||
<router-link to="/codeserver">
|
<div class="md:flex-grow">
|
||||||
<a class="text-blue-400 inline-flex items-center mt-4"
|
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
||||||
>See Project
|
Kno-Logic API
|
||||||
<svg
|
</h2>
|
||||||
class="w-4 h-4 ml-2"
|
<p class="leading-relaxed">
|
||||||
viewBox="0 0 24 24"
|
Built a backend with a REST interface for a news aggregation project. Assisted with integration into the frontend react native applicaton.
|
||||||
stroke="currentColor"
|
</p>
|
||||||
stroke-width="2"
|
<a href="https://github.com/jslightham/kno-logic-api" class="text-blue-400 inline-flex items-center mt-4"
|
||||||
fill="none"
|
>View on GitHub
|
||||||
stroke-linecap="round"
|
<svg
|
||||||
stroke-linejoin="round"
|
class="w-4 h-4 ml-2"
|
||||||
>
|
viewBox="0 0 24 24"
|
||||||
<path d="M5 12h14"></path>
|
stroke="currentColor"
|
||||||
<path d="M12 5l7 7-7 7"></path>
|
stroke-width="2"
|
||||||
</svg>
|
fill="none"
|
||||||
</a>
|
stroke-linecap="round"
|
||||||
</router-link>
|
stroke-linejoin="round"
|
||||||
|
>
|
||||||
|
<path d="M5 12h14"></path>
|
||||||
|
<path d="M12 5l7 7-7 7"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div
|
||||||
<div
|
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
||||||
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
>
|
||||||
>
|
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
||||||
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
<span class="font-semibold title-font text-white">Java, NodeJS</span>
|
||||||
<span class="font-semibold title-font text-white">NodeJS, Express, MongoDB</span>
|
<span class="mt-1 text-gray-500 text-sm">Aug 2021</span>
|
||||||
<span class="mt-1 text-gray-500 text-sm">Oct 2021</span>
|
</div>
|
||||||
|
<div class="md:flex-grow">
|
||||||
|
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
||||||
|
Brute Forced War Game
|
||||||
|
</h2>
|
||||||
|
<p class="leading-relaxed">
|
||||||
|
An experiment to learn using crowdsourced computing and multithreaded programming in Java to brute force a solution.
|
||||||
|
</p>
|
||||||
|
<a href="https://github.com/jslightham/brute-forced-war-game" class="text-blue-400 inline-flex items-center mt-4"
|
||||||
|
>View on GitHub
|
||||||
|
<svg
|
||||||
|
class="w-4 h-4 ml-2"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="2"
|
||||||
|
fill="none"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
>
|
||||||
|
<path d="M5 12h14"></path>
|
||||||
|
<path d="M12 5l7 7-7 7"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="md:flex-grow">
|
<div
|
||||||
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
||||||
Kno-Logic API
|
>
|
||||||
</h2>
|
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
||||||
<p class="leading-relaxed">
|
<span class="font-semibold title-font text-white">Unity, C#</span>
|
||||||
Built a backend with a REST interface for a news aggregation project. Assisted with integration into the frontend react native applicaton.
|
<span class="mt-1 text-gray-500 text-sm">Jul 2021</span>
|
||||||
</p>
|
</div>
|
||||||
<a href="https://github.com/jslightham/kno-logic-api" class="text-blue-400 inline-flex items-center mt-4"
|
<div class="md:flex-grow">
|
||||||
>View on GitHub
|
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
||||||
<svg
|
Zero Waste Game
|
||||||
class="w-4 h-4 ml-2"
|
</h2>
|
||||||
viewBox="0 0 24 24"
|
<p class="leading-relaxed">
|
||||||
stroke="currentColor"
|
A group project where we created a multiplayer space exploration game in Unity. This game is currently hosted in a private repository, thus I cannot provide a link.
|
||||||
stroke-width="2"
|
</p>
|
||||||
fill="none"
|
</div>
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path d="M5 12h14"></path>
|
|
||||||
<path d="M12 5l7 7-7 7"></path>
|
|
||||||
</svg>
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div
|
||||||
<div
|
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
||||||
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
>
|
||||||
>
|
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
||||||
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
<span class="font-semibold title-font text-white">NodeJS, Vue, TensorflowJS, Websockets</span>
|
||||||
<span class="font-semibold title-font text-white">Java, NodeJS</span>
|
<span class="mt-1 text-gray-500 text-sm">Feb 2021</span>
|
||||||
<span class="mt-1 text-gray-500 text-sm">Aug 2021</span>
|
</div>
|
||||||
|
<div class="md:flex-grow">
|
||||||
|
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
||||||
|
Multiplayer Stick Figure Game
|
||||||
|
</h2>
|
||||||
|
<p class="leading-relaxed">
|
||||||
|
A project for a hackathon, where my group created a multiplayer game. The game's input was the user's camera that used TensorflowJS to place a realtime virtual representation of them in the game. The player's positions were synchronized via websockets, which allowed games such as soccer and volleyball to be played virtually.
|
||||||
|
</p>
|
||||||
|
<a href="https://github.com/jslightham/multiplayer-stickfigure-game" class="text-blue-400 inline-flex items-center mt-4"
|
||||||
|
>View on GitHub
|
||||||
|
<svg
|
||||||
|
class="w-4 h-4 ml-2"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="2"
|
||||||
|
fill="none"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
>
|
||||||
|
<path d="M5 12h14"></path>
|
||||||
|
<path d="M12 5l7 7-7 7"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="md:flex-grow">
|
<div
|
||||||
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
||||||
Brute Forced War Game
|
>
|
||||||
</h2>
|
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
||||||
<p class="leading-relaxed">
|
<span class="font-semibold title-font text-white">NodeJS, Vue, Handbrake, FFMPEG, Video.js, MongoDB</span>
|
||||||
An experiment to learn using crowdsourced computing and multithreaded programming in Java to brute force a solution.
|
<span class="mt-1 text-gray-500 text-sm">Dec 2020</span>
|
||||||
</p>
|
</div>
|
||||||
<a href="https://github.com/jslightham/brute-forced-war-game" class="text-blue-400 inline-flex items-center mt-4"
|
<div class="md:flex-grow">
|
||||||
>View on GitHub
|
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
||||||
<svg
|
NodeJS Video Streamer
|
||||||
class="w-4 h-4 ml-2"
|
</h2>
|
||||||
viewBox="0 0 24 24"
|
<p class="leading-relaxed">
|
||||||
stroke="currentColor"
|
A simple clone project of the popular video sharing website YouTube. Automatically transcodes uploads, modern video player (Video.js), video and audio streaming from NodeJS backend, automatic thumbnail generation through FFmpeg, comment & like system, and metadata storage in MongoDB.
|
||||||
stroke-width="2"
|
</p>
|
||||||
fill="none"
|
<a href="https://github.com/jslightham/NodeJS-Video-Streamer" class="text-blue-400 inline-flex items-center mt-4"
|
||||||
stroke-linecap="round"
|
>View on GitHub
|
||||||
stroke-linejoin="round"
|
<svg
|
||||||
>
|
class="w-4 h-4 ml-2"
|
||||||
<path d="M5 12h14"></path>
|
viewBox="0 0 24 24"
|
||||||
<path d="M12 5l7 7-7 7"></path>
|
stroke="currentColor"
|
||||||
</svg>
|
stroke-width="2"
|
||||||
</a>
|
fill="none"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
>
|
||||||
|
<path d="M5 12h14"></path>
|
||||||
|
<path d="M12 5l7 7-7 7"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div
|
||||||
<div
|
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
||||||
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
>
|
||||||
>
|
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
||||||
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
<span class="font-semibold title-font text-white">HTML, Javascript</span>
|
||||||
<span class="font-semibold title-font text-white">Unity, C#</span>
|
<span class="mt-1 text-gray-500 text-sm">Jun 2020</span>
|
||||||
<span class="mt-1 text-gray-500 text-sm">Jul 2021</span>
|
</div>
|
||||||
|
<div class="md:flex-grow">
|
||||||
|
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
||||||
|
Collision Simulator
|
||||||
|
</h2>
|
||||||
|
<p class="leading-relaxed">
|
||||||
|
A javascript canvas collision simulation in 2D for a combined high school Physics and Computer Science final project.
|
||||||
|
</p>
|
||||||
|
<a href="https://jslightham.github.io/Collision-Simulator/" class="text-blue-400 inline-flex items-center mt-4"
|
||||||
|
>See Project
|
||||||
|
<svg
|
||||||
|
class="w-4 h-4 ml-2"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="2"
|
||||||
|
fill="none"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
>
|
||||||
|
<path d="M5 12h14"></path>
|
||||||
|
<path d="M12 5l7 7-7 7"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="md:flex-grow">
|
<div
|
||||||
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
||||||
Zero Waste Game
|
>
|
||||||
</h2>
|
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
||||||
<p class="leading-relaxed">
|
<span class="font-semibold title-font text-white">Vue, Bootstrap, NodeJS, Express, MongoDB</span>
|
||||||
A group project where we created a multiplayer space exploration game in Unity. This game is currently hosted in a private repository, thus I cannot provide a link.
|
<span class="mt-1 text-gray-500 text-sm">Jun 2020</span>
|
||||||
</p>
|
</div>
|
||||||
|
<div class="md:flex-grow">
|
||||||
|
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
||||||
|
MEVN Attendance System
|
||||||
|
</h2>
|
||||||
|
<p class="leading-relaxed">
|
||||||
|
A group project for a school project, where we created an attendance system in MongoDB.
|
||||||
|
</p>
|
||||||
|
<a href="https://github.com/jslightham/MEVN-Attendance-Tracker" class="text-blue-400 inline-flex items-center mt-4"
|
||||||
|
>View on GitHub
|
||||||
|
<svg
|
||||||
|
class="w-4 h-4 ml-2"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="2"
|
||||||
|
fill="none"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
>
|
||||||
|
<path d="M5 12h14"></path>
|
||||||
|
<path d="M12 5l7 7-7 7"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div
|
||||||
<div
|
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
||||||
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
>
|
||||||
>
|
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
||||||
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
<span class="font-semibold title-font text-white">Java</span>
|
||||||
<span class="font-semibold title-font text-white">NodeJS, Vue, TensorflowJS, Websockets</span>
|
<span class="mt-1 text-gray-500 text-sm">2019-2020</span>
|
||||||
<span class="mt-1 text-gray-500 text-sm">Feb 2021</span>
|
</div>
|
||||||
|
<div class="md:flex-grow">
|
||||||
|
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
||||||
|
MC Plugins
|
||||||
|
</h2>
|
||||||
|
<p class="leading-relaxed">
|
||||||
|
Built a few Java edition Minecraft plugins to learn how to.
|
||||||
|
</p>
|
||||||
|
<a href="https://github.com/jslightham/MC-Plugins" class="text-blue-400 inline-flex items-center mt-4"
|
||||||
|
>View on GitHub
|
||||||
|
<svg
|
||||||
|
class="w-4 h-4 ml-2"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="2"
|
||||||
|
fill="none"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
>
|
||||||
|
<path d="M5 12h14"></path>
|
||||||
|
<path d="M12 5l7 7-7 7"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="md:flex-grow">
|
<div
|
||||||
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
||||||
Multiplayer Stick Figure Game
|
>
|
||||||
</h2>
|
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
||||||
<p class="leading-relaxed">
|
<span class="font-semibold title-font text-white">Firebase, Google Cloud, Keybase, NodeJS</span>
|
||||||
A project for a hackathon, where my group created a multiplayer game. The game's input was the user's camera that used TensorflowJS to place a realtime virtual representation of them in the game. The player's positions were synchronized via websockets, which allowed games such as soccer and volleyball to be played virtually.
|
<span class="mt-1 text-gray-500 text-sm">Sep 2019</span>
|
||||||
</p>
|
</div>
|
||||||
<a href="https://github.com/jslightham/multiplayer-stickfigure-game" class="text-blue-400 inline-flex items-center mt-4"
|
<div class="md:flex-grow">
|
||||||
>View on GitHub
|
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
||||||
<svg
|
Translate Bot
|
||||||
class="w-4 h-4 ml-2"
|
</h2>
|
||||||
viewBox="0 0 24 24"
|
<p class="leading-relaxed">
|
||||||
stroke="currentColor"
|
A project for a hackathon that won the best use of google cloud award. This project translated conversations in real time within the keybase application into a language that the user selects.
|
||||||
stroke-width="2"
|
</p>
|
||||||
fill="none"
|
<a href="https://devpost.com/software/translatebot" class="text-blue-400 inline-flex items-center mt-4"
|
||||||
stroke-linecap="round"
|
>View on Devpost
|
||||||
stroke-linejoin="round"
|
<svg
|
||||||
>
|
class="w-4 h-4 ml-2"
|
||||||
<path d="M5 12h14"></path>
|
viewBox="0 0 24 24"
|
||||||
<path d="M12 5l7 7-7 7"></path>
|
stroke="currentColor"
|
||||||
</svg>
|
stroke-width="2"
|
||||||
</a>
|
fill="none"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
>
|
||||||
|
<path d="M5 12h14"></path>
|
||||||
|
<path d="M12 5l7 7-7 7"></path>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div
|
||||||
<div
|
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
||||||
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
>
|
||||||
>
|
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
||||||
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
<span class="font-semibold title-font text-white">Java</span>
|
||||||
<span class="font-semibold title-font text-white">NodeJS, Vue, Handbrake, FFMPEG, Video.js, MongoDB</span>
|
<span class="mt-1 text-gray-500 text-sm">Jun 2019</span>
|
||||||
<span class="mt-1 text-gray-500 text-sm">Dec 2020</span>
|
</div>
|
||||||
</div>
|
<div class="md:flex-grow">
|
||||||
<div class="md:flex-grow">
|
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
||||||
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
Zork
|
||||||
NodeJS Video Streamer
|
</h2>
|
||||||
</h2>
|
<p class="leading-relaxed">
|
||||||
<p class="leading-relaxed">
|
A group project where we recreated the classic text based adventure game Zork in Java, with some extra functionality.
|
||||||
A simple clone project of the popular video sharing website YouTube. Automatically transcodes uploads, modern video player (Video.js), video and audio streaming from NodeJS backend, automatic thumbnail generation through FFmpeg, comment & like system, and metadata storage in MongoDB.
|
</p>
|
||||||
</p>
|
<router-link to="/zork">
|
||||||
<a href="https://github.com/jslightham/NodeJS-Video-Streamer" class="text-blue-400 inline-flex items-center mt-4"
|
<a class="text-blue-400 inline-flex items-center mt-4"
|
||||||
>View on GitHub
|
>See Project
|
||||||
<svg
|
<svg
|
||||||
class="w-4 h-4 ml-2"
|
class="w-4 h-4 ml-2"
|
||||||
viewBox="0 0 24 24"
|
viewBox="0 0 24 24"
|
||||||
stroke="currentColor"
|
stroke="currentColor"
|
||||||
stroke-width="2"
|
stroke-width="2"
|
||||||
fill="none"
|
fill="none"
|
||||||
stroke-linecap="round"
|
stroke-linecap="round"
|
||||||
stroke-linejoin="round"
|
stroke-linejoin="round"
|
||||||
>
|
>
|
||||||
<path d="M5 12h14"></path>
|
<path d="M5 12h14"></path>
|
||||||
<path d="M12 5l7 7-7 7"></path>
|
<path d="M12 5l7 7-7 7"></path>
|
||||||
</svg>
|
</svg>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</router-link>
|
||||||
</div>
|
</div>
|
||||||
<div
|
|
||||||
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
|
||||||
>
|
|
||||||
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
|
||||||
<span class="font-semibold title-font text-white">HTML, Javascript</span>
|
|
||||||
<span class="mt-1 text-gray-500 text-sm">Jun 2020</span>
|
|
||||||
</div>
|
|
||||||
<div class="md:flex-grow">
|
|
||||||
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
|
||||||
Collision Simulator
|
|
||||||
</h2>
|
|
||||||
<p class="leading-relaxed">
|
|
||||||
A javascript canvas collision simulation in 2D for a combined high school Physics and Computer Science final project.
|
|
||||||
</p>
|
|
||||||
<a href="https://jslightham.github.io/Collision-Simulator/" class="text-blue-400 inline-flex items-center mt-4"
|
|
||||||
>See Project
|
|
||||||
<svg
|
|
||||||
class="w-4 h-4 ml-2"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke="currentColor"
|
|
||||||
stroke-width="2"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path d="M5 12h14"></path>
|
|
||||||
<path d="M12 5l7 7-7 7"></path>
|
|
||||||
</svg>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
|
||||||
>
|
|
||||||
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
|
||||||
<span class="font-semibold title-font text-white">Vue, Bootstrap, NodeJS, Express, MongoDB</span>
|
|
||||||
<span class="mt-1 text-gray-500 text-sm">Jun 2020</span>
|
|
||||||
</div>
|
|
||||||
<div class="md:flex-grow">
|
|
||||||
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
|
||||||
MEVN Attendance System
|
|
||||||
</h2>
|
|
||||||
<p class="leading-relaxed">
|
|
||||||
A group project for a school project, where we created an attendance system in MongoDB.
|
|
||||||
</p>
|
|
||||||
<a href="https://github.com/jslightham/MEVN-Attendance-Tracker" class="text-blue-400 inline-flex items-center mt-4"
|
|
||||||
>View on GitHub
|
|
||||||
<svg
|
|
||||||
class="w-4 h-4 ml-2"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke="currentColor"
|
|
||||||
stroke-width="2"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path d="M5 12h14"></path>
|
|
||||||
<path d="M12 5l7 7-7 7"></path>
|
|
||||||
</svg>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
|
||||||
>
|
|
||||||
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
|
||||||
<span class="font-semibold title-font text-white">Java</span>
|
|
||||||
<span class="mt-1 text-gray-500 text-sm">2019-2020</span>
|
|
||||||
</div>
|
|
||||||
<div class="md:flex-grow">
|
|
||||||
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
|
||||||
MC Plugins
|
|
||||||
</h2>
|
|
||||||
<p class="leading-relaxed">
|
|
||||||
Built a few Java edition Minecraft plugins to learn how to.
|
|
||||||
</p>
|
|
||||||
<a href="https://github.com/jslightham/MC-Plugins" class="text-blue-400 inline-flex items-center mt-4"
|
|
||||||
>View on GitHub
|
|
||||||
<svg
|
|
||||||
class="w-4 h-4 ml-2"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke="currentColor"
|
|
||||||
stroke-width="2"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path d="M5 12h14"></path>
|
|
||||||
<path d="M12 5l7 7-7 7"></path>
|
|
||||||
</svg>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
|
||||||
>
|
|
||||||
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
|
||||||
<span class="font-semibold title-font text-white">Firebase, Google Cloud, Keybase, NodeJS</span>
|
|
||||||
<span class="mt-1 text-gray-500 text-sm">Sep 2019</span>
|
|
||||||
</div>
|
|
||||||
<div class="md:flex-grow">
|
|
||||||
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
|
||||||
Translate Bot
|
|
||||||
</h2>
|
|
||||||
<p class="leading-relaxed">
|
|
||||||
A project for a hackathon that won the best use of google cloud award. This project translated conversations in real time within the keybase application into a language that the user selects.
|
|
||||||
</p>
|
|
||||||
<a href="https://devpost.com/software/translatebot" class="text-blue-400 inline-flex items-center mt-4"
|
|
||||||
>View on Devpost
|
|
||||||
<svg
|
|
||||||
class="w-4 h-4 ml-2"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke="currentColor"
|
|
||||||
stroke-width="2"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path d="M5 12h14"></path>
|
|
||||||
<path d="M12 5l7 7-7 7"></path>
|
|
||||||
</svg>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="py-8 flex border-t-2 border-gray-800 flex-wrap md:flex-nowrap"
|
|
||||||
>
|
|
||||||
<div class="md:w-64 md:mb-0 mb-6 flex-shrink-0 flex flex-col">
|
|
||||||
<span class="font-semibold title-font text-white">Java</span>
|
|
||||||
<span class="mt-1 text-gray-500 text-sm">Jun 2019</span>
|
|
||||||
</div>
|
|
||||||
<div class="md:flex-grow">
|
|
||||||
<h2 class="text-2xl font-medium text-white title-font mb-2">
|
|
||||||
Zork
|
|
||||||
</h2>
|
|
||||||
<p class="leading-relaxed">
|
|
||||||
A group project where we recreated the classic text based adventure game Zork in Java, with some extra functionality.
|
|
||||||
</p>
|
|
||||||
<router-link to="/zork">
|
|
||||||
<a class="text-blue-400 inline-flex items-center mt-4"
|
|
||||||
>See Project
|
|
||||||
<svg
|
|
||||||
class="w-4 h-4 ml-2"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
stroke="currentColor"
|
|
||||||
stroke-width="2"
|
|
||||||
fill="none"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
>
|
|
||||||
<path d="M5 12h14"></path>
|
|
||||||
<path d="M12 5l7 7-7 7"></path>
|
|
||||||
</svg>
|
|
||||||
</a>
|
|
||||||
</router-link>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</section>
|
||||||
</section>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
@@ -58,7 +58,7 @@ export default {
|
|||||||
if (!this.loaded) {
|
if (!this.loaded) {
|
||||||
this.loaded = true;
|
this.loaded = true;
|
||||||
console.log("Here");
|
console.log("Here");
|
||||||
this.socket = io.connect("localhost:4000");
|
this.socket = io.connect("jslightham:4000");
|
||||||
this.runCode();
|
this.runCode();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -4,6 +4,11 @@ module.exports = {
|
|||||||
"./src/**/*.{vue,js,ts,jsx,tsx}",
|
"./src/**/*.{vue,js,ts,jsx,tsx}",
|
||||||
],
|
],
|
||||||
theme: {
|
theme: {
|
||||||
|
container: {
|
||||||
|
center: true,
|
||||||
|
|
||||||
|
padding: '5rem',
|
||||||
|
},
|
||||||
extend: {},
|
extend: {},
|
||||||
},
|
},
|
||||||
plugins: [],
|
plugins: [],
|
||||||
|
|||||||
Reference in New Issue
Block a user