5 اکستنشن کاربردی که باید نصب کنی⚡️

🫆 اکستنشن WhatFont

یکی از مهم‌ترین افزونه‌هایی که باید به‌ عنوان دولوپر بشناسید، اکستنشن WhatFont هست. با کمک این افزونه می‌تونید نوع فونت مورد نظر رو فقط با نگه داشتن ماوس بر روی متن، شناسایی کنید.

🫆 اکستنشن Colorzilla

با استفاده از اکستنشن Colorzilla، می‌تونید کد HEX رنگ مورد نظرتون رو پیدا و به‌راحتی کپیش کنید. با این ابزار نه تنها می تونید تاریخچه رنگ ها رو ببینید، بلکه این امکان رو هم دارید که گرادیان های CSS ای رو تحلیل کنید.

🫆 اکستنشن Image Downloader

اگه از اون دسته دولوپرایی هستید که روزانه تصاویر زیادی دانلود می‌کنن، اکستنشن Image Downloader مختص شماست. به کمک این افزونه می‌تونید در سریع‌ترین زمان ممکن، تعداد زیادی از تصاویر رو بر اساس ابعاد مورد نظرتون فیلتر و دانلود کنید.

🫆 اکستنشن Dimensions

با استفاده از این افزونه خفن، میتونید فاصله بین ابعاد یا شکاف هایی که بین عناصر وجود داره، یا هر چیز دیگه ای که در سایت هست رو اندازه گیری کنید.

🫆 اکستنشن CSSViewer

اگه به دنبال کدهای CSS بخش‌ های مختلفی از یک وبسایت هستید، می‌تونید از اکستنشن CSSViewer کمک بگیرید. فقط با نگه داشتن ماوس در هر جایی از صفحه، میتونید به استایل های CSS اون قسمت دسترسی داشته باشید.


#extensions
@CodeModule

اگه برای تمرین و کدنویسی دنبال ui خاصی میگردید، این طرح فیگما رو به هیچ وجه از دست ندید 💀

(طرح رسپانسیوش هم موجوده)

💎 Link

#figma
@CodeModule

دائم دنبال api هستی و پیدا نمیکنی؟ 🕷

توی این پست ۲ api مارکت خاص بهتون معرفی میکنم که واسه هر چیزی که فکر کنید، api دارن. از دیجی کالا و آشپزی و ... بگیر تا هوش مصنوعی !!

▫️https://apieco.ir/

▫️https://one-api.ir/

#api
@CodeModule

😂😂😂😂😂

#fun
@CodeModule

دنبال نمونه پروژه برای تمرینی؟ 💥

ریپازیتوری 50projects50days مجموعه‌ای از ۵۰ پروژه‌ی کوچیک و کاربردیه که به منظور تمرین و تقویت مهارت‌های HTML، CSS و JavaScript طراحی شده. پیشنهاد میکنم حتما یه سر بزنید.

🔗 Repository

#repository
@CodeModule

داکیومنت‌های مورد نیازت رو آفلاین همراهت داشته باش! 💻

فرقی نمی‌کنه مشغول چه حوزه‌ای هستی، این ابزار‌ها در زمان قطعی اینترنت به فریادت میرسن.

‏📖 DevDocs
تقریباً هر چیزی که لازم داری رو یک‌جا جمع کرده؛ از JavaScript، TypeScript، React و Node.js گرفته تا CSS، HTML و ده‌ها تکنولوژی دیگه. کافیه داکیومنت‌های موردنیازت رو دانلود کنی تا هر زمان، حتی بدون اینترنت، به اونها دسترسی داشته باشی.

‏⚡️ Zeal
یکی از بهترین ابزارها برای دسترسی آفلاین به مستنداته. کافیه Docsetهای موردنیازت رو یک‌بار دانلود کنی؛ بعد از اون با یک جستجوی ساده، بدون نیاز به اینترنت به همه داکیومنت‌ها دسترسی داری.

🔗 DevDocs
🔗 Zeal

#document
@CodeModule

با Nuqs بیشتر آشنا بشید 🕷

پکیج Nuqs یک کتابخونه برای مدیریت state از طریق query string در پروژه های React و فریم‌ورک‌هایی مثل Next.js هست.

به زبان ساده‌تر: با Nuqs می‌تونید stateهایی مثل فیلترها، سرچ کاربر، پیجینیشن، یا هر متغیری رو که نیازه در URL نگه دارید و خیلی راحت و type-safe مدیریتشون کنید.

قابلیت‌های مهم این پکیج

💥 پشتیبانی از انواع داده (string number, boolean, date, array و ...)

💥 سازگاری کامل با App Router

💥 سینک خودکار بین state و URL

💥 ساده‌تر از useSearchParams

اگه از دست useSearchParams و useRouter خسته شدی، پکیج Nuqs دقیقاً همونه که دنبالش بودی.

🔗 Document

#nuqs
@CodeModule

۱۳ سپتامبر یا ۲۵۶مین روز سال، به عنوان روز برنامه‌نویس شناخته میشه، اما چرا ۲۵۶؟

