Convert content from TSX to Markdown

This commit is contained in:
Foster Hangdaan 2023-08-03 19:31:43 -04:00
parent 6c49426837
commit 2ca9f3c80f
Signed by: foster
GPG key ID: E48D7F49A852F112
10 changed files with 132 additions and 177 deletions

View file

@ -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/>

View file

@ -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>

View file

@ -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;

View file

@ -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
View 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.

View file

@ -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
View 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.

View file

@ -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
View 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

View file

@ -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>
</>
);
}