01
طراحی سایت شرکتی
حضوری حرفه‌ای در فضای دیجیتال؛ برای معرفی روشن خدمات و ساختن اعتماد در مشتریان شما.
طراحی و توسعه، با نگاه به کسب‌وکار شما
از یک وب‌سایت حرفه‌ای
تا یک سامانه اختصاصی؛
ایده شما را به واقعیت
تبدیل می‌کنم.
من مهدی الهی‌پور هستم؛ طراح و توسعه‌دهنده
وب‌سایت و سامانه‌های اختصاصی.
با استفاده از فناوری‌های مدرن، راهکارهای دیجیتالی متناسب با نیاز کسب‌وکار شما طراحی و پیاده‌سازی می‌کنم.
طراحی متناسب با شما از ایده تا پیاده‌سازی
مهدی الهی‌پورطراح و توسعه‌دهنده
از ایده تا اجراطراحی دقیق، توسعه اصولی
طراحی با هدف. توسعه با دقت.
FRONTENDBACKENDWEB APPLICATIONS
خدمات من / ۰۱
برای هر ایده، یک راهکار مناسب.
از اولین حضور آنلاین تا یک سامانه اختصاصی؛
در مسیر ساختن کسب‌وکارتان همراه شما هستم.
نمونه‌کارهای منتخب / ۰۲
هر پروژه، پاسخی به یک نیاز واقعی ایده‌هایی که شکل گرفته‌اند.
ostadki.ir
پلتفرم آموزشی
استادکی | پلتفرم جستجو و معرفی مدرس خصوصی
توسعهٔ پلتفرم فارسی جستجو و معرفی مدرس خصوصی با Next.js، NestJS، MySQL و Redis؛ از پروفایل و داشبورد مدرس تا درخواست ارتباط، مدیریت رسانه و سئوی فنی، با استقرار عملیاتی و انتشار قابل بازگشت.
جزئیات فنی پروژه
استادکی یک پلتفرم فارسی برای ارتباط دانش‌آموزان و زبان‌آموزان با مدرسان خصوصی در کلاس‌های آنلاین و حضوری است. مدرس می‌تواند پروفایل آموزشی خود را تکمیل کند، آگهی تدریس منتشر کند، برنامهٔ هفتگی مشخص کند و رزومه، جزوه و ویدیو ارائه دهد. کاربران نیز از طریق دسته‌بندی دروس و صفحات شهری، مدرس مناسب را پیدا می‌کنند و درخواست ارتباط می‌فرستند.
این پروژه به‌صورت عملیاتی در محیط Production استفاده می‌شود. توسعهٔ آن شامل فرانت‌اند، API، مدل‌سازی داده، احراز هویت، مدیریت رسانه، سئوی فنی و استقرار سرور است.
معماری و فناوری‌ها
پروژه در یک مخزن مشترک با دو برنامهٔ مستقل فرانت‌اند و بک‌اند نگهداری می‌شود. بک‌اند ساختار ماژولار دارد و از طریق REST API با فرانت‌اند ارتباط برقرار می‌کند.
| بخش | فناوری‌ها و کاربرد |
|---|---|
| فرانت‌اند | Next.js 15 با App Router، React 18، JavaScript و TypeScript |
| رابط کاربری | Tailwind CSS، CSS Modules، Material UI و Emotion |
| تعاملات و انیمیشن | Framer Motion، کامپوننت‌های تعاملی و کاروسال واکنش‌گرا |
| مدیریت داده در کلاینت | TanStack Query، Context و Hookهای اختصاصی |
| بک‌اند | NestJS 11، TypeScript و Express |
| پایگاه داده | MySQL و TypeORM |
| کش | Redis، Cache Manager و Keyv |
| احراز هویت | JWT، Passport، Google OAuth 2.0 و ورود با کد یک‌بارمصرف |
| اعتبارسنجی ورودی | DTO، class-validator و class-transformer |
| ذخیره‌سازی رسانه | فضای ذخیره‌سازی سازگار با S3 و AWS SDK |
| پردازش تصاویر | Sharp |
| به‌روزرسانی زنده | Server-Sent Events برای شمارندهٔ لایک ویدیو |
| سرویس‌های بیرونی | SMS.ir، زرین‌پال و خدمات ابری آروان |
| آزمون | Jest، ابزارهای تست NestJS و Node.js Test Runner |
| زیرساخت استقرار | Ubuntu، Nginx، PM2، HTTPS و CDN |
قابلیت‌های اصلی محصول
- جستجو و کشف مدرس بر اساس موضوع تدریس، دسته‌بندی‌های چندسطحی و شهر، همراه با صفحه‌بندی و نمایش آگهی‌های ویژه.
- پروفایل جامع مدرس شامل معرفی، اطلاعات تحصیلی، تجربهٔ تدریس، نرخ ساعتی، روش برگزاری کلاس، رزومه، برنامهٔ هفتگی و محتوای آموزشی.
- داشبورد مدرس برای مدیریت مشخصات، ایجاد و ویرایش آگهی، بارگذاری رسانه، تنظیم زمان‌های تدریس و مشاهدهٔ درخواست‌های ارتباط.
- درخواست ارتباط با مدرس پس از تأیید شمارهٔ دانش‌آموز با OTP و انتخاب درس و زمان.
- مدیریت ویدیو با صفحهٔ مستقل، پخش واکنش‌گرا، توضیحات، دیدگاه، لایک و شمارندهٔ بازدید.
- پیشنهاد مدرسان مرتبط بر اساس ارتباط موضوعی با پروفایل فعلی.
- امکان مدیریت نمایش شمارهٔ تماس مدرس در مسیرهای عمومی.
- رابط فارسی و RTL، نمایش مناسب در موبایل و دسکتاپ، حالت روشن و تاریک و پشتیبانی از تاریخ شمسی.
سئوی فنی و ساختار محتوا
صفحات عمومی با رندر سمت سرور Next.js ساخته شده‌اند تا محتوای اصلی برای موتورهای جستجو قابل دسترسی باشد. صفحات دسته‌بندی، پروفایل و ویدیو دارای metadata پویا، عنوان، توضیحات و canonical هستند.
- صفحات هدفمند برای موضوعات تدریس و شهرها و ایجاد لینک‌های داخلی مرتبط میان دسته‌ها، درس‌ها و پروفایل‌ها.
- بازتولید دوره‌ای صفحات و کش داده با revalidate.
- دادهٔ ساختاریافتهٔ JSON-LD شامل BreadcrumbList، ItemList، Course و FAQPage در صفحات مرتبط.
- تولید sitemapهای موضوعی برای آگهی‌ها، ویدیوها و شهرها؛ مدیریت robots و محدود کردن ایندکس صفحات خصوصی.
- حفظ سازگاری مسیرهای قدیمی با ساختار جدید دسته‌بندی و slugها.
چالش‌های فنی و راهکارها
| چالش | راهکار پیاده‌سازی‌شده |
|---|---|
| نمایش آگهی نامرتبط به‌دلیل وجود نام درس در توضیحات | اولویت دادن به taxonomy و تطبیق موضوعی کنترل‌شده، همراه با نگاشت دسته‌های قدیمی |
| درخواست‌های متعدد برای بررسی زیرشاخه‌های دسته‌بندی | بررسی گروهی موجود بودن آگهی‌ها برای چند دسته |
| انتقال اطلاعات اضافی در فهرست کارت‌ها | پاسخ سبک مخصوص کارت آگهی با انتخاب فیلدهای موردنیاز |
| تکرار پردازش درخواست‌های عمومی | کش نتایج آگهی و taxonomy در Redis |
| تداخل پیام‌های زنده با وضعیت شخصی لایک | تفکیک شمارندهٔ عمومی از وضعیت لایک کاربر و کنترل ترتیب پاسخ‌ها |
| ناپایداری لایک با تغییر IP | هویت تأییدشدهٔ حساب و شناسهٔ امضاشدهٔ مرورگر برای مهمان |
| احتمال حذف مسیرها پس از بیلد | بررسی وجود مسیرهای قبلی و فایل‌های کامپایل‌شده پیش از فعال‌سازی نسخه |
امنیت، آزمون و استقرار
کنترل دسترسی API، بررسی توکن و نشست، محدودیت‌های OTP، اعتبارسنجی ورودی و محافظت از مسیرهای خصوصی پیاده‌سازی شده است. برای پراکسی تصویر نیز محدودیت میزبان، نوع پاسخ، زمان دریافت و اندازهٔ فایل در نظر گرفته شده است.
فرایند انتشار شامل تهیهٔ پشتیبان، انتقال فایل‌های مشخص با SCP، اجرای تست و بیلد در پوشهٔ release مستقل، بررسی سلامت و سپس فعال‌سازی سرویس‌ها با PM2 است. خروجی قابل اجرای نسخهٔ قبلی برای بازگشت نگهداری می‌شود.
FAMOOZ
سامانهٔ اختصاصی چندمدرسه‌ای
فاموز | سامانهٔ مدیریت یکپارچهٔ مدارس
طراحی و توسعهٔ سامانهٔ چندمدرسه‌ای مدیریت آموزش با Laravel، React و MariaDB؛ شامل پنل‌های مدیریت، معلم و والد، برنامهٔ هفتگی، حضور و غیاب، ارزیابی، امور مالی و پیامک غیبت، با استقرار روی لیارا.
جزئیات فنی پروژه
فاموز یک وب‌اپلیکیشن فارسی برای مدیریت امور آموزشی و اجرایی چند مدرسه است. سامانه شامل پنل مدیر کل، مدیریت مدرسه، معلمان و والدین است و امکانات ثبت‌نام، برنامه‌ریزی آموزشی، حضور و غیاب، ارزیابی، امور مالی و اطلاع‌رسانی را در یک بستر مشترک ارائه می‌کند.
فناوری‌های استفاده‌شده
| بخش | فناوری |
|---|---|
| بک‌اند | PHP 8.2 و Laravel 12 |
| فرانت‌اند | React 19، React DOM و Inertia.js |
| ساخت و بسته‌بندی فرانت | Vite و React Compiler |
| پایگاه دادهٔ عملیاتی | MariaDB 12 |
| دسترسی به داده | Eloquent ORM و Query Builder |
| رابط کاربری | CSS سفارشی، Tailwind CSS، آیکون‌های Lucide و فونت Vazirmatn |
| تاریخ و بومی‌سازی | تقویم شمسی با Morilog Jalali، ارقام فارسی و منطقهٔ زمانی تهران |
| آزمون | PHPUnit، Mockery، آزمون‌های JavaScript و تست مرورگر با Playwright |
| استقرار | پلتفرم Laravel لیارا و فضای ذخیره‌سازی پایدار |
| سرویس‌های بیرونی | SMS.ir، ایمیل SMTP و API هواشناسی MET Norway |
معماری و طراحی فنی
- معماری چندمدرسه‌ای با دیتابیس مشترک: داده‌های هر مدرسه با school_id تفکیک می‌شوند. مدرسهٔ جاری از عضویت معتبر کاربر تعیین می‌شود و محدودسازی داده‌ها در سمت سرور اعمال می‌شود.
- بک‌اند ماژولار: قواعد آموزشی، مالی، ثبت‌نام و حضور و غیاب در سرویس‌های دامنه سازمان‌دهی شده‌اند.
- رابط React با ناوبری بدون بارگذاری کامل صفحه: Inertia ارتباط Laravel و رابط کاربری را برقرار می‌کند. دانلودها، خروجی‌ها و صفحات چاپ رفتار متناسب خود را دارند.
- مهاجرت تدریجی از Blade به React: ورود، داشبورد و پوستهٔ پنل‌ها کامپوننت اختصاصی دارند. سایر صفحات از ساختار نمایشی مجازِ تولیدشده در سرور به عناصر React تبدیل می‌شوند؛ Blade برای تولید ساختار و مسیر جایگزین بدون JavaScript نیز باقی مانده است.
قابلیت‌های اصلی
- مدیریت مدارس، مدیران مدرسه، طرح‌ها و اشتراک‌ها از پنل مدیر کل.
- تعریف سال تحصیلی، پایه، کلاس و ظرفیت؛ ثبت‌نام و جابه‌جایی دانش‌آموزان با حفظ سوابق.
- مدیریت پروندهٔ معلم، تخصص‌های تدریس و اتصال پرونده به حساب ورود.
- تعریف برنامهٔ هفتگی، بازهٔ تکرار و تولید جلسات آموزشی.
- ثبت حضور، غیبت، تأخیر و غیبت موجه، همراه با تاریخچهٔ اصلاحات.
- تعریف دوره‌های ارزیابی، ثبت نمرات و نمایش نتایج آموزشی.
- ثبت و پیگیری مشاهدات رشد و موارد انضباطی دانش‌آموز.
- پنل والدین با اتصال تأییدشدهٔ حساب سرپرست به پروندهٔ فرزند.
- ثبت بدهی، دریافت، هزینه و ماندهٔ مالی؛ گزارش و رسید قابل چاپ.
- اطلاعیه‌ها، وضعیت خواندن، تقویم مدرسه و گزارش‌های مدیریتی.
- ارسال تکی و گروهی پیامک غیبت توسط مدیر یا معاون، همراه با پیش‌نمایش، شناسهٔ پیام و ثبت نتیجهٔ پذیرش سرویس.
- صفحهٔ ورود واکنش‌گرا با تصویر خودکار چهار فصل و نمایش آب‌وهوای نیشابور.
کنترل دسترسی و صحت داده‌ها
- مجوزهای مبتنی بر نقش با Laravel Gates و Middleware؛ محدودسازی معلم به برنامه و فعالیت‌های مرتبط با خودش.
- کنترل دسترسی والد صرفاً به فرزندان متصل‌شده و تأییدشده.
- محافظت CSRF، محدودسازی تلاش ورود، هش رمز عبور و فرایند تعیین و بازیابی رمز.
- استفاده از تراکنش و قفل دیتابیس در عملیات حساس، از جمله کنترل ظرفیت کلاس و ثبت عملیات مالی.
- کنترل نسخهٔ رکورد برای جلوگیری از بازنویسی تغییرات از فرم‌های قدیمی.
- استفاده از کلید درخواست در عملیات مالی برای جلوگیری از ثبت تکراری.
- ثبت عامل انجام عملیات و تاریخچهٔ تغییرات برای پیگیری مدیریتی.
- جلوگیری از ارسال تکراری ناخواستهٔ پیامک غیبت برای یک دانش‌آموز در یک روز.
آزمون و آماده‌سازی انتشار
پروژه دارای آزمون‌های خودکار برای دسترسی نقش‌ها، جداسازی مدارس، ثبت‌نام، حضور و غیاب، ارزیابی، مالی، پنل والد و اتصال پیامک است. جریان‌های کاربری، ناوبری React، حالت موبایل و خطاهای شبکه نیز در مرورگر بررسی شده‌اند.
فرایند انتشار شامل ساخت فایل‌های production، حذف وابستگی‌های توسعه از بسته، جلوگیری از ورود فایل‌های محرمانه و دیتابیس محلی به ZIP، کنترل SHA-256 و آزمون اجرای برنامه از داخل بستهٔ نهایی است. ابزار بررسی آمادگی سرور و پشتیبان‌گیری دیتابیس نیز پیاده‌سازی شده‌اند.
درباره من / ۰۳پشت هر خط کد،
پشت هر خط کد،
نگاهی به نیاز شما.
من مهدی الهی‌پور هستم؛ طراح وب و توسعه‌دهنده فول‌استک. کار من پیوند دادن طراحی کاربردی با توسعه اصولی است تا ایده شما به یک تجربه دیجیتال روشن و کارآمد تبدیل شود.
در توسعه فرانت‌اند و بک‌اند، وب‌اپلیکیشن‌های اختصاصی و پلتفرم‌های آموزشی فعالیت می‌کنم. نقطه شروع هر پروژه برای من، شناخت نیازها و هدف کسب‌وکار شماست.
توسعه فرانت‌اند توسعه بک‌اند وب‌اپلیکیشن اختصاصی پلتفرم‌های آموزشی
بیایید درباره ایده شما صحبت کنیم مهدی الهی‌پورطراح و توسعه‌دهنده
شروع یک همکاری خوب / ۰۴
برای شروع پروژه بعدی آماده‌اید؟
اگر برای کسب‌وکار خود به یک وب‌سایت حرفه‌ای یا سامانه اختصاصی نیاز دارید،
خوشحال می‌شوم درباره ایده شما گفت‌وگو کنیم.