چون برای ما دولوپرها عدد خاصیه؛ ۲۵۶ برابر با 2⁸ هست و در دنیای باینری و کامپیوتر، ارتباط مستقیمی با ۸ بیت و یک بایت داره.

شاید همین عدد کوچیک، بهانه‌ای باشه برای تبریک به آدم‌هایی که هر روز با کد، منطق و کلی باگ، چیزی می‌سازن.

روزتون مبارک ❤️‍🔥

آینده‌ی درخشانی برای تک‌تکتون آرزو می‌کنم 💙

@CodeModule

دولوپر روز نمیخواد، پروژه دلاری میخواد.

روز ai هم مبارک، بنده خدا کم کد نزده.

دیگه وقتت رو برای نوشتن کاستوم هوک‌ها هدر نده🩸

پکیج usehooks-ts مجموعه‌ای از هوک‌های آماده و کاربردی برای پروژه‌های ریکتی هست که خوشبختانه با تایپ اسکریپت هم سازگاره. در این مجموعه، هوک های مختلفی برای انواع کارها مانند مدیریت ایونت‌ها، مدیریت لوکال استوریج، مدیریت تایمرها، دسترسی به اطلاعات مرورگر و ... پیدا میشه، که باعث ساده‌تر شدن کدنویسی، سرعت بیشتر و همچنین کاهش نیاز به نوشتن کد تکراری میشه.

🔗 Link

#react
@CodeModule

اینایی که ریکشن خنده زدن، بات‌های ai هستن.

اگه بخواید یک نمونه کار فول استک رو انلاین کنید، حداقل ماهی ۱.۵ تا ۲ تومن هزینه زیر ساخت و نگهداریش رو دارید. سرویس دهنده های عزیز هم که ماهیانه دارن افزایش قیمت میدن.

یک‌جا رزومه فرستادم، گیر داد چرا سرعت یکی از پروژه‌ها پایینه.

خب مردک تو اگه میدونستی سرویس دیتابیس پروژه روی رندوم ترین سایت با پلن free توی دور افتاده ترین قاره دیپلوی شده، راجع به این که چرا ریکوست ها اینقدر طول میکشه صحبت نمیکردی !!!

لطفا شل کن کارفرمای عزیز.
من نمیتونم ففط برای بالا بودن پروژه ها ماهی ۸ ۹ تومن هزینه کنم.


@CodeModule

وقتی نوشتن کد دیگه مزیت نیست! 🌪

با ظهور ایجنت‌های مختلف مثل Claude Code، Codex و ابزارهای مشابه، نیاز شرکت‌ها به نیروی انسانی داره کمتر میشه.

برای اینکه روی این موج سهمگین بتونیم شناور بمونیم و غرق نشیم، باید بدونیم ارزش یک دولوپر امروزی دقیقاً به چیه؟

قبلاً برای ساخت یک فیچر، بخش قابل توجهی از ارزش یک دولوپر به این بود که:

چقدر سریع می‌تونه این فیچر رو کدنویسی کنه؟

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

پس سؤال داره تغییر می‌کنه.

آیا این دولوپر درک میکنه چی باید ساخته بشه؟
آیا می‌تونه برای مسئله، معماری درست انتخاب کنه؟
آیا می‌فهمه پیشنهاد AI چه زمانی درسته و چه زمانی اشتباه؟
آیا می‌تونه خروجی AI رو Review و Debug کنه؟
آیا تفاوت بین کد تمیز و کد کثیف رو تشخیص میده؟
آیا می‌تونه وقتی سیستم در پروداکشن خراب شد، ریشه مشکل رو پیدا کنه؟
آیا می‌فهمه چه زمانی باید به AI اعتماد کنه و چه زمانی نباید؟

اینجاست که تجربه واقعی هنوز ارزش خودش رو حفظ می‌کنه.

هوش مصنوعی می‌تونه در چند ثانیه کد تولید کنه، اما اینکه چه کدی باید تولید بشه، چرا باید این‌طور ساخته بشه و آیا واقعاً انتخاب درستی بوده یا نه، همچنان نیازمند درک مسئله و قضاوت مهندسیه.

شاید در آینده، ارزش یک دولوپر کمتر به تعداد خطوط کدی که می‌نویسه وابسته باشه و بیشتر به تصمیم‌هایی هست که می‌گیره.

ما وارد دوره‌ای شدیم که تعریف برنامه‌نویس داره تغییر می‌کنه.

حالا سؤال اینه:
ما هم قراره باهاش تغییر کنیم؟

@CodeModule

‏Ky، رقیب سرسخت اکسیوس 🪖

اگه با Axios کار میکنید و پایه ثابت پروژه هاتون هست، قراره Ky‌‏ هم برای شما بسیار جذاب باشه.

‏Ky یک HTTP Clientئه که بر پایه‌ی Fetch API ساخته شده و از مرورگرهای مدرن، Bun، Node.js و Deno پشتیبانی می‌کنه.

