ساخت کلون واکنش گرا فیسبوک با استفاده از HTML5 و CSS3 خالص
✅ سرفصل و جزئیات آموزش
آنچه یاد خواهید گرفت:
- مدل Flexbox را یاد خواهید گرفت، به ویژگیهای Flexbox تسلط پیدا خواهید کرد و مهارتهای خود را در طراحی وب بهبود خواهید بخشید.
- با کمک انتخابگرهای CSS، یاد خواهی گرفت چگونه عناصر خاص را در صفحه وب خود انتخاب و هدفگذاری کنید.
- کات و ترفندهای CSS را یاد خواهید گرفت.
- شما قادر خواهید بود به مهارتهای CSS خود بهطور کامل تسلط پیدا کنید.
توضیحات دوره
تصور کنید دانشی دارید که میتوانید سایتی مانند فیسبوک را از ابتدا طراحی و ایجاد کنید. موضوع فقط تکرار ظاهر آن نیست. بیشتر دربارهی این است که توانایی و مهارت لازم برای خلق چنین سایتی را داشته باشید. مدرس اینجا است تا به شما HTML ،CSS و طراحی وب را با ساخت وبسایت فیسبوک به صورت مرحله به مرحله آموزش دهد.
به دورهی "تسلط به HTML5 و CSS3 با ایجاد فیسبوک با CSS خالص" خوش آمدید، دورهای کامل که شما را قادر میسازد با استفاده فقط از HTML5 و CSS3 وبسایتی شبیه به فیسبوک بسازید. چه مبتدی باشید و چه قبلاً تجربهای نداشته باشید، این دوره به گونهای طراحی شده که شما را از صفر به سطح تسلط به طراحی وب برساند.
در طول این دوره، به بررسی عمیق HTML5 و CSS3 خواهید پرداخت. نکات و ترفندهای ضروری برای ساخت وبسایتی جذاب را خواهید آموخت. با دنبال کردن آموزشهای ویدیویی مرحله به مرحله، مهارت و تجربه دستاول کسب میکنید تا وبسایت شبکهی اجتماعی مشابه فیسبوک بسازید.
اما مزایا به همینجا ختم نمیشوند. این دوره فراتر از آموزش تکرار طراحی فیسبوک است. به شما کمک میکند مهارتهای کلی توسعهی وب خود را تقویت کنید و دانش ارزشمندی کسب کنید که در هر پروژهی وب قابل استفاده است. اصول طراحی واکنشگرا را خواهید آموخت تا مطمئن باشید سایت شما در دستگاههای مختلف مانند کامپیوتر، تبلت و گوشیهای هوشمند به خوبی اجرا و عملکرد دارد.
در پایان این دوره، اعتماد به نفس و تخصص کافی برای ساخت یک وبسایت شبکه اجتماعی عالی یا هر وبسایتی دیگر با استفاده از HTML5 و CSS3 خواهید داشت. بنابراین، چه هدفتان حرفهای شدن در طراحی وب باشد یا صرفاً میخواهید مهارتهای خود را افزایش دهید، این دوره انتخابی عالی برای آزاد کردن پتانسیل کامل شما در توسعهی وب است.
این دوره برای چه کسانی مناسب است؟
- مبتدیانی که میخواهند توسعهی وب را یاد بگیرند.
ساخت کلون واکنش گرا فیسبوک با استفاده از HTML5 و CSS3 خالص
-
مقدمه 01:47
-
درک طرح بندی فیسبوک 03:02
-
ایجاد بستهبندی برای دو بخش اصلی وبسایت 01:41
-
درک طرح بندی هدر 02:01
-
ایجاد طرح بندی هدر در HTML 02:00
-
ایجاد بخش لوگوی فیسبوک در HTML 04:04
-
ایجاد ناوبری مرکزی در HTML 03:44
-
طرح بندی ناوبری سمت راست در HTML 10:35
-
بیایید درباره انتخابگرهای ساده و اولیه CSS یاد بگیریم 09:54
-
شروع کار 09:21
-
ویژگیهای Display Flex و Flex-Direction 08:43
-
ویژگی Flex-Shrink 05:40
-
ویژگیهای Flex Basis ،Flex-Wrap و Flex 07:56
-
ایجاد چند کلاس Flex 07:10
-
افزودن کلاسهای بخش چپ دیو 04:28
-
افزودن کلاسهای بخش مرکزی دیو 03:50
-
افزودن کلاسهای بخش راست دیو 04:47
-
طراحی بخش سمت چپ دیو 10:02
-
طراحی بخش سمت راست دیو 04:32
-
طراحی بخش مرکزی دیو 04:28
-
ویژگیهای Justify Content و Align-Items 10:33
-
ایجاد 22 کلاس برای Justify و Align-Items 03:32
-
طراحی آیکنهای منوی راست 03:56
-
طراحی بخش بستهبندی نام 09:02
-
افکت هاور و انتقال به منوی سمت راست 09:07
-
حذف رنگ پسزمینه از منوی انتخاب شده 09:57
-
ایجاد Span برای نوتیفیکیشن ها 07:03
-
خلاصه بخش 1 08:55
-
درک ساختار HTML بستهبندی محتوا 02:50
-
ایجاد طرح بندی برای بستهبندی محتوا 03:30
-
ایجاد بستهبندی پست 03:43
-
ایجاد طرح بندی HTML برای cpost-input-wrap 06:29
-
افزودن کلاسها و طراحی تصویر 08:15
-
ایجاد بستهبندی پست 04:54
-
ویژگی Box Shadow 13:49
-
افزودن پسزمینه و شعاع گوشهها 05:21
-
طراحی پایین ایجاد پست 03:58
-
طراحی منوی پایین پست 11:02
-
افزودن رنگ و قرار دادن در موقعیت مرکزی 04:46
-
انتخابگر شبه کلاس Nth-Child 08:41
-
ایجاد طرح بندی HTML جعبه پاپآپ ایجاد شده 12:33
-
طراحی جعبه پاپآپ ایجاد شده 06:49
-
طراحی هدر ایجاد پست 06:37
-
طراحی TextArea 05:58
-
ایجاد طرح بندی فوتر "ایجاد پست" در HTML 18:38
-
افزودن کلاسهای فوتر ایجاد پست 05:50
-
تراز کردن المانهای فوتر ایجاد پست 04:05
-
طراحی بخش منوی فوتر ایجاد پست 10:09
-
طراحی منوی دوم فوتر ایجاد پست 22:56
-
ایجاد ساختار HTML بخش میانی 07:52
-
طراحی بخش میانی 11:57
-
ایجاد دکمه ارسال پست 19:10
-
انتخابگرهای Combinator 07:59
-
بیایید درباره Label و Input نوع Checkbox چیز جدید یاد بگیریم 16:34
-
افزودن Label و Checkbox و اعمال تکنیک مربوطه 09:12
-
افزودن Label و Checkbox برای مخفی و نمایان کردن جعبه پاپآپ ایجاد شده 05:48
-
ایجاد ساختار HTML پست 27:27
-
حالا بیایید پست را طراحی کنیم 05:55
-
اصلاح Span و افزودن آیکنها 06:32
-
ایجاد بخش لایک، نظر و اشتراکگذاری 04:35
-
طراحی بخش ناوبری بالای پست 15:18
-
کلاس شبه Root و متغیرهای CSS 06:44
-
افزودن حاشیه و رنگ و حذف متن تزئینی 07:36
-
ایجاد افکت هاور 03:20
-
طراحی بخش نظرات 09:53
-
چیدمان آیتمها در موقعیت دلخواه 02:21
-
اکنون قصد داریم کلاسها را در CSS اضافه کنیم 24:07
-
طراحی مجدد بخش ساختهشده قبلی 12:36
-
افزودن Padding و ویژگی Width 08:44
-
ایجاد بخش برای ورودی کاربر 08:49
-
درک ورودی کاربر و ویژگی Contenteditable 10:18
-
طراحی بخش ورودی 11:31
-
هماکنون روی TextArea کار میکنیم؛ حذف حاشیه خارجی، افزودن Placeholder و غیره 11:17
-
کلاس شبه Empty و عنصر شبه 08:42
-
اصلاح TextArea و تغییر رنگ Placeholder و آیکنها 03:57
-
اکنون قصد داریم آیکنها را طراحی کنیم 10:17
-
ایجاد ساختار HTML برای بخش سمت چپ 13:54
-
افزودن کلاسهای بخش سمت چپ 04:50
-
ایجاد متغیر رنگ در CSS 08:01
-
طراحی آیتمهای لیست بخش بالای سمت چپ 05:36
-
طراحی آیکنها 13:21
-
ایجاد بخش پایین سمت چپ 07:30
-
طراحی بخش پایین سمت چپ 06:04
-
ایجاد ساختار HTML بخش سمت راست 05:44
-
طراحی بخش سمت راست 11:55
-
واحدهای CSS vh ،vw و گرادینت خطی 10:17
-
درک مدیا کوئریها 11:52
مشخصات آموزش
ساخت کلون واکنش گرا فیسبوک با استفاده از HTML5 و CSS3 خالص
- تاریخ به روز رسانی: 1404/12/10
- سطح دوره:همه سطوح
- تعداد درس:87
- مدت زمان :13:21:51
- حجم :4.56GB
- زبان:دوبله زبان فارسی
- دوره آموزشی:AI Academy