دوستانی که تمایل به همکاری داشتن ، فایل‌های مقاله PWA روی گیت هاب آپدیت شد و میتونید روی هر فایلی که میخواید آپدیت ، حذف و اضافه انجام بدید و پول ریکوست بزنید.
https://github.com/alithecodeguy/pwa-article
پروژه دوم هم طراحی سایت صرافی بایننسه.
چندتا تا نکته :
۱- هر دوی این پروژه ها اپن سورس و پابلیکه.
۲- قرار نیست یه شبه انجام بشن. سر حوصله و بدون عجله انجام میدیم. اولی رو تموم میکنیم میریم سراغ دومی.
۳- هدف نهایی این پروژه‌ها شناختن افراد مستعد و پای کاره که برای پروژه‌های آینده یا معرفی به شرکت‌ها ، از پیش نفراتمون رو بشناسیم.
۴- مهمترین چیزم اینکه حال میده 🙂

آموزش پول ریکوست:
https://opensource.com/article/19/7/create-pull-request-github

دوستانی که توی ریکت تخصص دارن و سطحشون میدل به بالاتره و دنبال کار حضوری و تمام وقت توی یه شرکت معتبر در تهران هستن ، میتونن با آیدی زیر در ارتباط باشن :
https://news.1rj.ru/str/Ashkankeyhanian

دوره فشرده طراحی سایت با ReactJS در ۱ روز
(پروژه محور)
طراحی صفحات اصلی سایت
ترب با NextJs و Tailwind
..:: ۱۰ درصد تخفیف بیشتر با پرداخت رمزارز::..
@alithecodeguy #react

دوستان جلسه این هفته پر شد.
هفته آینده هم مشابه این هفته و با همین مبلغ ، دوره فشرده دیگه ای هست که صفحات اصلی سایت تراست ولت رو پیاده سازی میکنیم. (فقط فرانت)
پوسترش رو هفته اینده داخل کانال میذارم.

داکیومنت اصلی HTML5 :
https://html.spec.whatwg.org
دوستانی که میگن فرانت کاری نداره ، یه نگاهی بندازن. ۲۱۰۰ صفحه!
این تازه شاید یک صدم از کل کاریه که توی فرانت انجام میشه

دوره فشرده طراحی سایت با ReactJS در ۱ روز
۱۰ دی ماه- ۱۰ صبح تا ۱۰ شب
(پروژه محور)
..:: ۱۰ درصد تخفیف بیشتر با پرداخت رمزارز::..
@alithecodeguy #react

طرفیت این هفته تکمیل شد. انشالله هفته های آتی در خدمت دوستان خواهیم بود.

برای دوره فشرده و پروژه محور جمعه ۲۴ دی ماه ، چه سایتی رو طراحی کنیم؟ ممنون میشم همه دوستان نظرشون رو کامنت کنن.
(تعداد سایتا زیاده نمیشد به حالت نظرسنجی پرسید)

تغییرات React Router در ورژن 6 نسبت به ورژن قبل:
✅در ورژن 6 <Switch> حذف شده و به جای آن <Routes> جایگزین شده
✅در <Route> یک property به نام element اضافه شده است.
✅در ورژن 6، propertyهای activeStyle, activeClassName از <NavLink> حذف شده اند و در عوض className و style جایگزین شده اند که برای عملکرد بهتر یک فانکشن دریافت میکنند.
✅در ورژن 6، <Redirect> جایگزین <Navigate> شده است.
❗️در این لیست فقط تعداد محدودی از تغییرات ایجاد شده را معرفی کردیم. بنابراین پیشنهاد میکنم برای اطلاع از تغییرات دیگر ویدئو را مشاهده کنید.
#react_router
@alithecodeguy

ساخت رزومه با conva
این سایت کلی تمپلیت آماده و کاربردی در اختیار کاربر قرار میده که بتونید یه رزومه مناسب و تمیز برای ورود به بازار کار تهیه کنید. حتی نسخه free هم در اختیار کاربر قرار داده. میتونید هم با ساخت اکانت و هم بدون ساخت اکانت از امکاناتش استفاده کنید.
حتی نه تنها برای ساخت رزومه بلکه برای ساخت لوگو، پوستر، انواع پست‌ها و ... میتونید ازش استفاده کنید.
https://www.canva.com/
@alithecodeguy

🔷چرا اول فایل HTML باید از دستور <DOCTYPE html!> استفاده کنیم؟
دستور <DOCTYPE!> تگ نیست بلکه، یک دستورالعمل برای مشخص کردن نسخه یک فایل HTML است. همانطور که میدانید W3C نسخه های مختلفی از زبان HTML را ارائه داده است که هر کدام در مقایسه با هم تفاوت هایی را دارند، به این دلیل ممکن است مرورگر در تشخیص صحیح نسخه HTML استفاده شده دچار اشتباه شود و تنظیمات پیش فرض خود را اعمال کند. برای حل این مساله W3C استانداردی تعریف کرد که تمام سازندگان مرورگرها و دولوپرها از آن استاداردها طبعیت کنند بنابراین دولوپرها با اضافه کردن <DOCTYPE html!> در خط اول کدهای HTML خود به مرورگر میفهماندند که از کدام نسخه استفاده کند. البته لازم به ذکر است که این دستور برای صفحات وب که با HTML5 پیاده سازی شده اند قابل درک است و برای صفحات وب HTML4.0.1 باید از دستور دیگری استفاده کرد. برای آشنایی با جزییات بیشتر سایتهای زیر پیشنهاد میشود.
✅https://www.w3schools.com/tags/tag_doctype.asp
✅https://www.freecodecamp.org/news/what-is-the-doctype-declaration-in-html/

