From 9b6c9188ac037a54f681fa9eae4803409d384b8e Mon Sep 17 00:00:00 2001 From: Suradet Pratomsak Date: Tue, 30 Dec 2025 21:10:46 +0700 Subject: [PATCH 1/2] refactor(content): reorganize blog mdx to page bundles and structure public images --- agents.md | 64 +++++++ .../semantic-release-hero.png | Bin .../digital-warfarin-management.png | Bin .../confident-typing-at-work-2.png | Bin .../confident-typing-at-work.png | Bin .../typing-on-keyboard-hero.png | Bin .../12-git-commands-cheatsheet.jpeg | Bin .../12-git-commands-cheatsheet.png | Bin .../rust-variables-hero.png | Bin .../eslint-antfu-setup.png | Bin .../common}/blog-placeholder-1.png | Bin .../common}/blog-placeholder-2.png | Bin .../common}/blog-placeholder-3.png | Bin .../common}/blog-placeholder-4.png | Bin .../common}/blog-placeholder-5.png | Bin .../common}/blog-placeholder-6.png | Bin .../common}/blog-placeholder-7.png | Bin .../common}/blog-placeholder-8.png | Bin .../blog-placeholder-python-course.png | Bin .../common}/profile-placeholder.jpg | Bin .../index.mdx} | 2 +- .../index.mdx} | 2 +- .../index.mdx} | 6 +- .../index.mdx} | 4 +- .../index.mdx} | 2 +- .../index.mdx} | 2 +- .../index.mdx} | 2 +- .../index.mdx} | 2 +- .../index.mdx} | 2 +- .../index.mdx} | 2 +- .../index.mdx} | 2 +- .../index.mdx} | 2 +- .../index.mdx} | 2 +- .../index.mdx} | 2 +- .../index.mdx} | 2 +- src/pages/about.astro | 38 +++- src/pages/index.astro | 177 +++++++++--------- 37 files changed, 201 insertions(+), 114 deletions(-) create mode 100644 agents.md rename public/{blog => images/blog/automate-release-with-semantic-release}/semantic-release-hero.png (100%) rename public/{blog => images/blog/awesome-warfarin-open-source}/digital-warfarin-management.png (100%) rename public/{blog => images/blog/benefits-of-touch-typing}/confident-typing-at-work-2.png (100%) rename public/{blog => images/blog/benefits-of-touch-typing}/confident-typing-at-work.png (100%) rename public/{blog => images/blog/benefits-of-touch-typing}/typing-on-keyboard-hero.png (100%) rename public/{blog => images/blog/essential-git-commands-guide}/12-git-commands-cheatsheet.jpeg (100%) rename public/{blog => images/blog/essential-git-commands-guide}/12-git-commands-cheatsheet.png (100%) rename public/{blog => images/blog/rust-variables-and-mutability}/rust-variables-hero.png (100%) rename public/{blog => images/blog/vue-standard-protocol-antfu}/eslint-antfu-setup.png (100%) rename public/{ => images/common}/blog-placeholder-1.png (100%) rename public/{ => images/common}/blog-placeholder-2.png (100%) rename public/{ => images/common}/blog-placeholder-3.png (100%) rename public/{ => images/common}/blog-placeholder-4.png (100%) rename public/{ => images/common}/blog-placeholder-5.png (100%) rename public/{ => images/common}/blog-placeholder-6.png (100%) rename public/{ => images/common}/blog-placeholder-7.png (100%) rename public/{ => images/common}/blog-placeholder-8.png (100%) rename public/{ => images/common}/blog-placeholder-python-course.png (100%) rename public/{ => images/common}/profile-placeholder.jpg (100%) rename src/content/blog/{automate-release-with-semantic-release.mdx => automate-release-with-semantic-release/index.mdx} (99%) rename src/content/blog/{awesome-warfarin-open-source.mdx => awesome-warfarin-open-source/index.mdx} (99%) rename src/content/blog/{benefits-of-touch-typing.mdx => benefits-of-touch-typing/index.mdx} (99%) rename src/content/blog/{essential-git-commands-guide.mdx => essential-git-commands-guide/index.mdx} (99%) rename src/content/blog/{frontend-developer-roadmap-part-1.mdx => frontend-developer-roadmap-part-1/index.mdx} (99%) rename src/content/blog/{frontend-developer-roadmap-part-2.mdx => frontend-developer-roadmap-part-2/index.mdx} (99%) rename src/content/blog/{git-commit-messages.mdx => git-commit-messages/index.mdx} (99%) rename src/content/blog/{google-app-script-drug-search-app.mdx => google-app-script-drug-search-app/index.mdx} (99%) rename src/content/blog/{google-app-script.mdx => google-app-script/index.mdx} (99%) rename src/content/blog/{haskell-ep1.mdx => haskell-ep1/index.mdx} (99%) rename src/content/blog/{haskell-ep2.mdx => haskell-ep2/index.mdx} (99%) rename src/content/blog/{learn-python-with-ritesh-chauhan.mdx => learn-python-with-ritesh-chauhan/index.mdx} (99%) rename src/content/blog/{rust-variables-and-mutability.mdx => rust-variables-and-mutability/index.mdx} (99%) rename src/content/blog/{vue-standard-protocol-antfu.mdx => vue-standard-protocol-antfu/index.mdx} (99%) rename src/content/blog/{web-accessibility-101.mdx => web-accessibility-101/index.mdx} (99%) diff --git a/agents.md b/agents.md new file mode 100644 index 0000000..3e19def --- /dev/null +++ b/agents.md @@ -0,0 +1,64 @@ +# Refactoring Task: Reorganize Blog Content and Assets + +## Context + +This is an Astro project. Currently, the file structure for blog posts and images is flat and cluttered. + +- Blog posts are located at: `src/content/blog/*.mdx` +- Images are scattered in: `public/`, `public/blog/`, and `public/images/` + +## Objective + +Refactor the file structure to use **Directory-based (Page Bundle)** organization for MDX files and a structured hierarchy for public images. The goal is to improve maintainability without breaking existing URLs or image paths. + +## Plan of Action + +### Phase 1: Reorganize MDX Files (Page Bundles) + +For every `.mdx` file in `src/content/blog/`: + +1. Create a new directory inside `src/content/blog/` with the same name as the file (minus the extension). + - Example: `src/content/blog/my-article.mdx` -> `src/content/blog/my-article/` +2. Move the `.mdx` file into that directory and rename it to `index.mdx`. + - Result: `src/content/blog/my-article/index.mdx` +3. **Important:** Use `git mv` command if possible to preserve file history. + +### Phase 2: Reorganize Public Images + +1. Create a standardized directory structure: `public/images/blog/` +2. Identify images belonging to specific blog posts. +3. Move images into specific subdirectories: `public/images/blog/[slug-of-the-post]/` + - If an image is generic (used across multiple posts), move it to `public/images/common/`. +4. **Important:** Use `git mv` to move the image files. + +### Phase 3: Update References + +Iterate through all `src/content/blog/**/*.mdx` files and update image paths: + +1. **Frontmatter (`heroImage`):** + - Update the path string to match the new location in `public/`. + - Example: `heroImage: '/blog/old-img.png'` -> `heroImage: '/images/blog/my-article/old-img.png'` + +2. **Markdown Images (`![alt](src)`):** + - Update standard markdown image links. + - Example: `![alt](/blog-placeholder-1.png)` -> `![alt](/images/blog/my-article/blog-placeholder-1.png)` + +3. **Astro `` Component:** + - Update the `src` attribute. + - Example: `` -> `` + +### Phase 4: Verification + +1. Run `npm run lint` or `npm run build` to ensure no broken paths. +2. Ensure that the `slug` generation logic in `src/utils/slugify.ts` or `astro.config.mjs` is not affected (Astro automatically handles `index.mdx` inside folders correctly, so this should remain safe). + +## Constraints & Rules + +- Do NOT delete any files. +- Do NOT change the logic in `src/content/config.ts`. +- Ensure all paths remain absolute paths starting with `/` (referencing the public folder). +- If you encounter duplicate image names, resolve them by appending the post slug to the filename. + +## Execution Order + +Please perform Phase 1 first. Once confirmed, proceed to Phase 2 and 3 together. diff --git a/public/blog/semantic-release-hero.png b/public/images/blog/automate-release-with-semantic-release/semantic-release-hero.png similarity index 100% rename from public/blog/semantic-release-hero.png rename to public/images/blog/automate-release-with-semantic-release/semantic-release-hero.png diff --git a/public/blog/digital-warfarin-management.png b/public/images/blog/awesome-warfarin-open-source/digital-warfarin-management.png similarity index 100% rename from public/blog/digital-warfarin-management.png rename to public/images/blog/awesome-warfarin-open-source/digital-warfarin-management.png diff --git a/public/blog/confident-typing-at-work-2.png b/public/images/blog/benefits-of-touch-typing/confident-typing-at-work-2.png similarity index 100% rename from public/blog/confident-typing-at-work-2.png rename to public/images/blog/benefits-of-touch-typing/confident-typing-at-work-2.png diff --git a/public/blog/confident-typing-at-work.png b/public/images/blog/benefits-of-touch-typing/confident-typing-at-work.png similarity index 100% rename from public/blog/confident-typing-at-work.png rename to public/images/blog/benefits-of-touch-typing/confident-typing-at-work.png diff --git a/public/blog/typing-on-keyboard-hero.png b/public/images/blog/benefits-of-touch-typing/typing-on-keyboard-hero.png similarity index 100% rename from public/blog/typing-on-keyboard-hero.png rename to public/images/blog/benefits-of-touch-typing/typing-on-keyboard-hero.png diff --git a/public/blog/12-git-commands-cheatsheet.jpeg b/public/images/blog/essential-git-commands-guide/12-git-commands-cheatsheet.jpeg similarity index 100% rename from public/blog/12-git-commands-cheatsheet.jpeg rename to public/images/blog/essential-git-commands-guide/12-git-commands-cheatsheet.jpeg diff --git a/public/blog/12-git-commands-cheatsheet.png b/public/images/blog/essential-git-commands-guide/12-git-commands-cheatsheet.png similarity index 100% rename from public/blog/12-git-commands-cheatsheet.png rename to public/images/blog/essential-git-commands-guide/12-git-commands-cheatsheet.png diff --git a/public/blog/rust-variables-hero.png b/public/images/blog/rust-variables-and-mutability/rust-variables-hero.png similarity index 100% rename from public/blog/rust-variables-hero.png rename to public/images/blog/rust-variables-and-mutability/rust-variables-hero.png diff --git a/public/blog/eslint-antfu-setup.png b/public/images/blog/vue-standard-protocol-antfu/eslint-antfu-setup.png similarity index 100% rename from public/blog/eslint-antfu-setup.png rename to public/images/blog/vue-standard-protocol-antfu/eslint-antfu-setup.png diff --git a/public/blog-placeholder-1.png b/public/images/common/blog-placeholder-1.png similarity index 100% rename from public/blog-placeholder-1.png rename to public/images/common/blog-placeholder-1.png diff --git a/public/blog-placeholder-2.png b/public/images/common/blog-placeholder-2.png similarity index 100% rename from public/blog-placeholder-2.png rename to public/images/common/blog-placeholder-2.png diff --git a/public/blog-placeholder-3.png b/public/images/common/blog-placeholder-3.png similarity index 100% rename from public/blog-placeholder-3.png rename to public/images/common/blog-placeholder-3.png diff --git a/public/blog-placeholder-4.png b/public/images/common/blog-placeholder-4.png similarity index 100% rename from public/blog-placeholder-4.png rename to public/images/common/blog-placeholder-4.png diff --git a/public/blog-placeholder-5.png b/public/images/common/blog-placeholder-5.png similarity index 100% rename from public/blog-placeholder-5.png rename to public/images/common/blog-placeholder-5.png diff --git a/public/blog-placeholder-6.png b/public/images/common/blog-placeholder-6.png similarity index 100% rename from public/blog-placeholder-6.png rename to public/images/common/blog-placeholder-6.png diff --git a/public/blog-placeholder-7.png b/public/images/common/blog-placeholder-7.png similarity index 100% rename from public/blog-placeholder-7.png rename to public/images/common/blog-placeholder-7.png diff --git a/public/blog-placeholder-8.png b/public/images/common/blog-placeholder-8.png similarity index 100% rename from public/blog-placeholder-8.png rename to public/images/common/blog-placeholder-8.png diff --git a/public/blog-placeholder-python-course.png b/public/images/common/blog-placeholder-python-course.png similarity index 100% rename from public/blog-placeholder-python-course.png rename to public/images/common/blog-placeholder-python-course.png diff --git a/public/profile-placeholder.jpg b/public/images/common/profile-placeholder.jpg similarity index 100% rename from public/profile-placeholder.jpg rename to public/images/common/profile-placeholder.jpg diff --git a/src/content/blog/automate-release-with-semantic-release.mdx b/src/content/blog/automate-release-with-semantic-release/index.mdx similarity index 99% rename from src/content/blog/automate-release-with-semantic-release.mdx rename to src/content/blog/automate-release-with-semantic-release/index.mdx index dc1e3cb..a0d650b 100644 --- a/src/content/blog/automate-release-with-semantic-release.mdx +++ b/src/content/blog/automate-release-with-semantic-release/index.mdx @@ -2,7 +2,7 @@ title: 'เลิกทำ Manual Release เปลี่ยนมาใช้ Semantic Release กันเถอะ' description: 'คู่มือการตั้งค่าระบบ Automated Release บน GitHub Actions เปลี่ยนการจัดการเวอร์ชัน เขียน Changelog และติด Tag ที่ยุ่งยากให้เป็นเรื่องอัตโนมัติด้วย Semantic Release' pubDate: '2025-12-24' -heroImage: '/blog/semantic-release-hero.png' +heroImage: '/images/blog/automate-release-with-semantic-release/semantic-release-hero.png' category: 'DevOps' tags: ['CI/CD', 'GitHub Actions', 'Automation', 'Semantic Release', 'Workflow'] featured: true diff --git a/src/content/blog/awesome-warfarin-open-source.mdx b/src/content/blog/awesome-warfarin-open-source/index.mdx similarity index 99% rename from src/content/blog/awesome-warfarin-open-source.mdx rename to src/content/blog/awesome-warfarin-open-source/index.mdx index d9996e1..d34de9f 100644 --- a/src/content/blog/awesome-warfarin-open-source.mdx +++ b/src/content/blog/awesome-warfarin-open-source/index.mdx @@ -2,7 +2,7 @@ title: 'เมื่อเภสัชกรเขียนโค้ด: สำรวจโปรเจกต์โอเพนซอร์สจัดการยา Warfarin' description: 'เจาะลึกโลก Health Tech ผ่าน Awesome Warfarin List ที่รวบรวมโปรเจกต์โอเพนซอร์ส ตั้งแต่เว็บแอปคำนวณขนาดยา ไปจนถึงโมเดล Machine Learning เพื่อการจ่ายยาที่แม่นยำ' pubDate: '2025-11-12' -heroImage: '/blog/digital-warfarin-management.png' +heroImage: '/images/blog/awesome-warfarin-open-source/digital-warfarin-management.png' category: 'Web Development' tags: ['Warfarin', 'Health Tech', 'Open Source', 'Pharmacist', 'Programming'] featured: true diff --git a/src/content/blog/benefits-of-touch-typing.mdx b/src/content/blog/benefits-of-touch-typing/index.mdx similarity index 99% rename from src/content/blog/benefits-of-touch-typing.mdx rename to src/content/blog/benefits-of-touch-typing/index.mdx index 3cedd31..3d3d70f 100644 --- a/src/content/blog/benefits-of-touch-typing.mdx +++ b/src/content/blog/benefits-of-touch-typing/index.mdx @@ -2,7 +2,7 @@ title: '7 ประโยชน์ของการพิมพ์สัมผัส (Touch Typing)' description: 'การพิมพ์สัมผัสเป็นมากกว่าแค่ความเร็ว มันช่วยเพิ่มสมาธิ (Flow State) เพิ่มประสิทธิภาพการทำงานกับ AI และสร้างความมั่นใจได้อีกด้วย' pubDate: '2025-11-04' -heroImage: '/blog/typing-on-keyboard-hero.png' +heroImage: '/images/blog/benefits-of-touch-typing/typing-on-keyboard-hero.png' category: 'Career & Soft Skills' tags: ['Productivity', 'Skill Development', 'Touch Typing', 'Career'] featured: true @@ -47,7 +47,7 @@ featured: true ภาพผู้หญิงกำลังยิ้มและพิมพ์คีย์บอร์ดอย่างมั่นใจระหว่างการประชุมออนไลน์ โดยมีเพื่อนร่วมงานปรากฏบนหน้าจอ @@ -88,7 +88,7 @@ featured: true การที่สามารถพิมพ์ได้อย่างราบรื่นต่อหน้าคนอื่นนั้นเป็นพลังอย่างหนึ่ง คุณสามารถจดโน้ต ร่างข้อความ หรือเขียนโค้ดสดๆ ได้โดยไม่สะดุด ความมั่นใจนั้นยังส่งผลต่อไปยังการนำเสนอ การทำ Pair Programming และทุกสถานการณ์ที่คนอื่นสามารถมองเห็นหน้าจอของคุณได้ ภาพที่แสดงถึงความมั่นใจ อาจจะเป็นคนกำลังยิ้มขณะนำเสนองานผ่านจอคอมพิวเตอร์ หรือกำลังทำ Pair Programming อย่างมั่นใจ diff --git a/src/content/blog/essential-git-commands-guide.mdx b/src/content/blog/essential-git-commands-guide/index.mdx similarity index 99% rename from src/content/blog/essential-git-commands-guide.mdx rename to src/content/blog/essential-git-commands-guide/index.mdx index 45bb137..ce3fa1b 100644 --- a/src/content/blog/essential-git-commands-guide.mdx +++ b/src/content/blog/essential-git-commands-guide/index.mdx @@ -2,7 +2,7 @@ title: '12 คำสั่ง Git ที่นักพัฒนาทุกคนต้องรู้' description: 'เจาะลึก 12 คำสั่ง Git ที่สำคัญ ตั้งแต่ git init, commit, push ไปจนถึง pull, merge, reset พร้อมตัวอย่างที่นำไปใช้ได้จริง' pubDate: '2025-11-06' -heroImage: '/blog/12-git-commands-cheatsheet.png' +heroImage: '/images/blog/essential-git-commands-guide/12-git-commands-cheatsheet.png' category: 'Version Control' tags: ['Git', 'Best Practice', 'DevOps', 'Beginner', 'Guide'] featured: true @@ -13,7 +13,7 @@ Git คือหัวใจของการพัฒนาซอฟต์แ บทความนี้คือคู่มือที่จะพาคุณเจาะลึก 12 คำสั่ง Git ที่สำคัญที่สุด ซึ่งเป็นเครื่องมือที่คุณจะได้ใช้ทุกวัน โดยอ้างอิงและขยายความจาก Cheat Sheet ที่ยอดเยี่ยมของ [Sysxplore](https://sysxplore.com/) Cheat Sheet สรุป 12 คำสั่ง Git ที่สำคัญ diff --git a/src/content/blog/frontend-developer-roadmap-part-1.mdx b/src/content/blog/frontend-developer-roadmap-part-1/index.mdx similarity index 99% rename from src/content/blog/frontend-developer-roadmap-part-1.mdx rename to src/content/blog/frontend-developer-roadmap-part-1/index.mdx index 139923f..83ed9fc 100644 --- a/src/content/blog/frontend-developer-roadmap-part-1.mdx +++ b/src/content/blog/frontend-developer-roadmap-part-1/index.mdx @@ -2,7 +2,7 @@ title: 'Frontend Developer Roadmap (Part 1): React.js' description: 'เจาะลึก React.js อย่างละเอียด: ตั้งแต่พื้นฐาน จนถึง Hooks, Ecosystem, และการใช้งานจริง' pubDate: '2025-08-23' -heroImage: '/blog-placeholder-1.png' +heroImage: '/images/common/blog-placeholder-1.png' category: 'Frontend Frameworks' tags: ['React.js', 'JavaScript', 'Web Development'] featured: false diff --git a/src/content/blog/frontend-developer-roadmap-part-2.mdx b/src/content/blog/frontend-developer-roadmap-part-2/index.mdx similarity index 99% rename from src/content/blog/frontend-developer-roadmap-part-2.mdx rename to src/content/blog/frontend-developer-roadmap-part-2/index.mdx index 32cb8f7..bf95ca0 100644 --- a/src/content/blog/frontend-developer-roadmap-part-2.mdx +++ b/src/content/blog/frontend-developer-roadmap-part-2/index.mdx @@ -2,7 +2,7 @@ title: 'Frontend Developer Roadmap (Part 2): Vue.js' description: 'เจาะลึก Vue.js อย่างละเอียด: ตั้งแต่พื้นฐาน จนถึง Composition API, Reactivity, และการใช้งานจริง' pubDate: '2025-08-25' -heroImage: '/blog-placeholder-2.png' +heroImage: '/images/common/blog-placeholder-2.png' category: 'Frontend Frameworks' tags: ['Vue.js', 'JavaScript', 'Web Development'] featured: false diff --git a/src/content/blog/git-commit-messages.mdx b/src/content/blog/git-commit-messages/index.mdx similarity index 99% rename from src/content/blog/git-commit-messages.mdx rename to src/content/blog/git-commit-messages/index.mdx index 00199eb..3baa666 100644 --- a/src/content/blog/git-commit-messages.mdx +++ b/src/content/blog/git-commit-messages/index.mdx @@ -2,7 +2,7 @@ title: คู่มือการเขียน Git Commit Message อย่างมืออาชีพ description: เรียนรู้วิธีการเขียนข้อความ Commit ที่ดีตั้งแต่พื้นฐานจนถึงระดับมืออาชีพ เพื่อการสื่อสารที่มีประสิทธิภาพในทีมพัฒนา pubDate: 2025-09-16 -heroImage: '/blog-placeholder-4.png' +heroImage: '/images/common/blog-placeholder-4.png' category: 'Version Control' tags: ['Git', 'Best Practice', 'DevOps'] featured: true diff --git a/src/content/blog/google-app-script-drug-search-app.mdx b/src/content/blog/google-app-script-drug-search-app/index.mdx similarity index 99% rename from src/content/blog/google-app-script-drug-search-app.mdx rename to src/content/blog/google-app-script-drug-search-app/index.mdx index fcc1449..40543e5 100644 --- a/src/content/blog/google-app-script-drug-search-app.mdx +++ b/src/content/blog/google-app-script-drug-search-app/index.mdx @@ -2,7 +2,7 @@ title: "สร้างระบบสืบค้นบัญชียาของโรงพยาบาล ด้วย Google Sheets และ Google Apps Script" description: "คู่มือในการสร้างเว็บแอปค้นหาข้อมูลบัญชียาของโรงพยาบาลแบบเรียลไทม์" pubDate: "2025-10-28" -heroImage: "/blog-placeholder-8.png" +heroImage: "/images/common/blog-placeholder-8.png" category: "Google Apps Script" tags: [ diff --git a/src/content/blog/google-app-script.mdx b/src/content/blog/google-app-script/index.mdx similarity index 99% rename from src/content/blog/google-app-script.mdx rename to src/content/blog/google-app-script/index.mdx index e3a6268..2aa1764 100644 --- a/src/content/blog/google-app-script.mdx +++ b/src/content/blog/google-app-script/index.mdx @@ -2,7 +2,7 @@ title: 'สร้างเว็บแอปกรอกข้อมูลด้วย Google Sheets + Apps Script (ฉบับมือใหม่)' description: 'เรียนรู้วิธีสร้างเว็บฟอร์มสำหรับกรอกข้อมูลที่บันทึกลง Google Sheets แบบเรียลไทม์ โดยใช้ Google Apps Script เหมาะสำหรับผู้เริ่มต้นที่ไม่มีพื้นฐานโปรแกรมมิ่ง' pubDate: '2025-08-27' -heroImage: '/blog-placeholder-3.png' +heroImage: '/images/common/blog-placeholder-3.png' category: 'Google Apps Script' tags: ['Google App Script', 'Google Sheets', 'Web Development',] featured: false diff --git a/src/content/blog/haskell-ep1.mdx b/src/content/blog/haskell-ep1/index.mdx similarity index 99% rename from src/content/blog/haskell-ep1.mdx rename to src/content/blog/haskell-ep1/index.mdx index 3ee1792..1a51186 100644 --- a/src/content/blog/haskell-ep1.mdx +++ b/src/content/blog/haskell-ep1/index.mdx @@ -2,7 +2,7 @@ title: 'เริ่มต้นกับ Haskell: EP.1 บทนำ' description: "แปลและเรียบเรียงจากบทนำของ 'Learn You a Haskell for Great Good!' เพื่อให้โปรแกรมเมอร์ที่มีประสบการณ์กับภาษาอย่าง C, Java, Python ได้เข้าใจแก่นของ Functional Programming ผ่าน Haskell" pubDate: '2025-10-13' -heroImage: '/blog-placeholder-6.png' +heroImage: '/images/common/blog-placeholder-6.png' category: 'Programming Languages' tags: ['Haskell', 'Functional Programming', 'Beginner'] featured: true diff --git a/src/content/blog/haskell-ep2.mdx b/src/content/blog/haskell-ep2/index.mdx similarity index 99% rename from src/content/blog/haskell-ep2.mdx rename to src/content/blog/haskell-ep2/index.mdx index cd59b6b..485e215 100644 --- a/src/content/blog/haskell-ep2.mdx +++ b/src/content/blog/haskell-ep2/index.mdx @@ -2,7 +2,7 @@ title: 'เริ่มต้นกับ Haskell: EP.2 ลงมือปฏิบัติ' description: 'เริ่มต้นลงมือปฏิบัติ มาลองใช้งาน GHCi ซึ่งเป็นโหมดโต้ตอบของ Haskell เพื่อทำความเข้าใจกับการคำนวณพื้นฐาน, Boolean, และวิธีเรียกใช้ฟังก์ชันแบบ prefix และ infix' pubDate: '2025-10-17' -heroImage: '/blog-placeholder-7.png' +heroImage: '/images/common/blog-placeholder-7.png' category: 'Programming Languages' tags: ['Haskell', 'Functional Programming', 'GHCi', 'Beginner'] featured: false diff --git a/src/content/blog/learn-python-with-ritesh-chauhan.mdx b/src/content/blog/learn-python-with-ritesh-chauhan/index.mdx similarity index 99% rename from src/content/blog/learn-python-with-ritesh-chauhan.mdx rename to src/content/blog/learn-python-with-ritesh-chauhan/index.mdx index e4603cf..665e452 100644 --- a/src/content/blog/learn-python-with-ritesh-chauhan.mdx +++ b/src/content/blog/learn-python-with-ritesh-chauhan/index.mdx @@ -2,7 +2,7 @@ title: 'เส้นทางสู่ Python Master: คู่มือการเรียนรู้จาก Repository Python by Ritesh Chauhan' description: 'เจาะลึกการเรียน Python ตั้งแต่พื้นฐานสู่ OOP ผ่าน 35 ไฟล์โค้ดพร้อมแบบฝึกหัดกว่า 200 ข้อใน Repository เดียว' pubDate: '2025-11-03' -heroImage: '/blog-placeholder-python-course.png' +heroImage: '/images/common/blog-placeholder-python-course.png' category: 'Programming Languages' tags: ['Python', 'Beginner', 'Programming', 'OOP', 'Guide'] featured: true diff --git a/src/content/blog/rust-variables-and-mutability.mdx b/src/content/blog/rust-variables-and-mutability/index.mdx similarity index 99% rename from src/content/blog/rust-variables-and-mutability.mdx rename to src/content/blog/rust-variables-and-mutability/index.mdx index 44fd5d4..c99dc28 100644 --- a/src/content/blog/rust-variables-and-mutability.mdx +++ b/src/content/blog/rust-variables-and-mutability/index.mdx @@ -2,7 +2,7 @@ title: 'Rust พื้นฐาน: ทำความเข้าใจตัวแปรและการเปลี่ยนแปลงค่าอย่างละเอียด' description: 'มาเรียนรู้เรื่องตัวแปรในภาษา Rust อย่างละเอียดครบถ้วน ตั้งแต่ทำไมตัวแปรถึงเป็นแบบไม่เปลี่ยนแปลงโดยค่าเริ่มต้น วิธีการทำให้เปลี่ยนแปลงได้ ค่าคงที่ ไปจนถึงเทคนิคการซ้อนทับตัวแปร' pubDate: '2025-11-13' -heroImage: '/blog/rust-variables-hero.png' +heroImage: '/images/blog/rust-variables-and-mutability/rust-variables-hero.png' category: 'Programming Languages' tags: ['Rust', 'Programming', 'Variables', 'Mutability', 'Backend'] featured: true diff --git a/src/content/blog/vue-standard-protocol-antfu.mdx b/src/content/blog/vue-standard-protocol-antfu/index.mdx similarity index 99% rename from src/content/blog/vue-standard-protocol-antfu.mdx rename to src/content/blog/vue-standard-protocol-antfu/index.mdx index 4ac02cd..bb99edc 100644 --- a/src/content/blog/vue-standard-protocol-antfu.mdx +++ b/src/content/blog/vue-standard-protocol-antfu/index.mdx @@ -2,7 +2,7 @@ title: 'Lint Like a Senior Developer: การตั้งค่า eslint + husky + lint staged + github actions' description: 'การ Setup โปรเจกต์ Vue ระดับ Production-Ready ครบจบทั้ง Linting, Formatting, Git Hooks และ CI/CD' pubDate: '2025-12-08' -heroImage: '/blog/eslint-antfu-setup.png' +heroImage: '/images/blog/vue-standard-protocol-antfu/eslint-antfu-setup.png' category: 'Development Tools' tags: ['Vue.js', 'ESLint', 'Antfu', 'Productivity', 'DX'] featured: true diff --git a/src/content/blog/web-accessibility-101.mdx b/src/content/blog/web-accessibility-101/index.mdx similarity index 99% rename from src/content/blog/web-accessibility-101.mdx rename to src/content/blog/web-accessibility-101/index.mdx index 6526af4..69aa058 100644 --- a/src/content/blog/web-accessibility-101.mdx +++ b/src/content/blog/web-accessibility-101/index.mdx @@ -2,7 +2,7 @@ title: 'Web Accessibility 101: คู่มือสร้างเว็บเพื่อทุกคนที่นักพัฒนา (ทุกคน) ควรรู้' description: 'เรียนรู้พื้นฐาน Web Accessibility (a11y) ที่ไม่ใช่แค่เรื่องทางเทคนิค แต่คือหัวใจของการสร้างประสบการณ์ที่ดีสำหรับผู้ใช้ทุกคน พร้อมเครื่องมือและเทคนิคที่นำไปใช้ได้ทันที' pubDate: '2025-10-05' -heroImage: '/blog-placeholder-5.png' +heroImage: '/images/common/blog-placeholder-5.png' category: 'Web Development' tags: ['Accessibility', 'a11y', 'Best Practice', 'Web Development', 'UX'] featured: true diff --git a/src/pages/about.astro b/src/pages/about.astro index b201b6a..d321ef1 100644 --- a/src/pages/about.astro +++ b/src/pages/about.astro @@ -8,27 +8,51 @@ import BaseLayout from '@/layouts/BaseLayout.astro';

