Ditty | دیتی – Telegram
Ditty | دیتی
3.19K subscribers
194 photos
20 videos
4 files
387 links
دیتی | دنیای ساده‌شدهٔ برنامه‌نویسی وب
https://ditty.ir
Download Telegram
🔺به جاوااسکریپت یک متد جدید اضافه شده به اسم hasOwn که کارایی اون خیلی شبیه به hasOwnProperty هست و به زودی قراره به عنوان جایگزین این متد معرفی بشه

- این متد از آبجکتِ Object در دسترس هست و بررسی می‌کنه که آیا یک پراپرتی توی یک آبجکت وجود داره یا نه

- توی این پست به صورت اختصاصی با این متد و تفاوت‌های اون با hasOwnProperty آشنا بشین:
ditty.ir/503 💯

#javanoscript
🔥21👍6👏2
🔺توی کروم DevTools یک تب داریم به اسم Changes که توی اون می‌تونین تغییرات موقتی که به استایل‌ها و جاوااسکریپت دادین رو رصد کنین

- برای مشاهده تب Changes توی DevTools مثل عکس سوم عمل کنین

- اطلاعات بیشتر

#tips
26👍18🔥4👏2
🔺دستور git open ؟ 🤔

- اگه زیاد با گیت کار می‌کنین، یک پلاگین کاربردی وجود داره به اسم git-open که با وارد کردن دستور git open توی خط فرمان، ریپازیتوری و برنچ فعلی رو توی مرورگر برامون باز می‌کنه 💯

- این پلاگین رو به سادگی با دستور زیر می‌تونین نصب کنین:
npm install --global git-open

- جزییات بیشتر رو از گیت‌هاب این پلاگین ببینین:
https://github.com/paulirish/git-open

#tips
👍32🔥5👎2
🔺چیزهایی که من هنوز نمی‌دونم

- یک مقاله جالب و معروف وجود داره از Dan Abramov (یکی از توسعه‌دهنده‌های معروف و اصلی تیم ری‌اکت) که توی اون به تکنولوژی‌ها و ابزارهایی که هنوز نمی‌دونه اشاره کرده. مثلاً Node.js و SCSS و حتی بعضی از الگوریتم‌های معروف

- پس چه چیزی باعث شهرت و اعتبار Dan Abramov شده؟ ارزشی که خلق کرده. استفاده بهینه از چیزهایی که می‌دونه! چه چیزی باعث موفقیت مارک زاکربرگ شد؟ ارزشی که خلق کرد، نه این اسپاگتی سورس کد فیسبوک :))

- برای اینکه یک توسعه‌دهنده موفق باشیم، جای هیچ بحثی نیست که باید خودمون رو توی این دنیای همیشه در حال پیشرفت و تغییر بروز نگه داریم. اما یکی از تله‌هایی که معمولاً افراد تازه‌کار بیشتر به اون دچار میشن، تلاش افراطی برای یادگیری تقریباً همه چیز هست

- سعی کنیم تعادل ایجاد کنیم. بین یادگیری و عمل. زمان و توانایی ما محدوده و نمی‌تونیم همه چیز یاد بگیریم و همه کار انجام بدیم. پس بهتره که سعی کنیم Stack و حوزهٔ خودمون رو مشخص کنیم و تلاش کنیم توی اونها متخصص بشیم. دنیای مدرن نرم‌افزار به دنبال متخصص هست، نه همه فن حریف

👈 شما چه چیزهایی نمی‌دونین؟ کامنت بذارین.
#tips
👍58👏84🔥4🤬1
🔺چطوری ببینیم یک وبسایت از کدوم پکیج‌های npm استفاده می‌کنه؟

- وبسایت مد نظرتون رو توی Bundle Scanner اسکن کنین:
https://bundlescanner.com

#links
👍32👏14🔥52👎2
🔺"خب به آخر مصاحبه رسیدیم. آیا سوالی هست که دوست داری بپرسی؟"

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

- برای پاسخ به چنین سوالی صفحه زیر رو ببینین که اختصاصی برای توسعه‌دهنده‌ها نوشته شده:
https://github.com/Twipped/InterviewThis

