#books

📖 کتاب ساخت مایکروفرانت‌اند با React 18 بهتون یاد می‌ده چطور یه پروژه بزرگ رو به بخش‌های کوچیک و مستقل تقسیم کنین تا بتونین اونا رو راحت‌تر توسعه بدین و استقرارشون کنین. توی این معماری، هر بخش می‌تونه توسط یه تیم جداگانه مدیریت بشه و سرعت توسعه و انعطاف‌پذیری پروژه هم بالاتر می‌ره.

🔴 <CodeHub/>

. اینجا چندتا نکته مهم از این کتاب رو براتون خلاصه کردم:

- از ساده شروع کنین و کم‌کم گسترده‌ترش کنین – با الگوی Multi-SPA شروع کنین که پیچیدگی کمتری داره، بعد اگر نیاز بود برید سراغ الگوی Micro-Apps برای مدیریت بهتر اجزای ریزتر.

- یه Monorepo داشته باشین تا تیم‌ها راحت‌تر با هم کار کنن – با یه مخزن مرکزی می‌تونین کدهاتون رو متمرکز کنین و همکاری تیم‌ها، مدیریت وابستگی‌ها و اتوماسیون رو آسون‌تر کنین.

- توی زمان اجرا یکپارچگی ایجاد کنین – به‌جای ترکیب کردن بخش‌ها در زمان ساخت، بذارین هر بخش به‌صورت مستقل به‌روزرسانی بشه تا کار راحت‌تر بشه و وابستگی کمتری هم ایجاد کنه.

- روی اتوماسیون و DevOps سرمایه‌گذاری کنین – اتوماسیون برای مایکروفرانت‌اند ضروریه؛ خطوط CI/CD رو راه بندازین تا تست و استقرار خودکار بشه و بتونین سریع‌تر تغییرات رو اعمال کنین.

- ظاهر و تجربه کاربری رو یکدست نگه دارین – با یه سیستم طراحی و کتابخونهٔ مشترک، مطمئن بشین همه بخش‌ها یه استایل و حس یکپارچه دارن.

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

🔵 <CodeHub/>

#Figma_Template

Figma Template: Car rent

Difficulty :  ⭐️⭐️⭐️

🔗Click for Get Link

🔴 </CodeHub>

#fun

وضعیت من هر روز😂

🔴 @codeeehub

#Next JS

سوالات تخصصی و کاربردی Next.js🔥

به دنبال منبعی برای یادگیری یا آماده شدن برای مصاحبه‌های Next.js هستید؟
در این مقاله، مجموعه‌ای از سوالات مهم و کاربردی همراه با پاسخ‌ها گردآوری شده.
فرصتی عالی برای به چالش کشیدن خودتون و ارتقای مهارت‌ها!

لینک رو از دست ندید: 👇

🔗 LINK

🔴 <CodeHub/>

#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>

حق