lew/website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: add bookmarks data file and render in index

Browse source 
Create bookmarks.yaml data file with sample entries and update
index.astro to import, parse, and display bookmarks with format
DD/MM/YY    Site Name (domain.com)
This commit is contained in:
Lewis Wynne 2026-01-23 01:28:19 +00:00
parent 8a09357036
commit a88af69ffd
3 changed files with 35 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

4
apps/blog/package.json
View file

@ -7,9 +7,11 @@
"preview": "astro preview" "preview": "astro preview"
}, },
"dependencies": { "dependencies": {
"astro": "^5.16.13" "astro": "^5.16.13",
"js-yaml": "^4.1.1"
}, },
"devDependencies": { "devDependencies": {
"@types/js-yaml": "^4.0.9",
"remark-directive": "^3.0.0", "remark-directive": "^3.0.0",
"remark-gfm": "^4.0.0", "remark-gfm": "^4.0.0",
"remark-slug": "^7.0.1", "remark-slug": "^7.0.1",

7
apps/blog/src/data/bookmarks.yaml Normal file
View file

@ -0,0 +1,7 @@
- date: 2026-01-15
title: Hacker News
url: https://news.ycombinator.com
- date: 2026-01-10
title: Astro Documentation
url: https://docs.astro.build/en/getting-started/

25
apps/blog/src/pages/index.astro
View file

@ -1,21 +1,46 @@
--- ---
import { getCollection } from 'astro:content'; import { getCollection } from 'astro:content';
import '../styles/global.css'; import '../styles/global.css';
import yaml from 'js-yaml';
import bookmarksRaw from '../data/bookmarks.yaml?raw';
interface Bookmark {
date: string;
title: string;
url: string;
}
const posts = await getCollection('posts'); const posts = await getCollection('posts');
const sorted = posts.sort((a, b) => b.data.date.getTime() - a.data.date.getTime()); const sorted = posts.sort((a, b) => b.data.date.getTime() - a.data.date.getTime());
const bookmarks = yaml.load(bookmarksRaw) as Bookmark[];
function formatDate(date: Date): string { function formatDate(date: Date): string {
const d = String(date.getDate()).padStart(2, '0'); const d = String(date.getDate()).padStart(2, '0');
const m = String(date.getMonth() + 1).padStart(2, '0'); const m = String(date.getMonth() + 1).padStart(2, '0');
const y = String(date.getFullYear()).slice(-2); const y = String(date.getFullYear()).slice(-2);
return `${d}/${m}/${y}`; return `${d}/${m}/${y}`;
} }
function formatBookmarkDate(dateStr: string): string {
const date = new Date(dateStr);
return formatDate(date);
}
function extractDomain(url: string): string {
try {
const parsed = new URL(url);
return parsed.hostname.replace(/^www\./, '');
} catch {
return url;
}
}
--- ---
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head><meta charset="UTF-8"><title>Blog</title></head> <head><meta charset="UTF-8"><title>Blog</title></head>
<body> <body>
<pre set:html={sorted.map(post => `${formatDate(post.data.date)} <a href="/${post.id}">${post.data.title}</a>`).join('\n')} /> <pre set:html={sorted.map(post => `${formatDate(post.data.date)} <a href="/${post.id}">${post.data.title}</a>`).join('\n')} />
<pre set:html={bookmarks.map(b => `${formatBookmarkDate(b.date)} <a href="${b.url}">${b.title}</a> (${extractDomain(b.url)})`).join('\n')} />
</body> </body>
</html> </html>