#links
🔥23👍6👏3
🔺وقتی درباره بهینگی و کاربر پسند بودن یک برنامه وب صحبت می‌کنیم، سرعت تعامل با اون برنامه همیشه یکی از فاکتورهای مهم و حیاتی به حساب میاد

- خوشبختانه راه‌هایی مختلفی برای افزایش سرعت و بهینگی یک برنامه وب وجود داره که توی این قسمت می‌خوایم با ۴ تا از اونها آشنا بشیم:
• Preload
• Prefetch
• Preconnect
• Prerender

- از لینک زیر با این قابلیت‌ها آشنا می‌شیم که کمک می‌کنن یک برنامهٔ سریع‌تر و کاربرپسند تر داشته باشیم:
ditty.ir/491

#optimization
22🔥6👏6👍4
🔺یک نمونه واقعی از قانون ۸۰/۲۰ توی صنعت نرم‌افزار

- توی سال ۲۰۰۲ مایکروسافت اعلام کرد که با برطرف کردن ۲۰٪ از باگ‌هایی که بیشتر از همه گزارش شدن، می‌تونستن ۸۰٪ مشکلات و باگ‌های مربوط به ویندوز و آفیس رو برطرف کنن

- بطور کلی این قانون میگه معمولاً چشمگیرترین (تقریباً ۸۰٪) خروجی‌ها، از ۲۰٪ تلاش‌ها ناشی میش. توی دنیای نرم‌افزار هم معمولاً چنین نتیجه‌گیری‌هایی وجود داره:

• ۸۰٪ یک نرم افزار با صرف ۲۰٪ زمان نوشته میشه. همچنین ۲۰٪ از سخت‌ترین قسمت‌های یک برنامه می‌تونه ۸۰٪ زمان رو به خودش اختصاص بده
• ۸۰٪ پیشرفت توسعهٔ یک برنامه مربوط به ۲۰٪ تلاش هست
• ۸۰٪ درآمد یک برنامه مربوط به ۲۰٪ از فیچرهای اون برنامه هست
• ۸۰٪ از خرابی‌ها (یا Crash های) یک برنامه مربوط به ۲۰٪ باگ‌ها هست
• ۸۰٪ استفاده از یک برنامه مربوط به ۲۰٪ از فیچرهای اون برنامه هست

- نظرتون درباره این اصل چیه؟ آیا این اصل برای شما قابل لمس بوده تا الان؟ 👇

منبع ۱ - منبع ۲
#tips
👍29🤔9👏4
🔺نمودار محبوبیت زبان‌های برنامه‌نویسی توی گیت‌هاب

- این آمار جالب مسیر رشد یک زبان رو نشون میده و مشخص می‌کنه چه زبان‌هایی توی این چند سال بیشتر از همه مورد توجه بوده: 👇
https://madnight.github.io/githut

#links
👍16
🔺ـType Assertion تایپ‌اسکریپت چیه؟ 🤔

- بعضی وقت‌ها ما توسعه‌دهنده‌ها نسبت به کامپایلر تایپ‌اسکریپت اطلاع بیشتری از نوع یک مقدار داریم. مثلاً توی document.getElementById چیزی که تایپ‌اسکریپت درباره خروجی این متد می‌دونه اینه که نوعی از HTMLElement هست

- اما ما می‌دونیم که getElementById که فلان جای برنامه استفاده کردیم، مقداری از نوع HTMLCanvasElement هست. پس باید روشی باشه که به تایپ‌اسکریپت بگیم که خروجی اون متد، نوعی از تایپ مد نظر ما هست

- برای این کار از Type Assertion استفاده می‌کنیم که کمک می‌کنه با استفاده از کلمه‌کلیدی as که بعد از مقدار مد نظرمون قرار می‌گیره، تایپ مد نظرمون رو مشخص کنیم

