| Rad Dev (JS) |

خب این باگ هم فیکس شد. حتما برنامه‌نویسی یاد بگیرید. برنامه‌نویسی بهترین کار دنیاست. @Mern_stack_01

آقا سمت برنامه‌نویسی نیاید. کاملا جدی. @Mern_stack_01

اکثرا اگه بخوایم سمت فرانت‌اند با کوکی‌ها کار کنیم از document.cookie استفاده می‌کنیم. اما از دردسرای این روش هر چی بگم کم گفتم. مثلا واسه خوندن کوکی باید slice و find و split بزنیم. حتی حذف کوکی هم دردسره. اما خبر خوب اینه که یه Api جدید اضافه شده به اسم CookieStore که کار باهاش خیلی راحت‌تره. هم ایجاد کوکی، هم خوندن کوکی و ... حتی حذف کوکی. حتی باهاش می‌تونین Watch بنویسین. خیلی خوبه :)) پشتیبانی مرورگرا رو هم داره و به نظرم دیگه باید از document.cookie خداحافظی کنیم. CookieStore حتی تو Service Worker هم کار می‌کنه. @Mern_stack_01

فرانت‌اند هم این‌قد پر استرس؟ موقع نوشتن useEffect باید با سرعت نور تایپ کنیم تا یه‌وقت فرصتی به auto save ادیتور ندیم که بخواد useEffect ناقص رو تو مرورگر اجرا کنه و تو تکرار رندر بیفته و سیستم کرش کنه. @Mern_stack_01

در ادامه این پست، احتمالا دیدید که یسری اسکریپت های package.json رو بدون run اجراشون می‌کنیم. مثلا به جای npm run start می‌نویسیم npm start. دلیلش اینه که خود npm واسه یسری keywordها شورت‌کات تعریف کرده. مثل: - npm start - npm test - npm stop - npm restart @Mern_stack_01

اگه Coding Interview رو کنکور در نظر بگیریم، LeetCode می‌شه کتاب کنکوری. یکی از سایت هایی که مهارت حل مسئله شما رو به شدت تقویت می‌کنه و در نتیجه واسه Coding Interview خیلی آماده‌تر می‌شید، سایت LeetCode هست: 🔗 LeetCode.com البته به نظرم قبل از حل تمرینات لیت‌کد بهتره مفاهیم پایه مربوط به الگوریتم و ساختمان داده رو بلد باشید. @Mern_stack_01

قدیما که ادا هایی مثل دوتا مانیتور و تم دارک و قهوه و ماچا و … نبودن، تو همچین محیطی کد می‌زدیم. @Mern_stack_01

در ادامه این پست، تو package.json می‌تونید واسه نام‌گذاری اسکریپت‌ها از : استفاده کنید. یعنی این‌طوری:

{ "scripts": { "test": "jest", "test:watch": "jest --watch", "test:coverage": "jest --coverage", "build": "tsc", "build:client": "vite build", "build:server": "tsc" } }

کاراکتر : هیچ معنی خاصی واسه npm نداره و فقط یه Naming Convention بین برنامه‌نویس‌هاست. این ساختار تو پروژه های بزرگ خیلی خوانا‌تره. @Mern_stack_01

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

کانال رسمی آپارات در یوتوب :)) @Mern_stack_01

در رابطه با این Poll باید بگم یه چیزی وجود داره یه اسم Best Practice Trap. یعنی تله بست‌پرکتیس‌ها. اکثرا وقتی یه best practice می‌بینیم به عنوان یه فکت مطلق برداشت می‌کنیم که همیشه درسته، همه ‌جا باید ازش استفاده کرد و … تو کد بالا دولوپر کم‌تجربه کد 2 رو انتخاب می‌کنه. چون احتمالا با یه اصلی به اسم DRY آشنایی داره و می‌گه نباید کد رو تکرار کرد. نمی‌دونه تو کد دوم باید کلی if نوشت که خودش باعث کثیفی کد می‌شه. نمی‌دونه تو ماه های آینده نیاز های یوزر و ادمین از هم‌دیگه جدا می‌شن و اون‌موقع هم قراره کلی if دیگه به فانکشن اضافه می‌شه و در نتیجه فانکشن تبدیل می‌شه به یه هیولا که نمی‌شه حتی بهش دست زد دیگه. گاهی اوقات کمی تکرار بهتر از abstraction زودهنگام هست. در نتیجه سعی کنید تو تله Best Practice نیفتید. بست‌پرکتیس‌ها فکت مطلق نیستن. اکثر بست‌پرکتیس‌ها عمدتا واسه یه context خاص تعریف می‌شن. @Mern_stack_01

کدوم کد رو ترجیح می‌دین؟ @Mern_stack_01

یه چک‌لیست خیلی جامع واسه فرانت‌اند (جاوا اسکریپت، امنیت، سئو، پروداکشن و …) 🔗 https://github.com/thedaviddias/Front-End-Checklist لینک‌ها و منابع خیلی مفیدی توش هست. حتما بهش یه سر بزنید. @Mern_stack_01

یه لیست خوب و دسته‌بندی‌شده از ابزارهایی که به درد دولوپر فرانت‌اند می‌خورن: 🔗 https://github.com/nafasebra/awesome-webdesign-tools @Mern_stack_01

اگه انگلیسی‌تون در حدی نیست که مقالات انگلیسی رو بخونید، لینک مقاله رو بفرستید به ChatGPT و این متن رو زیرش بنویسید: “محتوای این لینک رو بهم یاد بده” به زبون آدمی‌زاد و با دید فنی بهتون توضیح می‌ده، نه این که فقط ترجمه کنه. @Mern_stack_01

مواردی که در راستای امنیت Api باید بلد باشید: 🔗 https://roadmap.sh/api-security-best-practices @Mern_stack_01

این سایت اومده یسری سوال چالشی و مصاحبه‌ای از Css و Js رو به صورت سطح‌بندی‌شده و همراه با جواب تشریحی گذاشته که اگه در حال یادگیری هستین خیلی می‌تونه واسه درک بهتر کمک‌تون کنه: 🔗 https://30secondsofinterviews.org/ @Mern_stack_01

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

{ "editor.codeActionsOnSave": { "source.organizeImports": "explicit" } }

مثلا:

// Before save import z from "./z"; import React from "react"; import a from "./a"; // After save import React from "react"; import a from "./a"; import z from "./z";

@Mern_stack_01