จากเภสัชกรสู่โปรแกรมเมอร์

- เส้นทางของผมเริ่มต้นที่เคาน์เตอร์จ่ายยาท่ามกลางใบสั่งยาและการดูแลผู้ป่วย มาวันนี้ผมเปลี่ยนมาสร้างสรรค์โซลูชันดิจิทัล เขียนโค้ดที่สะอาดตา และออกแบบประสบการณ์ผู้ใช้ที่เข้าใจง่าย นี่คือเรื่องราวการเดินทางของผมจากบทบาทเภสัชกรสู่การเป็นนักพัฒนาซอฟต์แวร์ + เส้นทางของผมเริ่มต้นที่เคาน์เตอร์จ่ายยาท่ามกลางใบสั่งยาและการดูแลผู้ป่วย + มาวันนี้ผมเปลี่ยนมาสร้างสรรค์โซลูชันดิจิทัล เขียนโค้ดที่สะอาดตา + และออกแบบประสบการณ์ผู้ใช้ที่เข้าใจง่าย + นี่คือเรื่องราวการเดินทางของผมจากบทบาทเภสัชกรสู่การเป็นนักพัฒนาซอฟต์แวร์

- ผมคือเภสัชกรสุรเดช ประถมศักดิ์ ผู้สร้าง RxDev Man ด้วยความหลงใหลในตรรกะ การแก้ปัญหา และประสิทธิภาพ ซึ่งเป็นทักษะที่ได้ฝึกฝนจากงานสายสาธารณสุข ทำให้ผมได้ค้นพบเส้นทางใหม่ในการพัฒนาซอฟต์แวร์ ผมทึ่งกับวิธีที่เทคโนโลยีสามารถแก้ปัญหาที่ซับซ้อนในวงกว้างได้ และตัดสินใจที่จะกระโดดเข้ามาเรียนรู้อย่างเต็มตัว + ผมคือเภสัชกรสุรเดช ประถมศักดิ์ ผู้สร้าง RxDev Man + ด้วยความหลงใหลในตรรกะ การแก้ปัญหา และประสิทธิภาพ + ซึ่งเป็นทักษะที่ได้ฝึกฝนจากงานสายสาธารณสุข + ทำให้ผมได้ค้นพบเส้นทางใหม่ในการพัฒนาซอฟต์แวร์ + ผมทึ่งกับวิธีที่เทคโนโลยีสามารถแก้ปัญหาที่ซับซ้อนในวงกว้างได้ + และตัดสินใจที่จะกระโดดเข้ามาเรียนรู้อย่างเต็มตัว

