تاحالا شده لازم باشه یک عکس کامل از صفحه سایتتون به کارفرما بدید و نمیدونستید چجوری باید این کارو بکنید ؟ 🧐

🧩 برای این کار میتونید از اکستنشن Go Full Page استفاده کنید تا بتونید یک عکس کامل از صفحه سایتتون بگیرید و در فرمت های pdf یا png خروجی بگیرید

این اکستنشن کاربردی رو میتونید از لینک زیر روی مرورگر کروم خودتون نصب کنید.🔥

Extension 🌕

#tools #extension
@CodeModule

✌️ یک کتاب جامع و خوب برای توسعه دهنده های JavaScript

📖کتاب Eloquent JavaScript یک کتاب خوب برای یادگیری مباحث پایه ای و کاربردی جاوااسکریپته که برای افرادی که میخوان دانش جاوااسکریپتیشونو تقویت کنن مناسبه.

#book #js
@CodeModule

Good Night 🌚✨

⌛️ زمان مناسب هيچوقت فرا نمیرسه!

☯️ شما هميشه خيلي جوون، خيلي پير، خيلي گرفتار، خيلي خسته هستین! اگر هميشه دنبال زمان مناسب بگرديد، هیچوقت به خواسته هاتون نمیرسيد!


@CodeModule

امنیت در Frontend 🔒

هر فرانت دولوپر باید یک سری اصول امنیتی و تو پروژه هاش رعایت کنه. دو مقاله زیر، نکاتی راجب امنیت ارائه دادن که پیشنهاد میکنم حتما مطالعه کنید.


🔵Medium

🔵securitytrails


#frontend #security
@CodeModule

یکم خلاقیت تو اسم گذاشتن به خرج بدید 😂


#fun
@CodeModule

با HTMX بیشتر آشنا بشید 🔥

در سال ۲۰۱۳ دولوپری به اسم Carson Gross یک کتابخانه فرانت-اند جدید به نام intercooler.js منتشر کرد که شعار اصلیش “Ajax With Attributes” بود. هدفش از این کار ساده‌ سازی فرایند توسعه اپلیکیشن‌های سمت کاربر بود. همین کتابخانه در طی گذر مدت کوتاهی به نسخه دوم خود ارتقا پیدا کرد و اسمش به HTMX تغییر داده شد.

در واقع HTMX تلاش داره تا با قدرتی که HTML بهش میده، از مدل‌های اصلی دنیای وب پیروی کنه و روش جدیدی برای توسعه اپلیکیشن در اختیار ما قرار بده. با استفاده از این تکنیک، دولوپر ها دیگه نیازی به نوشتن کدهای جاوا اسکریپتی نخواهند داشت و می‌تونن با نوشتن کدهای بسیار ساده‌تر، به همون نتایجی که می‌خوان دست پیدا کنن.


ویژگی های کلیدی HTMX ⬇️


🔵سادگی و آسانی

این HTMX از سینتکس HTML استاندارد استفاده می‌کنه و برای افزودن امکانات پویا به وب‌سایت‌ها نیازی به نوشتن کدهای جاوا اسکریپت پیچیده نداره.

🔵استفاده از AJAX بدون دردسر

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

🔵تعامل با سرور

سیستم HTMX امکان تعامل با سرور و فراهم می‌کنه و به سادگی امکان ارسال و دریافت داده‌ها از سمت سرور ، بدون نیاز به نوشتن کدهای زیادی و مهیا میکنه.

🔵سازگاری با فریمورک‌های جاوا اسکریپت

این HTMX با بسیاری از فریمورک‌های جاوا اسکریپت سازگاره، از جمله jQuery و Alpine.js.

🔵قابلیت گسترش و تنظیم

سیستم HTMX قابلیت گسترش و تنظیم بالایی داره، به‌طوری‌که دولوپر ها میتونن اونو با نیازهای خودشون تطبیق بدن.


به طور کلی، HTMX یک ابزار قدرتمند و ساده برای توسعه وبسایت‌های پویا و با کارایی بالا بدون استفاده جاوا اسکریپت هست. پیشنهاد میکنم یه سر به داکیومنتش بزنید⚡

Document 🌐

#htmx
@CodeModule

کارفرما: بزن برات رزومه میشه 🤡😂


#fun
@CodeModule

یه سایت همه فن حریف برای css 🔵

با استفاده از این سایت، میتونید استایل های مختلفی مثل gradient, boxShadow borderRadius ,transform, border و ... رو ایجاد، و تو پروژه هاتون استفاده کنید 😎


➡️Website◀️

#tools #css
@CodeModule

دائم دنبال api هستی و پیدا نمیکنی؟🤔

