👨‍💻 تمرین قسمت ۲۳: با آموخته خود در background و جلسات پیشین صفحه پیوست شده رو را با پس‌زمینه دلخواه طراحی کنید.

⛔️ پ.ن: موج بالای تصویر هم یک background جدا گانه است!

#تمرین #تمرین_HTML_CSS
✈️@xstack_tut ❌

💠 فصل اول آموزش Full stack web developer
💠 عنوان فصل HTML & CSS - قسمت 24
💠 مباحث تدریس شده:

✅ ادامه مبحث grid
✅ ویژگی‌های grid-template-columns, grid-template-rows, grid-gap, grid-column, grid-row, span در grid

✅ و چگونه دیباگ کردن grid

#فیلم_آموزش #FullStackWebDeveloper

⭕️ با انتشار این مطلب ما را حمایت کنید.

👇 تمرین این جلسه کانال «برنامه‌نویسی با طعم تمشک»

✈️@xstack_tut ❌ | @devefun

👨‍💻 تمرین قسمت ۲۴: با آموخته خود در grid و جلسات پیشین صفحه پیوست شده رو طراحی کنید.


#تمرین #تمرین_HTML_CSS
✈️@xstack_tut ❌

💠 فصل اول آموزش Full stack web developer
💠 عنوان فصل HTML & CSS - قسمت 25
💠 مباحث تدریس شده:
✅ ادامه مبحث flex
✅ ویژگی‌های flex-direction - flex-wrap - flex-flow - flex - align-items - flex-grow - flex-shrink - flex-basis در flex


#فیلم_آموزش #FullStackWebDeveloper
⭐ با انتشار این مطلب ما را حمایت کنید.

🟩 تمرین این جلسه کانال «برنامه‌نویسی با طعم تمشک»
✈️@xstack_tut ❌| @devefun ✈️

👨‍💻 تمرین قسمت ۲۵: با آموخته خود در flex و جلسات پیشین همراه با راهنمایی صفحه پیوست شده رو طراحی کنید.


#تمرین #تمرین_HTML_CSS
✈️@xstack_tut ❌

💠 فصل اول آموزش Full stack web developer
💠 عنوان فصل HTML & CSS - قسمت 26
💠 مباحث تدریس شده:
✅ ادامه مبحث grid
✅ ویژگی‌های grid-auto-columns , grid-auto-flow
✅ توضیح ()minmax
✅ نکات ساختن یکی مگا منو


#فیلم_آموزش #FullStackWebDeveloper
⭐ با انتشار این مطلب ما را حمایت کنید.

🟩 تمرین این جلسه کانال «برنامه‌نویسی با طعم تمشک»
✈️@xstack_tut ❌| @devefun ✈️

👨‍💻 تمرین قسمت ۲۶: با آموخته خود در این جلسه و جلسات پیش یک mega menu به شکل زیر درست کنید!


#تمرین #تمرین_HTML_CSS
✈️@xstack_tut ❌

💠 فصل اول آموزش Full stack web developer
💠 عنوان فصل HTML & CSS - قسمت 27
💠 مباحث تدریس شده:
✅ سیار کردن مگا منو
✅ ویژگی‌های , *-spacing, text-*, word-*
✅ ویژگی mix-blend-mode و line-height , white-spacee
✅ توضیح ()minmax
✅ آموزش :first-letter

#فیلم_آموزش #FullStackWebDeveloper
⭐ با انتشار این مطلب ما را حمایت کنید.

🟩 تمرین این جلسه کانال «برنامه‌نویسی با طعم تمشک»
✈️@xstack_tut ❌| @devefun ✈️

👨‍💻 تمرین قسمت ۲۷: با آموخته خود در flex و postion و mix-blend-mode تمرین زیر رو پیاده سازی کنید،

🔻پ.ن: تصویر زیر بکگراند ندارد همه المان ها HTML است!


#تمرین #تمرین_HTML_CSS
✈️@xstack_tut 🔺

💠 فصل اول آموزش Full stack web developer
💠 عنوان فصل HTML & CSS - قسمت 28
💠 مباحث تدریس شده:

✅ ویژگی‌های user-select
✅ توضیح ()var و تعریف و تغییر متغییر در css
✅ کار کردن با Inkscape

#فیلم_آموزش #FullStackWebDeveloper
🔻 با انتشار این مطلب ما را حمایت کنید.

🟩 تمرین این جلسه کانال «برنامه‌نویسی با طعم تمشک»

✈️@xstack_tut ❌| @devefun ✈️

👨‍💻 تمرین قسمت ۲۸: با آموخته خود در این قسمت و قسمت های پیشین طرح بالا در سه سایز PC, tablet, mobile را کدنویسی کنید و از مگا منوی تمرین ۲۶ به صورت واکنشگرا responsive در آن استفاده کنید!

🚫پ.ن: رنگ‌ها به صورت var تعریف شود، حتی رنگ‌های مگا منو تمرین ۲۶ نیز باید تغییر کند و با متغییر تعریف شوند! و عکس ها به دلخواه خودتون خودتون باشه!

#تمرین #تمرین_HTML_CSS
✈️@xstack_tut 🔺

