Code Module | کد ماژول
前往频道在 Telegram
Hello World 🌎 <> Earth is programmable if you code it Group 👇🏻 @CodeModuleGap Contact Us 👇🏻 @MrShahiin @neoMahan
显示更多2 181
订阅者
无数据24 小时
-57 天
+3530 天
帖子存档
بدرود با نوشتن دستی API ها و تایپ هاشون ☃️
پکیج Orval یک ابزار هوشمنده که از روی فایل OpenAPI یا Swagger (که بکاند دولوپر برات میفرسته)، به صورت خودکار ریکوستها و تایپ مدل ها و رسپانس هارو برای کار با API میسازه.
تو پروژههای بزرگ که تعداد APIها زیاده (مثلاً ۵۰ تا endpoint یا بیشتر)، نوشتن دستی اون همه ریکوست و تایپ خیلی وقتگیره و امکان بروز اشتباه و باگ هست.
این پکیج ساخته شده تا: سرعت توسعه رو بالا ببره. هماهنگی با بکاند رو حفظ کنه. خطاهای تایپی و ارتباطی رو از بین ببره.ویژگی و مزیت های Orval 🌪تولید خودکار کد API: از روی فایل OpenAPI (.yaml) یا (json.) Swagger، بهصورت خودکار توابع ریکوست (GET, POST, …) میسازه. 🌪تولید تایپ های TypeScript: تایپ مدلهای داده و رسپانس هارو کامل جنریت میکنه. 🌪هماهنگی کامل با بکاند: وقتی بکاند تغییر میکنه، فقط نیازه یک بار کامند Orval رو اجرا کنی تا همهچی آپدیت بشه. 🌪پشتیبانی از کتابخونههای مختلف: بر اساس نیازتون میتونه خروجی رو برای Axios، Fetch API، React Query، SWR و … تولید کنه. 🌪امکان Mock کردن API: بدون نیاز به سرور واقعی، پاسخهای فیک Mock میسازه. 🌪 ساختار تمیز و سازمانیافته کدها: خروجیها منظم، خوانا و آماده استفاده در پروژه هستن. 🔗 Document #orval @CodeModule @CodeModuleGap
دیگه تویی که کل پروژه هات رو شاخ Ai میچرخه، نباید استوری بزاری و امروز رو به خودت بگیری😔
#fun
@CodeModule
امروز رو به همه کسایی که با کدهاشون دنیا رو زیباتر و هوشمندتر میکنن، تبریک میگم🔥
@CodeModule
🍀 گنجینه اوپن سورس به زبان پارسی
⚡️ معرفی روزانه چندین هزار پروژه اوپن سورس
📔 @TheGeeksArchive
سئوی قدرتمند در Next.js 🛠
سئو نقش بسیار مهمی در دیده شدن وبسایت و پروژه داره و شما به عنوان دولوپر، باید اطلاعاتی راجب این موضوع داشته باشید. مقاله زیر نکته هایی برای سئوی بهتر در پروژه های نکستی جمع اوری کرده و یشنهاد میکنم، حتما مطالعش کنید.
🔗 Article
#seo #tips
@CodeModule
یه موردی خیلی توجهم رو جلب کرده.
توی لینکدین پست های زیادی میبینم که همکار های خانم به دنبال کار هستن و در کنار رزومه، عکسی از خودشون هم قرار میدن.
واقعا رسالت این کار چیه؟ /:
در این که قشر قابل توجهی از افراد اصطلاحا هول تشریف دارن شکی نیست و خیلی مورد میبینیم خانم هایی که از دست این موضوع شاکی هستن. ولی خب اکثریت خود خانمها هم دارن به این موضوع قدرت میبخشن و سو افتاده میکنن که اصلا خوب نیست.
@CodeModule
پیغامهای زیبا با Sonner ☔️
Sonner یک کتابخانه toast notification فوقالعاده ساده، سبک و قابل شخصیسازی برای React و سایر فریمورکهای مبتنی بر React هست، که از لحاظ طراحی و تجربه کاربری بسیار مینیمال و جذابه.
Shadcn از این پکیج برای کامپوننت Toast خودش استفاده میکنهبرای کسب اطلاعات بیشتر و نحوه استفاده، به داکیومنت این پکیج مراجعه کنید. 🔗 Document #sonner @CodeModule
درود دوستان
به یک Mern Stack developer که ساکن شیراز باشه نیازمندم (در جهت استخدام)
اطلاعات کامل راجب شرکت رو پیوی میفرستم (قرارداد تمام وقت، حقوق بر اساس سطح و لول دولوپر مشخص میشه). اگه فرد توانمندی میشناسید ممنون میشم معرفی کنید.
@MrShahiin
درود
به یک متخصص سئو نیازمندیم.
اگه فرد کار بلدی سراغ دارید ممنون میشم معرفی کنید.
@MrShahiin
اگه برای تمرین و کدنویسی دنبال ui خاصی میگردید، این طرح فیگما رو به هیچ وجه از دست ندید 💀
🔗 Link
#figma
@CodeModule
درود💙
نیازمند یک برنامه نویس asp.net جهت توسعه یک پروژه هستم.
اگه کسی رو میشناسید ممنون میشم معرفی کنید.
@MrShahiin
Repost from Fullstacks — Academy
قابلیت جدید CSS برای ساخت Carousel
تو این ویدئو به قابلیت جدید CSS برای ساخت Carousel میپردازیم.
مشاهده ویدئو
این ویدئو بخشی از استریم های هفتگی جامعه ست شما هم میتونید با دنبال کردن کانال توی لایو ها شرکت کنید:
https://twitch.tv/fullstacksjs
عضویت در جامعه:
https://fullstacksjs.com
#wus #carousel #css
با پکیج nextjs-toploader رنگ و بوی جدیدی به پروژت بده🔥
nextjs-toploader یه پکیجِ انیمیشنی هست که در پروژههای Next.js استفاده میشه. با استفاده از این پکیج، زمانی که بین صفحات مختلف جابهجا میشید، در بالای صفحه یه progress bar (نوار لودینگ باریک) نشون داده میشه.
درست مثل نوار باریکی که بالای سایت معروفی مثل YouTube موقع لود صفحه جدید میبینی.برخی ویژگیهای nextjs-toploader 🧬 خیلی ساده و سریع راهاندازی میشه. 🧬 رنگ، ارتفاع، سرعت پیشروی و شکلش کاملا قابل تغییره. 🧬 با Router Events توی Next.js کار میکنه (مثل routeChangeStart, routeChangeComplete) برای کسب اطلاعات بیشتر به داکیومنت این پکیج مراجعه کنید. #animation #toploader @CodeModule
گروه تـاپیک برنامهنویســی
💬 | t.me/TopicsDev
چنل توسعه دهندگان و برنامه نویسان ❤️🩹
👨🏻💻| t.me/IDevZone
چطور اکانت گیتهابم رو حفظ کنم؟ مروری بر 2FA و اهمیت مدیریت دسترسیها 🔥
چند روز پیش یک مشکلی با سیستم 2FA داشتم که خیلی به موقع خودش رو نشون داد. به اپ 2FA در گوشیم دسترسی نداشتم و از اون بدتر، ریکاوری کدهایی که باید ذخیره میکردم رو اصلاً نداشتم! (که خب معمولاً خیلیا همینطوری هستن). این شد که یک وضعیت بحرانی پیش اومد و من به از تمام اکانتهای گیتهابم اومده بودم بیرون. تنها راه دسترسی به اکانتم هم یه PAT یا (Personal Access Token) بود که به سختی ساعتها گشتم تا پیداش کنم و در نهایت تونستم وارد بشم. ولی این اتفاق به من یادآوری کرد که چقدر مهمه چند تا نکته امنیتی ساده رو برای اکانت گیتهابمون فعال کنیم تا مثل من یهو از زندگی ناامید نشین!
1- سیو کردن ریکاوری کدها
اولین و مهمترین چیزی که باید انجام بدید اینه که ریکاوری کدها رو دانلود کنید و حتما یه جایی ذخیره کنید. نوشتن اونا توی جایی که به راحتی بهش دسترسی داشته باشید (مثلاً یه فایل امن یا یه اپ مخصوص ذخیرهسازی پسورد) خیلی میتونه کمککننده باشه. این کار رو حتما انجام بدید که اگر روزی روزگاری به اپ 2FA دسترسی نداشتید، راحت بتونید وارد بشید.
2- فعال کردن SSH
یکی دیگه از کارهایی که به شدت توصیه میکنم، فعال کردن SSH برای اکانت گیتهاب هست. این کار کمک میکنه که بدون نیاز به وارد کردن پسورد یا توکن، بتونید به راحتی به گیتهاب دسترسی پیدا کنید.
نحوه فعال سازی SSH:
- ابتدا باید یک کلید SSH بسازید (با استفاده از
ssh-keygen در ترمینال).
- بعد از ساخت کلید، باید اون رو به گیتهاب اضافه کنید از طریق تنظیمات SSH Keys در گیتهاب.
3- اکسس توکن (PAT)
همچنین به جای استفاده از پسورد برای احراز هویت، میتونید از اکسس توکنها (PAT) استفاده کنید. این توکنها برای ارتباط امنتر با گیتهاب خیلی مفید هستند.
نحوه فعال سازی PAT:
- به تنظیمات اکانت گیتهاب برید.
- در قسمت Developer Settings، گزینه Personal Access Tokens رو پیدا کنید.
- توکن جدید بسازید و سطوح دسترسی مورد نظر رو انتخاب کنید.
مهم:
اگر هیچ کدوم از این روشها رو برای اکانتتون فعال نکردید، گیتهاب هیچ تضمینی نمیده که بتونید اکانتتون رو بازیابی کنید. نهایتاً ممکنه مجبور میشید ایمیل رو unlink کنید و یه اکانت جدید بسازید، ولی حتی در این صورت هم تاریخچه کامیتها و اطلاعات دیگه رو ممکنه از دست بدید.
#github
@CodeModuleبا React Scan بیشتر آشنا بشید 💎
پکیج React Scan در واقع یک ابزار نسبتاً جدید و جالب برای آنالیز و اسکن پروژههای ریکتی هست که به شما، در شناسایی رندرهای غیرضروری در پروژتون کمک میکنه. این ابزار مشکلات عملکردی مربوط به re-render شدن کامپوننتها رو بدون نیاز به تغییر در کد به راحتی شناسایی میکنه.
برخلاف ابزارهای دیگه مثل React Devtools، این پکیج بهصورت دقیق مشخص میکنه که کدوم کامپوننتها باعث کند شدن پروژتون و آسیب به پرفورمنس میشن.
📎 Document
#reactScan
@CodeModule