تو این پست ۲ api مارکت خاص بهتون معرفی میکنم که واسه هر چیزی ک فک کنید api دارن. از دیجی کالا و آشپزی و ... بگیر تا هوش مصنوعی !!

🔵https://apieco.ir/

🔵https://one-api.ir/


پیشنهاد میکنم حتما یه سر بزنید💀

#api
@CodeModule

🫒 با کتابخانه Rx.js بیشتر آشنا بشید

در اصل RxJS یک کتابخانه برای ترکیب برنامه‌های ناهمگام و مبتنی بر رویداد (events) با استفاده از دنباله‌های Observable هست. این کتابخانه یک نوع اصلی به نام Observable، core type  (Observer، Schedulers، Subjects) و اپراتورهای الهام گرفته از متدهای Array (map، filter، reduce، every و ...) رو فراهم میکنه تا بتونن تسک های asynchronous رو هندل کنن.


✅ویژگی‌های اصلی RxJS عبارتند از:

🟣ایجاد Observable ها برای داده‌ها

🟣انتقال، تبدیل و ترکیب داده‌ها با استفاده از عملیات‌های متداول مانند map، filter، reduce و ...

🟣مدیریت خطاها و مدیریت وقفه‌ها (error handling and retrying)

🟣پشتیبانی از ایجاد ایونت‌ها (events)

🟣دارای اپراتورهای مختلف جهت کنترل جریان داده‌ها

🟣امکان کنترل زمان اجرای عملیات‌ها با استفاده از تایم‌اوت

🟣پیاده‌سازی مفهوم Backpressure برای مدیریت فشار دریافت داده

‼️اگر پروژه هاتون پر از تسک های async هست استفاده از Rx.js گزینه خوبی می‌تونه باشه.


🏤 همچنین Rx.js به طور پیش‌فرض یا دیفالت با پروژه های انگولاری لود میشه.

برای یادگیری این کتابخانه میتونید به داکیومنتش مراجعه کنید 🔥


Document 🌕

#rxjs #library #js
@CodeModule

Good Night 🌚✨

اشک هایی که برای شکست میریزند
عرق هاییست ک برای موفقیت نریختند


@CodeModule

تایپ اسکریپت و مثل ماست یاد بگیر 🥶

این سایتی که بهتون معرفی میکنم کلی آموزش، چالش و نمونه سورس کد در زمینه تایپ اسکریپت داره و به راحتی، میتونید مهارتتون و تقویت کنید.

⚡️https://typehero.dev/


#typeScript
@CodeModule

💎 خاموش کردن کامپیوتر در ویندوز و لینوکس، فقط با نوشتن یک کامند ساده در ترمینال !

💻 ویندوز

 Shutdown /p

🪴 لینوکس :

sudo shutdown -P now

با استفاده از این کامندها میتونید درجا کامپیوتر و خاموش کنید و در وقت صرفه جویی کنید🔥


#command #windows #linux
@CodeModule

🧐انکدر (encoder) jpegli چیه ؟

اینترنت شیوه زندگی، کار و ارتباط ما رو تغییر داده. با این حال، زمانی که صفحات به کندی بارگذاری می شن، می تونه به منبع ناامیدی تبدیل بشه.

💙در قلب این موضوع رمزگذاری تصاویر نهفته شده. برای بهبود این موضوع، گوگل jpegli رو معرفی کرده، یک کتابخانه کدنویسی پیشرفته JPEG که سازگاری بالاییو حفظ می‌کنه و در عین حال قابلیت‌های پیشرفته‌تر و بهبود نسبت فشرده‌سازی 35 درصدی رو در تنظیمات فشرده‌سازی با کیفیت بالا ارائه می‌ده.

در واقع Jpegli یک کتابخانه کدنویسی جدید JPEG هست که طوری طراحی شده که سریعتر، کارآمدتر و از نظر بصری دلپذیرتر از JPEG سنتی باشه.🔥

چه مزایای بیشتری از jpeg داره ؟

◀️رمزگذار و رمزگشا

◀️نتایج با کیفیت بالا

◀️سریع

◀️متراکم تر

در کل Jpegli یک فناوری جدید و امیدوارکنندست که پتانسیل اینو داره که اینترنت رو سریعتر و زیباتر کنه.


#performance #encoder
@CodeModule

Good Night 🌚✨

رویاهاتون و به حقیقت تبدیل کنید، در غیر این صورت فرد دیگری برای ساختن رویای خودش از شما، استفاده خواهد کرد.


@CodeModule

مقایسه React Hook Form با Formik 💀

تو این پست قراره دو کتابخانه مهم ریکتی به نام Formik و React Hook Form(RHF)، که جهت مدیریت فرم ها استفاده میشن و بررسی کنیم.

