Convert content from TSX to Markdown
This commit is contained in:
parent
6c49426837
commit
2ca9f3c80f
10 changed files with 132 additions and 177 deletions
|
@ -7,6 +7,7 @@ export default function({ comp }) {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<footer className="page-footer">
|
<footer className="page-footer">
|
||||||
|
{comp.separator()}
|
||||||
<div className="social-links">
|
<div className="social-links">
|
||||||
<a href="https://code.fosterhangdaan.com/foster" title="Forgejo" target="_blank">
|
<a href="https://code.fosterhangdaan.com/foster" title="Forgejo" target="_blank">
|
||||||
<ForgejoIcon/>
|
<ForgejoIcon/>
|
||||||
|
|
|
@ -17,7 +17,6 @@ export default function({ title, description, children, comp }) {
|
||||||
{ comp.navbar() }
|
{ comp.navbar() }
|
||||||
{ comp.header({title, description}) }
|
{ comp.header({title, description}) }
|
||||||
<main>{children}</main>
|
<main>{children}</main>
|
||||||
{ comp.separator() }
|
|
||||||
{ comp.footer() }
|
{ comp.footer() }
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -17,11 +17,27 @@ body {
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
padding: 0 1rem;
|
||||||
|
margin: 0 auto;
|
||||||
|
max-width: var(--page--max-width);
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
color: var(--color-blue);
|
||||||
|
font-weight: bold;
|
||||||
|
margin-top: 1.5rem;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
border-bottom: 1px solid var(--color-black);
|
||||||
|
padding-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
p {
|
p {
|
||||||
|
margin-top: 1rem;
|
||||||
margin-bottom: 1rem;
|
margin-bottom: 1rem;
|
||||||
&:only-child, &:last-child {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
|
@ -53,23 +69,6 @@ hr {
|
||||||
margin-bottom: 1rem;
|
margin-bottom: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
|
||||||
color: var(--color-blue);
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
section {
|
|
||||||
padding: 1rem;
|
|
||||||
margin: 0 auto;
|
|
||||||
max-width: var(--page--max-width);
|
|
||||||
& > * {
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
& > *:last-child {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
code {
|
code {
|
||||||
padding: 0.1em 0.3em;
|
padding: 0.1em 0.3em;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
|
|
|
@ -2,7 +2,7 @@ .page-footer {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
max-width: var(--page--max-width);
|
max-width: var(--page--max-width);
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: 1rem;
|
padding: 2rem 1rem;
|
||||||
|
|
||||||
.social-links {
|
.social-links {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
31
gpg-key.md
Normal file
31
gpg-key.md
Normal file
|
@ -0,0 +1,31 @@
|
||||||
|
---
|
||||||
|
title: GPG Key
|
||||||
|
description: Information about my public GPG key and how to obtain it.
|
||||||
|
---
|
||||||
|
|
||||||
|
|
||||||
|
## Intro
|
||||||
|
|
||||||
|
Before proceeding, I suggest reading up on GPG if you are unfamiliar with it.
|
||||||
|
You can find more information about GPG on the [GnuPG official website](https://gnupg.org/){target="_blank"}.
|
||||||
|
|
||||||
|
You can utilize the public key here to verify software and binaries released by me.
|
||||||
|
|
||||||
|
You can also use the key to encrypt emails you send to me. In that case, I would also need your public key so I can encrypt the emails I send back to you.
|
||||||
|
The excellent [Email Self-Defense Guide by the Free Software Foundation](https://emailselfdefense.fsf.org/){target="_blank"} describes how this process works.
|
||||||
|
|
||||||
|
> I do not use keyservers. This is the only place where I provide my public key. A key claiming to be mine somewhere else is definitely a fake.
|
||||||
|
|
||||||
|
## Obtaining my key
|
||||||
|
|
||||||
|
Start by downloading my key: [Foster Hangdaan's Public Key](https://static.fosterhangdaan.com/foster-pubkey.asc){target="_blank"}{download}.
|
||||||
|
|
||||||
|
Ensure that the key's fingerprint matches the one below:
|
||||||
|
|
||||||
|
```
|
||||||
|
pub ed25519/E48D7F49A852F112 2023-07-14 [SC]
|
||||||
|
Key fingerprint = DBD3 8E38 4B9E 1F4F 19F9 5BAE E48D 7F49 A852 F112
|
||||||
|
uid Foster Hangdaan <foster@hangdaan.email>
|
||||||
|
```
|
||||||
|
|
||||||
|
If the fingerprints match, import the key so that it's ready for use.
|
51
gpg-key.tsx
51
gpg-key.tsx
|
@ -1,51 +0,0 @@
|
||||||
export const title = "GPG Key";
|
|
||||||
|
|
||||||
export const description = "Information about my public GPG key and how to obtain it.";
|
|
||||||
|
|
||||||
const gpgFingerprint = `
|
|
||||||
pub ed25519/E48D7F49A852F112 2023-07-14 [SC]
|
|
||||||
Key fingerprint = DBD3 8E38 4B9E 1F4F 19F9 5BAE E48D 7F49 A852 F112
|
|
||||||
uid Foster Hangdaan <foster@hangdaan.email>
|
|
||||||
`;
|
|
||||||
|
|
||||||
export default function() {
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<section>
|
|
||||||
<h2>Intro</h2>
|
|
||||||
<p>
|
|
||||||
Before proceeding, I suggest reading up on GPG if you are unfamiliar with it.
|
|
||||||
You can find more information about GPG on the <a href="https://gnupg.org/" target="_blank">GnuPG official website</a>.
|
|
||||||
</p>
|
|
||||||
<p>You can utilize the public key here to verify software and binaries released by me.</p>
|
|
||||||
<p>
|
|
||||||
You can also use the key to encrypt emails you send to me. In that case, I would also need your public key so I can encrypt the emails I send back to you.
|
|
||||||
The excellent <a href="https://emailselfdefense.fsf.org/" target="_blank">Email Self-Defense Guide by the Free Software Foundation</a> describes how this process works.
|
|
||||||
</p>
|
|
||||||
<blockquote>
|
|
||||||
<p>
|
|
||||||
<strong className="highlight">NOTE: </strong>
|
|
||||||
I do not use keyservers.
|
|
||||||
This is the only place where I provide my public key.
|
|
||||||
A key claiming to be mine somewhere else is definitely a fake.
|
|
||||||
</p>
|
|
||||||
</blockquote>
|
|
||||||
</section>
|
|
||||||
<section>
|
|
||||||
<h2>Obtaining my key</h2>
|
|
||||||
<p>
|
|
||||||
Start by downloading my key: <a href="https://static.fosterhangdaan.com/foster-pubkey.asc" target="_blank" download>Foster Hangdaan's Public Key</a>.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Ensure that the key's fingerprint matches the one below:
|
|
||||||
</p>
|
|
||||||
<pre>
|
|
||||||
<code>
|
|
||||||
{gpgFingerprint.trim()}
|
|
||||||
</code>
|
|
||||||
</pre>
|
|
||||||
<p>If the fingerprints match, import the key so that it's ready for use.</p>
|
|
||||||
</section>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
20
index.md
Normal file
20
index.md
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
---
|
||||||
|
description: Software developer and open-source enthusiast.
|
||||||
|
---
|
||||||
|
|
||||||
|
## About Me
|
||||||
|
|
||||||
|
I am a software developer, open-source enthusiast, lover of pizza, and renegade of funk.
|
||||||
|
|
||||||
|
I speak fluent English and native Filipino. I also plan on learning German.
|
||||||
|
|
||||||
|
You'll most likely find me within [my lab](https://code.fosterhangdaan.com/foster){target="_blank"} tinkering with my inventions and the latest JavaScript frameworks.
|
||||||
|
An Android app and a Thunderbird extension are currently in the works.
|
||||||
|
|
||||||
|
Other times, I help in the battle for an open web and for user privacy by contributing in the development of free and open-source software.
|
||||||
|
|
||||||
|
## Contact Me
|
||||||
|
|
||||||
|
The primary method of reaching me is through my email: [foster@hangdaan.email](mailto:foster@hangdaan.email).
|
||||||
|
|
||||||
|
If you'd like an encrypted response, you can send me your GPG public key. You can find mine in the [GPG Key](/gpg-key) page.
|
33
index.tsx
33
index.tsx
|
@ -1,33 +0,0 @@
|
||||||
export const description = "Software developer and open-source enthusiast.";
|
|
||||||
|
|
||||||
export default function() {
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<section>
|
|
||||||
<h2 id="about">About Me</h2>
|
|
||||||
<p>
|
|
||||||
I am a software developer, open-source enthusiast, lover of pizza, and renegade of funk.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
I speak fluent English and native Filipino. I also plan on learning German.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
You'll most likely find me within <a href="https://code.fosterhangdaan.com/foster" target="_blank">my lab</a> tinkering with my inventions and the latest JavaScript frameworks.
|
|
||||||
An Android app and a Thunderbird extension are currently in the works.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Other times, I help in the battle for an open web and for user privacy by contributing in the development of free and open-source software.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
<section>
|
|
||||||
<h2 id="contact-me">Contact Me</h2>
|
|
||||||
<p>
|
|
||||||
The primary method of reaching me is through my email: <a href="mailto:foster@hangdaan.email">foster@hangdaan.email</a>.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
If you'd like an encrypted response, you can send me your GPG public key. You can find mine in the <a href="/gpg-key">GPG Key</a> page.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
60
resume.md
Normal file
60
resume.md
Normal file
|
@ -0,0 +1,60 @@
|
||||||
|
---
|
||||||
|
title: Resume
|
||||||
|
description: My experience, skills, education, etc.
|
||||||
|
---
|
||||||
|
|
||||||
|
## Experience
|
||||||
|
|
||||||
|
### Zetane Systems
|
||||||
|
|
||||||
|
Position: Full-Stack Developer<br/>
|
||||||
|
October 2021 - present
|
||||||
|
|
||||||
|
- Develop pages and components in Next.js according to Figma designs.
|
||||||
|
- Create CI/CD pipeline to containerize app and deploy to AWS.
|
||||||
|
- Debug and fix software issues.
|
||||||
|
- Ensure application quality and functionality by writing end-to-end tests using Cypress.
|
||||||
|
|
||||||
|
### Startup Tech Pros
|
||||||
|
|
||||||
|
Tech Lead<br/>
|
||||||
|
June 2022 - present
|
||||||
|
|
||||||
|
- Set standards and procedures for Engineering department.
|
||||||
|
- Design, maintain and deploy cloud infrastructure.
|
||||||
|
- Manage software development projects.
|
||||||
|
- Determine software tools and services based on company budget and requirements.
|
||||||
|
- Collaborate with clients to create websites and infrastructure based on business needs.
|
||||||
|
|
||||||
|
## Education
|
||||||
|
|
||||||
|
### Computer Engineering Technology
|
||||||
|
|
||||||
|
Emphasis in Computer Programming<br/>
|
||||||
|
Seneca College of Applied Arts and Technology<br/>
|
||||||
|
Graduated August 2020<br/>
|
||||||
|
Cumulative GPA 4.0/4.0<br/>
|
||||||
|
|
||||||
|
## Skills
|
||||||
|
|
||||||
|
### Programming Languages
|
||||||
|
|
||||||
|
- JavaScript
|
||||||
|
- TypeScript
|
||||||
|
- HTML
|
||||||
|
- CSS
|
||||||
|
- BASH
|
||||||
|
|
||||||
|
### Frameworks & Libraries
|
||||||
|
|
||||||
|
- Deno
|
||||||
|
- Fresh
|
||||||
|
- Lume
|
||||||
|
- Next.js
|
||||||
|
- Node.js
|
||||||
|
- Vue.js
|
||||||
|
|
||||||
|
### Other Tools & Software
|
||||||
|
|
||||||
|
- Docker
|
||||||
|
- Linux
|
71
resume.tsx
71
resume.tsx
|
@ -1,71 +0,0 @@
|
||||||
export const title = "Resume";
|
|
||||||
|
|
||||||
export const description = "My experience, skills, education, etc.";
|
|
||||||
|
|
||||||
export default function() {
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<section>
|
|
||||||
<h2>Experience</h2>
|
|
||||||
<div>
|
|
||||||
<h3 className="inline">Zetane Systems</h3>
|
|
||||||
<span className="resume--work-position">Full-Stack Developer</span>
|
|
||||||
<div>October 2021 - present</div>
|
|
||||||
</div>
|
|
||||||
<ul>
|
|
||||||
<li>Develop pages and components in Next.js according to Figma designs.</li>
|
|
||||||
<li>Create CI/CD pipeline to containerize app and deploy to AWS.</li>
|
|
||||||
<li>Debug and fix software issues.</li>
|
|
||||||
<li>Ensure application quality and functionality by writing end-to-end tests using Cypress.</li>
|
|
||||||
</ul>
|
|
||||||
<div>
|
|
||||||
<h3 className="inline">Startup Tech Pros</h3>
|
|
||||||
<span className="resume--work-position">Tech Lead</span>
|
|
||||||
<div>June 2022 - present</div>
|
|
||||||
</div>
|
|
||||||
<ul>
|
|
||||||
<li>Set standards and procedures for Engineering department.</li>
|
|
||||||
<li>Design, maintain and deploy cloud infrastructure.</li>
|
|
||||||
<li>Manage software development projects.</li>
|
|
||||||
<li>Determine software tools and services based on company budget and requirements.</li>
|
|
||||||
<li>Collaborate with clients to create websites and infrastructure based on business needs.</li>
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
<section>
|
|
||||||
<h2>Education</h2>
|
|
||||||
<div>
|
|
||||||
<h3 className="inline">Computer Engineering Technology</h3>
|
|
||||||
<span className="resume--education-emphasis">Emphasis in Computer Programming</span>
|
|
||||||
<div>Seneca College of Applied Arts and Technology</div>
|
|
||||||
<div>Graduated August 2020</div>
|
|
||||||
<div>Cumulative GPA 4.0/4.0</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section>
|
|
||||||
<h2>Skills</h2>
|
|
||||||
<h3>Programming Languages</h3>
|
|
||||||
<ul>
|
|
||||||
<li>JavaScript</li>
|
|
||||||
<li>TypeScript</li>
|
|
||||||
<li>HTML</li>
|
|
||||||
<li>CSS</li>
|
|
||||||
<li>BASH</li>
|
|
||||||
</ul>
|
|
||||||
<h3>Frameworks & Libraries</h3>
|
|
||||||
<ul>
|
|
||||||
<li>Deno</li>
|
|
||||||
<li>Fresh</li>
|
|
||||||
<li>Lume</li>
|
|
||||||
<li>Next.js</li>
|
|
||||||
<li>Node.js</li>
|
|
||||||
<li>Vue.js</li>
|
|
||||||
</ul>
|
|
||||||
<h3>Other Tools & Software</h3>
|
|
||||||
<ul>
|
|
||||||
<li>Docker</li>
|
|
||||||
<li>Linux</li>
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
Loading…
Reference in a new issue