اگر مثل من حوصله ندارید که فرانت بزنید

برید
https://stitch.withgoogle.com

یه سری توضیحات بدید براتون UI طراحی میکنه که هم فیگما میده و هم html

بعد html صفحات رو دانلود کنید.
حالا Vue, React... هرچی که میخواید رو init کنید.

به واسطه‌ی cursor, Cline,Kilo... بگید که تبدیل کنه براتون

@DevTwitter | <Mahmoud Eskandari/>

با این ریپو می‌تونید داکر ایمیج رو به فایل اجرایی ویندوز تبدیل کنید
https://github.com/rzane/docker2exe

@DevTwitter

اینترنت طبقاتی = اینترنت تخصصی

@DevTwitter

یکی از چالش‌های کار با کتابخانه‌های مختلف به کمک هوش مصنوعی به‌روز نبودن یا در فرمت مناسب نبودن مستنداته. یک سرویس رایگان و به‌روز هست به اسم Context7 که تقریباً همه چیز رو داره و راحت می‌تونید به فرآیند کاری‌تون در کدنویسی با AI اضافه‌اش کنید.

https://context7.com/

@DevTwitter | <Hamed/>

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

https://github.com/rShetty/awesome-podcasts

@DevTwitter | <MEHDI Homeily/>

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

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

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

پکیج فیکر فارسی برای PHP - لینک گیت هاب
https://github.com/amyavari/persian-faker-php

@DevTwitter | <Ali Mohammad Yavari/>

شکنجه‌ای به نام XAMPP !

اولین بار که خواستم با PHP و لاراول کار کنم، رفتم سراغ XAMPP.
نتیجه؟ بیشتر حس می‌کردم دارم با سیستم کشتی می‌گیرم تا کدنویسی کنم
پورت قاطی می‌کرد، MySQL قطع میشد، سرعت پایین بود، یه چیز درست می‌کردم یه جای دیگه خراب می‌شد. خلاصه هر بار پروژه بالا می‌آوردم، خودمم پایین می‌اومدم ‍️

بعد یه روز کاملاً اتفاقی با Laragon آشنا شدم...
اون لحظه شبیه سوییچ کردن از پراید به تسلا بود
یه کلیک = پروژه جدید
هیچ خبری از قاطی کردن پورت‌ها و Shut down شدن MySQL نبود.
بلاخره حس می‌کردم دارم واقعاً کد میزنم، نه پشتیبانی فنی برای XAMPP !

- لاراگون برخلاف XAMPP کاملا با ویندوز ۱۱ سازگاره و مدام MySQL رو Shut down نمیکنه.
- سرویس‌های خیلی بیشتری از XAMPP داره که میشه ازش استفاده کرد. (مثل Nginx، Redis، Mailpit، PostgreSQL و...)
- امکان نصب کلی افزونه و ابزار و... برای هرکردوم از سرویس هاش وجود داره.
- کلی امکانات مثل بک‌آپ گیری از تمام دیتابیس‌ها و... داره.
- و اینکه برخلاف XAMPP امکان نصب و استفاده از ورژن های مختلفی از هر سویس رو داره. (مثلا میشه هم PHP ورژن ۸ رو داشت و هم ۷ و بینشون سوییچ کرد)

علاوه بر این‌ها خیلی سبکه و کمتر از ۱۰ مگابایت رم اشغال میکنه. پیشنهاد میکنم حتما امتحانش کنید
https://laragon.org

نگران منتقل کردن دیتابیس‌ها و فایل‌هاتون هم نباشید. با یک خط دستور میتونید تمام دیتابیس‌هاتون و اطلاعاتتون رو از XAMPP منتقل کنید (داخل داکیومنت خودش توضیح داده).

الان دیگه وقتی یکی میگه "من هنوز XAMPP دارم"، یاد روزای پر از ارور و اعصاب‌خوردی خودم میفتم و دوباره اعصابم خورد میشه

@DevTwitter | <Aida Mortazavi/>

آیا در Next.js (App Router) بیش از حد از 'use client' استفاده می‌کنید؟
یکی از بزرگترین تغییرات پارادایم در توسعه React با Next.js، معرفی Server Components به عنوان پیش‌فرض است. این یک تغییر شگرف برای پرفورمنس است، اما نیازمند یک تغییر فکری است.

