⚡️ خیلی وقتا میشه که یه چیزو ایمپورت میکنیم ولی استفاده نمیکنیم. در #VSCode میتونیم با Shift + Alt + O (در ویندوز و لینوکس) یا Shift + Option + O (در مک)، این ایمپورت های اضافی رو به طور خودکار حذف کنیم.

پ.ن: این دستور ترتیب ایمپورت‌ها رو هم مرتب میکنه

🆔 @frontcode01 | 👩‍💻🧑‍💻

🔺 با Web Share API میتونید مشابه اپ های نیتیو، منوی share رو باز کنید تا از اون طریق، کاربر قادر باشه لینک، تکست و فایل رو ارسال کنه

پ.ن: مرز بین وب اپ ها و اپ های نیتیو روز به روز داره باریک تر میشه 😍

🆔 @frontcode01 | 👩‍💻🧑‍💻

⚛️ با هوک useWorker میتونید تسک های به شدت سنگین (مثل sort کردن یه آرایه با ۵ میلیون عضو رندوم!) که تو اپ #React انجام میدید رو بجای thread اصلی مرورگر، بفرستید به Web Worker تا جلوی رندر شدن UI رو نگیره

لینک گیتهاب این پکیج 🎉

🆔 @frontcode01 | 👩‍💻🧑‍💻

🔺 با pseudo سلکتور placeholder-shown میتونید استایل #CSS رو فقط زمانی که placeholder اینپوت نمایش داده میشه اعمال کنید

🆔 @frontcode01 | 👩‍💻🧑‍💻

⚡️ از تب compatibility فایرفاکس ، میتونین ساپورت مرورگرها از کدهای #CSS که میزنید رو ببینید
✅ این دیتا رو هم بر اساس جدول ساپورت MDN نشون میده

🆔 @frontcode01 | 👩‍💻🧑‍💻

📌اگه تو پروژه وبتون عکسی دارید که پس زمینش transparent هستش و می‌خواید بهش سایه بدید به جای box-shodow از drop-shadow استفاده کنید تا اینطوری زیبا شه

🆔 @frontcode01 | 👩‍💻🧑‍💻

🔺 یه مشکلی که با height:100vh داریم اینه که توی موبایل اسکرول میخوره و تمام ارتفاع صفحه مرورگر همراه آدرس بار (نه فاصله از آدرس بار تا انتهای صفحه) ولی با این تکنیک میشه حلش کرد 😇

🆔 @frontcode01 | 👩‍💻🧑‍💻

⚡️ یه مورد از مزیت هایی که CSS grid نسبت به فلکس باکس داشت این بود که یه پراپرتی grid-gap داشتیم که خیلی راحت باهاش فاصله بین آیتما رو تنظیم میکردیم منتها تو فلکس باکس باید مارجین داده میشد. الان با این پراپرتی جدید flex-gap میشه مشابه CSS grid فاصله انداخت بین آیتما 😍

🆔 @frontcode01 | 👩‍💻🧑‍💻

🔰اگر نیاز دارید از css variable درون جاوااسکریپت استفاده کنید
خیلی راحت میتونید از getComputedStyle() استفاده کنید

🆔 @frontcode01 | 👩‍💻🧑‍💻

✅ برای دسترسی و راحتی کاربران موبایل ، از type مخصوص برای input ها استفاده کنیم 👌

🆔 @frontcode01 | 👩‍💻🧑‍💻

🔰 کاربرد use در React 19

🆔 @frontcode01 | 👩‍💻🧑‍💻

دیس و دیس بک فرانت و بک 🚨

🆔 @frontcode01 | 👩‍💻🧑‍💻

⚡️ چندتا راه باحال برای اینکه falsy value ها رو از یک آرایه حذف کرد.

🆔 @frontcode01 | 👩‍💻🧑‍💻

📚 هروقت با خودتون گفتید که دیره برم چیز جدید یاد بگیرم
یه سر به چنل این خانومه بزنید.
اینجا داره ffmpeg رو معرفی میکنه با gui های مختلفش تو لینوکس 🔥

🆔 @frontcode01 | 👩‍💻🧑‍💻

🔰 نگاهی به نظرسنجی Stackoverflow 2024

◽️ تاپ ترین کشورها

USA , Germany , India

◽️ محبوب ترین زبان ها

JS , HTML/CSS , PY

◽️ محبوب ترین دیتابیس ها

PostgreSQL , MySQL , SQLite

◽️ محبوب ترین فریمورک و تکنولوژی

Node.js , React , Jquery , Next.js , Express

◽️ محبوب ترین ابزارها

Docker , Npm , Pip

◽️ محبوب ترین محیط های توسعه

Visual Studio Code , Visual Studio , IntelliJ IDEA

◽️ محبوب ترین ابزارهای AI

ChatGPT , GitHub Copilot , Google Gemini

◽️ بیشترین درآمد سالانه ( در حیطه وب )

Back-end : $67,227
Full-stack : $63,332
Front-end : $48,787

◽️ درصد خوشحالی و رضایت از شغل

Not Happy at Work : 32.1%
Complacent at Work : 47.7%
Happy at Work : 20.2%

📌 جزئیات بیشتر + نظرسنجی کامل

🆔 @frontcode01 | 👩‍💻🧑‍💻

کلوچه‌های اینترنتی🍪
مجبور نیستید همه چیز رو ترجمه کنید 🤦🏻‍♂️

🆔 @frontcode01 | 👩‍💻🧑‍💻

⚡ سایت roadmap.sh خوب بود، خوب تر هم شد. اخیرا شروع کرده به تعریف کردن پروژه های مرتبط با هر مسیر به صورت سطح بندی شده

پ‌ن: این سایت نقشه‌راه هر استکی که بخواین رو بهتون نشون می‌ده.

🆔 @frontcode01 | 👩‍💻🧑‍💻

🔰 کدت رو بنویس و دیگه نگران تست نوشتن نباش، من می‌نویسم برات!
این شعار هوش مصنوعی جدیدی هستش به اسم Celp که در مقام یک دستیار تمام عیار در کنارتونه و دیگه شما رو از شر دغدغه تست نوشتن‌های روزمره راحت می‌کنه

◽️https://www.celp.ai

🆔 @frontcode01 | 👩‍💻🧑‍💻