add developer blog, replace screenshots

Author: nemanjam

docs/working-notes/todo4.md

@@ -54,6 +54,7 @@ git checkout feat/tailwind4-v2
 ----------
     astro markdown link in new tab
 mdx not formatting, prettierignore, breaks them
+for screenshots use new not private window and select window in screenshot tool, not screen or selection, hide dock for 16/9 // important
 ```
 
 

src/content/project/2024/02-13-example-project-1/_images/flowers-store.jpg renamed to src/content/project/2023/02-13-example-project-1/_images/flowers-store.jpg

@@ -1,16 +1,16 @@
 ---
 title: This is the first project
 description: Description of the first project
-heroImage: '../../../../content/project/2024/02-13-example-project-1/_images/flowers-store.jpg'
+heroImage: '../../../../content/project/2023/02-13-example-project-1/_images/flowers-store.jpg'
 heroAlt: Flowers store
-publishDate: 2024-02-13
+publishDate: 2023-02-13
 ---
 
 import { Image } from 'astro:assets';
 
 import { IMAGE_SIZES } from '../../../../constants/image';
 
-import FlowersImage from '../../../../content/project/2024/02-13-example-project-1/_images/flowers-store.jpg';
+import FlowersImage from '../../../../content/project/2023/02-13-example-project-1/_images/flowers-store.jpg';
 
 # This is the first project
 

src/content/project/2024/02-13-example-project-1/index.mdx renamed to src/content/project/2023/02-13-example-project-1/index.mdx

@@ -1,17 +1,17 @@
 ---
 title: This is the second project
 description: Description of the second project
-heroImage: '../../../../content/project/2024/03-15-example-project-2/_images/cyco5.jpg'
+heroImage: '../../../../content/project/2023/03-15-example-project-2/_images/cyco5.jpg'
 heroAlt: This is bicycle
-publishDate: 2024-03-15
-updatedDate: 2024-04-21
+publishDate: 2023-03-15
+updatedDate: 2023-04-21
 ---
 
 import { Image } from 'astro:assets';
 
 import { IMAGE_SIZES } from '../../../../constants/image';
 
-import BicycleImage from '../../../../content/project/2024/03-15-example-project-2/_images/cyco5.jpg';
+import BicycleImage from '../../../../content/project/2023/03-15-example-project-2/_images/cyco5.jpg';
 
 
 # This is the second project

src/content/project/2024/03-15-example-project-2/_images/cyco5.jpg renamed to src/content/project/2023/03-15-example-project-2/_images/cyco5.jpg

@@ -1,15 +1,15 @@
 ---
 title: This is the third project
 description: Description of the third project
-heroImage: '../../../../content/project/2024/05-16-example-project-3/_images/morning1.jpg'
-publishDate: 2024-05-16
+heroImage: '../../../../content/project/2023/05-16-example-project-3/_images/morning1.jpg'
+publishDate: 2023-05-16
 ---
 
 import { Image } from 'astro:assets';
 
 import { IMAGE_SIZES } from '../../../../constants/image';
 
-import MorningImage from '../../../../content/project/2024/05-16-example-project-3/_images/morning1.jpg';
+import MorningImage from '../../../../content/project/2023/05-16-example-project-3/_images/morning1.jpg';
 
 # This is the third project
 

src/content/project/2024/03-15-example-project-2/index.mdx renamed to src/content/project/2023/03-15-example-project-2/index.mdx

@@ -0,0 +1,55 @@
+---
+title: Developer blog
+description: Insights into HackerNews "Who's Hiring" thread. 
+heroImage: '../../../../content/project/2024/09-30-developer-blog/_images/developer-blog.png'
+heroAlt: Homepage Developer blog
+publishDate: 2024-09-30
+---
+
+import { Image } from 'astro:assets';
+import Link from '../../../../components/Link.astro';
+import { IMAGE_SIZES } from '../../../../constants/image';
+import DeveloperBlogImage from '../../../../content/project/2024/09-30-developer-blog/_images/developer-blog.png';
+
+# Developer blog
+
+<Image {...IMAGE_SIZES.FIXED.MDX_LG} src={DeveloperBlogImage} class="shadow-lg shadow-base-300" alt="Homepage Developer blog" />
+
+## Overview
+
+Developer blog website you are currently on.
+
+## Goal
+
+Build a custom blog script for my personal coding blog.
+
+## Tech stack
+
+- Astro, TailwindCSS, React, MDX
+- Zod, Satori, class-variance-authority
+
+## Features
+
+- Static Astro website
+- Post and project markdown content
+- Tags, categories, pagination
+- Optimized images, view transitions
+- SEO friendly - sitemap, metadata, Open Graph image
+- GitHub Pages, Nginx, x86 and arm Docker deployments
+
+## Implementation details
+
+You can find more implementation details in the <Link href="https://github.com/nemanjam/nemanjam.github.io/tree/main#implementation-details" variant="markdown" target="_blank" title="README.md file">README.md</Link> file on Github.
+
+## Lessons learned 
+
+- Currently Astro is the best framework for building static websites.
+- Keeping styles consistent and visually harmonious between markdown and custom components while maintaining clean, well structured, and maintainable code is not a trivial challenge.
+- You need to review many existing examples to come up with a visually appealing, practical, and up-to-date design for a blog.
+
+## Links
+
+- **Demo:** <Link href="https://nemanjamitic.com" variant="markdown" target="_blank" title="Developer blog demo" />
+- **Repository:** <Link href="https://github.com/nemanjam/nemanjam.github.io" variant="markdown" target="_blank" title="Developer blog repository" />
+
+