💠 فصل اول آموزش Full stack web developer
💠 عنوان فصل HTML & CSS - قسمت 29
💠مباحث تدریس شده:
✅ ادامه مبحث grid
✅ ویژگی‌های grid-area grid-area-template
✅ توضیح outline
✅ توضیح focus:
✅ کار با live template های php strom

#فیلم_آموزش #FullStackWebDeveloper
🔻 با انتشار این مطلب ما را حمایت کنید.

🟩 تمرین این جلسه کانال «برنامه‌نویسی با طعم تمشک»
✈️@xstack_tut ❌| @devefun ✈️

👨‍💻 تمرین قسمت ۲۹: با آموخته خود در این قسمت و قسمت های پیشین طرح بالا رو پیاده سازی کنید!


#تمرین #تمرین_HTML_CSS
✈️@xstack_tut 🔺

💠فصل اول آموزش Full stack web developer
💠 عنوان فصل HTML & CSS - قسمت 30
💠 مباحث تدریس شده:
✅ تاثیر + و ~ در انتخاب گر
✅ ویژگی visiblity و تفاوت آن با display
✅ ساخت یک switch toggle در html css 🎚️
✅ خصوصیت noscript و وضعیت :check

#فیلم_آموزش #FullStackWebDeveloper
🔻 با انتشار این مطلب ما را حمایت کنید.

🟩 تمرین این جلسه کانال «برنامه‌نویسی با طعم تمشک»
✈️@xstack_tut ❌| @devefun ✈️

👨‍💻 تمرین قسمت ۳۰: با آموخته خود در این قسمت و قسمت های پیشین یک جدول با قابلیت dark mode درست کنید!

🚫پ.ن: ممکن است یه خرده غیر اصولی به نظر برسه ولی استفاده JavaScript مجاز نیست!

#تمرین #تمرین_HTML_CSS
✈️@xstack_tut 🔺

✅ مقایسه اجمالی و مختصر، شیوه کد نویسی در سه سکوی javanoscript, reactJS, vueJS یا vanillaJS برای کسانی که در انتخاب مردد هستند

💠 پیرو پادکست قبلی توضیحاتی در مورد react و vue دادیم، دو مثال رو در هر سه انجام دادیم تا یک نگرش کلی از این دو داشته باشید!

🔺نمونه مشابه هرگز منتشر نشده و برای اولین بار توسط xstack این فیلم منتشر شده است!

🔻پ.ن: ممکنه دوستانی که vue یا react کار می‌کنند، با دیدنش بگن ما در پروژه تجاری این شکلی استفاده نمی‌کنیم، فراموش نکنیم که این یک نمونه آموزشی است نه تجاری!

✈️@xstack_tut ❌| @devefun ✈️

💠 معرفی فونت وب remixIcon ویژه طراحان

❌ گاهی از گشتن در font-awesome پشیمون میشم و گیج میشیم، بعضیاش چرا پولی هستش و با کلاس‌های پیش‌وند متخلف تعریف میشه، از اون گذشته حس می‌کنیم، خیلی تکراری شده!!!

✅ پس با هم دردیم، فونت remix Icon هم مدرن‌تره، هم کاملا اوپن سورس و مشکلات فوق رو نداره برای نصبش فقط کافیه از دستور زیر استفاده کنید:

npm i remixicon

و برای دیدن نمونه آیکون‌ها به سایتش مراجعه کنید:

https://remixicon.com/

✈️@xstack_tut ❌| @devefun ✈️

💠 فصل اول آموزش Full stack web developer
💠 عنوان فصل HTML & CSS - قسمت 31

💠 مباحث تدریس شده:
✅ ساخت یک پارالاکس
✅ یادآوری :before :after
✅ کار با Inkscape مجدد


#فیلم_آموزش #FullStackWebDeveloper
🔻 با انتشار این مطلب ما را حمایت کنید.

🟩 تمرین این جلسه کانال «برنامه‌نویسی با طعم تمشک»

✈️@xstack_tut ❌| @devefun ✈️

👨‍💻 تمرین قسمت ۳۱: با آموخته خود در این قسمت و یک section پارالاکس به تمرین ۲۸ اضافه کنید!


#تمرین #تمرین_HTML_CSS
✈️@xstack_tut 🔺

💠 فصل اول آموزش Full stack web developer
💠 عنوان فصل HTML & CSS - قسمت ۳۲
💠 مباحث تدریس شده:
✅ کار کردن با gimp در طراحی
✅ پیاده سازی یک footer خاص
✅ ساخت قسمت محصولات با دانش قبلی


#فیلم_آموزش #FullStackWebDeveloper
🔻 با انتشار این مطلب ما را حمایت کنید.

🟩 تمرین این جلسه کانال «برنامه‌نویسی با طعم تمشک»

✈️@xstack_tut ❌| @devefun ✈️

👇 تمرین این جلسه کانال «برنامه‌نویسی با طعم تمشک»

👨‍💻 تمرین قسمت 32: یک قالب از سایت‌های themeforest یا templatemonster انتخاب کنید، با آموخته های خود در فصل اول، سعی کنید، حدالممکن آن‌را پیاده سازی کنید.

پ.ن: عناصری که به کلیک، اسکرول و ... واکنش نشون میدن، js هستن که در فصل ۳ به آن می‌پردازیم!


#تمرین #تمرین_HTML_CSS
✈️@xstack_tut 🔺