جاوااسکریپت | JavaScript
511 subscribers
654 photos
140 videos
3 files
512 links
کانال @IR_javascript حاوی اطلاعات مفید در حوزه برنامه نویس فرانت که بصورت روزانه بروز می‌شود.
در این کانال شما به:
[1] مطالب تازه
[2] تحلیل‌های عمیق
[3] نکات آموزشی
[4] چالش
[5] ابزار و راهنمایی‌های کاربردی
دسترسی خواهید داشت.

🆔@IR_javascript
Download Telegram
در خروجی چه خواهد بود
Anonymous Quiz
18%
error
8%
undefined
14%
string
33%
array
26%
object
color-mix() in CSS

#️⃣#tip #css
🆔@IR_javascript
👍1
‏Prehooks - امکان اجرای اسکریپت ها را قبل از اجرای دستورات Git مانند commit یا push فراهم می کند. ‏هر زمان که یک مخزن Git را init می کنید، Git قلاب های نمونه را در دایرکتوری git/hooks. در دایرکتوری پروژه ایجاد می کند.
تو حالت خیلی ساده مثل کد زیر شما میتونید بررسی کنید که آیا برنچی که داره تغییراتش در اون ثبت میشه از نامگذاری درستی پیروی میکنه یا نه ؟
LC_ALL=C

local_branch="$(git rev-parse --abbrev-ref HEAD)"

valid_branch_regex="^(dev|master|(feature|deprecation|bugfix|improvement|library|prerelease|release|hotfix)\/[a-z0-9._-]+$)"

message="There is something wrong with your branch name."

if [[ ! $local_branch =~ $valid_branch_regex ]]
then
echo "$message"
exit 1
fi

exit 0


🔗https://virgool.io/@amirzenoozi72/using-githooks-to-manage-your-project-programmatically-fg6rqdjebux9
🔗https://dev.to/akdevcraft/git-pre-hook-setup-pre-push-hook-for-gradle-project-example-1nn6

#️⃣#tool
🆔@IR_javascript
1
‏box-shadow در مقابل drop-shadow

‏box-shadow به ما یک سایه مستطیل شکل می دهد حتی اگر عنصر پس زمینه نداشته باشد (مثلا png یا svg باشد)
ولی drop-shadow اگر تصویر زمینه نداشته باشد سایه از قسمت های مات عنصر ایجاد می کند.

🔗https://css-tricks.com/breaking-css-box-shadow-vs-drop-shadow/

#️⃣#tip #css
🆔@IR_javascript
👍4
Remult: fullstack CRUD framework

در این orm یکبار کلاس مدل خود را تعریف کرده و در فرانت و بک اند از آن استفاده می کنید
بطور خلاصه در یکجا و یکبار مدل خود را مطابق شکل بالا تعریف می کنید و در سمت فرانت دیگر نیازی به نوشتن ولیدیشن برای فرم ها ندارید (چون بر اساس تایپ خودش کنترل می کنه و هشدار ها رو می ده) و در سمت بک اند هم نیازی به نوشتن API ندارید (چون بر اساس مدلی که نوشتید خودش crud رو ایجاد می کنه و فقط در سمت فرانت کافیه یه چیزی مثل taskRepo.insert رو صدا بزنید )

🔗https://www.youtube.com/watch?v=rEoScmSVNUE
🔗https://github.com/remult/remult

#️⃣#npm_module
🆔@IR_javascript
translate global attribute

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

🔗https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/translate

#️⃣#tip #html
🆔@IR_javascript
🤔2👍1
منابع مفید برای یادگیری جاوا اسکریپت

Airbnb JavaScript Style Guide:
دارای یه سری راهنمایی ها و کانونشن ها برای نوشتن کد های جاوااسکریپت
🔗https://github.com/airbnb/javascript?tab=readme-ov-file

30secondsofcode:
مجموعه شامل طیف گسترده ای از توابع کمکی ES6 که راهنمایی هایی برای برخورد با داده های primitive، آرایه‌ها و اشیا، و همچنین الگوریتم‌ها، توابع دستکاری DOM و ابزارهای Node.js است.
🔗https://www.30secondsofcode.org/js/p/1/

javascript-algorithms:
این مخزن شامل نمونه های مبتنی بر جاوا اسکریپت از بسیاری از الگوریتم ها و ساختارهای داده محبوب است. هر الگوریتم و ساختار داده دارای README جداگانه خود با توضیحات و پیوندهای مرتبط برای خواندن بیشتر (از جمله به ویدیوهای YouTube) است.
🔗https://github.com/trekhleb/javascript-algorithms


#️⃣#learning
🆔@IR_javascript
طاعات و عباداتتون مقبول درگاه خداوند و عیدتون مبارک

#️⃣#event
🆔@IR_javascript
🎉9👎2😢1
Notification API

یک API مرورگر وب که به برنامه های کاربردی وب اجازه می دهد حتی زمانی که برنامه فعال نیست، اعلان ها را برای کاربر ارسال کنند.

در نظر گرفتن چه چیزی مهم است؟
✔️ کاربر باید اجازه دهد تا اعلان هایی برای وب سایت شما ارائه شود.
✔️ کاربر می تواند اعلان ها را غیرفعال کند یا نمایش آنها را در تنظیمات مرورگر محدود کند.
✔️ اعلان ها می توانند قابل کلیک باشند، به این معنی که کاربر می تواند با آنها تعامل داشته باشد. به عنوان مثال، به این صورت می توانیم به یک صفحه جدید برویم:
 notification.onclick = function() {
window.open('https://www.example.com', '_blank');
};

در نتیجه ابزاری مفید برای اطلاع رسانی به کاربران از رویدادهای مختلف، یادآوری ها و سایر پیام های مهم است.

🔗https://developer.mozilla.org/en-US/docs/Web/API/Notification

#️⃣#tip
🆔@IR_javascript
👍3🔥1