- کامپوننت‌های سرور (Server Components) - (پیش‌فرض):
روی سرور رندر می‌شوند.
هیچ JavaScript-ای به کلاینت (مرورگر) ارسال نمی‌کنند.
نتیجه: لود اولیه فوق‌العاده سریع (FCP/LCP عالی).
بهترین مکان برای: فچ کردن دیتا (Data Fetching)، دسترسی مستقیم به دیتابیس، و نمایش UI استاتیک.
محدودیت: نمی‌توانند از هوک‌هایی مثل useState، useEffect یا رویدادهای onClick استفاده کنند.
- کامپوننت‌های کلاینت (Client Components) - (با 'use client'):
مانند کامپوننت‌های سنتی React در مرورگر رندر می‌شوند.
برای هرگونه تعامل (Interactivity) ضروری هستند.
باید از 'use client' در بالای فایل استفاده کنید.
مکان استفاده: دکمه‌ها، فرم‌ها، منوهای Dropdown، و هرجایی که به useState یا useEffect نیاز دارید.

اشتباه رایج این است که به محض نیاز به یک دکمه تعاملی، کل صفحه (page.jsx) را به 'use client' تبدیل کنیم.
​راه‌حل بهتر: «پایین بردن تعامل» (Pushing Interactivity Down)
​صفحه اصلی (page.jsx) خود را یک Server Component نگه دارید تا دیتا را فچ کند.
​کامپوننت تعاملی خود (مثلاً LikeButton.jsx) را جداگانه بسازید و در آن از 'use client' استفاده کنید.
​حالا آن کامپوننت کلاینت را در کامپوننت سرور (صفحه) خود Import کنید.

@DevTwitter | <Maysam Ghaysari/>

اول Javanoscript یاد بگیر!!

دوستان سلام , امیدوارم حالتون خوب باشه هرجا که هستید.
امروز اومدم راجع به یه مبحثی صحبت کنم که احساس میکنم برای دوستانی که حتی تا نیمه مسیر هم هستن به درد بخوره.
در ادامه میپردازم بهش.

در سالهای اخیر , زمانی که تبلیغات و فروش دوره های متنوع خیلی زیاد شد, بیشتر تمرکز بر یادگیری ReactJS بود. (اصلا نمیخوام وارد این موضوع بشم که خیلی هاشون حتی میگفتن: "ببین , سریع React رو که یاد گرفتی برو سراغ NextJS" که همین هم خودش فاجعه ای بود)

ببینید دوستان , اگر هدفتون این باشه که به سطح قابل ارائه و با کیفیتی از فیلد کاری که داخلش هستید برسید , این موضوع مستلزم تلاش هستش. اشتباه کنید , کد بی کیفیت بزنید , و ادامه بدید این مسیر رو. شما با اصلاح مسیر خودتون میتونید واقعا اون راهی رو پیمایش کنید که شمارو به چیزی که میخواهید برسونه.

در اثر همین تبلیغات طوفانی خود من به شخصه یکی از کسانی بودم که JS رو خیلی آبکی یاد گرفتم و جلو بردم و این باعث صدمه زدن به خودم شد, چرا؟ چون React چیز جدیدی نبود! اگر مفاهیم JS رو خوب یاد میگرفتم , علاوه بر اینکه کد های کارآمدتری میتونستم بزنم , حتی میتونستم دیدگاه خوبی داشته باشم نسبت به کاری که دارم میکنم.

مثلا چی؟ بیایید از مثال خیلی ساده شروع کنیم : React Client Component ها چی هستن؟ اگر به خوده Javanoscript برگردیم متوجه میشیم مفهومی مشابه مثل Function Composion رو داره ارائه میده. چون ما داریم داخل یک تابع که همون کامپوننت ما هست , از توابع و متد های دیگه ای هم استفاده میکنم که حالا به نام Component Composion داریم باهاشون کار میکنیم.

یا یه مثال خیلی ساده و کلاسیک دیگه همون هوک های ری اکت هستن مثل useState و useEffeect , این هوک ها هم خودشون Function Composion هستن.

حرف من اینه که اگر شما در JS به دیدگاه درستی برسید , زمانی که با React دارید کار میکنید و کد میزنید دیگه به چشم یک چیز کاملا جدید بهش نگاه نمیکنید چرا که درصد خیلی زیادی از کاری که دارید میکنید همون چیزی بوده که در JS باهاش سر و کار داشتید.

