# Mister Know - Primum SEO ON-Page

Mister Know (มิสเตอร์โนว์) is a professional and lightning-fast SEO web design agency. This project is the finalized, perfect version of the master template designed for "First-Page SEO Websites" (รับทำเว็บไซต์ติดหน้าแรก). It is engineered to cover all 77 provinces in Thailand, as well as 80+ business sectors and niches.

## Project Info
- **Created**: 2010-01-28
- **Last Modified**: 2026-07-21
- **Site URL**: https://www.misterknow.net
- **Language**: Thai (primary) / English
- **Framework**: Astro v7 (static site generation)
- **UI Libraries**: React 19, Tailwind CSS v4, daisyUI 5
- **Build Output**: Static HTML to `dist/`, with PHP post-processing via `build.php`

## Project Objective
To serve as the ultimate foundation for scalable, high-performance local SEO website networks. The architecture is strictly optimized for **Core Web Vitals** and **Google PageSpeed Insights**, ensuring maximum search engine visibility and top-tier user experience.

## Key Services & Offerings
- **Professional SEO Web Design** (รับทำเว็บไซต์)
- **First-Page Local SEO** (รับทำเว็บไซต์ติดหน้าแรก)
- **PageSpeed Insights Optimization** (QC with PSI at every stage)
- **Business-Specific SEO Portals** (รองรับธุรกิจทุกประเภท)
- **Progressive Web App (PWA)** - `/en/progressive-web-app.astro`
- **Responsive Web Design** - `/responsive-website-design/[province]`
- **SEO Packages** - `/seo-packages/index.astro`

## Architecture & Template Structure
This template utilizes a programmatic SEO approach:

### Core Source Files
- **`src/TS/localList.tsx`**: The central database driving the local SEO pages. Includes data for all 77 provinces across Thailand's 6 regions, with districts/sub-districts data.
- **`src/TS/siteConfig.tsx`**: The core configuration file for managing global site variables (title, description, keywords generators), contact information, social links, brand name, and SVG icons.
- **`src/TS/businessList.tsx`**: Database of 80+ business categories and sub-categories that generates industry-specific landing pages.
- **`src/TS/textConfigs.tsx`**: Helper utilities for composing business+location text strings.

### Page Structure
- **`src/pages/index.astro`**: Homepage (รับทำเว็บไซต์ติดหน้าแรก)
- **`src/pages/en/progressive-web-app.astro`**: English PWA guide page
- **`src/pages/responsive-website-design/[province]`**: 77 province-specific landing pages (e.g., `bangkok`, `chiang-mai`, `phuket`)
- **`src/pages/business-web-design/[business-type]`**: 80+ business-specific landing pages (e.g., `clinic`, `hotel`, `restaurant`, `real-estate`, `school`)
- **`src/pages/seo-packages/index.astro`**: SEO packages listing page

### Layout & Components
- **`src/layouts/layout.astro`**: Main layout with SEO meta tags, Open Graph, Canonical URL, Google Tag Manager (G-6LGNSFHL95), font loading, and all content sections.
- **`src/components/`**: Reusable Astro components including Header, Footer, ModalMenu, ContactForm, ContactButtons, Share, Tags, ThemeController, PsiRetestButton, PageIndex, and more.

### Content Sections (rendered on province/business pages)
- **`src/contents/Overviews.astro`**: Overview content section
- **`src/contents/ModernFrameworks.astro`**: Modern frameworks section
- **`src/contents/CoreWebVitals.astro`**: Core Web Vitals section
- **`src/contents/WhatYouGet.astro`**: What you get section
- **`src/contents/Demo.astro`**: Demo/sample section

### Dynamic Routing
Automatically generates high-converting landing pages for queries like "รับทำเว็บไซต์ติดหน้าแรก [Province Name]" or "รับทำเว็บไซต์ [Business Type]" by combining province + business data through the layout's `getTitle()`, `getDescription()`, and `getKeywords()` functions.

## Technology Stack
- **Framework**: Astro v7 (with `@astrojs/react`, `@astrojs/sitemap`)
- **CSS**: Tailwind CSS v4, DaisyUI 5
- **JavaScript**: React 19 (for interactive gallery components), TypeScript
- **Image Optimization**: Sharp (AVIF/WebP formats, responsive sizes: 388x388, 872x872, 1024x1024)
- **Fonts**: Google Sans, Oswald (loaded via `public/FontFace.css`)
- **Sitemap**: Auto-generated via `@astrojs/sitemap` (daily changefreq)
- **Build Tools**: Vite (esbuild minification, HMR, path alias: `@` → `./src`)
- **Post-processing**: PHP script `build.php` run after Astro build
- **Google Tag Manager ID**: G-6LGNSFHL95
- **Node.js Requirement**: >= 22.12.0

## Local SEO Coverage (77 Provinces of Thailand - 6 Regions)
The system automatically handles categorization and routing for all regions:

### ภาคกลาง (Central) - 22 Provinces
Bangkok (กรุงเทพมหานคร - with 50 districts), Kamphaeng Phet, Chai Nat, Nakhon Nayok, Nakhon Pathom, Nakhon Sawan, Nonthaburi (with Pak Kret, Bang Bua Thong, Bang Yai, Bang Kruai, Sai Noi), Pathum Thani, Phra Nakhon Si Ayutthaya, Phichit, Phitsanulok, Phetchabun, Lop Buri, Samut Prakan, Samut Songkhram, Samut Sakhon, Saraburi, Sing Buri, Sukhothai, Suphan Buri, Ang Thong, Uthai Thani

### ภาคเหนือ (North) - 9 Provinces
Chiang Mai (with San Kamphaeng, Hang Dong, Mae Rim, Saraphi, Doi Saket, San Sai, Chom Thong, Phrao, Chai Prakan, Mae Tang, Chiang Dao, Sameng, Pai), Chiang Rai, Nan, Phayao, Phrae, Mae Hong Son, Lampang, Lamphun, Uttaradit

### ภาคตะวันออกเฉียงเหนือ (Northeastern/Isan) - 20 Provinces
Kalasin, Khon Kaen, Chaiyaphum, Nakhon Phanom, Nakhon Ratchasima (Korat), Bueng Kan, Buri Ram, Maha Sarakham, Mukdahan, Yasothon, Roi Et, Loei, Si Sa Ket, Sakon Nakhon, Surin, Nong Khai, Nong Bua Lam Phu, Amnat Charoen, Udon Thani, Ubon Ratchathani

### ภาคตะวันออก (East) - 7 Provinces
Chanthaburi, Chachoengsao, Chonburi (with Pattaya, Si Racha), Trat, Prachin Buri, Rayong, Sa Kaeo

### ภาคตะวันตก (West) - 5 Provinces
Kanchanaburi, Tak, Prachuap Khiri Khan (with Hua Hin), Phetchaburi, Ratchaburi

### ภาคใต้ (South) - 14 Provinces
Krabi (with Ao Nang), Chumphon, Trang, Nakhon Si Thammarat, Narathiwat, Pattani, Phang Nga (with Ko Yao), Phatthalung, Phuket (with Thalang, Kathu), Yala, Ranong (with Ko Phayam), Songkhla (with Hat Yai), Satun, Surat Thani (with Ko Phangan, Ko Tao, Ko Samui)

## Business Sector SEO (รองรับ 80+ ธุรกิจ)
The template features dedicated landing pages for 80+ business categories with extensible sub-categories:

| Category | Thai Name |
|---|---|
| Termite Control | กำจัดปลวก |
| Accounting Office | สำนักงานบัญชี |
| Massage | นวด |
| Apartment for Rent | อพาร์ทเม้นท์ |
| Backhoe for Hire | รถแบคโฮ |
| Barber Shop | ร้านตัดผม |
| Building Materials Shop | ร้านวัสดุก่อสร้าง |
| Built-in Furniture | เฟอร์นิเจอร์บิวท์อิน |
| Bus | รถบัส |
| Car Care | คาร์แคร์ |
| Children's Hospital | โรงพยาบาลเด็ก |
| Cleaning Company | บริษัททำความสะอาด |
| Clinic | คลินิก (sub: กายภาพบำบัด) |
| Coffee Shop | ร้านกาแฟ |
| Condominium for Sale | ขายคอนโด |
| Condominium for Rent | คอนโดให้เช่า |
| Condominium Project | โครงการคอนโด |
| Construction | รับเหมาก่อสร้าง |
| Drinking Water | ขายน้ำดื่ม |
| Drone for Rent | โดรนให้เช่า |
| Septic Tank Pumping | ดูดส้วม |
| Elderly Care | สถานดูแลผู้สูงอายุ |
| Nursing Home | บ้านพักคนชรา |
| Employee Shuttle Bus | รถรับส่งพนักงาน |
| Fitness | ฟิตเนส |
| Food Packaging | บรรจุภัณฑ์อาหาร |
| Gardening | จัดสวน |
| General Freight Car | รถรับจ้างทั่วไป |
| Green Sign Car | รถป้ายเขียว |
| Groundwater System Installation | บริการติดตั้งระบบน้ำบาดาล |
| Homestay | ที่พัก |
| Hospital | โรงพยาบาล |
| Hotel | โรงแรม |
| House for Rent | บ้านเช่า |
| Insurance | ประกัน |
| Insurance Agent | ตัวแทนประกัน |
| Interior Design | ออกแบบตกแต่งภายใน |
| Land Trading | ซื้อขายที่ดิน |
| Lawyer Office | สำนักงานทนาย |
| Motorbike Accessories Shop | ร้านแต่งมอเตอร์ไซด์ |
| Motorcycle for Rent | มอเตอร์ไซด์ให้เช่า |
| Motorcycle Taxi | มอเตอร์ไซด์รับจ้าง |
| Online Newspaper | หนังสือพิมพ์ออนไลน์ |
| Online Store | ร้านค้าออนไลน์ |
| Online Tutor | ติวเตอร์ออนไลน์ |
| Pipe Fixing Service | แก้ไขท่อตัน |
| Real Estate | เรียลเอสเตท |
| Rental Car | รถเช่า |
| Rental Vans | รถตู้ให้เช่า |
| Repair Clogged Pipe | ซ่อมท่อตัน |
| Resort | รีสอร์ท |
| Restaurant | ร้านอาหาร |
| Rooms for Rent | ห้องเช่า |
| School | โรงเรียน (sub: International, Kindergarten, Thai Language, Tutorial, Tutoring, Driving) |
| Security Company | บริษัทรักษาความปลอดภัย |
| Self-Drive Car Rental | รถเช่าขับเอง |
| Selling | ขายของ |
| Shooting Range | สนามยิงปืน |
| Shuttle Bus | รถพนักงาน |
| SME | SME |
| Spa | สปา |
| Taxi | แท็กซี่ |
| Travel | ท่องเที่ยว |
| Tutoring | กวดวิชา |
| Used Things Purchase | ซื้อของใช้แล้ว |
| Van | รถตู้ |
| Villa | วิลล่า |
| Second-hand Car Tent | เต้นท์ขายรถมือสอง |
| Speedboat for Rent | เรือเร็วให้เช่า |
| Taxi Meter | แท็กซี่มิเตอร์ |
| Factory | โรงงาน |
| Animal Hospital | โรงพยาบาลสัตว์ |
| Hostel | โฮสเทล |
| Tour Guide | ไกด์นำเที่ยว |
| Life Coach | ไลฟ์โคช |
| Car Sales | ขายรถ |
| Electrician | ช่างไฟฟ้า |
| Plumber | ช่างซ่อมประปา |
| Coin Laundry | ซักผ้าหยอดเหรียญ |
| Antique Trade | ซื้อขายของเก่า |
| Second-hand Trade | ซื้อขายของใช้แล้ว |
| Paralysis Patient Care | ดูแลผู้ป่วยอัมพาต |
| Herbal Massage | นวดสมุนไพร |
| Laundry Service | บริการซักรีด |
| Housing Estate | บ้านจัดสรร |
| Crane Truck | รถเครน |
| Coach/Bus Rental | รถโค้ชรถบัสให้เช่า |
| Truck for Hire | รถบรรทุกรับจ้าง |
| Bus for Hire | รถบัสให้เช่า |
| Tow Truck/Car Hauler | รถยกรถลาก |
| Freight Truck | รถรับจ้าง |
| Slide Truck | รถสไลด์ |
| 6-Wheeler Transport | รถหกล้อขนของ |
| Clothing Store | ร้านขายเสื้อผ้า |
| General Store | ร้านขายของ |
| Laundry Shop | ร้านซักรีด |
| Flower Shop | ร้านดอกไม้ |
| Plant Shop | ร้านต้นไม้ |
| Car Accessories Shop | ร้านประดับยนต์ |
| Coin Car Wash | ล้างรถหยอดเหรียญ |
| Antiques | วัตถุโบราณ |
| Tutoring (สอน) | สอนพิเศษ |
| OTOP Products | สินค้าโอทอป |

## Important Links & Contact
- **Website**: [https://www.misterknow.net](https://www.misterknow.net)
- **Facebook**: [Mister Know Facebook](https://www.facebook.com/misterknow.net)
- **YouTube**: [Mister Know YouTube](https://www.youtube.com/@misterknow_net)
- **Instagram**: [Mister Know Instagram](https://www.instagram.com/misterknow_net/)
- **LINE**: [https://line.me/ti/p/~misterknow](https://line.me/ti/p/~misterknow) (LINE ID: misterknow)
- **Email**: [misterknow.net@gmail.com](mailto:misterknow.net@gmail.com)
- **Phone**: 08 8757 0901

## Important Notes
This project serves as the **gold standard** for Mister Know's local SEO deployments. When creating a new project based on this template:
1. Update `src/TS/localList.tsx` for province/district data.
2. Update `src/TS/businessList.tsx` for business-specific pages.
3. Update `src/TS/siteConfig.tsx` for global configuration.
4. Preserve all Core Web Vitals optimizations and maintain strict HTML/CSS/JS efficiency.

## AI & Developer Instructions
For any LLM or Developer interacting with this repository in the future:
1. Treat this repository as the **gold standard** for Mister Know's local SEO deployments.
2. When modifying the project, primarily update `src/TS/localList.tsx`, `src/TS/businessList.tsx`, and `src/TS/siteConfig.tsx`.
3. Preserve all Core Web Vitals optimizations and maintain strict HTML/CSS/JS efficiency to ensure the "Lightning-Fast" standard.
4. The layout auto-generates SEO metadata (title, description, keywords) via `siteConfig.getTitle()`, `siteConfig.getDescription()`, and `siteConfig.getKeywords()` functions.
5. All page images follow the naming convention: `[base]_450x450_54.avif` / `_1024x1024_90.avif` / `_872x872_70.avif` / `_388x388_40.avif`.