- باید دقت کنیم که تایپ مد نظر ما باید یک زیر-تایپ از تایپ انتخابی کامپایلر باشه. مثلاً نمی‌تونیم برای یک رشته از تایپ number استفاده کنیم که در این صورت خطا می‌گیریم
#typenoscript
👍23👏3🔥2
🔺 تایپ‌اسکریپت توی دنیای امروز برای یک توسعه‌دهنده فرانت‌اند ، یک «باید» هست
Anonymous Poll
78%
قبول دارم
22%
مخالفم
👍8
🔺کدنویسی تمیز با حذف Flag Argument

ــ Flag Argument به آرگومانی گفته میشه که معمولاً به صورت Boolean به یک تابع پاس داده میشه و حضور و عدم حضور اون باعث میشه که تابع رفتارهای متفاوتی نشون بده که در نتیجه اصل اول SOLID که میگه یک تابع فقط و فقط باید یک کار انجام بده نقض میشه

- توی عکس، اولین تابع یک Flag Argument گرفته به اسم silentMode که باعث میشه تابع ۲ تا کار انجام بده

- آقای رابرت سی‌مارتین میگه این کار یک کدنویسی تمیز به حساب نمیاد و بهتره تابع رو تبدیل کنیم به چند تابع که هر کدوم مسئول یک رفتار مشخص و قابل پیش‌بینی باشن
#tips
👍64🔥4🤔2🙏2
🔺 این دوست عزیزمون کتاب نکات ری‌اکتی داره که برای ایرانی‌ها رایگان کرده:

People from Iran have no access to any international payment tool therfore I will give it for free to everyone from Iran.’

https://www.linkedin.com/posts/adrian-%F0%9F%9F%A2-b-b52348181_people-from-iran-who-want-to-get-my-ebook-activity-6980276118041845760-F56Q
🕊31👍15👌5👎2👏1🤔1
فاندیشن SheCodes آموزش‌های خودش رو برای 10,000 خانم ایرانی رایگان کرد‌ ❤️👏

https://www.shecodesfoundation.org/iran
👍42👎4👏32
🔺درود دوستان. ۲ مقاله تایپ‌اسکریپتی منتشر کردم. امیدوارم بدردتون بخوره:

تفاوت Type و Interface توی تایپ‌اسکریپت
تایپ‌های any و unknown توی تایپ‌اسکریپت چه فرقی دارن؟


پ.ن: ممنون که توی این مدت توی کانال بودین و حمایت کردین. اگه فعالیتی نبود، به احترام غمی بود که به همه‌مون وارد شد. اگه هم فعالیتی باشه، دلیلی جز احترام به حضور و درخواست شما عزیزان نیست ❤️

- قصد دارم به زودی (نه خیلی زود :)) ) مجموعه مقالات فنی و غیرفنی رو آماده کنم که بهتون کمک می‌کنه بتونین شغل بهتری پیدا کنین یا توی شغلتون به عنوان یک Frontend Developer پیشرفت کنین. ممنون اگه به هر نحوی از کانال و مطالب حمایت کنین
#typenoscript
81👍20🎉3👎2😢2👏1🙏1
This media is not supported in your browser
VIEW IN TELEGRAM
🔺یه ابزار باحال برای نمایش console.log های برنامه

- با Console Ninja که یک اکستنشن VS Code هست می‌تونیم console.log های برنامه رو توی همون VS Code و به صورت لحظه‌ای ببینیم (ویدئو رو نگاه کنین)

- نصب و جزییات بیشتر:
https://marketplace.visualstudio.com/items?itemName=WallabyJs.console-ninja

#links
👍50🔥9👎2🤩2
🔺از sendBeacon جاوااسکریپت چی می‌دونیم؟

- اگه توی یک صفحه وب، قصد داریم اطلاعات کوچیک که بیشتر جنبهٔ آماری دارن رو به سرور ارسال کنیم، بهتره sendBeacon رو به Ajax ترجیح بدیم. چون توی بعضی شرایط Ajax محدودیت‌هایی داره و قابل اطمینان نیست

- متد sendBeacon که یک Web API هست، شباهت‌هایی به ای‌جکس داره و اطلاعات رو بصورت Async به سرور می‌فرسته. اما ویژگی‌ها و کاربرد منحصر به فردی داره که توی پست زیر می‌تونید با اون آشنا بشید:
ditty.ir/506

#javanoscript
👎179👍408💔1