درود، وقتتون بخیر.

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

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

❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊

اصول نوشتن پروژه در رزومه:
عنوان پروژه:

● یک عنوان واضح و مختصر انتخاب کنید.
● مثلاً: «طراحی و توسعه وب‌سایت فروشگاهی» یا «پیاده‌سازی داشبورد مدیریتی با React».
توضیحات کوتاه و هدف پروژه:

● یک یا دو جمله درباره‌ی پروژه بنویسید.
● مثلاً: «یک وب‌سایت فروشگاهی با قابلیت مشاهده محصولات، جستجو و خرید آنلاین برای بهبود تجربه کاربری فروشگاه‌های کوچک».
تکنولوژی‌های استفاده‌ شده:

● ابزارها، زبان‌ها و فریم‌ورک‌هایی که استفاده کردید رو بنویسید.
● مثلاً: HTML, CSS, JavaScript, React, Node.js.
دستاوردها و نتایج:

● به جای این که فقط بگید چه کاری انجام دادید، تأکید کنید که چرا این پروژه مهمه یا چه مشکلی رو حل کرده.
● مثلاً: «افزایش سرعت بارگذاری صفحات تا ۳۰٪ با بهینه‌سازی کد»، یا «ایجاد طراحی ریسپانسیو برای دسترسی بهتر کاربران موبایل».
نقش شما در پروژه:

● اگر پروژه تیمی بوده، نقش خودتون رو مشخص کنید.
● مثلاً: «مسئول طراحی رابط کاربری و پیاده‌سازی منطق بخش جستجو».
لینک به پروژه:

● اگر پروژه آنلاین هست یا کدش روی GitHub قرار داره، لینک بدید.
● مثلاً: مشاهده پروژه یا مشاهده کد در GitHub.
مقیاس پروژه (اختیاری):

● اگر پروژه واقعی بوده، می‌تونید اطلاعاتی مثل تعداد کاربران یا عملکرد مالی رو اضافه کنید.
● مثلاً: «پشتیبانی از ۵۰۰ کاربر فعال در ماه» یا «افزایش فروش روزانه تا ۲۰٪».

❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊

چند نمونه پروژه فرضی:

1. صفحه فرود (Landing Page)

هدف: طراحی یک صفحه فرود جذاب برای معرفی یک محصول یا خدمات.

ویژگی‌ها:

● بخش‌های مختلف مثل معرفی محصول، ویژگی‌ها، نظرات مشتریان و فرم تماس.
● انیمیشن‌های ساده با CSS یا JavaScript.
● طراحی حرفه‌ای و بهینه برای موبایل.

2. گالری تصاویر

هدف: یک وب‌سایت برای نمایش و مدیریت تصاویر، یه چیزی مثل پینترست.

ویژگی‌ها:

● صفحه نمایش تصاویر با قابلیت جستجو و فیلتر.
● افکت‌های جذاب هنگام کلیک روی تصاویر (مانند لایت‌باکس).
● آپلود تصویر (با استفاده از Local Storage یا بک‌اند فرضی).

3. اپلیکیشن مدیریت وظایف (To-Do App)

ویژگی‌ها:
● اضافه، ویرایش و حذف وظایف.
● قابلیت دسته‌بندی وظایف (مثل کاری، شخصی).
● ذخیره‌سازی داده‌ها در Local Storage.
● طراحی مینیمال و کاربردی.

4. وب‌سایت شخصی/رزومه آنلاین

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

ویژگی‌ها:
● بخش درباره من، مهارت‌ها، تجربه کاری، و تماس.
● یک گالری برای پروژه‌ها با توضیحات.
● فرم تماس با قابلیت ارسال ایمیل.
● ریسپانسیو بودن برای موبایل و دسکتاپ

5. وبلاگ شخصی

هدف: ایجاد یک وب‌سایت برای نوشتن و اشتراک‌گذاری مقالات.

ویژگی‌ها:
● قابلیت افزودن و ویرایش مقالات.
● صفحه نمایش لیست مقالات با قابلیت فیلتر و جستجو.
● طراحی کارت برای هر مقاله.
● سیستم کامنت‌گذاری (حتی به‌صورت ساده بدون بک‌اند)

6. وب‌سایت فروشگاهی کوچیک

ویژگی‌ها:
● صفحه محصولات با دسته‌بندی.
● صفحه جزئیات محصول با اطلاعات کامل.
● قابلیت اضافه کردن به سبد خرید.
● ریسپانسیو بودن و طراحی حرفه‌ای.

7. داشبورد مدیریتی

ویژگی‌ها:
● نمایش داده‌ها با جدول و نمودار (می‌تونید از Chart.js یا ApexCharts استفاده کنید).
● قابلیت فیلتر و مرتب‌سازی داده‌ها.
● فرم اضافه کردن اطلاعات جدید.
● تم تیره/روشن.

8. سایت آموزشی کوچیک

هدف: طراحی سایتی برای نمایش دوره‌های آموزشی.

ویژگی‌ها:
● لیست دوره‌ها با توضیحات کوتاه.
● صفحه جزئیات دوره (ویدئو، اطلاعات استاد، محتوا).
● فرم ثبت‌نام یا علاقه‌مندی.
● طراحی مدرن و قابل گسترش.

9. بازی کوچیک

10. سیستم مدیریت محتوا (CMS) کوچیک
هدف: یک پروژه ساده که امکان مدیریت محتوا رو به کاربر بده.

ویژگی‌ها:
● اضافه، ویرایش و حذف محتوا.
● نمایش لیست محتوا در فرانت‌اند.
● رابط کاربری مینیمال و زیبا.

❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊❇ ❈ ❊

نکته:

● هر پروژه رو در یک ریپازیتوری جداگانه در GitHub قرار بدید.
● لینک نسخه آنلاین پروژه (با استفاده از Vercel یا Netlify) رو در رزومه بگذارید.
● مستندات کوتاه برای هر پروژه بنویسید (فایل README).
● سعی کنید هر پروژه حداقل یک ویژگی جالب و متمایز داشته باشه.