از شروع کلیشه‌ای پست‌های اول مثل «سلام، این اولین پست منه» یا «فعالیت رو از امروز شروع می‌کنیم» خوشم نمی‌آید. اولین پستمون تقدیم شما 👨‍💻🔥🤝

@SabziDevCode | <Abolfazl/>

به‌عنوان اولین فعالیتم در جامعه‌ی اوپن‌سورس، یه پکیج ESLint ساختم به اسم:

@sabzidev/eslint-rules

که هدفش صرفا فراتر از Lint کردن پروژه‌ست؛ بلکه ساده‌تر کردن کدنویسی و حذف موارد غیرضروریه!

۲ تا از کاربردی‌ترین Ruleها:

no-invalid-id-and-classname-value

مقادیر نامعتبر یا غیرضروری id و className رو تشخیص می‌ده و در موارد قابل اصلاح، خودکار ساده‌سازی می‌کنه؛ حتی فراخوانی‌های غیرضروری clsx رو هم حذف می‌کنه.

merge-duplicate-id-and-classname-props

پراپرتی‌های تکراری id و className رو ادغام می‌کنه؛ مثلا وقتی استایل کامپوننتی رو کپی می‌کنید، دیگه نیازی نیست کلاس‌ها رو دستی ادغام کنید.

هدفم کاهش کارهای تکراری و نوشتن کد تمیزتر و قابل‌نگهداری‌تره. ❤️

🔗 لینک پکیج و آموزش نصب، به‌همراه لیست تمام سایر ruleها:
https://www.npmjs.com/package/@sabzidev/eslint-rules

@SabziDevCode | <Abolfazl/>

توی همین هفته‌ی اول انتشار، حدود ۱۳۰۰ دانلود داشته 😇💚

اگه براتون مفید بود، خوشحال می‌شم با یه ⭐ از پروژه حمایت کنید:
https://github.com/SabziDev/eslint-rules

ممنون از حمایتتون! ❤️

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

یه مقاله جالب امروز دیدم راجع‌به وضعیت بازار کار تکنولوژی و راستش حرف اصلیش خیلی قابل فکر بود: شاید مسئله این نباشه که دیگه توی تک فرصت نیست، مسئله اینه که راه ورودش عوض شده.

تا چند سال پیش مسیر تقریباً مشخص بود. یه زبان و فریم‌ورک یاد می‌گرفتی، چندتا پروژه می‌ساختی، رزومه می‌فرستادی و بالاخره یه جایی به عنوان جونیور وارد می‌شدی. الان اون مسیر خیلی سخت‌تر شده. تعداد موقعیت‌های جونیور کمتر شده، بخشی از کارهایی که قبلاً به نیروی تازه‌کار می‌دادن با AI انجام می‌شه و شرکت‌ها هم از همون اول انتظار دارن آدم مستقل‌تر باشه، مسئله حل کنه و بلد باشه از AI به عنوان ابزار استفاده کنه.

به نظرم نکته مهم مقاله همین بود: بازار کار تکنولوژی بسته نشده، ولی درِ ورودی قبلیش دیگه مثل قبل باز نیست. اگه هنوز با همون فرمول قدیمی جلو بری، احتمالاً بیشتر از اینکه مشکل از توانایی تو باشه، مشکل از مسیریه که داری امتحان می‌کنی.

https://dev.to/james_anderson_h/tech-is-brutal-right-now-stay-or-go-lets-think-clearly-59jk

@codehalics | کدهالیک

مقاله رو که پیشنهاد می‌کنم حتما ازش یه مطالعه‌‌ای داشته باشید.
علاوه بر مقاله و نظر ادمین کانال، می‌خوام دیدگاه خودمم درباره‌ی ورود به بازار کار تکنولوژی بگم.

به نظرم اگه جونیور هستید، باید فراتر از یه جونیور معمولی ظاهر بشید؛ نه با ادعا، بلکه با چیزی که واقعاً انجام دادید. کارفرما ازتون خروجی می‌خواد، نه صرفاً نوشتن حرف‌های قشنگ درباره‌ی Clean Code و معماری نرم‌افزار داخل رزومه و پروفایل لینکدین!
الآن عصر پرفرکت‌رزومه ها هستش! واقعا رزومه ها بی نقصن! یکی از یکی خوشگل‌تر...

راه های مختلفی برای اینکار وجود داره که حالا بعد ها اگه فرصت شد هرزگاهی یه صحبتی راجبشون می‌کنیم.
یکی از راه‌هاش؟ GitHub و مشارکت در پروژه‌های Open Source.
به‌جای سبز کردن چمن‌های گیت‌هابت، برک سراغ پروژه‌های واقعی و سعی کن مشکلی رو حل کنی، یه فیچری اضافه کنی، ایشو ها و دیسکاشن ها رو بخون و ببین اصلا درد مردم چیه؟ ایشو های تاپ اون هفته چی بوده؟