- เว็บไซต์นี้เปรียบเสมือนคลังความรู้ส่วนตัวและบันทึกการเรียนรู้ที่ผมเปิดเผยสู่สาธารณะ ผมเขียนเกี่ยวกับหัวข้อต่างๆ ที่กำลังศึกษา ตั้งแต่ frontend frameworks อย่าง Astro และ Vue ไปจนถึงความท้าทายเฉพาะทางในซอฟต์แวร์โรงพยาบาลอย่าง HOSxP เป้าหมายของผมคือการสร้างความเข้าใจที่ลึกซึ้งยิ่งขึ้นผ่านการแบ่งปันความรู้ให้ผู้อื่น และเผยแพร่แหล่งข้อมูลที่เป็นประโยชน์ซึ่งผมได้ใช้ตลอดเส้นทางนี้ + เว็บไซต์นี้เปรียบเสมือนคลังความรู้ส่วนตัวและบันทึกการเรียนรู้ที่ผมเปิดเผยสู่สาธารณะ + ผมเขียนเกี่ยวกับหัวข้อต่างๆ ที่กำลังศึกษา ตั้งแต่ frontend frameworks + อย่าง Astro และ Vue ไปจนถึงความท้าทายเฉพาะทางในซอฟต์แวร์โรงพยาบาลอย่าง + HOSxP + เป้าหมายของผมคือการสร้างความเข้าใจที่ลึกซึ้งยิ่งขึ้นผ่านการแบ่งปันความรู้ให้ผู้อื่น + และเผยแพร่แหล่งข้อมูลที่เป็นประโยชน์ซึ่งผมได้ใช้ตลอดเส้นทางนี้

