وبلاگ MiPiBoy

وبلاگ MiPiBoy یک وبلاگ و پورتفولیوی شخصی است که با Next.js، MDX و Tailwind CSS ساخته شده است. این وبلاگ برای به اشتراک‌گذاری دانش مهندسی فرانت‌اند، تفکر محصول‌محور، بینش‌های UI/UX و تجربیات فنی در قالبی تمیز، حرفه‌ای و خوانا طراحی شده است.

وب‌سایت زنده: https://mipiboy.ir

این پروژه یک وب‌سایت و وبلاگ شخصی است، نه یک قالب متن‌باز عمومی.

دربارهٔ وبلاگ

این پروژه حول یک ایدهٔ اصلی شکل گرفته است: نوشتن محتوای فنی باکیفیت و ارائهٔ آن در قالب یک تجربهٔ برند شخصی قوی.

وبلاگ برای انتشار موارد زیر استفاده می‌شود:

• آموزش‌های فرانت‌اند و یادداشت‌های پیاده‌سازی
• مقالات فنی دربارهٔ React و Next.js
• بینش‌های مهندسی CSS و UI
• بهترین روش‌های تجربهٔ کاربری (UX) و کارایی
• مطالعهٔ موردی پروژه‌ها و تأملات مهندسی
• یادداشت‌های یادگیری شخصی و مشاهدات صنعتی

نتیجهٔ نهایی وب‌سایتی است که هم به‌عنوان یک پورتفولیو و هم یک پایگاه دانش حرفه‌ای احساس می‌شود.

چرا این وبلاگ مهم است؟

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

این پروژه به نمایش موارد زیر کمک می‌کند:

• عمق فنی در توسعهٔ فرانت‌اند
• وضوح در توضیح ایده‌های پیچیده
• تفکر محصول‌محور و آگاهی از تجربهٔ کاربری
• محتوای ساختاریافته به‌عنوان یک سیگنال حرفه‌ای
• ثبات و ظرافت در طراحی بصری

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

حوزه‌های تمرکز وبلاگ

استراتژی محتوایی حول موضوعاتی متمرکز شده است که برای کار مدرن فرانت‌اند و محصول بیشترین اهمیت را دارند:

• React و Next.js
• TypeScript و معماری فرانت‌اند
• Tailwind CSS و سیستم‌های UI مقیاس‌پذیر
• طراحی UI/UX و کیفیت تعاملات
• سئو و ساختار محتوا
• کارایی وب و بهینه‌سازی
• تجربهٔ توسعه‌دهنده و گردش‌کارهای عملی کدنویسی

این موضوعات باعث می‌شوند وبلاگ برای خوانندگان فنی و تیم‌های استخدامی، مرتبط، مفید و قابل‌اعتماد باشد.

امکانات اصلی

• صفحهٔ اصلی مدرن با هویت بصری قوی
• سیستم محتوای مبتنی بر وبلاگ با استفاده از MDX
• صفحات مقالهٔ ساختاریافته با متادیتا و برچسب‌ها
• پشتیبانی از نوشته‌های فنی و آموزش‌ها
• طراحی واکنش‌گرا برای موبایل و دسکتاپ
• تجربهٔ تم تیره/روشن با کیفیت بالا
• طراحی حرکتی و تعاملات نرم
• ساختار دوستدار سئو برای دیده‌شدن محتوا
• بخش‌های پورتفولیو که مکمل وبلاگ هستند

تکنولوژی‌ها

ساختار پروژه

ساختار کلی پروژه به شکل زیر است:

چه چیزی این پروژه را متمایز می‌کند؟

۱. یک پلتفرم برند شخصی است

وب‌سایت چیزی فراتر از کد را منتقل می‌کند؛ سلیقه، وضوح و حرفه‌ای‌گری را به نمایش می‌گذارد.

۲. توانایی نویسندگی را به رخ می‌کشد

نوشتن فنی یکی از قوی‌ترین سیگنال‌ها برای مهندسان است، به‌ویژه در نقش‌های فرانت‌اند، محصول و محتوا‑محور.

۳. تفکر محصول واقعی را ارائه می‌دهد

رابط کاربری نه تنها جذاب است، بلکه به‌گونه‌ای ساختار یافته است که تفکر محصول، ترکیب‌بندی، تصمیمات UX و کیفیت تجربهٔ کاربری را منعکس کند.

۴. برای رشد بلندمدت ساخته شده است

این وبلاگ می‌تواند به یک آرشیو فنی غنی، پورتفولیو و پایگاه دانش شخصی تبدیل شود.

راه‌اندازی محلی

پیش‌نیازها

• Node.js 18+
• pnpm

نصب و اجرا

git clone https://github.com/MiPiBoy/MiPiBoy-Blog.git
cd MiPiBoy-Blog

pnpm install

pnpm dev

pnpm build

مدل محتوا

وبلاگ از نوشتن مقاله با MDX و فرانت‌متر پشتیبانی می‌کند. یک پست معمولی شامل فیلدهای زیر است:

---
title: "عنوان مقاله شما"
description: "توضیح کوتاهی دربارهٔ مقاله"
date: "2026-08-29"
tags: ["React", "Next.js", "Tutorial"]
featured: true
readTime: "8"
author: "mortezaAghaei"
thumbnail: "/images/example.webp"
dir: "rtl"
---

## مقدمه

محتوای مقاله شما اینجا قرار می‌گیرد.

این ساختار برای محتوای فنی، آموزش‌ها، یادداشت‌ها و مطالعهٔ موارد (Case Studies) عالی است.

تنظیمات نویسنده

اطلاعات نویسندگان از طریق تنظیمات پروژه مدیریت می‌شود:

export const authors: Record<string, Author> = {
  mortezaAghaei: {
    name: "Morteza Aghaei",
    position: "Front-end Developer",
    avatar: "/authors/morteza-aghaei-3d.webp",
  },
};

برای استفاده از این نویسنده در یک مقاله:

author: "mortezaAghaei"

موقعیت‌های شغلی مرتبط

این پروژه به‌ویژه برای نقش‌های زیر مناسب است:

• توسعه‌دهندهٔ فرانت‌اند
• توسعه‌دهندهٔ React
• توسعه‌دهندهٔ Next.js
• مهندس UI
• توسعه‌دهندهٔ فرانت‌اند با تمرکز بر UX
• توسعه‌دهندهٔ وب با نگاه محصول‌محور

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

سوالات متداول

ارتباط

اگر به همکاری، استخدام یا گفت‌وگو دربارهٔ توسعهٔ محصولات دیجیتال علاقه‌مندید:

لایسنس

این پروژه یک پورتفولیو و وبلاگ شخصی است — یک قالب متن‌باز عمومی نیست. تمامی حقوق محفوظ است.

خلاصه

وبلاگ MiPiBoy یک وبلاگ و پورتفولیوی شخصی است که با Next.js، React، TypeScript، Tailwind CSS و Fumadocs MDX ساخته شده است. این پروژه برای ارائهٔ مهارت‌های مهندسی فرانت‌اند، تفکر محصول‌محور و ارتباطات فنی شفاف در قالبی صیقلی و حرفه‌ای طراحی شده است.

این وب‌سایت به‌عنوان یک پلتفرم برند شخصی مؤثر برای استخدام‌کنندگان، همکاران و خوانندگان فنی عمل می‌کند که می‌خواهند هم کیفیت کار و هم عمق تفکر پشت آن را درک کنند.