به نظر من برای یادگرفتن اصولی هیچوقت دیر نیست بلکه این به تعویق انداختن و سرسری گرفتن اصل کدنویسی هست که باعث میشه در سال های آینده هم وابستگی کامل به ابزار های دیگه داشته باشیم و نتونیم از شخص خودمون یک روش فکری داشته باشیم.

@DevTwitter | <Shayan Sharifi/>

چند وقت پیش یه پکیج کوچیک به اسم react-state-timeline ساختم که باهاش می‌تونین تاریخچه‌ی stateهای کامپوننت‌هاتون رو نگه دارین و خیلی راحت undo / redo انجام بدین.
حالا توی نسخه‌ی جدیدش یه قابلیت جذاب اضافه کردم
StateTimeline DevTools
یه پنل کوچیکه که با یه دکمه کنار صفحه باز میشه و کل تایملاین state رو نشون میده.
میتونین stateهای قبلی رو ببینین، روشون کلیک کنین و به همون نقطه برگردین — بدون اضافه کردن extention یا پکیج اضافه ای

Npm: https://www.npmjs.com/package/react-state-timeline
Demo & Docs: https://nazari2079.github.io/react-state-timeline/
Github: https://github.com/nazari2079/react-state-timeline

@DevTwitter | <Mohammad Nazari/>

کمپانی IBM یه مدل جدید به اسم granite-4.0-h-350m منتشر کرده که خیلی سروصدا کرده. این مدل سبکه (۳۵۰ میلیون پارامتر) و کاملاً اپن سورس (متن‌باز) هست!
این مدل بخشی از خانواده مدل‌های "Nano" آی‌بی‌ام هست و برای اجرا شدن روی خود دستگاه‌ها (on-device) و کارهای تحقیقاتی بهینه‌ شده. با اینکه مدل خیلی کوچکه ولی دقت خیلی خوبی داره! و اینکه این یه مدل "Instruct" (دستورپذیر) قویه که برای کارهایی مثل خلاصه‌سازی، پرسش و پاسخ/RAG ، دسته‌بندی متن و حتی کارهای مرتبط با کدنویسی عالیه. یکی از قابلیت‌های باحالش "Tool Calling" هست که بهش اجازه میده به ابزارها و APIهای خارجی وصل بشه. تازه، برای گفتگوهای چندزبانه هم طراحی شده و از زبان‌های مختلفی پشتیبانی می‌کنه. و میشه برای زبانهای دیگه مثل فارسی فین تیونش کرد.
HuggingFace link: https://huggingface.co/ibm-granite/granite-4.0-h-350m

@DevTwitter | <Mehdi Allahyari/>

#بدرد

لیست ۲۰ ابزار هوش مصنوعی برای ساخت عکس و ویدئو

۱. Vider.ai
تبدیل تصویر به ویدئو با کیفیت بالا، بدون نیاز به ثبت‌نام.
https://vider.ai

۲. Photiu.ai
حذف پس‌زمینه، بهبود کیفیت و بزرگنمایی تصاویر، بدون نیاز به ثبت‌نام.
https://toolify.ai/free-ai-tools/image-generation-editing

۳. BeArt AI Face Swap
تعویض چهره در تصاویر، بدون محدودیت و بدون نیاز به ثبت‌نام.
https://toolify.ai/free-ai-tools/image-generation-editing

۴. FaceSwapVideo
تعویض چهره در ویدئوها با ۱۰۰۰ اعتبار روزانه رایگان، بدون نیاز به لاگین.
https://toolify.ai/free-ai-tools/image-generation-editing

۵. VisualGPT
تولید و ویرایش تصویر با هوش مصنوعی، بدون نیاز به ثبت‌نام.
https://toolify.ai/free-ai-tools/image-generation-editing

۶. ImgLarger
بهبود کیفیت و بزرگنمایی تصاویر با ۱۰۰ اعتبار ماهانه رایگان، بدون نیاز به لاگین.
https://imglarger.com

۷. Deep Dream Generator
ایجاد آثار هنری منحصربه‌فرد با سبک‌های مختلف، بدون نیاز به ثبت‌نام.
https://deepdreamgenerator.com

