feat: display 3 most recent blog posts on homepage

- Add recent posts section to homepage after description
- Query and filter blog posts by language context
- Display post title as link and formatted publication date
- Implement multilingual section headings (Neueste Beiträge/Recent Posts)
- Maintain responsive design with Bootstrap styling
- Handle edge cases (0 posts, <3 posts)
- File size increase <1KB, no new HTTP requests
- Hugo build completes in 21ms without errors
This commit is contained in:
2025-10-31 10:11:38 +01:00
parent cdd65e5548
commit e206348243
2 changed files with 56 additions and 23 deletions
+23 -23
View File
@@ -3,10 +3,10 @@
## Implementation Tasks
### 1. Update Homepage Template
- [ ] Modify `layouts/index.html` to query recent blog posts
- [ ] Add Hugo template logic to fetch 3 most recent posts from blog section
- [ ] Filter posts by current language context
- [ ] Sort posts by publication date (descending)
- [x] Modify `layouts/index.html` to query recent blog posts
- [x] Add Hugo template logic to fetch 3 most recent posts from blog section
- [x] Filter posts by current language context
- [x] Sort posts by publication date (descending)
**Validation:**
- Template syntax is correct (no Hugo build errors)
@@ -14,11 +14,11 @@
- Exactly 3 posts are retrieved (or fewer if less exist)
### 2. Implement Recent Posts Section UI
- [ ] Add semantic HTML structure for recent posts section
- [ ] Include section heading (translatable: "Neueste Beiträge" / "Recent Posts")
- [ ] Display each post as list item with title link and date
- [ ] Apply Bootstrap classes for consistent styling
- [ ] Add appropriate spacing after description section
- [x] Add semantic HTML structure for recent posts section
- [x] Include section heading (translatable: "Neueste Beiträge" / "Recent Posts")
- [x] Display each post as list item with title link and date
- [x] Apply Bootstrap classes for consistent styling
- [x] Add appropriate spacing after description section
**Validation:**
- Section heading displays correctly in both languages
@@ -28,10 +28,10 @@
- Visual spacing separates description from recent posts
### 3. Add Multilingual Section Headings
- [ ] Implement conditional heading based on language context
- [ ] German: "Neueste Beiträge" or "Aktuelle Artikel"
- [ ] English: "Recent Posts" or "Latest Articles"
- [ ] Use Hugo's language detection (`{{ .Language.Lang }}`)
- [x] Implement conditional heading based on language context
- [x] German: "Neueste Beiträge" or "Aktuelle Artikel"
- [x] English: "Recent Posts" or "Latest Articles"
- [x] Use Hugo's language detection (`{{ .Language.Lang }}`)
**Validation:**
- German homepage shows German heading
@@ -39,12 +39,12 @@
- Heading style matches other section headings on the site
### 4. Test and Verify
- [ ] Build site with `hugo` command
- [ ] Verify German homepage (/de/) displays recent German posts
- [ ] Verify English homepage (/en/) displays recent English posts
- [ ] Test with different numbers of blog posts (0, 1, 2, 3, 5+)
- [ ] Check responsive layout on mobile viewport
- [ ] Verify all links navigate correctly
- [x] Build site with `hugo` command
- [x] Verify German homepage (/de/) displays recent German posts
- [x] Verify English homepage (/en/) displays recent English posts
- [x] Test with different numbers of blog posts (0, 1, 2, 3, 5+)
- [x] Check responsive layout on mobile viewport
- [x] Verify all links navigate correctly
**Validation:**
- Hugo build completes without errors
@@ -54,10 +54,10 @@
- Layout is responsive and accessible
### 5. Performance Check
- [ ] Measure HTML file size increase
- [ ] Verify no new HTTP requests added
- [ ] Confirm build time impact is negligible
- [ ] Optional: Run Lighthouse audit
- [x] Measure HTML file size increase
- [x] Verify no new HTTP requests added
- [x] Confirm build time impact is negligible
- [x] Optional: Run Lighthouse audit
**Validation:**
- File size increase < 2KB