#GN
@CleverDevs - @CleverDevsGp

آسیب پذیری های امنیتی جاوا اسکریپت🖇
#part1

1⃣ آسیب‌پذیری Cross-Site Scripting (XSS):
حمله‌ای که  مهاجم کد مخربو به یک وب‌سایت وارد میکنه و این کد در مرورگر کاربرا اجرا میشه.

راهای جلوگیری:
امن‌سازی داده‌های ورودی با تابع هایی مثل encodeURIComponent.
جلوگیری از نمایش مستقیم داده‌های کاربر در صفحات وب.


2⃣ آسیب‌پذیری Cross-Site Request Forgery (CSRF)
توضیح: حمله‌کننده با استفاده از کاربر و کوکی‌های مرورگر، عملیات ناخواسته‌ای رو اجرا میکنه و وقتی اتفاق میوفته که یک سایت بدون بررسی اعتبار درخواستای ارسالی از کاربرو اجرا کنه

راهای جلوگیری:
استفاده از توکن‌های CSRF در فرم‌ها و درخواست‌های حساس و تنظیم کوکی‌ها به گونه‌ای که فقط از طریق سرور قابل دسترس باشن (HttpOnly)


3⃣ حمله DDoS (Distributed Denial of Service)
توضیح: حمله‌ای که با ارسال تعداد زیادی درخواست به یک سرور، اونو از دسترس خارج میکنه.

راهای جلوگیری:
با محدود کردن تعداد درخواست‌های ورودی به سرور، از بار زیاد جلوگیری میشه.
از سرویس‌های مقابله با DDoS به طور تخصصی برای کاهش اثرات حملات DDoS طراحی شدن استفاده کنید
ظرفیت شبکه رو افزایش بدید و بار ترافیک رو بین چند سرویس توزیع کنین(load balancing)


4⃣ آسیب پذیری SQL injection:
حمله‌ای که  مهاجم دستورات مخربو از طریق ورودی کاربر به سرور ارسال میکنه و این دستورات در سرور اجرا میشن

راهای جلوگیری:
استفاده از parameterized queries
به کارگیری ORM (Object-Relational Mapping) برای تعامل با پایگاه داده‌ها.

@CleverDevs
@CleverDevsGp

این قضیه توی نصب فیلترشکن به خاطر برنامه نویس بودن هم صادقه

#fun
@CleverDevs - @CleverDevsGp

توی این پست میخوام یه دانلود منیجر خفن و کاربردی رو معرفی کنم که بچه های ایرانی نوشتن

پرسپولیس یک دانلود منیجر و رابط کاربری گرافیکی برای Aria2 میباشد که با پایتون نوشته شده

پرسپولیس یک دانلود منیجر کراس پلتفرمه که برای سیستم عامل های گنو/لینوکس ، ویندوز ، مکینتاش و بی اس دی ها توسعه یافته

یک سری از قابلیت های این دانلود منیجر هم ایناس

رابط کاربری گرافیکی برای Aria2
دانلود چند بخشی فایل
زمانبندی دانلودها
صف‌بندی دانلودها
پیدا و دانلود کردن ویدئو از DailyMotion، Vimeo، Youtube، Aparat و ...

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

اطلاعات بیشتر و نحوه نصب و استفاده :

https://persepolisdm.github.io/fa/

#tools #openSource
@CleverDevs - @CleverDevsGp

$$typeof property

توی React وقتی یه کامپوننت رو لاگ میگیریم، یه پراپرتی با این اسم میبینیم و هدفش جلوگیری از حملاتی مثل Cross-Site Scripting هست؛ حالا چطور انجام میشه؟

مقدار این پراپرتی یه Symbol هست، و یکی از Primitive تایپ‌های Js هست که نمیتونه به JSON تبدیل بشه، بخاطر همین اگه هکر بخواد یه کامپوننت فیک به سایتمون ارسال کنه ریکت متوجه این قضیه میشه.
#React #Js
@CleverDevs - @CleverDevsGp

درود🌹

بیاین امروز در مورد معماری Event-driven Architecture با یک مثال ساده صحبت کنیم.

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

اجزای اصلی این معماری عبارتند از:

فرستنده رویداد (Event Emitter): این بخش کارش اینه که رویدادها رو به بقیه بخش‌های برنامه اطلاع بده.
شنونده‌ها (Listeners): اینا فانکشن‌هایی هستن که وقتی یه رویداد خاص اتفاق می‌افته، اجرا می‌شن.
رویدادها (Events): رویدادها پیغام‌هایی هستن که نشون می‌دن یه تغییر یا اتفاق خاص رخ داده.

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

فرض کن یه برنامه داری که توش چند تا کاربر هستن. می‌خوای هر وقت یکی از کاربرا اطلاعاتش تغییر کرد یا کاربری اضافه شد، این تغییرات به بقیه بخش‌های برنامه اطلاع داده بشه. برای این کار از معماری مبتنی بر رویداد استفاده می‌کنیم.

اول یه کلاس می‌سازیم که کارش مدیریت رویدادهاست:

// این کلاس مسئولیت مدیریت رویدادها رو داره
class EventEmitter {
  constructor() {
    this.events = {}; // اینجا رویدادها و شنونده‌هاشون رو نگه می‌داریم
  }

  // این متد یه شنونده جدید برای یه رویداد خاص ثبت می‌کنه
  on(event, listener) {
    if (!this.events[event]) {
      this.events[event] = [];
    }
    this.events[event].push(listener);
  }

  // این متد همه شنونده‌های یه رویداد خاص رو اجرا می‌کنه
  emit(event, args) {
    if (this.events[event]) {
      this.events[event].forEach(listener => listener(args));
    }
  }
}

حالا یه کلاس می‌سازیم که کاربرها رو مدیریت کنه و وقتی کاربری اضافه یا تغییر کرد، رویدادهای مناسب رو صادر کنه:

// این کلاس مسئول مدیریت کاربران و رویدادهای مرتبط با اوناست
class UserManager extends EventEmitter {
  constructor() {
    super();
    this.users = []; // لیست کاربران رو اینجا نگه می‌داریم
  }

  // این متد یه کاربر جدید اضافه می‌کنه
  addUser(user) {
    this.users.push(user);
    this.emit('userAdded', user); // رویداد اضافه شدن کاربر رو صادر می‌کنیم
  }

  // این متد اطلاعات یه کاربر رو تغییر می‌ده
  updateUser(id, newUser) {
    const index = this.users.findIndex(user => user.id === id);
    if (index !== -1) {
      this.users[index] = { ...this.users[index], ...newUser };
      this.emit('userUpdated', this.users[index]); // رویداد به‌روزرسانی کاربر رو صادر می‌کنیم
    }
  }
}

حالا از UserManager استفاده می‌کنیم و شنونده‌های مختلفی برای رویدادها ثبت می‌کنیم:

const userManager = new UserManager();

// ثبت یه شنونده برای وقتی که یه کاربر جدید اضافه می‌شه
userManager.on('userAdded', (user) => {
  console.log(`کاربر جدید اضافه شد: ${user.name}`);
  // اینجا می‌تونیم کارهای دیگه‌ای هم انجام بدیم، مثل به‌روزرسانی رابط کاربری
});

// ثبت یه شنونده برای وقتی که اطلاعات یه کاربر تغییر می‌کنه
userManager.on('userUpdated', (user) => {
  console.log(`اطلاعات کاربر به‌روزرسانی شد: ${user.name}`);
  // اینجا می‌تونیم کارهای دیگه‌ای هم انجام بدیم، مثل به‌روزرسانی رابط کاربری
});

// اضافه کردن یه کاربر جدید
userManager.addUser({ id: 1, name: 'Ali', age: 30 });
// نتیجه: کاربر جدید اضافه شد: Ali

// تغییر اطلاعات یه کاربر
userManager.updateUser(1, { name: 'Hassan', age: 35 });
// نتیجه: اطلاعات کاربر به‌روزرسانی شد: Hassan

حالا فرض کن می‌خوای هر وقت کاربری اضافه شد یا تغییر کرد، علاوه بر چاپ توی کنسول، یه نوتیفیکیشن هم نشون بدی:

// ثبت شنونده برای نوتیفیکیشن‌ها
userManager.on('userAdded', (user) => {
  alert(`کاربر جدید اضافه شد: ${user.name}`);
});

userManager.on('userUpdated', (user) => {
  alert(`اطلاعات کاربر به‌روزرسانی شد: ${user.name}`);
});

از این معماری در drawio استفاده شده.
ری اکت و ویو و همچنین Apache Kafka از این معماری استفاده میکنه، اگر علاقه داشتین مثال های بیشتری باهاش میزنیم یا تو یک برنامه ای ازش استفاده میکنیم اصلا

موفق باشید❤️

#Event_driven_Architecture
@CleverDevs - @CleverDevsGp

اگه تلگرامتون اپدیت نیست کامنتارو ببینید

قابلیت دیگه ای که توی این اپدیت اومده
مینی مایز کردن وب اپ های تلگرامه که خیلی کاربردیه

یعنی وسط کار با وب اپ ها (مثل ناتکوین و ..) میتونید یه دیقه برید توی تلگرام بدون اینکه وب اپ رو کامل ببنید

#News #telegram
@CleverDevs - @CleverDevsGp

-اصل Bad Comments در کلین کد

این دسته که از کامنت ها که بیشتر کامنت هایی که میزاریم رو شامل میشه کامنت هایی ان که سود خاصی برامون ندارن و الکی کد رو شلوغ میکنن
این اصل چنتا زیر مجموعه داره و کامنت های بدی که میتونید بزارید رو گفته تو این پست سعی میکنم به طور خلاصه همشون رو بگم

‏1 - Mumbling
یعنی اینکه کامنتی بزاری که نامفهمومه و بیشتر از اینکه بدرد بخور باشه باعث سر در گمیه

‏2 - Redundant Comments
یعنی کامنت هایی که بدرد نخور و اضافن و خوندوشون از خوندن کد کد زمان بیشتری میبره