البته هر مشارکتی ارزشمند نیست! اینکه صرفا README رو آپدیت کنی، یا بری تست بنویسی یا مستندات رو تغییر بدی، لزوما با اینکار ها قرار نیست کار پیدا کنی؛ مخصوصاً وقتی AI هم می‌تونه بخش زیادی از این کارها رو انجام بده.

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

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

در نهایت، GitHub شما باید نشون بده با دانسته‌هاتون چه کاری از دستتون برمیاد، نه اینکه صرفاً چه چیزهایی بلدید.
این نظر شخصی منه، و بنظرم تو عصر فعلی اهمیت به گیت هاب و پروژه های واقعی (حالا چه اوپن سورس یا تجاری خیلی زیاد شده)

@SabziDevCode | <Abolfazl/>

شما تا همین چندسال پیش صرفا با داشتن یه رزومه خوب و ۲ ۳ تا نمونه‌کار قابل قبول بازار کار، خیلی راحت‌تر می‌تونستید استخدام بشید.
اما الان همه رزومه ها perfect هستن،
واقعا تمام رزومه ها بی نقص هستن...

در کل سعی کن خودت رو یه جوری به جامعه برنامه نویس ها نشون بدی و خودتو اثبات کن!

@SabziDevCode | <Abolfazl/>

می‌دونستید JavaScript چند بار تا مرز نابودی رفت، ولی هر بار زنده موند؟!

اول Java Applet اومد که می‌خواست وب رو با Java فتح کنه؛ شکست خورد!
بعد Flash با انیمیشن‌ها و بازی‌هاش حسابی قدرت گرفت، اما مشکلات امنیتی و مخالفت استیو جابز نابودش کرد.
بعدش Silverlight مایکروسافت اومد؛ اونم شکست خورد!
گوگل هم با Dart خواست JavaScript رو کنار بزنه، ولی در نهایت Dart بیشتر با Flutter شناخته شد.

و اما TypeScript، ساخته‌ی مایکروسافت که اونم جای JavaScript رو نگرفته؛ بلکه کدهاش در نهایت به JavaScript تبدیل می‌شن.

@SabziDevCode | <Abolfazl/>

‏DPR اصلا چی هست؟ چه تاثیری روی کیفیت تصاویر داره؟

‏devicePixelRatio نسبت پیکسل‌های فیزیکی نمایشگر به پیکسل‌های css رو مشخص می‌کنه. (که توی پست بعدی گفتم تفاوت پیکسل های فیزیکی نمایشگر با css pixel ها چیه)
ازش استفاده می‌کنیم تا تصاویر و گرافیک‌ها روی نمایشگرهای مختلف، مخصوصا مانیتورهای HiDPI، شارپ و باکیفیت نمایش داده بشن.

console.log(window.devicePixelRatio);

‏- SVG: برداریه؛ به تنظیم دستی dpr نیاز نداره؛ مرورگر خودش اون رو متناسب با اندازه نمایش و dpr رندر می‌کنه.
‏- Canvas: بافر پیکسلی داره و به‌صورت پیش‌فرض با dpr هماهنگ نمی‌شه و همچنین با زوم کردن افت کیفیت داره؛ معمولا بافر رو متناسب با dpr تنظیم می‌کنن تا روی مانیتورهای مختلف کیفیت خوبی داشته باشه. این کار هم با ایجاد ایونت resize و تنظیم ابعاد canvas، مقیاس‌دهی context و رسم مجدد محتوا انجام می‌شه؛ هنگام تغییر اندازه یا dpr هم باید به‌روزرسانی بشه.
‏- PNG / JPEG: پیکسلی‌ان؛ با زوم کردن، افت کیفیتشون قابل مشاهده‌س.

@SabziDevCode | <Abolfazl/>

چرا SVG به DPR نیاز نداره؟
‏svg مختصات ریاضیِ شکل‌ها و بردارها رو نگه می‌داره و مرورگر هنگام رندر، اون‌ها رو متناسب با اندازه و وضوح نمایشگر به پیکسل تبدیل می‌کنه.
اما canvas محتوای رسم‌شده رو به‌صورت پیکسل ذخیره می‌کنه؛ بنابراین معمولاً باید همین فرآیند رو دستی برای کنواس شبیه‌سازی کنیم.

@SabziDevCode | <Abolfazl/>

حالا تفاوت CSS Pixel با پیکسل واقعی چیه؟

پیکسلی که توی CSS می‌نویسیم، لزوما با پیکسل واقعی نمایشگر یکی نیست! این تفاوت رو dpr مشخص می‌کنه.

مثلاً اگه dpr نمایشگر برابر با 2 باشه، هر 1px در css با 2px فیزیکی در هر بُعد نمایش داده می‌شه؛
پس 200px در css می‌شه 400px فیزیکی. (فقط درصورتی که dpr = 2 باشه!)

برای دیدن مقدارش:

console.log(window.devicePixelRatio);

این نسبت کمک می‌کنه محتوا روی نمایشگرهای مختلف، با وضوح مناسبی نمایش داده بشه.

@SabziDevCode | <Abolfazl/>