Ditty | دیتی – Telegram
Ditty | دیتی
3.19K subscribers
194 photos
20 videos
4 files
387 links
دیتی | دنیای ساده‌شدهٔ برنامه‌نویسی وب
https://ditty.ir
Download Telegram
🔺با ۵۰۰ خط کد قبلاً یک برنامه To-do می‌ساختیم. ولی این آقا یک الگوریتم پارک خودکار ماشین ساخته 😁
https://trekhleb.dev/self-parking-car-evolution

پ.ن: این آقا یک ریپازیتوری معروف جاوااسکریپت داره به اسم JavaScript Algorithms and Data Structures با 122K استار!
#javanoscript
🔺ببینین CSS نویس‌های سراسر دنیا چه نظری درباره این زبان دارن:
https://2020.stateofcss.com

- این نتیجه نظرسنجی سال ۲۰۲۰ هست. برای شرکت توی نظرسنجی امسال اینجا رو ببینین.
#css
🔺چند بازی فوق‌العاده که با #جاوااسکریپت و HTML نوشته شدن:

https://github.blog/2021-10-05-13-tiny-and-terrific-entries-from-the-js13kgames-competition

- جدا از خود بازی‌ها، توی این لینک سورس کد هر بازی هم قرار گرفته که فرصت خوبیه برای آشنا شدن با کدهای مختلف و انواع تکنیک‌های کدنویسیِ کم‌حجم و البته با عملکرد بالا

ـ js13kGames یک مسابقه ساخت بازی با جاوااسکریپت و HTML هست که از سال 2012 داره برگزار میشه و مهمترین قانونش اینه که هر بازی حداکثر باید ۱۳ کیلوبایت باشه
#javanoscript #links
Ditty | دیتی
🔺الگوی طراحی Decorator به زبان #ساده - از این الگو زمانی استفاده می‌کنیم که می‌خوایم به آبجکت‌ها ویژگی اضافه کنیم یا رفتار اونها رو تغییر بدیم - در واقع با این الگو می‌تونیم به آبجکت‌های موجود، در زمان اجرای کد (Run-time) ویژگی اضافه کنیم. بدون اینکه مجبور…
🔺الگوی طراحی Facade به زبان #ساده

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

- از لینک زیر با Facade که یکی از راحت‌ترین الگوهاست آشنا بشین:
https://ditty.ir/461

#oop 💯
🔺کلی One Liner (کدهای تک‌خطی کاربردی) برای #جاوااسکریپت:
https://1loc.dev

#links #javanoscript 🔥
🔺این چند تا نکته باحال حتماً به کارتون میاد وقتی دارین توی گوگل سرچ می‌کنین:

14 Tips to Google like a Pro ⚡️🔎

#links
🔺یک ویژگی قراره به جاوااسکریپت مرورگرها اضافه بشه به اسم Sanitizer API که همونطور که از اسمش مشخصه، برای پاک‌سازی و تمیز کردن رشته‌های آلوده و مخرب هنگام کار با DOM استفاده میشه:


// Unsanitized string of HTML
const input = "abc <noscript>alert(1)</noscript> def";

const el = document.getElementById("target");
👉 el.setHTML(input, new Sanitizer());

alert(target.innerHTML); // "abc def"


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

نکته: این ویژگی توی مرحله Experimental هست و هنوز هیچ مرورگری اون رو ساپورت نکرده ¯/_(ツ)_\¯

https://developer.mozilla.org/en-US/docs/Web/API/HTML_Sanitizer_API
🔺دوستان لاراولی! برای بالا بردن سرعت برنامه حتماً از دستورات آرتیزان زیر استفاده کنین:

php artisan config:cache
php artisan route:cache
php artisan view:cache

واقعاً سرعت برنامه چندین برابر بالا میره!
همچنین تا جایی که می‌تونین کوئری‌ها رو Cache کنین. اینها راه حل‌های رایگان ولی واقعاً موثری هستن.
چند روز پیش وقتی می‌خواستم دیتی رو انتقال بدم، هاست‌های چندین شرکت رو تست کردم. با اینکه همگی ادعا داشتن که هارد NVMe و سرور لایت‌اسپید دارن، سرعت‌ها خیلی تفاوت داشت. بالاخره یک هاستینگ خوب پیدا کردم که واقعاً سرعتش فوق‌العادس! همه Response ها زیر ۲۰۰ میلی‌ثانیه (۰.۲ ثانیه) میاد. در صورتی که روی هاست‌های قبلی همون Response ها ۵ برابر دیرتر میومدن!

این پست رو هم ببینین:
https://ashallendesign.co.uk/blog/6-quick-and-easy-ways-to-speed-up-your-laravel-website
🔺مایکروسافت برای VS Code نسخه وب (مرورگر) هم راه‌اندازی کرد:
https://vscode.dev

