چند روز پیش یکی از بچه ها یه مشکلی با nextjs و SWC تو ویندوز داشت
من بهش پیشنهاد کردم WSL و رو ویندوزش فعال کنه و از طریق اون nextjs و اجرا کنه
علاوه بر اینکه مشکلش حل شده شده بود، سرعت بیلد و اجرای دستورات nodejs خیلی بیشتر شده بود (حدود ۵۰% بیشتر)
حتما یه نگاهی به WSL تو ویندوز ۱۰ و ۱۱ بندازیت و فعالش کنید که کلی سرعتتونو بیشتر میکنه
@react_ir
من بهش پیشنهاد کردم WSL و رو ویندوزش فعال کنه و از طریق اون nextjs و اجرا کنه
علاوه بر اینکه مشکلش حل شده شده بود، سرعت بیلد و اجرای دستورات nodejs خیلی بیشتر شده بود (حدود ۵۰% بیشتر)
حتما یه نگاهی به WSL تو ویندوز ۱۰ و ۱۱ بندازیت و فعالش کنید که کلی سرعتتونو بیشتر میکنه
@react_ir
اگر خواستید به کسی لینک بدید که فقط یه قسمتی از ویدیو رو ببینه یا خودتون میخواستید یه قسمتی رو دوباره ببینید
فقط کافیه عنوان موضوع رو از قسمت Chapters پیدا کنید و روش کلیک کنید و ویدیو از اون قسمت پخش میشه 🔥🔥🔥
@react_ir | react.ir
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
بعد از ظهر کانال یوتیوبو چک کنید یکی از خفنترین و بهترین ویدیوهایی که تاحالا تونستم بسازم و اماده کردم
کلی نکته و اطلاعات به درد بخور داخلش هستش و قراره از ماتریکس خارج بشید
پیشنهاد میکنم تا اون موقع یکم درباره الگوریتم memoization بخونید، چند وقت پیش یه مقاله بلند و بالا درباره memoization و هوک های useCallback/useMemo نوشته بودم که لینکشو اینجا میزارم
https://react.ir/p/memo
@react_ir | react.ir
کلی نکته و اطلاعات به درد بخور داخلش هستش و قراره از ماتریکس خارج بشید
پیشنهاد میکنم تا اون موقع یکم درباره الگوریتم memoization بخونید، چند وقت پیش یه مقاله بلند و بالا درباره memoization و هوک های useCallback/useMemo نوشته بودم که لینکشو اینجا میزارم
https://react.ir/p/memo
@react_ir | react.ir
ریاکت
الگوریتم Memoization | ریاکت
با استفاده از تابع memo و هوک های useMemo و useCallback ما پرفورمنس برنامه های ری‌اکتمون رو بالا میبریم و کمک میکنیم که کاربرار های برنامه های ما بهترین تجربه ممکنه و داشته باشن
نظرتون چیه بعد از ظهر ساعت ۵ لایو بزارم (داخل یوتیوب) ؟
میخوام یه اپ نکست و با گیت هاب اکشن بیلد کنم، پوش کنم تو رجیستری، از اونور رو VPS که coolify داره بگیرمش و دیپلویش کنم
خودمم نمیدونم دقیق چیکار باید کنم، کلی فکر کردن و سوتی دادن قراره داشته باشه
کنارش پرسش و پاسخ میتونیم هم داشته باشیم
میخوام یه اپ نکست و با گیت هاب اکشن بیلد کنم، پوش کنم تو رجیستری، از اونور رو VPS که coolify داره بگیرمش و دیپلویش کنم
خودمم نمیدونم دقیق چیکار باید کنم، کلی فکر کردن و سوتی دادن قراره داشته باشه
کنارش پرسش و پاسخ میتونیم هم داشته باشیم
https://cutejson.dev/
این اپ بالاخره دیپلوی شد، میتونید تست کنید و لذت ببرید
کارش اینکه به شما JSON Server میده که خیلی راحت بتونید ازش استفاده کنید برای پروژه هایی تمرینی که دارید توسعه میدید
سورس پروژه به صورت open source روی گیتهاب قرار داره
یکی از بچه‌های با استعداد community خودمون توسعه دادتش
اگر خوشتون اومد میتونید بهشstar ⭐️ بدید
@react_ir
این اپ بالاخره دیپلوی شد، میتونید تست کنید و لذت ببرید
کارش اینکه به شما JSON Server میده که خیلی راحت بتونید ازش استفاده کنید برای پروژه هایی تمرینی که دارید توسعه میدید
سورس پروژه به صورت open source روی گیتهاب قرار داره
یکی از بچه‌های با استعداد community خودمون توسعه دادتش
اگر خوشتون اومد میتونید بهشstar ⭐️ بدید
@react_ir
cutejson.dev
Cute JSON - Automated API Generation & JSON Editing
Cute JSON offers automated API generation from JSON keys, fake data creation, and an integrated online JSON editor. Create, test, and manage your APIs effortlessly.
دیدید که نکست جی اس یه دنیای متفاوتیه از اون چیزی که اول به عنوان react یاد میگیرید
برای یه اپ ری‌اکتی CSR خیلی راحت صبح بیدار میشید یه اپ ریاکت با vite میسازید شروع میکنید به کد زدن، همه چی ساده هستش، راحت کار میکنه
بعد برای اینکه پرفورمنس اپ بهتر بشه و rank بهتری بگیره تو صفحه نتایج serach engine و … میاید SSR/SSG میکنید
و اینجا تازه اول بدبختیامونه، نکست جی اس باید بریزی همه چی پیچیده شده - روترش فرق داره کانفیگش فرق داره کلا یه دنیای متفاوتیه
چند روز پیش react router نسخه ۷ اومد که تمام این مشکلاتو حل میکنه 🔥
شما اپتونو با vite میسازید react router و نصب میکنید روتاتونو تعریف میکنید و اپو توسعه میدید
بعد روزی که خواستید SSR بشه کافیه برید تو تنظیمات react router یه فلگ ssr و true کنید
و تمام
اپ شما SSR میشه
ممکنه بگید میخوایم SSG کنیم!
اینم کاری نداره
داخل کانفیگ react router بهش route هایی که باید ssg بشن و میگید و اونارو SSG میکنه
به همین راحتی
نه نیازه چیز جدید یاد بگیرید
نه نیازه از اول پروژه رو ببرید رو نکست
مستنداتش اینجا هستش و میتونید اپ های reacr router 6 که دارید و راحت ببرید به نسخه ۷
https://reactrouter.com/home
(با اینکار تیم ریاکت روتر فریمورک remix با react router ادغام شد و یکی شدن)
@react_ir | react.ir
برای یه اپ ری‌اکتی CSR خیلی راحت صبح بیدار میشید یه اپ ریاکت با vite میسازید شروع میکنید به کد زدن، همه چی ساده هستش، راحت کار میکنه
بعد برای اینکه پرفورمنس اپ بهتر بشه و rank بهتری بگیره تو صفحه نتایج serach engine و … میاید SSR/SSG میکنید
و اینجا تازه اول بدبختیامونه، نکست جی اس باید بریزی همه چی پیچیده شده - روترش فرق داره کانفیگش فرق داره کلا یه دنیای متفاوتیه
چند روز پیش react router نسخه ۷ اومد که تمام این مشکلاتو حل میکنه 🔥
شما اپتونو با vite میسازید react router و نصب میکنید روتاتونو تعریف میکنید و اپو توسعه میدید
بعد روزی که خواستید SSR بشه کافیه برید تو تنظیمات react router یه فلگ ssr و true کنید
و تمام
اپ شما SSR میشه
export default {
ssr: true,
};
ممکنه بگید میخوایم SSG کنیم!
اینم کاری نداره
داخل کانفیگ react router بهش route هایی که باید ssg بشن و میگید و اونارو SSG میکنه
export default {
// return a list of URLs to prerender at build time
async prerender() {
return ["/", "/about", "/contact"];
},
}
به همین راحتی
نه نیازه چیز جدید یاد بگیرید
نه نیازه از اول پروژه رو ببرید رو نکست
مستنداتش اینجا هستش و میتونید اپ های reacr router 6 که دارید و راحت ببرید به نسخه ۷
https://reactrouter.com/home
(با اینکار تیم ریاکت روتر فریمورک remix با react router ادغام شد و یکی شدن)
@react_ir | react.ir
Reactrouter
React Router Home
و بالاخره نسخه استیبل tailwind 4 منتشر شد!
https://tailwindcss.com/blog/tailwindcss-v4
@react_ir | react.ir
https://tailwindcss.com/blog/tailwindcss-v4
@react_ir | react.ir
Tailwindcss
Tailwind CSS v4.0
We just released Tailwind CSS v4.0 — an all-new version of the framework optimized for performance and flexibility, with a reimagined configuration and customization experience, and taking full advantage of the latest advancements the web platform has to…