@alithecodeguy

🔹 دستور important در css چه زمانهایی استفاده میشود؟
با استفاده از دستور important در CSS میتوانیم تعریف کنیم که اولویت اجرای یک دستور در CSS به بالاترین اولویت تبدیل شود و اولویت اجرای بقیه دستورات را لغو کند.
✅معایب استفاده از این دستور :
پایین اومدن قدرت اشکال یابی
پایین اومدن خوانایی کد
بستن دست خودتون در آینده برای ایجاد تغییرات
✅مزیت استفاده از این دستور :
با وجود داشتن یک فایل CSS خارجی میتوانید با این دستور اولویت کدهای خود را بالاتر ببرید

@alithecodeguy

🔹تگهای معنایی(semantic tags) چه هستند و چرا ایجاد شدند؟
قبل از ارائه ی HTML5 برای مشخص کردن قسمت های مختلف صفحه از دستوراتی مانند <div id="navbar"> یا <div class="header"> استفاده میشد.
اما با ایجاد تگهای معنایی برای مرورگر مشخص شد که هر محتوایی که در این تگ ها وجود دارد از چه نوعی هستند و چه نقشی در صفحه وب دارند. درواقع این تگها اطلاعات اضافی به محتوای سایت اضافه میکنند که به موتورهای جستجوی گوگل امکان تشخیص نوع محتوا و نیز درجه اهمیت و اولویت محتواهای صفحات وب را می دهند و نقش بسزایی در بحث سئوی صفحات وب ایفا میکنند و همچنین خوانایی کد را بالا میبرد.
@alithecodeguy

ابزار Svelte رو دریابید. رقیب قدرتمندیه برای React و تا حدودی که من کار کردم نظرم رو جلب کرده. تمرکزش روی performance صفحاته و کدرنی باهاشم هرچند که مقداری متفاوته ولی چیزی نیست که اذیت کنه و در واقع از ریکت آسون تره.
چرا گفتم ابزار؟ چون بیشتر از اینکه فریم ورک باشه ، کامپایلر محسوب میشه.
در آینده مطالب بیشتری در موردش میذارم
@alithecodeguy #svelte #js

🔹تفاوت کتابخانه(library) و فریم ورک(framework)
تفاوت فریم ورک و کتابخانه، در نحوه‌ی کنترل کدهاست.
✅کتابخانه، مجموعه‌ای از کلاس‌ها و متد‌هاست که آنها را فراخوانی می‌کنیم و برای ساده تر شدن کد نویسی از اونا استفاده میکنیم. درواقع کنترل جریان کد دست خودمان است، این ما هستیم که تعیین میکنیم کی و کجا از چه لایبرری استفاده کنیم.
✅فریم ورک، فریم‌ورک مجموعه‌ی کاملی از لایبرری‌هاست.درواقع کنترل جریان برنامه دست آن فریم‌ورک هست و چارچوب و اسکلت کد ما توسط اون فریم‌ورک تعیین میشود. فریم‌ورک بستری را فراهم میکند تا بتونیم کد‌ها را نوشته و این فریم‌ورک هست که تصمیم میگیرد کی و کجا از کد‌های ما استفاده نماید. به طور کلی فریم ورک را فراخوانی نمی‌کند، بلکه فریم ورک، کدهای اضافه شده توسط کاربر را فراخوانی می‌کند.
@alithecodeguy

ممکن است بارها با عبارت falsy expressions روبرو شده باشید اما این عبارت چیست؟ در جاوا اسکریپت، عبارات Truthy به مقدار درست بولی و عبارات Falsy به مقدار غلط بولی ارزیابی می شوند.
در مجموع 6 عبارت falsy در جاوااسکریپت وجود دارد که عبارت اند از:
false
+0/-0
“ ”/’ ’/
null
undefind
NaN
@alithecodeguy

چگونه در جاوا اسکریپت فانکشن‌هایی با نام و حتی بدنه متغیر داشته باشیم؟
با استفاده از فانکشنی مشابه این عکس.
چرا ممکنه نیاز داشته باشیم از همچین چیزی استفاده کنیم؟ چون گاهی اوقات اسم و حتی بدنه فانکشنی که قراره اجرا بشه رو از قبل نمیدونیم و توی ران تایم ایجاد میشه یا از روی api خونده میشه.

این لینک هم میتونه کمکتون کنه :
https://stackoverflow.com/questions/5905492/dynamic-function-name-in-javanoscript/40918734#40918734

#js #javanoscript #dynamic #alithecodeguy @alithecodeguy