سئوی قدرتمند در Next.js 🛠

سئو نقش بسیار مهمی در دیده شدن وب‌سایت و پروژه داره و شما به عنوان دولوپر، باید اطلاعاتی راجع به این موضوع داشته باشید. مقاله زیر نکته هایی برای سئوی بهتر در پروژه های نکستی جمع اوری کرده و یشنهاد میکنم، حتما مطالعش کنید.

🔗 Article

#seo #tips
@CodeModule

دیگه تویی که کل پروژه هات رو شاخ Ai میچرخه، نباید استوری بزاری و امروز رو به خودت بگیری😔

#fun
@CodeModule

بدرود با نوشتن دستی 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

حالا مگه بک اند دولوپر زیر بار سواگر type safe میره؟😞

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

🔗 Link

#figma
@CodeModule @CodeModuleGap

ترکیبی از مودال و منوی کشویی با Credenza 🐝

پکیج Credenza یک کامپوننت آماده به ما میده که ترکیبی از dialog و drawer هست، یعنی در سایز دسکتاپ، به صورت مودال معمولی باز میشه و در سایز موبایل، به شکل drawer (منو کشویی) نمایش داده میشه.

🔗 Document

#credenza
@CodeModule @CodeModuleGap

خیلی خوب بوددد 😂😂😂

#fun
@CodeModule @CodeModuleGap

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

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

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

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

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

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

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

💥 ساده‌تر از useSearchParams

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

🔗 Document

#nuqs
@CodeModule @CodeModuleGap

با React Share بیشتر آشنا بشید ☃️

کتابخونه‌ی react-share یکی از کتابخونه‌های محبوب ریکته که برای اضافه‌کردن دکمه‌های اشتراک‌گذاری، در شبکه‌های اجتماعی مثل تلگرام، واتساپ، توییتر، لینکدین، فیسبوک و ... استفاده میشه.

ویژگی‌های کتابخانه React Share

⚡️ پشتیبانی از شبکه‌های اجتماعی مختلف

⚡️ آیکون‌های SVG با قابلیت شخصی‌سازی

⚡️ بسیار کم حجم و سریع


🔗 Document

#react_share
@CodeModule @CodeModuleGap

دوستان یه پول ریکوست بزنید بلکه روبیکا و بله هم اضافه بشه🙏

در کل به نظر من منطقی نیست یه دپندنسی برای چنین تسکی به پروژه اضافه کرد.

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

پست‌هایی که پیشنهاد میکنم از دست ندید ;-)

💎 چگونه تبدیل به یک فریلنسر موفق بشیم؟

💎 ۳۰ توصیه از یک برنامه‌نویس سنیور

💎 ایونت لوپ در جاوااسکریپت

💎 زمان کار آموزی به چه نکاتی توجه داشته باشیم؟

💎 ‏5 ماژول کاربردی Node.js

💎 5 دیزاین پترن مطرح Gof

#top
@CodeModule
@CodeModuleGap

با توجه به وضعیت فعلی، استفاده از ai های مرسوم و اصلی امکان پذیر نیست و یا به شدت دردسر داره.

توی این پست هوش مصنوعی‌ای بهتون معرفی میکنم که با نت ملی هم پاسخگوی شما هست ( ۲۱ روز اشتراک Pro به صورت رایگان بهتون میده)

🔗 Boof Ai

لطفا دوستانی که متصل هستن این ai رو به باقی افراد معرفی کنن تا کسی این روزا لنگ نمونه.

#ai
@CodeModule
@CodeModuleGap

زشت نیست مهندسین نتورک اخرین بازدیدشون یک ماه پیشه؟ :))

لیست زیر رو ذخیره کنید 💎

💡دانلود تمام دوره های برنامه نویسی، دیزاین، تدوین، گرافیک و... Udemy به صورت رایگان
https://downloadly.ir/

💡 انتقال اطلاعات بین گوشی و سیستم
https://pastehub.ir/

💡داکیومنت زبان های برنامه نویسی
http://wewiki.ir/

💡برای چت موقت
https://esm.cr0.ir/

💡وضعیت اینترنت
https://radar.arvancloud.ir/

💡 ابزار کاهش سایز عکس و فایل
https://www.eboo.ir/

💡 جایگزین anydesk
https://dorsandesk.ir/

💡 جایگزین ترلو
https://www.mizito.ir/

💡 پکیج های pypi، npm، داکر
https://runflare.com/mirrors/

💡 پکیج های پایتون
https://icodeacademy.ir/python-packages/

💡 یکسری ریپو خوب
https://gitlab.aranserver.com/explore

💡 کتاب رایگان
https://icodeacademy.ir/library/

💡مخازن اوبونتو، دبیان، کالی روی شاتل
https://mirror.shatel.ir/

💡یه سری mirror کاربردی
https://mirror.kubarcloud.com/

