Skip to content

Commit c5e30d3

Browse files
gradientsearchgradientsearch
committed
Merge branch 'add-some-blog-posts'
2 parents 1898c73 + 4c011d5 commit c5e30d3

File tree

8 files changed

+174
-3
lines changed

8 files changed

+174
-3
lines changed

‎.github/workflows/main.yml‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@ name: Deploy to GitHub Pages
22

33
on:
44
push:
5-
branches:
6-
- 'main'
7-
- 'confgiure-static-build'
5+
tags:
6+
- 'v*'
7+
88

99
jobs:
1010
build_site:

‎src/components/layout/pageLayout.svelte‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,15 @@
1313
</svelte:head>
1414

1515
<Container className="mt-16 sm:mt-20">
16+
<a
17+
aria-label={backText}
18+
class="mb-8 flex lg:hidden h-10 w-10 items-center justify-center rounded-full bg-white shadow-md shadow-zinc-800/5 ring-1 ring-zinc-900/5 transition hover:text-zinc-700 hover:ring-zinc-200 lg:absolute lg:-left-5 lg:-mt-2 lg:mb-0 lg:flex xl:-top-1.5 xl:left-0 xl:mt-0 dark:border dark:border-zinc-700/50 dark:bg-zinc-800 dark:text-zinc-500 dark:ring-0 dark:ring-white/10 dark:hover:border-zinc-700 dark:hover:text-zinc-400 dark:hover:ring-white/20"
19+
href={backHref}
20+
type="button"
21+
>
22+
<ArrowLeft class="size-4" />
23+
</a>
24+
1625
<div class="xl:relative">
1726
<div class="mx-auto max-w-2xl">
1827
<a

‎src/components/socials.svelte‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,22 @@
4747
></path></svg
4848
></a
4949
>
50+
<a
51+
class="group -m-1 rounded-full p-1 focusable"
52+
aria-label="Follow on LinkedIn"
53+
href="https://www.youtube.com/@gradientsearch"
54+
target="_blank"
55+
>
56+
<svg
57+
viewBox="0 0 50 50"
58+
aria-hidden="true"
59+
fill="currentColor"
60+
class="size-6 text-zinc-500 transition group-hover:text-sky-500 dark:text-zinc-300 dark:group-hover:text-sky-400"
61+
><path
62+
d="M 44.898438 14.5 C 44.5 12.300781 42.601563 10.699219 40.398438 10.199219 C 37.101563 9.5 31 9 24.398438 9 C 17.800781 9 11.601563 9.5 8.300781 10.199219 C 6.101563 10.699219 4.199219 12.199219 3.800781 14.5 C 3.398438 17 3 20.5 3 25 C 3 29.5 3.398438 33 3.898438 35.5 C 4.300781 37.699219 6.199219 39.300781 8.398438 39.800781 C 11.898438 40.5 17.898438 41 24.5 41 C 31.101563 41 37.101563 40.5 40.601563 39.800781 C 42.800781 39.300781 44.699219 37.800781 45.101563 35.5 C 45.5 33 46 29.398438 46.101563 25 C 45.898438 20.5 45.398438 17 44.898438 14.5 Z M 19 32 L 19 18 L 31.199219 25 Z"
63+
/></svg
64+
></a
65+
>
5066
</div>
5167
{/if}
5268