اما چه تفاوتی با Fetch و Axios دارد؟

🔸 ‏API ساده‌تر نسبت به Fetch

‏Ky سعی نمی‌کنه که یک سیستم کاملاً متفاوت از Fetch ایجاد کنه، بلکه همون ریکوست رو ساده‌تر و کاربردی‌تر می‌کنه.

در کنار API ساده‌تر، امکاناتی مثل Retry داخلی، Timeout، پشتیبانی بهتر از TypeScript و اعتبارسنجی Response با Schema رو هم ارائه میده..

🔸‏ هوک های کاربردی

‏Ky مجموعه‌ای از Hookها رو در اختیار ما قرار میده:

beforeRequest
beforeRetry
beforeError
afterResponse

با استفاده از این هوک‌ها می‌تونیم قبل از ارسال ریکوست، هنگام Retry، قبل از ارور یا بعد از دریافت رسپانس، لاجیک موردنظر رو اضافه یا تغییر بدیم.

🔸 ‏سبک و بدون Dependency

‏Ky حدود 9KB حجم داره و هیچ dependency خارجی نداره، در حالی که حجم Axios حدود 18.5KB هست.

در نهایت برنده میدان؟

هر دو هدفی مشترک، اما رویکرد متفاوتی دارن. Axios یک HTTP Client مستقل با API و امکانات خودش هست، در حالی که Ky به Fetch نزدیک‌تره و سعی می‌کنه تجربه‌ی کار با Fetch رو ساده‌ و کامل‌تر کنه. به همین دلیل برای انجام بعضی کارها نسبت به Axios به کد کمتری نیاز داره.

🔗 Document

#ky
@CodeModule

رفتم مصاحبه کاری برای پوزیشن جونیور بک‌اند دولوپر.

کاری به نحوه مصاحبه و رفتار و هیچ چیزی ندارم، مسئله ای که بهش برخوردم حقوقه.

بنده قبل از این که بک اند دولوپر باشم، یه فرانت دولوپر باتجربه هستم.

رسیدیم به بخش شیرین حقوق و من مبلغ درخواستیم رو گفتم(مبلغ پایین تر از رنج تهران و حتی ارزشی که خودم خلق میکنم بود)

مصاحبه کننده قبول نمیکنه و میگه میدونی که تعداد اگهی کمه؟ در جواب از مهارت های خودم گفتم و برگشته میگه ما اینجا فقط بک اند دولوپر نیاز داریم.

حرفشون رو تایید کردم و گفتم باشه، اما تسک فرانت به من نمیدی یا سئو تکنیکال برای پروژه نیاز داشتی به من مربوط نیست.

من اینجا فقط یه بک اند دولوپر جونیور هستم.

قبول نکرد و گفت اره تو میخوای مثل کامپیوتر ۰ و ۱ بری جلو، ضربه بزنی به تیم و باید هر تسکی محول شد انجام بدی...

گفتم روی چشم، حقوقم رو اعلام کردم دیگه.

نپذیرفت.


سوال اینجاست، من باید به سازشون برقصم و بخشی از زحماتم رو ندید بگیرم، یا شرکت‌ها باید از این مفتبری کردن دست بردارن؟

حق ترین پست 😂😂😂😂

#fun
@CodeModule

با چند کلمه، یک پرامپت حرفه‌ای بساز 🧩

اگه برای نوشتن پرامپت‌های خوب همیشه مجبورید چندین دستور رو پشت سر هم بنویسید، این ابزار می‌تونه کارتون رو خیلی ساده‌تر کنه.

این ابزار یک Prompt Builder هست که عبارت‌های کوتاه و ساده شما رو به پرامپت‌های مفصل و دقیق تبدیل می‌کنه.

مثلاً به‌جای اینکه بنویسید:

یه کامپوننت لاگین با Next.js بساز، ریسپانسیو باشه، ولیدیشن داشته باشه، TypeScript باشه و کد تمیز بنویس.

میتونید این متن رو به این ابزار بدید و خروجی زیر رو تحویل بگیرید 👇

یک کامپوننت Login برای Next.js بنویس که:

1. نیازمندی‌های فنی:
- با TypeScript نوشته شود
- کاملاً ریسپانسیو باشد (موبایل، تبلت، دسکتاپ)
- حتما validation سمت کلاینت برای ایمیل و پسورد داشته باشد
- پیام‌های خطا و موفقیت نشان دهد

2. ویژگی‌های UX:
- فیلد ایمیل و پسورد
- دکمه ورود
- "رمز عبور را فراموش کردم" لینک
- "ثبت‌نام" لینک
- حالت loading حین ارسال

3. استانداردهای کد:
- کد تمیز و خوانا با naming واضح
- کامپوننت کوچک و قابل استفاده
- استفاده از React hooks
- استایل‌دهی با Tailwind CSS
- توضیحات برای بخش‌های پیچیده

4. خروجی:
- کد کامل و آماده برای استفاده
ا - include کنید types/interfaces


🔗 site

#ai
@CodeModule