💡مخزن ملی منابع متن باز
https://repo-portal.ito.gov.ir/

💡میرور جامع دانشگاه صنعتی اصفهان از توزیع های لینوکس
https://repo.iut.ac.ir/

💡داکر ریجستری مبین هاست
https://docker.mobinhost.com/

💡یه cdn برای کتابخونه ها و فریم ورک
https://lib.arvancloud.ir/

📌 ابزارهای برنامه نویسی:
ان پی ام میرور (npm mirror)
https://runflare.com/mirrors/npm-mirror/
مخازن ابونتو
https://mirror.shatel.ir/
ریپازیتوری لینوکس
https://repo.iut.ac.ir/
میرور مایکت
https://maven.myket.ir/
میرور مبین هاست
https://mirror.mobinhost.com/
پروکسی کوبار
https://mirrors.kubarcloud.com/
همروش
https://hamravesh.com/darkube/

#help
@CodeModule

پست موقت

دنبال یه بات بودم که فایل تلگرام رو به لینک داخلی تبدیل کنه ( یعنی بشه بدون فیلترشکن دانلود کرد)
از کل بات‌هایی که فرستادید، این موارد کار می‌کرد، بعضیاشون لینک داخلی نمیدن البته، همه رو کامل تست نکردم، کارم با چهارمی اوکی شد

@irftlbot
@linkulubot
@file2link_bot
@LeecherPro_bot
@uploadbot
@MMDLeecherbot

خوشحالم که دارید آنلاین میشید❤️

بهترین ترفندهای پرامپت نویسی چیه؟ 🐝

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

🕸 هدف پرامپت رو شناسایی کنید.

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

🕸 زمینه‌سازی کنید و جملاتی واضح بنویسید.

به جای اینکه خواسته‌های مبهم مطرح کنید، دستورالعملی کاملا دقیق و واضح در اختیار Ai بذارید که ویژگی‌ها، اشکال، رنگ‌ها، بافت‌ها، الگوها و یا سبک‌های مورد نظرتون رو تشریح کنه. علاوه بر این خوبه کمی زمینه‌سازی و اطلاعاتی مفهومی به AI ارائه کنید. مثلا پرامپت «یک تصویر پس‌زمینه بساز» به اندازه «تصویر پس‌زمینه‌ای از یک کوهستان پوشیده از برف، برکه‌ای آرام و آسمانی که با نورهای گرم خورشید روشن شده بساز» موثر نخواهد بود.

🕸 استفاده از کلمات و عبارات کلیدی رو فراموش نکنید.

اگر نیاز دارید هوش مصنوعی در سطح وب و گوگل جستجو کنه و اطلاعاتی دقیق پیدا کنه، استفاده از کلمات کلیدی موثر در «بهینه‌سازی موتور جستجو» (Search Engine Optimization | SEO) رو فراموش نکنید.

🕸 پرامپت‌ها رو کوتاه و تمیز نگه دارید.

با توجه به اینکه از کدوم ابزار AI کمک می‌گیرید و چه مشکلی دارید، طول پرامپت متغیر خواهد بود. اگرچه که پرامپت‌های طولانی و پیچیده می‌تونن اطلاعات ارزشمندی در اختیار هوش مصنوعی بذارن، اما به عنوان یک قاعده کلی، پرامپت‌ها رو تا حد امکان کوتاه و سرراست نگه دارید و از حداقل ۳ الی ۷ کلمه استفاده کنید.

🕸 سوالات استدلالی و خلاقانه بپرسید.

اگه پرامپت رو طوری بنویسید که پاسخ ساده «بله» یا «خیر» داشته باشه، نتایج محدودتری نسبت به سوالات استدلالی دریافت خواهید کرد. برای مثال به جای پرسیدن اینکه «آیا قهوه برای سلامتی مضر است؟»، می‌تونید بپرسید «مزایا و معایب مصرف قهوه برای سلامتی چیست؟».

به طور کلی اینا برخی از راه حل هایی بود که به ما در نوشتن پرامپت کمک بزرگی میکنن و با جدی گرفتن اون ها، خروجی بهتری از Ai خواهیم داشت 🤖

#tips #ai
@CodeModule

تست رسپانسیو وبسایت، در همه اندازه ها🔥

برنامه LT Browser، یک ابزار تست نمایشگر وب هست که به دولوپرا کمک می‌کنه، تا طراحی وبسایت‌های خودشون رو بر روی انواع دستگاه‌ها و اندازه‌های صفحه نمایش، تست کنند. این برنامه امکان تست ریسپانسیو و تطابق وب‌سایت با دستگاه‌های مختلف از جمله تلفن همراه، تبلت و کامپیوتر رو فراهم می‌کنه 📱

Download 🌐

#responsive #ltbrowser
@CodeModule