⁣⁣⁣⁣⁣⁣⁣⁣🔥 ⁣Loaders.css

مجموعه ای از #لودینگ های انیمیشنی طراحی شده با #CSS. کاربرد ساده و سریع با قابلیت سفارشی سازی و سازگاری با تمامی مرورگرها

⁣🌐⁣https://goo.gl/5JS13s

#UI

⁣✅@coderszone

⁠⁣🔥 پیش بینی می شود #PWA (⁣Progressive Web App) ها تا سال 2020 جای 50 درصد از #اپ های native را در بازار بگیرند.

صفحات #PWA #وب_اپلیکیشن هایی هستند که در ظاهر شبیه وبسایت های معمولی اند اما قادرند بسیاری از قابلیت های اپ های #موبایل همچون ⁣working offline، ⁣push notifications و دسترسی به سخت افزار دستگاه را فراهم کنند.

⁣🌐 ⁣https://developers.google.com/web/progressive-web-apps/

⁣✅@coderszone

⁣⁣⁣⁣🔥⁣یادگیری #جاوا_اسکریپت: یازده منبع آنلاین برای هر سطح تخصص

⁣👇👇👇👇👇👇👇
🌐⁣⁣⁣https://goo.gl/TY83aE

⁣✅@coderszone

⁠⁣⁣🔥 از تکنیکی به نام #Prefetching می توان جهت بهبود سرعت مرور صفحات وب بهره برد. در این تکنیک برخی منابع مشخص حتی قبل از اینکه کاربر آن ها را درخواست کرده باشد گرفته شده و در #cache مرورگر ذخیره می شوند.

سه نوع ⁣Prefetching وجود دارد:

👈روش ⁣Link Prefetching : که در آن با استفاده از یک تگ link، منبع مورد نظر برای مرورگر تعیین می شود.

⁣👈روش ⁣DNS Prefetching : که در آن با تعیین آدرس یک سایت دیگر، مرورگر در پس زمینه یک #DNS lookup برای دامنه آن سایت انجام میدهد تا در صورت کلیک کاربر، دیگر این کار انجام نگیرد و زمان انتظار کاربر به حداقل برسد.

⁣👈روش ⁣Prerendering : در این روش کل منابع مورد نیاز برای صفحه ای ک آدرس آن را تعیین کرده ایم دانلود و نگه داری می شود.

#frontend #UI #tips

⁣✅@coderszone

⁣⁣🔥مجموعه ای از #best_practice های #لاراول

👇👇👇👇👇👇👇
⁣🌐⁣https://goo.gl/dnRPzg

#backend #laravel #php

⁣✅@coderszone

⁣⁣⁣🔥مجموعه ای از دکمه های #Toggle کاملا #CSSی با افکت های جذاب

👇👇👇👇👇👇👇
⁣🌐https://goo.gl/rteGXD

#UI #frontend

⁣✅@coderszone

⁣⁣⁣⁣⁣🔥⁣۷ دلیل برای اینکه برنامه‌نویس بیکاری هستید!


⁣👇👇👇👇👇👇👇
🌐⁣https://goo.gl/AQMkrT

⁣✅@coderszone

⁠⁣🔥نمونه #طرح فروشگاه کفش برای #اپ های #اندروید

#inspiration #UI #frontend #android

✅@coderszone

⁣⁣⁣⁣⁣⁣⁣⁣⁣🔥 در طراحی جداول کمی خلاقیت به خرج دهید. خانه های جداول قادرند چیزهایی بیش از متن های بدون #استایل و ساده را نگه داری کنند.

#UI #UX #frontend

⁣✅@coderszone

⁣🔥⁣چگونه یک دولوپر ماهر را از یک دولوپر خوب تشخیص دهیم؟

🌐 ⁣https://goo.gl/H9G4RC

#programming

✅@coderszone

⁠⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣🔥 7 اصل اساسی در #SEO که نباید از آن ها غافل شوید:

💡مطمئن شوید که نقشه #XML سایت شما کاملا به روز است.
⁣💡از #کلمات_کلیدی طولانی استفاده کنید.
⁣💡محتوای منحصر به فردی که حاوی کلمات کلیدی مختلف است تولید کنید.
⁣💡از سایت های دیگر #backlink بگیرید.
⁣💡از مقداردهی صفت alt تصاویر غافل نشوید.
⁣💡از #mobile_friendly بودن وبسایت خود اطمینان حاصل کنید.
⁣💡سایت خود را همواره تست کنید تا از سرعت بارگذاری آن مطمئن شوید.


⁣✅@coderszone

⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣🔥 در Blade #لاراول، هنگام کار با foreach های تو در تو ، باز هم می توان از طریق متغیر loop$ ، به حلقه پدر دسترسی داشت.


#backend #php #laravel

⁣✅@coderszone

⁠⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣🔥 اگر یک سایت #responsive دارید می توانید در آن از "تصاویر واکنش گرا" نیز استفاده کنید.

با استفاده از دو صفت جدید به نام های ⁣srcset و sizes به ترتیب برای تعیین مجموعه ای از آدرس های یک تصویر و تعیین اندازه نسبی تصویر در اسکرین های گوناگون استفاده کنید. سپس مرورگر بهترین اندازه تصویر برای نمایش در #device های مختلف را انتخاب می کند.

میزان پشتیبانی عمومی از این قابلیت در مرورگرها، ⁣88.54% است.

<img srcset="image-320w.jpg 320w,
             image-480w.jpg 480w,
             image-800w.jpg 800w"
     sizes="(max-width: 320px) 300px,
            (max-width: 480px) 440px,
            800px"
     src="image-800w.jpg" alt="Image">

#UI #frontend


✅@coderszone

⁣⁣🔥 #ربات رقاص، خلق شگفتی دیگری از #Boston_dynamics

#technology

⁣✅@coderszone

🔥نمونه #طرح ⁣Stepper لمسی

#inspiration #UI #frontend #android

✅@coderszone

⁣⁣🔥 اسنیپت استور (#Snippet_store) یک اپلیکیشن با ظاهری ساده و کوچک است که به #توسعه دهندگان کمک می کند #snippet_code هایی که زیاد استفاده می کنند را ذخیره و در صورت لزوم به راحتی به آن ها دسترسی داشته باشند.

این #اپلیکیشن، هم اکنون در دو نسخه برای windows و Linux و در دو تم رنگی روشن و تیره ارائه گردیده است و امکان integrate با #VSCode را دارد.

⁣🌐 ⁣⁣https://goo.gl/Dkqdys

#tools #programming

⁣✅@coderszone

⁣⁣🔥 تفاوت #Spinner ها و #progress_bar ها

از spinner ها برای پروسه هایی که کمتر از 4 ثانیه و بیشتر از 1 ثانیه طول می کشند استفاده کنید و برای پروسه های طولانی تر از progress bar ها.

تحقیقات نشان داده است که آستانه انتظار کاربران حداکثر 4 ثانیه می باشد و بیشتر از آن باعث می شود تصمیم کاربران عوض شود.

استفاده از progress bar خطی با نمایش میزان پیشرفت پروسه، کاربر را تشویق به انتظار می کند.

#UI #UX #frontend

⁣✅@coderszone

⁣⁣🔥 در نسخه 70 مرورگر #chrome قابلیت #picture_in_picture اضافه شده است. با این قابلیت می توان با کلیک راست روی ویدیوهای موجود در صفحه و انتخاب گزینه Picture in picture، آن ها را به حالت شناور طوری که بر روی تمامی پنجره های #سیستم_عامل قرار بگیرد، درآورد.

#chrome

⁣✅@coderszone

⁣🔥 با استفاده از صفت download برای تگ های a در #HTML5 میتوان لینکهای دانلودی ایجاد کرد.در این حالت حتی اسم فایلی که با کلیک بر روی لینک ذخیره میشود را نیز میتوان تعیین کرد.

#frontend

⁣✅@coderszone

⁣🔥نمونه #طرح خلاقانه منوی تنظیمات

#inspiration #UI #frontend

✅@coderszone