Rename categories to topics

This commit is contained in:
2025-05-07 19:50:38 +08:00
parent f1fb698fca
commit 90097f6aaa
40 changed files with 124 additions and 124 deletions

View File

@@ -10,7 +10,7 @@ import { VentoPlugin } from 'eleventy-plugin-vento';
import markdownItConfig from "./src/_config/markdown-it.js";
import feedsConfig from "./src/_config/feeds.js";
import filesConfig from "./src/_config/files.js";
import categoriesConfig from "./src/_config/categories.js";
import topicsConfig from "./src/_config/topics.js";
import filtersConfig from "./src/_config/filters.js";
import shortCodesConfig from "./src/_config/shortcodes.js";
@@ -34,7 +34,7 @@ export default function(eleventyConfig) {
eleventyConfig.addPlugin(markdownItConfig);
eleventyConfig.addPlugin(feedsConfig);
eleventyConfig.addPlugin(filesConfig);
eleventyConfig.addPlugin(categoriesConfig);
eleventyConfig.addPlugin(topicsConfig);
eleventyConfig.addPlugin(filtersConfig);
eleventyConfig.addPlugin(shortCodesConfig);

View File

@@ -1,26 +0,0 @@
export default function(eleventyConfig) {
// Add blog post categories to collections
eleventyConfig.addCollection("categories", (collectionApi) => {
let categories = new Set();
let posts = collectionApi.getFilteredByTag('posts');
posts.forEach(p => {
let cats = p.data.categories;
if (cats) {
cats.forEach(c => categories.add(c));
}
});
return Array.from(categories).sort();
});
// Filter: Filter blog posts by category
eleventyConfig.addFilter("filterByCategory", (posts, cat) => {
cat = cat.toLowerCase();
let result = posts.filter(p => {
let cats = p.data.categories.map(s => s.toLowerCase());
if (cats) {
return cats.includes(cat);
}
});
return result;
});
}

26
src/_config/topics.js Normal file
View File

@@ -0,0 +1,26 @@
export default function(eleventyConfig) {
// Add blog post topics to collections
eleventyConfig.addCollection("topics", (collectionApi) => {
let topics = new Set();
let posts = collectionApi.getFilteredByTag("posts");
posts.forEach(p => {
let tops = p.data.topics;
if (tops) {
tops.forEach(t => topics.add(t));
}
});
return Array.from(topics).sort();
});
// Filter: Filter blog posts by topicegory
eleventyConfig.addFilter("filterByTopic", (posts, topic) => {
topic = topic.toLowerCase();
let result = posts.filter(p => {
let tops = p.data.topics.map(t => t.toLowerCase());
if (tops) {
return tops.includes(topic);
}
});
return result;
});
}

View File

@@ -16,9 +16,9 @@ layout: layouts/base
{{ if updated }}
<p><span class="text-bold">Last Updated:</span> <time datetime="{{ updated }}">{{ updated |> formatDate }}</time></p>
{{ /if }}
<p><span class="text-bold">Categories:</span>
{{ for cat of categories }}
<a href="/blog/categories/{{ cat |> slugify }}">{{ cat }}</a>{{ if categories.indexOf(cat) !== categories.length - 1 }}, {{ /if }}
<p><span class="text-bold">Topics:</span>
{{ for topic of topics }}
<a href="/blog/topics/{{ topic |> slugify }}">{{ topic }}</a>{{ if topics.indexOf(topic) !== topics.length - 1 }}, {{ /if }}
{{ /for }}
</p>
</div>

View File

@@ -1,21 +0,0 @@
---
layout: layouts/content
title: Blog Post Categories
tags: blog pages
hasBreadcrumbs: true
eleventyNavigation:
key: Blog Categories
title: Categories
parent: Blog
order: 2
---
<ul>
{{ for category of collections.categories }}
{{ set categoryUrl }}/blog/categories/{{ category |> slugify }}/{{ /set }}
{{ set categoryPostCount = collections.posts |> filterByCategory(category) |> itemCount }}
<li><a href="{{ categoryUrl }}">{{ category }}</a> ({{ categoryPostCount }} posts)</li>
{{ /for }}
</ul>
<p>See all blog posts in the <a href="posts.vto">archive</a>.</p>

View File

@@ -1,22 +0,0 @@
---
pagination:
data: collections.categories
size: 1
alias: category
addAllPagesToCollections: true
permalink: /blog/categories/{{ category |> slugify }}/
layout: layouts/content
hasBreadcrumbs: true
eleventyComputed:
title: 'Blog Post Category: "{{ category }}"'
eleventyNavigation:
key: "{{ category }}"
parent: Blog Categories
---
{{ set postCount = collections.posts |> filterByCategory(category) |> itemCount }}
<h2 class="blog__cat--title">{{ postCount }} Posts Filed Under "{{ category }}"</h2>
{{ set postList = collections.posts |> filterByCategory(category) |> toReversed }}
{{ include "partials/postslist.vto" }}
<p>See <a href="/blog/categories/">all blog post categories</a>.</p>

View File

@@ -2,7 +2,7 @@
title: Welcome to Helen Codes
desc: Welcome to Helen Chong's coding and tech blog.
date: 2023-08-21
categories: ["about this blog"]
topics: ["about this blog"]
---
My name is Helen Chong. I am a self-taught developer with 8 years of working experience as a graphic designer.
@@ -11,4 +11,4 @@ I created this blog to document my coding learnings and talk about various tech
You can check out [my portfolio website](https://helenclx.github.io).
Enjoy!
Enjoy!

View File

@@ -2,7 +2,7 @@
title: Built A TickyBot Clone for Chingu's Solo Projects
desc: I built a TickyBot Clone for Chingu's Solo Project.
date: 2023-08-24
categories: ["chingu"]
topics: ["chingu"]
---
On 11 August 2023, I decided to join [Chingu](https://www.chingu.io/) after discovering its existence through the [Scrimba Podcast](https://www.chingu.io/), specifically [Episode 127](https://scrimba.com/podcast/are-you-a-new-developer-follow-this-one-tip-with-scrimba-student-danny/). I have learned coding since December 2022, and one of the challenges aspiring self-taught developers face is gaining practical experience that can prepare them for developer jobs, so when I discovered Chingu, I thought it could be an opportunity for me to gain experience in working in group developer projects, thus I registered on the platform and joined the Chingu community on Discord.

View File

@@ -2,7 +2,7 @@
title: CS50x Week 7 Completed
desc: I have completed and submitted the Week 7 assignment of the CS50's Introduction to Computer Science (CS50x) course.
date: 2023-09-10
categories: ["cs50", "cs50x", "sql"]
topics: ["cs50", "cs50x", "sql"]
---
On 8 September 2023, I completed [Week 7](https://cs50.harvard.edu/x/2023/weeks/7/) of [CS50s Introduction to Computer Science](https://cs50.harvard.edu/x/2023/) (CS50x) course, by submitting the required assignments, [Lab 7](https://cs50.harvard.edu/x/2023/labs/7/) and [Problem Set 7](https://cs50.harvard.edu/x/2023/psets/7/).
@@ -11,4 +11,4 @@ Week 7 of the CS50x course revolved around SQL. Since I was focusing on learning
However, it turned out SQL and working on databases was more fun than I expected. I had a good time in writing out the SQL queries to solve this week's assigned problems. In particular, I found my new favourite assignment from CS50x in the [Fiftyville](https://cs50.harvard.edu/x/2023/psets/7/fiftyville/) problem, which involved using SQL to solve a mystery of a theft of the CS50 Duck. I had a great deal of fun with the Fiftyville problem from start to finish, from writing my SQL queries and comments about my thought process in solving the mysteries, to narrowing down the suspects and eventually identifying the thief and their accomplice. Kudos to those who designed this fun and challenging assignment!
Now that I am done with Week 7 of CS50x, I am ready to move on to next week, which will be about HTML, CSS and JavaScript — the languages I had spent the past eight months in learning and practicing through various courses outside CS50. CS50x Week 8 here I come!
Now that I am done with Week 7 of CS50x, I am ready to move on to next week, which will be about HTML, CSS and JavaScript — the languages I had spent the past eight months in learning and practicing through various courses outside CS50. CS50x Week 8 here I come!

View File

@@ -2,11 +2,11 @@
title: CS50x Week 8 Assignments Completed
desc: I have completed and submitted the Week 8 assignment of the CS50's Introduction to Computer Science (CS50x) course.
date: 2023-09-26
categories: ["cs50", "cs50x", "html", "css", "javascript"]
topics: ["cs50", "cs50x", "html", "css", "javascript"]
---
At last, I completed and submitted [Week 8](https://cs50.harvard.edu/x/2023/weeks/8/) assignments of the CS50's Introduction to Computer Science (CS50x) course, including [Lab 8](https://cs50.harvard.edu/x/2023/labs/8/) and [Problem Set 8](https://cs50.harvard.edu/x/2023/psets/8/).
The eighth week of the CS50x is about HTML, CSS, JavaScript and how the internet works. I already have a good foundation in HTML, CSS and JavaScript since I started taking front-end web development courses on other platforms like freeCodeCamp and Scrimba since December 2022. Even then, I learned new things about how the internet works from the CS50x course.
As for the assignments, I already completed and submitted Lab 8 on September 13, but it took almost two weeks after submitting Lab 8 for me to finally finish Problem Set 8, because I was struggling to come out of ideas about what to put on my pages to meet CS50x's requirement. I was relieved when I finally finished Problem Set 8.
As for the assignments, I already completed and submitted Lab 8 on September 13, but it took almost two weeks after submitting Lab 8 for me to finally finish Problem Set 8, because I was struggling to come out of ideas about what to put on my pages to meet CS50x's requirement. I was relieved when I finally finished Problem Set 8.

View File

@@ -2,7 +2,7 @@
title: cbpickaxe and My First (Merged) Pull Request in Python
desc: About my first pull request in Python that got approved and merged.
date: 2023-11-13
categories: ["python", "github", "cbpickaxe", "cassette beasts"]
topics: ["python", "github", "cbpickaxe", "cassette beasts"]
---
Recently, on 11 November 2023, I created my first pull request in Python that got merged later. Specifically, the pull request was for [cbpickaxe](https://github.com/ExcaliburZero/cbpickaxe), a Python library and set of scripts for data mining the video game [Cassette Beasts](https://www.cassettebeasts.com/), titled ["extract\_translation Script: Add support for finding strings of IDs that require pronoun identifiers"](https://github.com/ExcaliburZero/cbpickaxe/pull/3).
@@ -26,4 +26,4 @@ Voilà! At last, I solved the problem!
After testing my code multiple times to ensure it works, I made a pull request on cbpickaxe's GitHub repository. ExcaliburZero approved and merged my pull request, which has become my first merged pull request on Python! This pull request has been included in the release of cbpickaxe starting from [version 0.1.2](https://github.com/ExcaliburZero/cbpickaxe/releases/tag/v0.1.2).
I am immensely grateful of this opportunity to not only contribute to an open source project that is realated to one of my favourite video games, but also practicing my Python skills.
I am immensely grateful of this opportunity to not only contribute to an open source project that is realated to one of my favourite video games, but also practicing my Python skills.

View File

@@ -2,7 +2,7 @@
title: Chingu Voyage 46 Completed
desc: My participation and winning of Scrimba's JavaScriptmas 2023 challenge.
date: 2023-11-25
categories: ["chingu"]
topics: ["chingu"]
---
On 12 November 2023, I, along with two other teammates had officially completed [Chingu](https://www.chingu.io/) Voyage 46. I received my [Certificate of Completion](/assets/documents/Chingu-Voyage46-Completion-Cert.pdf) (PDF file) from Chingu on 19 November 2023.

View File

@@ -2,7 +2,7 @@
title: JavaScriptmas 2023 Challenge Completed — and Won
desc: My participation and winning of Scrimba's JavaScriptmas 2023 challenge.
date: 2023-12-27T21:47:00+0800
categories: ["scrimba", "javascriptmas"]
topics: ["scrimba", "javascriptmas"]
---
Starting from 1 December 2023, I had participated in [Scrimba](https://scrimba.com/)'s [JavaScriptmas](https://scrimba.com/learn/javascriptmas) challenge. After 24 days, I finally completed the entire challenge! I have compiled a [scrim playlist](https://scrimba.com/playlist/pdpB3JZfE) for all my JavaScriptmas solutions on Scrimba.

View File

@@ -2,7 +2,7 @@
title: Rebuilding My Developer Portfolio with Eleventy
desc: I recreated my developer portfolio and blog from scratch with Eleventy.
date: 2024-04-11T18:03:00+0800
categories: ["eleventy", "about this website", "about this blog"]
topics: ["eleventy", "about this website", "about this blog"]
---
I have been taking courses to learn to code, starting from HTML, CSS and JavaScript, since December 2022. As I honed my front-end web development skills further by building projects, I quickly realised that I needed a portfolio website to showcase myself and my projects. Eventually, I launched my first developer portfolio website in February 2023, based on Kolade Chris tutorial ["How to Build Your Own Developer Portfolio Website with HTML, CSS, and JavaScript"](https://www.freecodecamp.org/news/how-to-build-a-developer-portfolio-website/) on freeCodeCamp, and deployed it to GitHub Pages.

View File

@@ -2,7 +2,7 @@
title: Round 1 of 100 Days of Code Challenge Completed
desc: I completed my first round of the 100 Days of Code challenge.
date: 2024-04-13T12:20:00+0800
categories: ["100 days of code", "freecodecamp"]
topics: ["100 days of code", "freecodecamp"]
---
On 3 January 2024, I started the [#100DaysOfCode](https://www.100daysofcode.com/) challenge for the first time. Came 11 April 2024, I finally completed my first round of the challenge!
@@ -21,4 +21,4 @@ To learn more about the #100DaysOfCode challenge, visit [its official website](h
The #100DaysOfCode challenge has been a wonderful journey. I am glad I managed to motivate myself to code every day. Through various courses and projects, I have honed my front-end development skills a lot.
Thank you to everyone who has supported me throughout my 100 Days of Code journey, and has interacted with my posts on Twitter, Mastodon, Bluesky and the freeCodeCamp Discord serve, by replying to, liking or reposting.
Thank you to everyone who has supported me throughout my 100 Days of Code journey, and has interacted with my posts on Twitter, Mastodon, Bluesky and the freeCodeCamp Discord serve, by replying to, liking or reposting.

View File

@@ -2,7 +2,7 @@
title: CS50x Week 9 Completed
desc: In March 2024, I have completed and submitted the Week 9 problem set of the CS50's Introduction to Computer Science (CS50x) course.
date: 2024-04-15T16:37:00+0800
categories: ["cs50", "cs50x", "python", "flask", "sql"]
topics: ["cs50", "cs50x", "python", "flask", "sql"]
---
At last, on 5 March 2024, I completed [Week 9](https://cs50.harvard.edu/x/2024/weeks/9/) of the CS50's Introduction to Computer Science (CS50x) course, by submitting my solutions to [Problem Set 9](https://cs50.harvard.edu/x/2024/psets/9/) . In other words, I have finished all assignments for the CS50x course, with the only thing left for me to do to complete the course is building and submitting my own [final project](https://cs50.harvard.edu/x/2024/project/).
@@ -27,4 +27,4 @@ Here is a video demonstration of my completed Finance project:
https://www.youtube.com/watch?v=AYkO59_Ojb4
Working on this assignment allowed me to practice and learn SQL, Python and Flask a lot. By finishing Week 9 of the CS50x, I reached another milestone.
Working on this assignment allowed me to practice and learn SQL, Python and Flask a lot. By finishing Week 9 of the CS50x, I reached another milestone.

View File

@@ -2,7 +2,7 @@
title: CS50x Course Completed
desc: About me completing the CS50s Introduction to Computer Science course.
date: 2024-05-27T21:47:00+0800
categories: ["cs50", "cs50x", "python", "flask", "sql"]
topics: ["cs50", "cs50x", "python", "flask", "sql"]
---
On 23 May 2024, at long last, I completed [CS50s Introduction to Computer Science](https://cs50.harvard.edu/x/2024/), also known as CS50x, course!

View File

@@ -2,7 +2,7 @@
title: Custom Domain Name for My Developer Website
desc: My developer website now has a custom domain name.
date: 2024-05-29T23:18:00+0800
categories: ["about this website"]
topics: ["about this website"]
---
This website — my developer portfolio and blog website — now has a custom domain: [helenchong.dev](https://helenchong.dev/)!

View File

@@ -2,7 +2,7 @@
title: Finally Deployed My Scrimba React Solo Projects to GitHub Pages
desc: At long last, I found a way to deploy my solo projects for Scirmba's React course form my repository's subdirectories.
date: 2024-06-03T11:01:00+0800
categories: ["scrimba", "react", "github pages"]
topics: ["scrimba", "react", "github pages"]
hasCodeBlock: true
---

View File

@@ -2,7 +2,7 @@
title: Dipping My Toes in PHP for My Hobby Project
desc: I started to learn to code in PHP for my hobby project.
date: 2024-07-08T13:21:00+0800
categories: ["php", "bellabuffs"]
topics: ["php", "bellabuffs"]
---
Hobbies are a great motivator to learn new things, and web development is no exception. I had dabbled in HTML and CSS since my teenage years, but it was not until December 2022 when I decided to take online web development courses, and then aspire to become a web developer.
@@ -29,4 +29,4 @@ I am glad that despite my inexperience in PHP, I was able to apply the programmi
I decided to fork BellaBuffs and release my version of the fanlisting script with PHPMailer integration, in case there are others who want to use BellaBuffs to build fanlistings, but cannot or do not want to use the PHP `mail()` function.
You can download my BellaBuffs fork and learn about how to use it from [its GitHub repository](https://github.com/helenclx/BellaBuffs-PHPMailer).
You can download my BellaBuffs fork and learn about how to use it from [its GitHub repository](https://github.com/helenclx/BellaBuffs-PHPMailer).

View File

@@ -4,7 +4,7 @@ desc: My developer portfolio and blog website has been officially upgraded to El
date: 2024-07-19T15:31:00+0800
updated: 2024-09-27T11:41:53+0800
templateEngineOverride: md
categories: ["about this website", "eleventy", "javascript"]
topics: ["about this website", "eleventy", "javascript"]
toc: true
hasCodeBlock: true
---

View File

@@ -3,7 +3,7 @@ title: Responsive Disability Pride Flag CSS Background
desc: I coded the Disability Pride Flag in CSS to celebrate Disability Pride Month.
date: 2024-07-23T20:35:00+0800
updated: 2024-12-15T18:43:47+0800
categories: ["css", "disability pride"]
topics: ["css", "disability pride"]
hasCodeBlock: true
---

View File

@@ -2,7 +2,7 @@
title: Migrating My Website to Hostinger
desc: I have migrated my developer portfolio and blog website to Hostinger.
date: 2024-07-31T09:31:00+0800
categories: ["about this website", "hostinger"]
topics: ["about this website", "hostinger"]
toc: true
---
@@ -77,4 +77,4 @@ At the moment, I am still deploying projects to GitHub Pages, so the `helenclx.g
I am glad to have made the decision to move hosts for this website. By migrating my developer portfolio and blog website to Hostinger, I felt like opening up new opportunities for my website to grow, and for myself to keep learning as a web developer.
As of this writing, I had created a `.htaccess` for my website to set a custom 404 page, configure the cache policy of this website's static assets, and remove `.html` file extension from website addresses. I am looking forward to exploring this new web hosting experience more.
As of this writing, I had created a `.htaccess` for my website to set a custom 404 page, configure the cache policy of this website's static assets, and remove `.html` file extension from website addresses. I am looking forward to exploring this new web hosting experience more.

View File

@@ -3,7 +3,7 @@ title: Got My First Developer Job
desc: At last, I have officially switched my career path to web development.
date: 2024-08-16T20:35:51+0800
updated: 2025-01-02T21:51:14+0800
categories: ["life updates"]
topics: ["life updates"]
toc: true
---
@@ -43,4 +43,4 @@ Unfortunately, my first web development ended up lasting only four months, as it
I am a web developer, not a marketer, so I decided to leave the company to continue to focus on web development, thus 3 January 2025 will be the final day of my employment in the company.
On the plus side, at least I actually got some professional web development experience, even if it lasted only a few months, since I had successfully developed a WordPress plugin for the first time ever during my first web developer job.
On the plus side, at least I actually got some professional web development experience, even if it lasted only a few months, since I had successfully developed a WordPress plugin for the first time ever during my first web developer job.

View File

@@ -2,7 +2,7 @@
title: "Scheduled: Speaking at THE Eleventy Meetup Episode 19"
desc: My first opportunity to speak at a tech event will be in Episode 19 of THE Eleventy Meetup.
date: 2024-09-10T23:35:17+0800
categories: ["eleventy", "speaking"]
topics: ["eleventy", "speaking"]
---
I am pleased to announce that I have been invited to speak at Episode 19 of [THE Eleventy Meetup](https://11tymeetup.dev/)!
@@ -13,4 +13,4 @@ Episode 19 of THE Eleventy Meetup is scheduled to be held on 26 September 2024,
I have been using Eleventy since [April 2024](2024-04-11-rebuilding-my-developer-portfolio-with-eleventy.md), and loving it and its wonderful community, so I am immensely grateful that my first time speaking at a tech event will be dedicated to Eleventy.
You can find more details about [THE Eleventy Meetup Ep. 19: Migrating to 3.0 and Blogging with Storyblok](https://11tymeetup.dev/events/ep-19-migrating-to-3-0-and-blogging-with-storyblok/) on THE Eleventy Meetup website. See you there!
You can find more details about [THE Eleventy Meetup Ep. 19: Migrating to 3.0 and Blogging with Storyblok](https://11tymeetup.dev/events/ep-19-migrating-to-3-0-and-blogging-with-storyblok/) on THE Eleventy Meetup website. See you there!

View File

@@ -2,7 +2,7 @@
title: "THE Eleventy Meetup Episode 19: My First Talk at a Tech Event"
desc: I gave my first talk at a tech event at Episode 19 of THE Eleventy Meetup
date: 2024-09-27T11:47:53+0800
categories: ["eleventy", "speaking"]
topics: ["eleventy", "speaking"]
---
On 26 September 2024, I gave my first talk at a tech event at Episode 19 of THE Eleventy Meetup!
@@ -17,4 +17,4 @@ Thank you [Sia Karamalegos](https://sia.codes/) for organising Episode 19 of THE
You can watch my talk, "Eleventy Journey From 2.0 to 3.0", at THE Eleventy Meetup Episode 19 at THE Eleventy Meetup's YouTube channel:
https://www.youtube.com/watch?v=qgFNl_oAyQY
https://www.youtube.com/watch?v=qgFNl_oAyQY

View File

@@ -3,7 +3,7 @@ title: Happy One-Month Anniversary of My omg.lol Membership
desc: It has been a month since I joined omg.lol, and I am glad to be part of it.
date: 2024-10-19T00:14:19+0800
updated: 2024-11-04T23:57:10+0800
categories: ["omg.lol"]
topics: ["omg.lol"]
---
19 October 2024 marks my one-month anniversary of joining [omg.lol](https://home.omg.lol/).
@@ -44,4 +44,4 @@ The package of these goodies also included a message from the founder Adam Newbo
>
> — Adam
Thank you, Adam, for these adorable Prami goodies, and again for all your work on omg.lol and more!
Thank you, Adam, for these adorable Prami goodies, and again for all your work on omg.lol and more!

View File

@@ -2,7 +2,7 @@
title: My Web Development and Web Design Origin Story
desc: sailorhg's comic "Home Sweet Homepage" inspired me to share my web development and web design origin story.
date: 2024-11-05T18:05:46+0800
categories: ["web development"]
topics: ["web development"]
---
Recently, I discovered [sailorhg](https://sailorhg.com/)'s comic, ["Home Sweet Homepage"](https://sailorhg.com/home_sweet_homepage/) (which also has a [text transcript](https://sailorhg.com/home_sweet_homepage/transcript.html) available), telling the author's story about growing up online in the era of GeoCities. While I never got to code my own website on GeoCities, this comic reminded me of why I love web development and web design and thus eventually decided to changed my career path to web development.
@@ -31,4 +31,4 @@ I did not expect career switch to be easy, so I did put as much as I could in le
After teaching myself to code for almost two years, and received multiple code and tech-related certifications including [CS50's Introduction to Computer Science](2024-05-27-cs50x-course-completed.md), I updated my résumé with information about my interest in switching career from graphic design to web development, and hope for transferring my creativity and design expertise into building the web. I started to try hunting for front end web developer jobs, until I [finally got my first developer job in August 2024](2024-08-16-got-my-first-developer-job.md).
Looking back, even I am still amazed by the fact that I managed to transition from a hobbyist to a professional web developer, especially since I did not come from a tech educational or industrial background, but I am glad that it happened.
Looking back, even I am still amazed by the fact that I managed to transition from a hobbyist to a professional web developer, especially since I did not come from a tech educational or industrial background, but I am glad that it happened.

View File

@@ -2,7 +2,7 @@
title: My 2024 Year in Web Development
desc: Reflecting on my 2024 as a web developer.
date: 2024-12-28T19:47:18+0800
categories: ["year in review", "web development"]
topics: ["year in review", "web development"]
toc: true
---
@@ -57,4 +57,4 @@ I am a web developer, not a marketer, so I decided to leave the company to conti
2024 has been a huge year for my journey as a web developer, as it was a year when I achieved multiple milestones in those regards, including rebuilding my entire website with a static site generator for the first time, completing a CS50 course, speaking at a tech event for the first time, and getting my first developer job.
For 2025, I intend to continue to keep learning to hone my web development knowledge and skills.
For 2025, I intend to continue to keep learning to hone my web development knowledge and skills.

View File

@@ -2,7 +2,7 @@
title: Developed My First WordPress Plugin
desc: I successfully developed a WordPress plugin during my first web developer job.
date: 2025-01-03T16:30:08+0800
categories: ["wordpress", "php"]
topics: ["wordpress", "php"]
---
3 January 2025 was the final day of [my first web developer job](2024-08-16-got-my-first-developer-job.md).
@@ -21,4 +21,4 @@ After I completed and tested my plugin, I proudly showed it to my employer and m
My success in developing my first WordPress plugin was a huge milestone in my web developer journey, by showcasing not only my technical and programming knowledge and skills, but also my learning and problem-solving skills.
You can view the source code of my one-time redeemable voucher add-on WooRewards by checking out [its GitHub repository](https://github.com/helenclx/woorewards-addon-one-time-voucher).
You can view the source code of my one-time redeemable voucher add-on WooRewards by checking out [its GitHub repository](https://github.com/helenclx/woorewards-addon-one-time-voucher).

View File

@@ -3,7 +3,7 @@ title: Attending 42 the Computer Science School
desc: I have applied to attend one of the Malaysian campuses of 42, an international computer science school.
date: 2025-01-19T23:56:32+0800
updated: 2025-02-17T18:08:02+0800
categories: ["42 the school", "life updates"]
topics: ["42 the school", "life updates"]
---
After [my first web developer job](2024-08-16-got-my-first-developer-job.md) ended, I had been considering how to proceed to the next phase of my web development journey.

View File

@@ -2,7 +2,7 @@
title: I Have Joined the light-dark() Side
desc: I am applying the CSS light-dark() function to add light and dark modes to my websites.
date: 2025-02-15T11:18:07+0800
categories: ["css"]
topics: ["css"]
---
After building and working on this developer portfolio and blog website of mine for a while, I began to learn to apply light and dark modes to my website. Initially, I used the [`prefers-color-scheme`](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) CSS `@media` feature to achieve that. Specifically, I used a `prefers-color-scheme: dark` media query to set the values of my website layout in dark mode.
@@ -15,4 +15,4 @@ Therefore, I decided to apply `color-scheme` and `light-dark()` to my websites.
helenchong.dev is also a member of the [Darktheme Club](https://darktheme.club/), a directory of websites with dark modes. Part of the process to join the directory is to specify how you add dark mode to your website, with multiple options include dark mode by default, `@media` query or JavaScript, but no option for the `color-scheme` CSS property.
Therefore, I made a suggestion to add `color-scheme` CSS property as a possible method to set dark mode by [creating a GitHub issue](https://github.com/garritfra/darktheme.club/issues/194). [Garrit Franke](https://garrit.xyz/), the creator of Darktheme Club, replied by asking if I could create a pull request for it, so [I happily did](https://github.com/garritfra/darktheme.club/pull/196). I also changed my website's dark mode method from "media query" to "color-scheme". My pull request eventually got merged! I am happy to be able to make good use of my new CSS knowledge.
Therefore, I made a suggestion to add `color-scheme` CSS property as a possible method to set dark mode by [creating a GitHub issue](https://github.com/garritfra/darktheme.club/issues/194). [Garrit Franke](https://garrit.xyz/), the creator of Darktheme Club, replied by asking if I could create a pull request for it, so [I happily did](https://github.com/garritfra/darktheme.club/pull/196). I also changed my website's dark mode method from "media query" to "color-scheme". My pull request eventually got merged! I am happy to be able to make good use of my new CSS knowledge.

View File

@@ -2,7 +2,7 @@
title: Adding a Button to Copy Code Snippets
desc: How I added a button to copy code snippets to my website with JavaScript.
date: 2025-02-19T11:05:03+0800
categories: ["javascript", "accessibility"]
topics: ["javascript", "accessibility"]
hasCodeBlock: true
---
@@ -89,4 +89,4 @@ document.addEventListener('DOMContentLoaded', () => {
})
```
Finally, after styling the button a bit with CSS, I was satisfied with how my button to copy code snippets turn out, so as long as your browser has JavaScript enabled, you should be able to see a "Copy Code" button below the code snippet blocks on this website, including my JavaScript code for the button above.
Finally, after styling the button a bit with CSS, I was satisfied with how my button to copy code snippets turn out, so as long as your browser has JavaScript enabled, you should be able to see a "Copy Code" button below the code snippet blocks on this website, including my JavaScript code for the button above.

View File

@@ -2,7 +2,7 @@
title: Attended 42 the School's 5-Day Coding Bootcamp
desc: I joined 42 the school's 5-day bite-sized coding bootcamp in late February.
date: 2025-03-06T22:20:37+0800
categories: ["42 the school", "python", "life updates"]
topics: ["42 the school", "python", "life updates"]
---
From 24 to 28 February 2025, I attended [42 the computer science school](2025-01-20-attending-42-school.md)'s bite-sized coding bootcamp that lasted for 5 days, called the Discovery Piscine.

View File

@@ -2,7 +2,7 @@
title: Purelymail and Online Account Spring Cleaning
desc: I started to use Purelymail as my email provider, and took the opportunity to clean up my online accounts.
date: 2025-03-21T21:42:18+0800
categories: ["emails", "online life"]
topics: ["emails", "online life"]
---
I have switched to [Purelymail](https://purelymail.com/) as my main email service provider.
@@ -21,4 +21,4 @@ For example, [Obsidian](https://obsidian.md/) has become my go-to note-taking so
In conclusion, I am satisfied with my switch to Purelymail, and I have found online spring cleaning a good practice in declutter my online life.
Shout-out to [Adam Newbold](https://adam.omg.lol/) and [Faisal Misle](https://faisal.fm/) of [omg.lol](https://home.omg.lol/) staff for helping me to troubleshoot an issue with using my omg.lol email forwarding address to forward emails to my Purelymail mailbox using my omg.lol address as the custom domain, as well as Porkbun's support team for helping me to resolve a DNS issue with one of my domain names after switching from Porkbun's email forwarding service to Purelymail that was caused by the DNS records related to Porkbun's email forwarding being cached in my domain's DNS records longer than expected.
Shout-out to [Adam Newbold](https://adam.omg.lol/) and [Faisal Misle](https://faisal.fm/) of [omg.lol](https://home.omg.lol/) staff for helping me to troubleshoot an issue with using my omg.lol email forwarding address to forward emails to my Purelymail mailbox using my omg.lol address as the custom domain, as well as Porkbun's support team for helping me to resolve a DNS issue with one of my domain names after switching from Porkbun's email forwarding service to Purelymail that was caused by the DNS records related to Porkbun's email forwarding being cached in my domain's DNS records longer than expected.

View File

@@ -2,7 +2,7 @@
title: I Use (Neo)Vim BTW
desc: I have officially joined the Vim ecosystem and switched to Neovim as my main code editor.
date: 2025-04-03T20:22:21+0800
categories: ["vim", "neovim", "42 the school", "vs code"]
topics: ["vim", "neovim", "42 the school", "vs code"]
toc: true
---

View File

@@ -2,7 +2,7 @@
title: First Week of 42's Piscine Bootcamp
desc: My first week attending 42 the computer science school's 26-day bootcamp named Piscine.
date: 2025-04-13T07:40:46+0800
categories: ["42 the school", "c", "life updates"]
topics: ["42 the school", "c", "life updates"]
---
On 7 April 2025, my attendance to [42 the computer science school](2025-01-19-attending-42-school.md)'s 26-day bootcamp named Piscine has finally begun. I have been looking forward to this day for nearly three months, after visiting my local campus of the school on its open day in January, applying to join the Piscine that was originally scheduled on February 24 but was later replaced by a 5-day bite-sized version of the bootcamp called [Discovery Piscine](2025-03-06-attended-42-discovery-piscine.md), and applying to join the full Piscine that was scheduled for April 7.

View File

@@ -2,7 +2,7 @@
title: 42's Piscine Bootcamp Completed
desc: At last, I finished 42 the computer science school's 26-day bootcamp.
date: 2025-05-04T11:05:16+0800
categories: ["42 the school", "c", "life updates"]
topics: ["42 the school", "c", "life updates"]
---
2 May 2025 marked the final day of [42 the computer science school](/blog/categories/42-the-school/)'s 26-day bootcamp, named the Piscine, that I was attending. The final day of the Piscine was also when the final exam took place. I am happy to announce that I have completed the Piscine, by taking and passing the final exam!

22
src/blog/topic.vto Normal file
View File

@@ -0,0 +1,22 @@
---
pagination:
data: collections.topics
size: 1
alias: topic
addAllPagesToCollections: true
permalink: /blog/topics/{{ topic |> slugify }}/
layout: layouts/content
hasBreadcrumbs: true
eleventyComputed:
title: 'Blog Post Topic: "{{ topic }}"'
eleventyNavigation:
key: "{{ topic }}"
parent: Blog Topics
---
{{ set postCount = collections.posts |> filterByTopic(topic) |> itemCount }}
<h2 class="blog__cat--title">{{ postCount }} Posts Filed Under "{{ topic }}"</h2>
{{ set postList = collections.posts |> filterByTopic(topic) |> toReversed }}
{{ include "partials/postslist.vto" }}
<p>See <a href="/blog/topics/">all blog post topics</a>.</p>

21
src/blog/topics.vto Normal file
View File

@@ -0,0 +1,21 @@
---
layout: layouts/content
title: Blog Post Topics
tags: blog pages
hasBreadcrumbs: true
eleventyNavigation:
key: Blog Topics
title: Topics
parent: Blog
order: 2
---
<ul>
{{ for topic of collections.topics }}
{{ set topicUrl }}/blog/topics/{{ topic |> slugify }}/{{ /set }}
{{ set topicPostCount = collections.posts |> filterByTopic(topic) |> itemCount }}
<li><a href="{{ topicUrl }}">{{ topic }}</a> ({{ topicPostCount }} posts)</li>
{{ /for }}
</ul>
<p>See all blog posts in the <a href="posts.vto">archive</a>.</p>