النسخة التالتة: بنيت موقعي من جديد من موبايلي

#1. ما فتحتش اللابتوب

النهارده بنيت hfares.com من جديد للمرة التالتة. وعملت كل ده من الموبايل.

ما كانش ده التخطيط. كنت لسه دافع اشتراك Claude Pro وعايز أجرب التحديثات الجديدة: Opus 5.5، والـ artifacts، وClaude Design، وClaude Code وهو شغال على الكلاود من تطبيق الموبايل. وموقعي كان أقرب حاجة أجرب عليها.

وبالليل كان فيه أربع pull requests اتعملهم merge على main. ديزاين جديد، وserver rendering، وanalytics بجد. واللابتوب فضل مقفول.

#2. تلات نسخ، تلات harnesses

النسخة الأولى كانت في سبتمبر 2025. Replit agent، وChatGPT للمتطلبات، تلات أيام، 15 دولار. وقلت خلاص كده خلصت.

النسخة التانية كانت في مايو 2026. عملت audit كامل للـ SEO والـ UX، وحولته لملفات specs، وسلمتها لـ Claude Code متوصل بـ DeepSeek V4 Pro. بعد ضهر واحد، 37 مليون token، 87 سنت. الدرس ساعتها كان إن الـ harness أهم من الموديل.

النسخة التالتة خدت ساعتين من وقتي. Claude Opus في cloud sessions، بدأتها ووجهتها من تطبيق Claude على أندرويد. لا terminal، ولا IDE، ولا نسخة من الكود على جهازي.

النسخة الأولى أثبتت إني أقدر أطلق. التانية أثبتت إني أقدر أطلق برخص. التالتة سألت سؤال مختلف: الموضوع ده محتاجني أنا قد إيه؟

#3. ساعتين، من الموبايل

شغلي النهارده كان تلات حاجات. بكتب prompts. بفتح لينكات الـ preview. بوافق على الـ pull requests.

وسجلات الـ sessions بتحكي الباقي. خمس sessions على الموقع، كلهم بدأوا من الموبايل. أول واحدة اتفتحت الساعة 10:03. وآخر pull request اتعمله merge الساعة 20:36. وفي وقت كان فيه تلات sessions شغالين مع بعض: واحدة بتنضف الكود، وواحدة بتراجع الـ SEO، وواحدة بترسم اتجاهات للديزاين.

الجزء بتاعي خد ساعتين، على فترات، وأنا بعمل حاجات تانية. والـ agents اشتغلوا العشر ساعات ونص اللي في النص. ومفيش حاجة فيهم احتاجت التركيز اللي قعدة اللابتوب بتحتاجه.

الـ cloud sessions شغالة على أجهزة Anthropic، فالشغل بيكمل والشاشة مقفولة. وده التغيير الحقيقي. الـ agent مش مستنيني أقعد.

#4. الديزاين جه الأول المرة دي

النسخة التانية صلحت اللي الـ audit لقاه. وما لمستش شكل الموقع خالص.

النسخة التالتة بدأت بالديزاين. Session واحدة طلعت تلات اتجاهات للديزاين كـ Claude artifacts، صفحات أقدر أفتحها على الموبايل وأقارن بينهم. والتجارب دي وصلتني لـ PR #8، redesign كامل: ألوان teal، وخطوط IBM Plex Sans وIBM Plex Sans Arabic، وlayouts جديدة لكل صفحة، بالإنجليزي والعربي، فاتح وغامق.

فيه تصليحات كانت صغيرة. التواريخ بقت مكتوبة "Oct 4, 2026" بدل "10/4/2026". بانر الكوكيز بقى كارت صغير في الركن. وفلتر المدونة العربي كان بيعرض "تقنية" خمس مرات، لأن بوستاتي العربي كانت كاتبة التصنيف بخمس طرق مختلفة.

#5. الأداء، بالأرقام

لحد النهارده الصبح، كل بوستات المدونة كانت متشحنة جوه bundle واحد حجمه 845 KB. النسخة التالتة بتعمل render لكل صفحة بـ React على السيرفر، وبتحمل محتوى كل صفحة كملف JSON صغير.

والصور كانت أسوأ من الكود. صور المدونة نزلت من 198.5 MB لـ 16.3 MB بعد ما اتحولت لـ WebP.

شغلت Lighthouse على الموبايل، نفس الاختبار ونفس الجهاز، على الموقع زي ما كان الصبح وزي ما هو بالليل:

	قبل	بعد