- البته بعضی از ویژگی‌های نسخه دسکتاپ مثل پشتیبانی از بعضی پلاگین‌ها رو نداره

#links
👍1
Ditty | دیتی
🔺نوبتی هم باشه نوبت ری‌اکته! - یک لیست از کلی ابزار و پلاگین و فریم‌ورک و ... برای #ری‌اکت: https://github.com/enaqx/awesome-react #react #links
🔺 ‌دوستان اگه برای زبان یا فریم‌ورک مورد علاقه‌تون چنین لیستی می‌خواین، توی گوگل بزنین [اسم زبان] Awesome چنین لیست‌هایی میاره. مثلاً:
Awesome PHP
Awesome Laravel

هر چند این اَبَر لیست رو ببینین که یک لیست از همه لیست‌هاست:
https://github.com/sindresorhus/awesome

#links
🔺بنیان جاوااسکریپت رو از دیتی یاد بگیرین:
ditty.ir/series/javanoscript-101

- بیشترین چیزها از جاوااسکریپت رو توی کمترین زمان یاد می‌گیریم
- با کلی مثال مهمترین موضوع‌های جاوااسکریپت رو بررسی می‌کنیم
- ثابت می‌کنم که جاوااسکریپت #راحت و قابل فهمه :))

- ۴۱ قسمت متنی + ویدئویی
- نسخه ویدئویی در مجموع ۵ ساعت هست
- هر ویدئو مدت زمانی حدود ۱۰ دقیقه یا کمتر داره

- نسخه متنی کاملاً رایگانه. هدیه من به همراهان دیتی 💝
- با خرید ویدئوها، از ادامه فعالیت‌های دیتی هم #حمایت می‌کنین 😊
- ۳۰٪ #تخفیف برای ویدئوها با کد JS-30 (برای ۱۰۰ نفر اول)

» سرفصل‌ها رو از اینجا ببینین

#javanoscript
🔺آیا برای یک مسئله جاوااسکریپتی چند راه حل دارین و می‌خواین ببینین کدوم سریع‌تره؟ این وبسایت رو ببینین:
https://hasty.dev

- با این وبسایت می‌تونین سرعت راه حل‌های خودتون رو بررسی کنین 👌

#javanoscript #links
🔺پرامیس (Promise) های جاوااسکریپت به زبان #ساده

- یکی از مهمترین ویژگی‌هایی که از ES6 به جاوااسکریپت اضافه شد، پرامیس‌ها بودن که برای مدیریت کردن عملیات ناهمگام استفاده میشن

- توی این پست، هم به صورت متنی و هم به صورت ویدئویی می‌خوایم با این ویژگی آشنا بشیم:
ditty.ir/courses/es6/promises/XGQw5



- این پست قبلاً نوشته شده بود و به تازگی بازنویسی شده 😉

#javanoscript
🔺پراکسی‌ها توی #جاوااسکریپت چه کاربردی دارن؟ 🤔

- با پراکسی‌ها می‌تونیم تقریباً همه اتفاق‌هایی که برای یک آبجکت رخ میده رو مدیریت و کنترل کنیم

- مثلاً می‌تونیم خوندن، ویرایش و یا حذف یک پراپرتی یا متد رو کنترل کنیم تا جوری که دلمون میخواد این اتفاق‌ها رخ بدن!

- توی این پست، هم به صورت متنی و هم #ویدئویی مفصل با پراکسی‌های جاوااسکریپت آشنا میشیم:
ditty.ir/456




- این پست قبلاً نوشته شده بود و به تازگی بازنویسی شده 😉

#javanoscript
🔺کد تمیز، خوانا و البته مدرن با Destructuring #جاوااسکریپت

ــ Destructuring بهمون کمک می‌کنه تا از نوشتن کدهای اضافی و تکراری جلوگیری کنیم

- در واقع Destructuring برای آرایه‌ها و آبجکت‌ها به کار میره که با اون می‌تونیم به شکل خواناتر به اعضای یک آرایه یا آبجکت دسترسی داشته باشیم

- توی این پست (متن و ویدئویی) مفصل درباره این ویژگی آشنا بشیم:
ditty.ir/459

#javanoscript
React Interview Book.pdf
8.5 MB
🔺بیشتر از 300 سوال مصاحبه ری‌اکت (PDF) 👌😎

#react
👍2🔥2🤩1
🔺تولد داریم، چه تولدی! جاوااسکریپتمون امروز ۲۶ ساله شد 😆🎉

- توی یک جمله جاوااسکریپت رو وصف کنین (هرچند وصف ناپذیره)👇👇