#Figma_Template

Figma Template: RIVO - multi page template

Difficulty :  ⭐️⭐️⭐️⭐️

🔗Click for Get Link

🔴 </CodeHub>

🔧 اهمیت فایل tsconfig.json تو پروژه‌های TypeScript

📂 فایل tsconfig.json یکی از مهم‌ترین بخش‌های هر پروژه‌ی تایپ‌اسکریپتیه. این فایل به کامپایلر میگه چطور کدهای TypeScript رو به JavaScript تبدیل کنه. با تنظیم درستش، می‌تونی:
✅ سخت‌گیری بیشتری تو بررسی خطاها داشته باشی.
✅ فرمت خروجی کد رو مدیریت کنی.
✅ تو پروژه‌های واقعی مشکلات رو بهتر کنترل کنی.

⚙️ تنظیمات پیشنهادی برای tsconfig.json

با استفاده از یه سری تنظیمات خوب، می‌تونی:
🚀 سرعت بیلد رو بالا ببری.
🔒 ایمنی کد رو بیشتر کنی.
🐞 دیباگ کردن رو راحت‌تر کنی.
🤝 سازگاری کد رو تضمین کنی.


🔗 میتونید توضیحات بیشتر درباره هر کدوم از این موارد رو داخل این داکیومنت ببینید.

پروژه‌ی تایپ‌اسکریپتی بدون tsconfig.json مثل یه نقشه‌ی گنج بدون علامت X هست! 🗺✨

🔵<CodeHub/>

#Figma_Template

Figma Template: Crypto trading

Difficulty :  ⭐️⭐️⭐️

🔗Click for Get Link

🔴 </CodeHub>

تحلیل رزومه با جزییات

#تجربه

@webinar_farsi

#tailwindCss #frontend

👀 بیش از 20 انیمیشن CSS با کلاس‌های آماده Tailwind CSS.

سایت Origin UI مجموعه‌ای از توابع "easing" آماده برای پروژه‌هایی که با Tailwind CSS کار می‌کنند ارائه کرده است. برای اضافه کردن این توابع به پروژه‌تان، کافی است نام کلاس موردنظر 📄 را کپی کنید.

🔗 Link: https://originui.com/easings

@IDevZone | از کد تا خلاقیت

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

#WebSocket

بریم سمت دنیای ریلتایم! WebSocket

🧐 مفهوم WebSocket چیه؟
- تصور کن تو یه چت روم آنلاین هستی و هر پیام رو بدون رفرش کردن صفحه میفرستی و دریافت میکنی! 🪄 این معجزه رو WebSocket ممکن میکنه!
مفهوم WebSocket یه پروتکوله که ارتباط دوطرفه و پایدار بین کلاینت (مثل مرورگر) و سرور ایجاد میکنه.
برعکس HTTP که هر بار باید درخواست جدید بزنی (مثل رفرش صفحه)، WebSocket مثل یه تونل باز میمونه و دادهها باهم ردوبدل میشن!

مقایسه با مفهوم HTTP
- مفهوم HTTP : مثل ارسال نامه📮... هر بار باید به پستخونه بری و نامه جدید بفرستی!
مفهوم WebSocket : مثل تماس تلفنی📞... یکبار ارتباط برقرار میشه و هر دو طرف میتونن حرف بزنن!

💡کجاها استفاده میشه؟
۱. چتهای ریلتایم (مثل تلگرام خودمون! 😉)
۲. نوتیفیکیشنهای آنلاین (مثلاً وقتی یه کاربر جدید تو سایت لاگین میکنه)
۴. داشبوردهای زنده (مثلاً آپدیت قیمت ارز یا بورس بدون رفرش!)

چطوری کار میکنه؟ 👨💻
۱. اول یه Handshake با HTTP انجام میشه (سلام و احوالپرسی اولیه 😅).
۲. اگه سرور موافقت کنه، ارتباط Upgrade میشه به WebSocket.
۳. حالا کلاینت و سرور میتونن با هم دیتا ردوبدل کنن تا هر وقت خواستن!

