# Tasks: Display Recent Blog Posts on Homepage ## Implementation Tasks ### 1. Update Homepage Template - [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) - Recent posts query respects language context - Exactly 3 posts are retrieved (or fewer if less exist) ### 2. Implement Recent Posts Section UI - [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 - Post titles are clickable links using `relPermalink` - Dates are formatted using Hugo's date formatting - Bootstrap classes match existing site patterns - Visual spacing separates description from recent posts ### 3. Add Multilingual Section Headings - [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 - English homepage shows English heading - Heading style matches other section headings on the site ### 4. Test and Verify - [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 - Both language versions render correctly - Edge cases handled (0 posts, < 3 posts) - Links preserve language context - Layout is responsive and accessible ### 5. Performance Check - [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 - No additional network requests - Build time difference < 100ms - Performance score remains high ## Dependencies - Task 1 must complete before Task 2 - Task 2 and 3 can be done in parallel or sequentially - Task 4 requires all implementation tasks (1-3) complete - Task 5 can be done after Task 4 ## Notes - Keep implementation minimal and focused on title + date only - Use existing blog post querying patterns if any exist in the codebase - Ensure null/empty checks to handle cases with no blog posts - Consider using Hugo's `.Site.RegularPages` or `.Site.Taxonomies` for blog queries