الأداء (الرئيسية)	50	74
إمكانية الوصول	87	100
SEO	85	100
Largest Contentful Paint (الرئيسية)	11.3 s	5.1 s
حجم الصفحة (الرئيسية)	2,070 KB	1,122 KB

الاختبار اتعمل على سيرفر محلي عادي من غير CDN ومن غير compression، فالأرقام نفسها أقل من اللي هتشوفه على hfares.com. المهم هو الفرق بين العمودين.

لو بتبني موقعك من جديد بالـ agents، أنا بكتب عن كل نسخة بالأرقام الحقيقية. تابعني على LinkedIn عشان النسخة الجاية.

#6. أخيرًا هشوف مين بيزورني

Google Analytics كان دايمًا بطيء معايا. بطيء ومش بيستجيب.

النسخة التالتة فيها PostHog، مع session replay وevents مخصوصة لضغطات التواصل، وقراية المحتوى، واللينكات الخارجية. ومش بيشتغل غير لما الزائر يوافق على كوكيز الـ analytics، والـ replays بتخفي أي حاجة بتتكتب.

ودي أكتر حتة أنا متحمس لها. تلات نسخ وأنا ببني الموقع لزوار مش شايفهم. دلوقتي أقدر أعرف جايين منين، وبيقروا إيه، وبيمشوا من فين.

#7. ما قريتش الكود

لأول مرة، ما بصيتش على التغييرات في الملفات. ولا diff واحد.

الـ skill بتاع /code-review هو اللي راجع الـ pull requests. على الـ redesign لوحده عمل مرورين ولقى خمستاشر مشكلة، من breadcrumb كان بيخلص على الصفحة الغلط، لسنة في الـ footer كانت ممكن تبوظ الـ hydration ليلة راس السنة. والخمستاشر اتصلحوا قبل الـ merge.

في يونيو نشرت "ضائع في السياق". الفكرة كانت: الذكاء الاصطناعي يقدر يشيل مليون token، والبني آدم يقدر يراجع بجد حوالي 400 سطر، وحد هيطلق كود محدش قدر يقراه. النهارده أنا كنت الحد ده.

وأنا مش شايفه تناقض. شايفه تأقلم. الكود اللي بيكتبه الذكاء الاصطناعي بقى يعتمد عليه أكتر، وإنك تقرا كل سطر بنفسك بقت أهميته أقل من الأول. المراجعة ما اختفتش. اتنقلت من عيني لـ agent بيراجع، وفي الآخر لينك preview أنا فعلًا ضغطت عليه.

#8. الفاتورة

النسخة التانية كلفت 87 سنت، وكنت فخور بالرقم ده. النسخة التالتة حكاية تانية.

أنا على Claude Pro، بدفع شهري، يعني 20 دولار في الشهر. والخمس sessions بتوع الموقع كانوا هيكلفوا حوالي 72 دولار بأسعار الـ API. وعمري ما وصلت للـ usage limit.

النسخة التانية كانت أرخص لكل token. التالتة عملت شغل أكتر بكتير، على اشتراك ثابت أنا أصلًا بدفعه، وعملتها من الموبايل.

#9. اللي براقبه دلوقتي

الموقع بقى أسرع، ولأول مرة أقدر أقيسه. اللي لسه مش عارفه هو مين بيقراه.

PostHog اشتغل الساعة 15:06 النهارده. وكمان كام أسبوع هعرف الناس بتكمل أنهي بوستات، وهل حد بيضغط على "احجز مكالمة". والنسخة الرابعة هتتبني على الداتا دي، مش على تخميني.

#10. المراجع

1. Hossam Fares, "From Idea to Fully Deployed in 3 Days, All for $15", hfares.com, January 2025. V1: Replit, 3 days, $15.
2. Hossam Fares, "The Harness: How I Rebuilt My Portfolio for 87 Cents in One Afternoon", hfares.com, May 2026. V2: Claude Code + DeepSeek V4 Pro, 37M tokens, $0.87.
3. Hossam Fares, "Lost in the Context", hfares.com, June 2026. Effective human review window of about 400 lines.
4. Anthropic, "Claude Code on mobile", code.claude.com/docs/en/mobile. Cloud sessions keep running with the device off.
5. Anthropic, "Plans & pricing", claude.com/pricing. Claude Pro at $20 per month, billed monthly.
6. h-f-fares/Personal-website, pull requests #5 to #8, GitHub, October 17, 2026. Images 198.5 MB to 16.3 MB, 845 KB bundle replaced, fifteen review findings fixed.