‏3 - Misleading Comments
یعنی یجور لقمه رو دور سر بپیچونی که کسی که کامنت رو میخونه کلا فکر و ذهنش منحرف بشه به یه سمت دیگه

‏4 - Mandated Comments
کامنت هایی که برای هر متغیری مینویسد و معمولا زیاد بدرد نمیخورن مثل javadocs

‏5 - Journal Comments
اینکه بیای و تغییرات پروژه رو هر بار تو کامنتا بزنی ، اینکار برا قبل اومدن سیستم های کنترل ورژن مثل گیت بود این نوع کامنتا الان بدرد نمیخورن

‏6 - Noise Comments
کامنت هایی که کار خاصی ندارن و فقط کد رو شلوغ کردن مثل

/** The day of the month. */

private int dayOfMonth;

‏7 - Commented-Out Code
کامنت کردن کد ها هم یکی از بدترین نوع کامنت هاست

‏8 - Too Much Information
یعنی اینکه تو کامنت اطلاعات زیادی بدی انقدر زیاد باشه خوندنش کلی وقت ببره

این فصل هم تموم شد و میتونید لیستش رو اینجا ببینید

#CleanCode
@CleverDevs - @CleverDevsGp

منطق متا :

#fun
@CleverDevs - @CleverDevsGp

تیم های حوزه های مختلف تشکیل شدن و داریم ایده های مختلف رو بررسی میکنیم تا پروژه هارو بالا بیاریم
اگه پایه بودید و هنوز جوین ندادید میتونید بیایید تو گروه زیر و توی تاپیک مربوطه ایدی گیت هابتون رو بدید تا اضافتون کنیم به تیم ها

https://news.1rj.ru/str/+mdJgJfZOBfU0ODlk

همچین جای طراح های ui ux توی جمعمون خالیه اگه تجربه ای تو این زمینه دارید خوشحال میشیم به تیم بپیوندید

@CleverDevs - @CleverDevsGp

مث اینکه تلگرام باگ خورده و نمیتونید پیوی کسی پیام بدید
دست به گیرنده ها نزنید مشکل همگانیه احتمالا

برا شماهم باگ خورده ؟
#News
@CleverDevs - @CleverDevsGp

این تیکه کد ساده که با Nodejs نوشتم پروکسی های که در آخرین پست یک کانال هست رو استخراج و داخل یک لیست برمیگردونه، میتونه بصورت یک ماژول در ربات هاتون نصب بشه برای دوستانی که چنل دارن و با ربات به چنلشون پست ارسال میکنن میتونه خیلی مفید باشه.

const { default: axios } = require("axios");
const cheerio = require("cheerio");

module.exports = {
    requests: async () => {
        try {
            // get html data
            var {data: requestTelegramChannle} = await axios('https://news.1rj.ru/str/s/NPROXY');

            // parse html data
            var $ = cheerio.load(requestTelegramChannle);

            // get proxys 
            var mainElement = $('body > main > div > section > div:last-child').html()
            var tempElement = $('<div>').html(mainElement);

            var proxyList = []
            tempElement.find('a[rel="noopener"]').each((i, el) => {
                if ($(el).attr('href').includes('https://news.1rj.ru/str/proxy?server=')) {
                    proxyList.push($(el).attr('href'))
                }
            });
            return proxyList
        } catch (error) {
            console.error(error+'');
        }
    }
}

خودم بهش نیاز داشتم زدمش گفتم شاید دوستانی هم باشن که بهش نیاز داشته باشن، میتونین آدرس چنل رو عوض کنید و چنل مد نظرتون رو بزارین داخلش.

شاید برای دوستان سوال باشه چرا از کلمه کلیدی var برای متغییر های استفاده شده، اگر قرار نیست پروژه هاتون رو با Babel یا ابزار مشابه کامپایل کنین هیچوقت از let و const استفاده نکنین Garbage Collector در js نمیتونه به خوبی مموری رو تمیز کنه و مشکلاتی اعم از کرش برنامه و ... پیش میاد.

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

@CleverDevs - @CleverDevsGp

سایت شخصی نامزد ریاست‌جمهوری رو مشاهده میکنید که یه بخشی طراحی کردن که استانی رو مشخص میکنید و شماره های فعال و درحال استفاده ای رو براتون نمایش میده تا برید زنگ بزنید و ازشون بخواید به دکتر(👍🏽) جلیلی رأی بدن.

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

هرروز اوپن سورس تر از دیروز

@CleverDevs - @CleverDevsGp

#GN
@CleverDevs - @CleverDevsGp

این باگ جدیده که توی openssh هم بود ماجرای جالبی داشته
اگه حوصلش رو دارید ویدیوی جادی در این باره رو ببینید

جزئیاتش یکم سخته ولی خب تا همونجایی هم که میشه فهمید باحال بود

https://youtu.be/EClct9i_7Wc

#openssh
@CleverDevs - @CleverDevsGp

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

@CleverDevs - @CleverDevsGp

CSS center 😁

#css #fun
@CleverDevs - @CleverDevsGp

سطح پاسخگویی شرکت های ایرانی :

source
@CleverDevs - @CleverDevsGp