۸. Artbreeder
ترکیب و ویرایش تصاویر با هوش مصنوعی، بدون نیاز به لاگین.
https://artbreeder.com

۹. Vheer
تولید تصویر و ویدئو با هوش مصنوعی، ویرایش حرفه‌ای، و تبدیل متن به تصویر و ویدئو، بدون نیاز به لاگین.
https://vheer.com

۱۰. GenApe AI Video Generator
تبدیل متن یا تصویر به ویدئو با کیفیت بالا، بدون نیاز به ثبت‌نام.
https://app.genape.ai/ai-video-generator

۱۱. PixVerse
تولید ویدئو از متن یا تصویر با امکانات خلاقانه، بدون محدودیت و بدون نیاز به لاگین.
https://pixverse.ai

۱۲. Pika
تولید ویدئو کوتاه برای شبکه‌های اجتماعی با امکانات خلاقانه، بدون نیاز به ثبت‌نام.
https://pika.art

۱۳. CapCut
ویرایش ویدئو با هوش مصنوعی و قالب‌های آماده، بدون نیاز به ثبت‌نام.
https://capcut.com

۱۴. InVideo AI
تولید ویدئو با استفاده از متن و تصاویر، بدون نیاز به لاگین.
https://invideo.io/make/ai-video-generator/

۱۵. Runway Gen-2
تبدیل متن و تصویر به ویدئو با امکانات خلاقانه، بدون نیاز به لاگین.
https://runwayml.com/gen-2/

۱۶. Freepik AI
تولید تصویر و ویدئو با امکانات خلاقانه، بدون نیاز به لاگین.
https://freepik.com/ai

۱۷. Flux AI
تولید تصویر و ویدئو با کیفیت بالا، بدون نیاز به ثبت‌نام.
https://flux.ai

۱۸. http://Leonardo.AI (Demo)
تولید تصویر با امکانات خلاقانه، بدون نیاز به لاگین.
https://leonardo.ai

۱۹. Krea
تولید تصویر با کیفیت حرفه‌ای برای پروژه‌های خلاقانه، بدون نیاز به ثبت‌نام.
https://krea.ai

۲۰. Stable Diffusion (Demo)
تولید تصویر با مدل Stable Diffusion، بدون نیاز به لاگین.
https://stablediffusionweb.com

@DevTwitter | <POURYA/>

تمام ابزارهایی که Astral با RUST برای پایتون نوشته به طرز خیره کننده ایی عالی و سریع بوده .و قطعا مهاجرت از mypy به Pyrefly هم تصمیم درستی خواهد بود.
https://pyrefly.org/

@DevTwitter | <Babak.uk/>

اگر داری سیستم جست‌وجوی RAG می‌سازی، می‌دونی چقدر زیرساخت می‌خواد: OCR، embedding، chunking و رتبه‌بندی.
ما پایگاه داده‌ای ساختیم که همه‌ی این کارها رو خودکار انجام می‌ده.
فقط فایل رو بفرست (PDF، DOCX، صوتی یا متنی) و با یه API جست‌وجو کن. سریع، بدون زیرساخت، با هزینه‌ی رقابتی.

@DevTwitter | <Pouya Mohammadi/>

تست کردن پکیج ها و لایبری ها قبل از publish کردن
(yarn link - yarn workspaces)

اخیراً وقتی روی یکی از لایبری‌های داخلی شرکت کار می‌کردم٬ یه چالشی داشتیم برای تست کردن تغییرات نهاییمون روی پروژه هامون که تنها راهی که داشتیم پابلیش کردن روی npm و تستشون بود. که جدیدا با yarn link و yarn workspaces آشنا شدم.

وقتی روی چند تا پکیج هم‌ زمان کار می‌کنی مثلاً یه لایبرری UI داخلی و یه اپ اصلی٬ لازمه اینا رو قبل از پابلیش تو npm، به هم وصل کنی تا لوکال بتونی تستشون کنی.

که تو این شرایط میشه از دوتا قابلیت yarn استفاده کرد :

Yarn link
یه symbolic link بین پکیج لوکال و پروژت می‌سازه. یعنی پکیج رو مثل یه dependency نصب‌شده می‌تونی استفاده کنی، بدون اینکه منتشرش کنی.
ولی اگه چند تا پکیج داری یا ساختار مونو‌ریپو داری، مدیریت لینک‌ها می‌تونه سخت بشه.