@@ -95,5 +111,21 @@
95111
></path></svg
96112
>&nbsp;&nbsp; Connect with me on LinkedIn</a
97113
>
114+
115+
<a
116+
class="group -m-1 rounded-full p-1 focusable flex flex-row"
117+
aria-label="Watch on YouTube"
118+
href="https://www.youtube.com/@gradientsearch"
119+
target="_blank"
120+
><svg
121+
viewBox="0 0 50 50"
122+
aria-hidden="true"
123+
fill="currentColor"
124+
class="size-6 text-zinc-500 transition group-hover:text-sky-500 dark:text-zinc-300 dark:group-hover:text-sky-400"
125+
><path
126+
d="M 44.898438 14.5 C 44.5 12.300781 42.601563 10.699219 40.398438 10.199219 C 37.101563 9.5 31 9 24.398438 9 C 17.800781 9 11.601563 9.5 8.300781 10.199219 C 6.101563 10.699219 4.199219 12.199219 3.800781 14.5 C 3.398438 17 3 20.5 3 25 C 3 29.5 3.398438 33 3.898438 35.5 C 4.300781 37.699219 6.199219 39.300781 8.398438 39.800781 C 11.898438 40.5 17.898438 41 24.5 41 C 31.101563 41 37.101563 40.5 40.601563 39.800781 C 42.800781 39.300781 44.699219 37.800781 45.101563 35.5 C 45.5 33 46 29.398438 46.101563 25 C 45.898438 20.5 45.398438 17 44.898438 14.5 Z M 19 32 L 19 18 L 31.199219 25 Z"
127+
/></svg
128+
>&nbsp;&nbsp; Watch on YouTube</a
129+
>
98130
</div>
99131
{/if}

‎src/components/socials.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,5 +13,10 @@ export const socials = [
1313
href: 'https://linkedin.com/in/stephenodwyer/',
1414
label: 'Follow on LinkedIn',
1515
name: 'LinkedIn'
16+
},
17+
{
18+
href: 'https://www.youtube.com/@gradientsearch',
19+
label: 'Watch on YouTube',
20+
name: 'YouTube'
1621
}
1722
];

‎src/routes/(main)/blog/3/+page.svelte‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<script lang="ts">
2+
import { posts, type post } from '../posts';
3+
import PageSubtitle from '../../../../components/pageSubtitle.svelte';
4+
import PageLayout from '../../../../components/layout/pageLayout.svelte';
5+
import PageParagraph from '../../../../components/pageParagraph.svelte';
6+
7+
let p: post = posts[2];
8+
let title = p.title;
9+
let date = p.date;
10+
let backText = 'blog';
11+
let backHref = '/blog';
12+
</script>
13+
14+
<!-- POST 2 -->
15+
16+
<PageLayout {backHref} {backText} {title} {date}>
17+
<PageSubtitle className="underline underline-offset-8 decoration-sky-500">Demo</PageSubtitle>
18+
<PageParagraph>
19+
In this demo, I showcase an open-source password manager I’m currently developing, which
20+
integrates with HashiCorp Vault via a Vault plugin. I walk through the process of registering a
21+
user, unlocking the password manager, and creating and viewing passwords. Additionally, I
22+
explain how password entries are stored in Vault using the KV-v2 secret engine, including the
23+
encryption and decryption processes, and how Vault policies control access to these entries.
24+
</PageParagraph>
25+
<div class="pt-10">
26+
<iframe
27+
class="md:min-h-[315px] min-h-[250px] w-full"
28+
src="https://www.youtube.com/embed/T7pL32kxAhQ?si=Ef4lowBpqeODZPUE"
29+
title="YouTube video player"
30+
frameborder="0"
31+
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
32+
referrerpolicy="strict-origin-when-cross-origin"
33+
allowfullscreen
34+
></iframe>
35+
</div>
36+
</PageLayout>

‎src/routes/(main)/blog/4/+page.svelte‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<script lang="ts">
2+
import { posts, type post } from '../posts';
3+
import PageSubtitle from '../../../../components/pageSubtitle.svelte';
4+
import PageLayout from '../../../../components/layout/pageLayout.svelte';
5+
import PageParagraph from '../../../../components/pageParagraph.svelte';
6+
7+
let p: post = posts[3];
8+
let title = p.title;
9+
let date = p.date;
10+
let backText = 'blog';
11+
let backHref = '/blog';
12+
</script>
13+
14+
<!-- POST 2 -->
15+
16+
<PageLayout {backHref} {backText} {title} {date}>
17+
<PageSubtitle className="underline underline-offset-8 decoration-sky-500">Tutorial</PageSubtitle>
18+
<PageParagraph>
19+
In this tutorial, we’ll walk through setting up the development environment for PwManager and
20+
registering a user. We’ll cover the steps to configure the environment, start the client-side
21+
app, log into Vault, and create a user account. You’ll also learn how to store the secret key,
22+
unlock the password manager, and add your first password entry.
23+
</PageParagraph>
24+
<div class="pt-10">
25+
<iframe
26+
class="md:min-h-[315px] min-h-[250px] w-full"
27+
src="https://www.youtube.com/embed/bdtOFmLfTd8?si=u8FsL1UWs2AxWZvq"
28+
title="YouTube video player"
29+
frameborder="0"
30+
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
31+
referrerpolicy="strict-origin-when-cross-origin"
32+
allowfullscreen
33+
></iframe>
34+
</div>
35+
</PageLayout>