🔵کارکرد و اصول عملکرد

کتابخانه Formik بر اساس مفهوم "formik bag" عمل می‌کنه که شامل استیت و منطق مربوط به فرم هست. این کتابخانه از مفهوم render-prop برای ارائه قابلیت‌های مدیریت فرم استفاده می‌کنه.

کتابخانه RHF بر پایه هوک‌ها (hooks) در React طراحی شده و به صورت اصلی بر روی استفاده از وضعیت React و روش‌های ارسال فرم متمرکز هست.

🔵حجم کد و پیچیدگی

کتابخانه Formik ممکنه نیاز به کد بیشتری داشته باشه، چون که پیشرفته‌ترین ویژگی‌ها و امکانات و فراهم می‌کنه که ممکنه برای برخی دولوپرها پیچیده به نظر برسه.

کتابخانه RHF معمولاً کد کمتری نیاز داره و کمترین تعداد مفهوم و پیچیدگی و در ارتباط با مدیریت فرم ارائه میده.

🔵امکانات

کتابخانه Formik ویژگی‌هایی مثل مدیریت اعتبارسنجی، مدیریت وضعیت فرم، ارسال فرم‌ها و پیگیری تغییرات داره.

کتابخانه RHF هم امکانات مشابهی و فراهم می‌کنه، اما از هوک‌ها برای این کار استفاده می‌کنه و روش های متفاوتی داره.

🔵پایداری و انعطاف‌پذیری

هر دو کتابخانه پایدار و پشتیبانی شده هستن. اما کتابخانه React Hook Form از حالت hooks استفاده می‌کنه که باعث افزایش انعطاف‌پذیری در کد شما میشه.


به طور کلی، اگر به دنبال یک راه سریع و سبک برای مدیریت فرم‌ها هستید، React Hook Form انتخاب بهتریه، اما اگه نیاز به قابلیت‌ها و کنترل بیشتری دارید، Formik مناسب‌تره. البته سلیقه و همچنین نیازهای خاص پروژه تو انتخاب شما تاثیر میذاره ⚡️


#formik #rhf
@CodeModule

نوتیفیکیشن های جذاب با کتابخانه React-hot-toast 😍


کتابخانه React-Hot-Toast برای نمایش اعلان‌ یا نوتیف در پروژه های ریکتی هست. اعلان‌های Toast پیام‌های کوتاه مدت هستن که روی صفحه ظاهر میشن تا به کاربران اطلاعات، فیدبک یا هشدار‌های مهم ارائه بدن.


‼️ویژگی‌های کتابخانه React-hot-toast:

🔵ظاهر قابل کاستومایز
🔵ایونت هندلر
🔵کنترل مدت زمان
🔵عملیات async
🔵واسط برنامه نویسی ساده

❓چرا به این کتابخانه نیاز داریم؟

🔢 انگیزش کاربر: اعلان‌ها به کاربران کمک میکنن تا با جلب توجه اونها به اقدامات یا محتوای خاص، اونارو ترغیب به انجام اقدامات خاصی مثل تکمیل ثبت نام یا کاوش تو ویژگی‌های جدید کنن.

🔢 بازخورد و رفع خطا: یک سیستم اعلان نقش مهمی تو ارائه فیدبک به کاربرا ایفا می‌کنه. این میتونه به کاربرا در مورد موفقیت یا شکست اقداماتشون اطلاع بده و اونها رو تو رفع خطاها یا تأیید عملیات موفق هدایت کنه.

🔢 پایش وظایف: اعلان‌ها به کاربران در پایش و نظارت بر وظایف، رویدادها یا به‌روزرسانی‌های مهم در برنامه کمک می‌کنن.

🔢 ارتباط: اعلان‌ها به عنوان یک وسیله حیاتی برای ارتباط بین برنامه و کاربرانش عمل می‌کنن.

🔢 بروزرسانی‌های زمان واقعی: اعلان‌ها با فراهم کردن به‌روزرسانی‌های زمان واقعی، به کاربرا فوراً درباره تغییرات یا محتوای جدید اطلاع میدن.


برای یادگیری این کتابخانه، می‌تونید به داکیومنتش مراجعه کنید. 🔥

Document 🌕

#library #react #react_hot_toast
@CodeModule

📚 پایتون و با این کتاب شروع کن!

⌨️ کتاب Head_First_Python، یک کتاب آموزشی در زمینه پایتون هست که به شما کانسپت های اصولی پایه رو، به صورت ساده و جذاب آموزش میده.

💡از دستش ندید


#book #python
@CodeModule

Good Night 🌚✨

موفقیت، مجموعه‌ای از تلاش‌های کوچکه که
هر روز و هر روز تکرار شده‌اند.


@CodeModule