Yarn workspaces
برای همین مورد طراحی شده. Workspaces بهت اجازه میده چند تا پکیج رو تو یه repo نگه داری، dependency هاشون رو share کنی و تغییراتشون رو هم زمان sync نگه داری.
در واقع یه روش تمیزتر و پایدارتر برای پروژه‌های چند‌ پکیجی هستش.

داک رسمی :
https://classic.yarnpkg.com/lang/en/docs/cli/link/
https://classic.yarnpkg.com/lang/en/docs/workspaces/

@DevTwitter | <Siavash Aghazadeh/>

یک ریپو جدید دارم برای کسایی که با Laravel کار میکنند
برای اتومیشن سرور که به راحتی بتونید تمامی نیازمندی هارو نصب کنید بدون اتلاف وقت

https://github.com/MisaghMomeniB/ansible-laravel-nginx-mysql-ubuntu

@DevTwitter | <Misagh Momeni Bashusqeh/>

من خودم زمانی که برای المپیاد میخوندم ، داده و الگوریتم را باید میخوردم با هسته اش
سمت دنیای برنامه نویسی میاین باید داده و الگوریتم بیشتر از اظرافیان بشناسین و بفهمین
اینم لینک :
https://github.com/arpit20adlakha/Data-Structure-Algorithms-LLD-HLD

@DevTwitter | <zhiwar/>

یکی از ویژگی‌های جالبی که در React 19.2 اضافه شده، هوک جدیدی به نام useEffectEvent است. این هوک یکی از مشکلات قدیمی React را حل می‌کند: "stale closures" و اجرای غیرضروری useEffect وقتی state یا props تغییر می‌کنند.
با useEffectEvent می‌توانیم وابستگی‌های useEffect را به حداقل برسانیم و در عین حال، همیشه به جدیدترین مقادیر state و props دسترسی داشته باشیم.
در این مثال، ما یک کامپوننت ساده به نام ChatRoom داریم که وقتی به یک room جدید متصل می‌شود، اگر صدای اعلان در تنظیمات کاربر فعال باشد، صدایی پخش می‌کند.
نکته مهم اینجاست که تابع onConnected با استفاده از هوک جدید useEffectEvent تعریف شده است.
این کار باعث می‌شود که تابع همیشه به جدیدترین مقدار userPreferences دسترسی داشته باشد،
اما بدون اینکه نیاز باشد آن را در dependency array قرار دهیم.
به این ترتیب، اتصال فقط زمانی دوباره برقرار می‌شود که roomId تغییر کند،
و تغییر تنظیمات کاربر باعث اجرای غیرضروری useEffect نمی‌شود.

@DevTwitter | <Sepehr Sharifzade/>

آخر هفته سرم خلوت بود
یه قالب مینیمال ساختم که با چند کلیک یه بلاگ رایگان روی GitHub آماده می‌کنه، بدون دردسر و هزینه ای
https://github.com/alihtt/al-minimal

@DevTwitter | <Ali Hatami/>

یک رپو دیگه برای علاقه مندان به تجربه امنیت و باگبانتی و Ai ابزار جذاب HackGPT Enterprise یه ابزار حرفه‌ای و پیشرفته برای تست نفوذه که با هوش مصنوعی و یادگیری ماشین کار می‌کنه
با HackGPT می‌تونید آسیب‌پذیری‌های سیستم‌ها رو پیدا کنید، گزارش‌های کامل و دقیق بگیرید و حتی از چارچوب‌های امنیتی مثل OWASP، NIST و ISO27001 پیروی کنید.

این ابزار با معماری میکروسرویس‌ها و پشتیبانی از Docker و Kubernetes، مقیاس‌پذیری بالایی داره و می‌تونید روی ابرهای مختلف مثل AWS، Azure و GCP استقرارش بدید.

https://github.com/yashab-cyber/HackGpt/

@DevTwitter | <POURYA/>

اگه دنبال یه آلترنیتیو برای Claude Code می گردید که اکثر Providerهارو ساپورت کنه بهتون Crush رو پیشنهاد می دم!

با go نوشته شده و من خیلی تجربه خوبی داشتم وقتی توی دو سه روز گذشته!

https://github.com/charmbracelet/crush

@DevTwitter | <Von Datawarehausen/>