‎src/routes/(main)/blog/5/+page.svelte‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<script lang="ts">
2+
import { posts, type post } from '../posts';
3+
import PageSubtitle from '../../../../components/pageSubtitle.svelte';
4+
import PageLayout from '../../../../components/layout/pageLayout.svelte';
5+
import PageParagraph from '../../../../components/pageParagraph.svelte';
6+
7+
let p: post = posts[4];
8+
let title = p.title;
9+
let date = p.date;
10+
let backText = 'blog';
11+
let backHref = '/blog';
12+
</script>
13+
14+
<!-- POST 2 -->
15+
16+
<PageLayout {backHref} {backText} {title} {date}>
17+
<PageSubtitle className="underline underline-offset-8 decoration-sky-500">Demo</PageSubtitle>
18+
<PageParagraph>
19+
In this demo, we go over how to update, add, and delete entries in a password manager. You’ll
20+
see how to modify existing passwords, add extra details like text or date, and remove items or
21+
entries as needed. We also demonstrate how to work with different types of data such as text,
22+
passwords, and dates. This session builds on the first demo, showing the new functionality added
23+
to manage password entries more effectively.
24+
</PageParagraph>
25+
<div class="pt-10">
26+
<iframe
27+
class="md:min-h-[315px] min-h-[250px] w-full"
28+
src="https://www.youtube.com/embed/IN9dkl5nD6M?si=CLMztd9T6IOMFAsw"
29+
title="YouTube video player"
30+
frameborder="0"
31+
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
32+
referrerpolicy="strict-origin-when-cross-origin"
33+
allowfullscreen
34+
></iframe>
35+
</div>
36+
</PageLayout>

‎src/routes/(main)/blog/posts.ts‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,5 +16,23 @@ export const posts: post[] = [
1616
title: 'How to Host a Svelte Static Site on GitHub Pages',
1717
description: `In today’s web development world, building fast and lightweight static sites is easier than ever. One such powerful framework for creating modern, high-performance static sites is Svelte. Known for its simplicity and speed, Svelte compiles down to optimized JavaScript, offering an excellent user experience with minimal overhead.`,
1818
date: '2024-12-17'
19+
},
20+
{
21+
id: '3',
22+
title: 'Developing an Open-Source Password Manager with HashiCorp Vault Plugin',
23+
description: `In this demo, I showcase an open-source password manager I’m currently developing, which integrates with HashiCorp Vault via a Vault plugin. I walk through the process of registering a user, unlocking the password manager, and creating and viewing passwords. Additionally, I explain how password entries are stored in Vault using the KV-v2 secret engine, including the encryption and decryption processes, and how Vault policies control access to these entries.`,
24+
date: '2025-01-17'
25+
},
26+
{
27+
id: '4',
28+
title: 'Setting Up PwManager Development Environment and Registering a User',
29+
description: `In this tutorial, we’ll walk through setting up the development environment for PwManager and registering a user. We’ll cover the steps to configure the environment, start the client-side app, log into Vault, and create a user account. You’ll also learn how to store the secret key, unlock the password manager, and add your first password entry.`,
30+
date: '2025-01-24'
31+
},
32+
{
33+
id: '5',
34+
title: 'Managing Password Entries: Edit, Add, and Delete Features',
35+
description: `In this demo, we go over how to update, add, and delete entries in a password manager. You’ll see how to modify existing passwords, add extra details like text or date, and remove items or entries as needed. We also demonstrate how to work with different types of data such as text, passwords, and dates. This session builds on the first demo, showing the new functionality added to manage password entries more effectively.`,
36+
date: '2025-01-31'
1937
}
2038
];

0 commit comments

Comments
 (0)