مزایای WebSocket ✅
سرعت بالا: دیگه نیازی به درخواستهای مکرر HTTP نیست!
کمتر شدن بار سرور: ارتباط همیشه بازه، پس سرور کمتر کار میکنه.
پشتیبانی گسترده: تقریباً همه مرورگرهای جدید (Chrome, Firefox, ...) ازش حمایت میکنن.

مثال کد ساده (جاوااسکریپت) 🖥

// ایجاد ارتباط WebSocket
const socket = new WebSocket('wss://مثال.com/chat');

// گوش دادن به پیامهای سرور
socket.addEventListener('message', (event) => {
    console.log('پیام از سرور: ', event.data);
});

// فرستادن پیام به سرور
socket.send('سلام سرور! چطوری؟');

🔵</CodeHub>

یکی از بچه های چنل یه اکستنش کروم نوشتن که مشکل راست به چپ deepseek رو حل میکنه
میتونید از گیت هابش دانلود و نصب کنید

https://github.com/pouriasabaghi/deepseek_rtl_extention/


#openSource #deepseek
@CleverDevs - @CleverDevsGp

#Figma_Template

Figma Template: Shop.co

Difficulty :  ⭐️⭐️⭐️

🔗Click for Get Link

🔴 </CodeHub>

حق

#NEXT

کار های نسبتا ساده ای که میتونه پرفورمنس توسعه پروژه رو بالا ببره و بعضیاش واقعا کاربردی و ساده ان .

وقت داشتید یه نگاهی به این مقاله بندازید.



🔵 <CodeHub/>

اگر توی پروژه React js و یا Next js از کتابخانه framer motion استفاده میکنید این پست میتونه براتون خیلی مفید باشه!

سایت aceternity UI با استفاده از framer motion کلی انیمیشن های خفن و کاربری توی زمینه و قسمت های مختلف توسعه دادن که میتونید ببینید و اگر دوست داشتید کدش رو مستقیم کپی و استفاده کنید.

پیشنهاد میکنم حتما به سایتش سر بزنید!!!

https://ui.aceternity.com

@DevTwitter | <Mohammad Reza Moradi/>

#JS

پنج تا از کتابخونه‌های قدیمی که یه موقع مناسب‌ و مفید بودن ولی دیگه موقع تغییره :

اول. jQuery:
روزای قدیم برای دستکاری DOM و پشتیبانی از مرورگرهای قدیمی کاربرد داشت، ولی حالا جاوااسکریپت خودش کلی قابلیت داره و روش‌های جدید، جای jQuery رو گرفته.

دوم. Lodash:
این کتابخونه واسه کارهای کمکی توی کدها بود، ولی با معرفی ES6 و توابع بومی جاوااسکریپت، نیاز بهش کمتر شده.

سوم. Moment.js:
برای کار با تاریخ و زمان عالی بود، اما حجم بالایش باعث می‌شه سرعت برنامه‌ها پایین بیاد. جایگزین‌هایی مثل date-fns و Luxon خیلی سبک‌تر و بهینه‌تر هستن.

چهارم. Underscore.js:
نسخه اولیه Lodash که با امکانات کمترش دیگه کافی نیست؛ بهتره از روش‌های بومی ES6 استفاده کنید.

پنجم. RequireJS:
ابزار قدیمی برای مدیریت ماژول‌ها که با ورود ES6 ماژول‌ها و ابزارای مدرن مثل Webpack، Vite و Rollup دیگه نیاز بهش کمتر شده.همه رو حل می‌کنن.

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

🔵</Codehub>

۵۶ تا آگهی آخر جابینجا رو دادم به هوش مصنوعی که تحلیل کنه. خلاصه‌ تکنولوژی‌هایی که نیاز دارن به ترتیب اولویت این شد.

1. React proficiency (hooks, component lifecycle, best practices)
2. Next.js (SSR, SSG, and performance optimization)
3. TypeScript for type-safe, scalable JavaScript
4. State management (Redux, React Query, Zustand, etc.)
5. HTML/CSS frameworks (Tailwind, MUI, Bootstrap, Styled Components)
6. Git version control and team workflows
7. Testing (Jest, Cypress) and clean code practices
8. Familiarity with Docker, CI/CD, and DevOps fundamentals
9. Knowledge of SSR and performance tuning
10. Optional pluses: React Native, WebSocket, GraphQL, PWA