ช่องทางการติดต่อ

- ผมเปิดรับการพูดคุยเกี่ยวกับโปรเจกต์ใหม่ๆ แลกเปลี่ยนความรู้ หรือเรื่องราวเกี่ยวกับเทคโนโลยีเสมอ อย่าลังเลที่จะติดต่อมานะครับ + ผมเปิดรับการพูดคุยเกี่ยวกับโปรเจกต์ใหม่ๆ แลกเปลี่ยนความรู้ + หรือเรื่องราวเกี่ยวกับเทคโนโลยีเสมอ อย่าลังเลที่จะติดต่อมานะครับ

A portrait of Sabot diff --git a/src/pages/index.astro b/src/pages/index.astro index a1eb587..cb07854 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -3,106 +3,105 @@ import BaseLayout from '@/layouts/BaseLayout.astro'; --- -
-
-
-

HI, I'M SURADET

-

- Pharmacist by Training,
Developer by Passion. -

-

- ยินดีต้อนรับสู่ RxDev Man นะครับ ^^ - ผมสร้างเว็บบล็อกนี้ขึ้นมาเพื่อบันทึกสิ่งที่ได้เรียนรู้ในโลกของการเขียนโปรแกรม - ในเว็บบล็อกนี้หลักๆก็จะเน้นไปที่บทความครับ - อาจจะมีเครื่องมือที่ผมสร้างขึ้นเองบ้าง - หรืออาจจะมีอะไรเพิ่มเติมในอนาคต ถ้าอยากรู้ว่ามีอะไรบ้าง - มาค้นหากันเลยครับ -

