آموزش وب سایت نمونه کارها شخصی پاسخگو بسازید

Build Responsive Personal Portfolio Website

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره:

به کلاس کاملاً جدید خوش آمدید که در آن می‌توانید با نحوه ایجاد یک وب‌سایت نمونه کار شخصی از ابتدا تنها با سه فناوری اصلی HTML، CSS و JS آشنا شوید.

اگر می خواهید نمونه کار خود را ایجاد کنید که به شما کمک می کند تا خود را به بهترین شکل معرفی کنید و استخدام شوید، این دوره آموزشی مناسب برای شماست.

اگر از هر یک از کارفرمایان یا مدیران پروژه بپرسید که چگونه بهترین توسعه دهندگان را انتخاب کنند، همه پاسخ خواهند داد که مهمترین چیز در مورد توسعه دهنده این است که خود را با یک نمونه کار خوب معرفی کند.

اگر با HTML، CSS و JS آشنایی دارید، می‌توانید یک وب‌سایت نمونه کار شخصی واقعاً خوب ایجاد کنید که به شما امکان می‌دهد خود را بیان کنید و مهارت‌ها و دانش خود را به همه نشان دهید.

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

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

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

من فکر می‌کنم این دوره برای همه، یعنی طراحان مبتدی یا با تجربه، جالب و مفید خواهد بود.

تکلیف:

پروژه کلاس شما ایجاد یک الگوی وب سایت نمونه کارها شخصی طبق راهنمای زیر است.

مواد:

از عکس‌ها و فایل‌های آغازین پیوست شده به بخش منابع استفاده کنید.

راهنما:

1. با دایره های متحرک ماوس و دکمه اصلی با جلوه موج دار، یک سرصفحه از وب سایت بسازید

2. ساخت و طراحی بخش "درباره من":

3. ساخت و طراحی بخش پروژه ها با ویژگی "نمایش بیشتر":

4. ایجاد بخش خدمات:

5. ساخت و طراحی بخش تماس با نمایش اسلاید از نمادهای رسانه های اجتماعی:

6. ایجاد ناوبری برای وب سایت:

7. نوار پیشرفت را بسازید و طراحی کنید:

8. صفحه فرود را به تمام اندازه های مختلف صفحه پاسخگو کنید:

9. فرم ها را اعتبارسنجی کنید و وب سایت را میزبانی کنید.

اشتراک گذاری کار شما:

پس از اتمام پروژه، آن را در بخش پروژه‌ها به اشتراک بگذارید.

موفق باشید!!!


سرفصل ها و درس ها

درس ها Lessons

  • نوار پیشرفت طراحی - قسمت 3 Design Progress Bar - Part 3

  • بخش خدمات ایجاد و طراحی Create and Design Services Section

  • افکت ریپل را به دکمه اصلی اضافه کنید Add Ripple Effect to Main Button

  • اضافه کردن ویژگی "نمایش بیشتر" به پروژه ها - قسمت 1 Add "Show More" Feature to Projects - Part 1

  • نوار پیشرفت طراحی - قسمت 2 Design Progress Bar - Part 2

  • ایجاد و طراحی بخش درباره من Create and Design About Me Section

  • اعتبار سنجی فرم Form Validation

  • پس زمینه را آماده کنید و سبک های مشترک ایجاد کنید Prepare Background and Create Common Styles

  • ایجاد و سفارشی کردن هدر وب سایت Create and Customize Website Header

  • نوار پیشرفت طراحی - قسمت 1 Design Progress Bar - Part 1

  • پروژه را پاسخگو کنید - قسمت 1 Make Project Responsive - Part 1

  • ایجاد و سفارشی کردن ناوبری Create and Customize Navigation

  • بخش ایجاد و سفارشی کردن پروژه ها - قسمت 2 Create and Customize Projects Section - Part 2

  • میزبانی وب سایت در Netlify Website Hosting on Netlify

  • ایجاد و سفارشی کردن دکمه اصلی Create and Customize Main Button

  • معرفی Introduction

  • اضافه کردن ویژگی "نمایش بیشتر" به پروژه ها - قسمت 2 Add "Show More" Feature to Projects - Part 2

  • دایره ها را متحرک کنید Animate Circles

  • عناصر چسبنده Sticky Elements

  • دایره متحرک ماوس ایجاد کنید Create Animated Mouse Circle

  • پروژه را پاسخگو کنید - قسمت 2 Make Project Responsive - Part 2

  • بخش ایجاد و سفارشی کردن پروژه ها - قسمت 1 Create and Customize Projects Section - Part 1

  • Refactoring کد Code Refactoring

  • ایجاد نمایش اسلاید از پیوندهای رسانه های اجتماعی Create Slideshow of Social Media Links

  • جلوه تبدیل دایره ماوس Mouse Circle Transform Effect

  • پیش نمایش پروژه Project Preview

  • برپایی Setup

  • ایجاد و سفارشی کردن فرم تماس Create and Customize Contact Form

نمایش نظرات

آموزش وب سایت نمونه کارها شخصی پاسخگو بسازید
جزییات دوره
5h 28m
28
Skillshare (اسکیل شیر) Skillshare (اسکیل شیر)
(آخرین آپدیت)
17
- از 5
دارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Giorgi Lomidze Giorgi Lomidze

طراح UI/UX

سلام،

من جورج هستم، طراح UI/UX، بنیانگذار 'Code And Create' و نویسنده چندین پرفروش کلاس های آنلاین .

من هیجان زده هستم که فرصتی برای کمک به مردم برای یادگیری یکی از جالب ترین و داغ ترین رشته های جهان دارم.

من تصمیم گرفتم دانش و تجربه خود را با شما به اشتراک بگذارم و این دلیل اصلی حضور در Skillshare است.

منتظر دیدار شما در کلاس‌هایم هستم و به شما کمک می‌کنم تا یک طراح UI/UX حرفه‌ای شوید