برو به محتوای اصلی
برگرد به همه‌ی یادداشت‌ها
6 دقیقه برای خوندن

این پورتفولیو فقط یک رزومه نیست

چرا این سایت رو ساختم و چطور از یک معرفی ساده، به بخشی از کار روزمره‌ام تبدیل شد.

nextjstailwindپورتفولیومهندسی

از اول نمی‌خواستم این سایت یک رزومه‌ی آنلاین باشه که یک بار بسازمش و بعد فراموشش کنم. دنبال جایی بودم که هم کارهام رو نشون بده، هم توضیح بده چرا و چطور ساخته شدن. برای همین این پورتفولیو هیچ‌وقت واقعاً تمام نمی‌شه. هر وقت مسیر کارم تغییر کنه، اینجا هم باید همراهش تغییر کنه.

چرا رفتم سراغ Next.js App Router؟

برای یک سایت محتوایی، سرعت و خوانایی فقط مسئله‌ی فنی نیست. کسی که وارد سایت می‌شه نباید برای دیدن یک معرفی ساده منتظر بمونه یا دنبال محتوای اصلی بگرده. App Router چند نیاز مهمم رو یک‌جا جواب داد:

  • رندر سمت سرور: متن اصلی از همان اول داخل صفحه‌ست و برای دیده شدن منتظر جاوااسکریپت نمی‌مونه.
  • متادیتای درست: عنوان، توضیح، نقشه‌ی سایت و نسخه‌های فارسی و انگلیسی کنار خود صفحه تعریف می‌شن و کمتر چیزی از قلم می‌افته.
  • ساختار جدا برای هر زبان: فارسی واقعاً راست‌به‌چپه و انگلیسی چپ‌به‌راست، ولی لازم نیست منطق مشترک رو دو بار بنویسم.

یک زبان مشترک برای همه‌ی صفحه‌ها

سایت رو از چند قطعه‌ی کوچک و قابل‌استفاده‌ی دوباره ساختم. دکمه، تیتر بخش، کارت پروژه و خط زمانی هرکدوم کار مشخصی دارن و صفحه‌ها فقط از همین قطعه‌ها ترکیب می‌شن.

شاید بازدیدکننده این ساختار رو مستقیم نبینه، ولی موقع تغییر تفاوتش معلوم می‌شه. مثلاً وقتی لحن فارسی سایت رو عوض می‌کنم یا پروژه‌ی تازه‌ای اضافه می‌کنم، لازم نیست دنبال چند نسخه‌ی پراکنده بگردم. متن یا کامپوننت اصلی رو تغییر می‌دم و نتیجه هر جایی که باید دیده می‌شه.

سرعت هم بخشی از طراحی بود

برای خودم چند خط قرمز عملکردی گذاشتم:

  • نمایش اولین محتوای صفحه زیر ۱.۲ ثانیه
  • نمایش بزرگ‌ترین بخش قابل‌دیدن زیر ۲.۵ ثانیه
  • جابه‌جایی ناخواسته‌ی صفحه کمتر از ۰.۱

این عددها قرار نیست فقط یک گزارش خوب بسازن. سایت کند، قبل از اینکه بازدیدکننده چیزی درباره‌ی کیفیت کارم بخونه، خودش یک تصویر بد از کیفیت کار می‌سازه.

پشت صحنه‌ای که دیده نمی‌شه

نسخه‌ی اصلی سایت داخل Docker اجرا می‌شه، Docker Compose روشن نگهش می‌داره و nginx درخواست‌های دامنه رو به کانتینر می‌رسونه. خروجی standalone رو هم طوری آماده کردم که فایل‌های استاتیک و پوشه‌ی public حتماً همراهش باشن. اگر این بخش جا بمونه، HTML می‌رسه ولی سایت بدون ظاهر و تعامل درست بالا میاد.

این دقیقاً همون بخشیه که دوستش دارم. محصول فقط چیزی نیست که روی صفحه می‌بینیم؛ تجربه‌ی خوب نتیجه‌ی معماری، انتشار، مانیتورینگ و ده‌ها تصمیم کوچیکیه که پشت صحنه گرفته می‌شن.

از اینجا به بعد

این پورتفولیو تمام نشده و قرار هم نیست تمام بشه. هر پروژه‌ی تازه، هر یادداشت و هر تجربه‌ای که ارزش ثبت کردن داشته باشه، چیزی بهش اضافه می‌کنه. نسخه‌ی فعلی فقط تصویر صادقانه‌ای از کاریه که امروز انجام می‌دم: ساختن یک محصول از اولین ایده تا وقتی که واقعاً منتشر می‌شه.