- Explore My Notes -
-
- A portrait of the author -
-
+
+
+
+

HI, I'M SURADET

+

+ Pharmacist by Training,
Developer by Passion. +

+

+ ยินดีต้อนรับสู่ RxDev Man นะครับ ^^ + ผมสร้างเว็บบล็อกนี้ขึ้นมาเพื่อบันทึกสิ่งที่ได้เรียนรู้ในโลกของการเขียนโปรแกรม + ในเว็บบล็อกนี้หลักๆก็จะเน้นไปที่บทความครับ + อาจจะมีเครื่องมือที่ผมสร้างขึ้นเองบ้าง หรืออาจจะมีอะไรเพิ่มเติมในอนาคต + ถ้าอยากรู้ว่ามีอะไรบ้าง มาค้นหากันเลยครับ +

+ Explore My Notes +
+
+ A portrait of the author +
+
From a3a280a58f8079280f44093bb23d6dece91c2107 Mon Sep 17 00:00:00 2001 From: Suradet Pratomsak Date: Tue, 30 Dec 2025 21:16:08 +0700 Subject: [PATCH 2/2] chore: remove AGENTS.md after AI task completion --- agents.md | 64 ------------------------------------------------------- 1 file changed, 64 deletions(-) delete mode 100644 agents.md diff --git a/agents.md b/agents.md deleted file mode 100644 index 3e19def..0000000 --- a/agents.md +++ /dev/null @@ -1,64 +0,0 @@ -# Refactoring Task: Reorganize Blog Content and Assets - -## Context - -This is an Astro project. Currently, the file structure for blog posts and images is flat and cluttered. - -- Blog posts are located at: `src/content/blog/*.mdx` -- Images are scattered in: `public/`, `public/blog/`, and `public/images/` - -## Objective - -Refactor the file structure to use **Directory-based (Page Bundle)** organization for MDX files and a structured hierarchy for public images. The goal is to improve maintainability without breaking existing URLs or image paths. - -## Plan of Action - -### Phase 1: Reorganize MDX Files (Page Bundles) - -For every `.mdx` file in `src/content/blog/`: - -1. Create a new directory inside `src/content/blog/` with the same name as the file (minus the extension). - - Example: `src/content/blog/my-article.mdx` -> `src/content/blog/my-article/` -2. Move the `.mdx` file into that directory and rename it to `index.mdx`. - - Result: `src/content/blog/my-article/index.mdx` -3. **Important:** Use `git mv` command if possible to preserve file history. - -### Phase 2: Reorganize Public Images - -1. Create a standardized directory structure: `public/images/blog/` -2. Identify images belonging to specific blog posts. -3. Move images into specific subdirectories: `public/images/blog/[slug-of-the-post]/` - - If an image is generic (used across multiple posts), move it to `public/images/common/`. -4. **Important:** Use `git mv` to move the image files. - -### Phase 3: Update References - -Iterate through all `src/content/blog/**/*.mdx` files and update image paths: - -1. **Frontmatter (`heroImage`):** - - Update the path string to match the new location in `public/`. - - Example: `heroImage: '/blog/old-img.png'` -> `heroImage: '/images/blog/my-article/old-img.png'` - -2. **Markdown Images (`![alt](src)`):** - - Update standard markdown image links. - - Example: `![alt](/blog-placeholder-1.png)` -> `![alt](/images/blog/my-article/blog-placeholder-1.png)` - -3. **Astro `` Component:** - - Update the `src` attribute. - - Example: `` -> `` - -### Phase 4: Verification - -1. Run `npm run lint` or `npm run build` to ensure no broken paths. -2. Ensure that the `slug` generation logic in `src/utils/slugify.ts` or `astro.config.mjs` is not affected (Astro automatically handles `index.mdx` inside folders correctly, so this should remain safe). - -## Constraints & Rules - -- Do NOT delete any files. -- Do NOT change the logic in `src/content/config.ts`. -- Ensure all paths remain absolute paths starting with `/` (referencing the public folder). -- If you encounter duplicate image names, resolve them by appending the post slug to the filename. - -## Execution Order - -Please perform Phase 1 first. Once confirmed, proceed to Phase 2 and 3 together.