کافه برنامه نویسان | 𝗣𝗿𝗼𝗴𝗿𝗮𝗺𝗲𝗿s 𝗖𝗮𝗳𝗲 – Telegram
کافه برنامه نویسان | 𝗣𝗿𝗼𝗴𝗿𝗮𝗺𝗲𝗿s 𝗖𝗮𝗳𝗲
2.75K subscribers
1.08K photos
264 videos
30 files
1.13K links
👈 اینجا جایی است که یاد می‌گیریم و ایده‌هایمان را به واقعیت تبدیل می‌کنیم و در نهایت با هم رشد می‌کنیم

💬 Group : @IRdeveloperchat
تبادل / تبلیغات : @ProgramersCafeSup 🫴


♂️ مالک : @Ali_Rohany ♂️
Download Telegram
چگونه متن مون رو رمز گذاری کنیم با JavaScript

⚡️خب توی این پست می‌خوام که که بهتون بگم
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<noscript>Encryption Example</noscript>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="container">
<h1>Encryption Example</h1>
<textarea id="inputText" placeholder="Enter text to encrypt"></textarea>
<button onclick="encryptText()">Encrypt</button>
<p id="encryptedText"></p>
</div>

<noscript src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js"></noscript>
<noscript>
function encryptText() {
var key = CryptoJS.enc.Hex.parse('2b7e151628aed2a6abf7158809cf4f3c'); // تعریف کلید
var iv = CryptoJS.enc.Hex.parse('3ad77bb40d7a3660a89ecaf32466ef97'); // تعریف بردار اولیه

var plaintext = document.getElementById('inputText').value; // خواندن متن از ورودی

var ciphertext = CryptoJS.AES.encrypt(plaintext, key, { iv: iv }); // رمزگذاری متن

document.getElementById('encryptedText').textContent = "Encrypted Text: " + ciphertext.toString(); // نمایش متن رمزگذاری شده
}
</noscript>
</body>
</html>

ببنید اول یه textarea ساختیم که بیاد کاربر متنش رو بگه بعد یه باتن ساختیم با تابع encryptText.
بعد اومدیم فایل Cryptojs را با استفاده از لینک
https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js

استفاده کردیم.

کد های JavaScriptهم که کامنت گذاری کردم

⚡️و تمام⚡️
#javanoscript

Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
7
👾 ساخت آرایه در جاوا اسکریپت:

آرایه ها مجموعه ای از مقادیر هستند که مانند یک صف در یک متغیر قرار میگیرند و در آینده با صدا زدن آنها قابل دسترسی خواهند بود.

برای ساخت یک آرایه در جاوا اسکریپت از فرمول زیر استفاده می کنیم:
var name = [Value0 , Value1 , Value2 , Value3....];

فرمول بالا از ۴ قسمت تشکیل شده که در زیر هر کدام توضیح داده شده:

1️⃣ کلمه کلیدی var که اشاره به Variable دارد و در شروع مشخص می کند این مقدار قرار است ساخته شود.

2️⃣ قسمت دوم نام آرایه است که این نام به دلخواه قابل تغییر خواهد بود و در اینده برای اشاره به عناصر آرایه به کار می رود.

3️⃣ علامت = نشانگر مقداردهی در زبان های برنامه نویسی و زبان جاوا اسکریپت است.

4️⃣ در قسمت آخر مقادیر آرایه باید ذخیره شود. این مقدار ها به همه نوع داده ها قابل تنظیم است و محدودتی در آن وجود ندارد.

نکته: یک آرایه می تواند بی نهایت عنصر از جنس های مختلف داشته باشد.

به این چند مثال توجه کنید:

var Names = ["Alireza", "Mohammad", "Hamid"  ]

var Prices = [1500, 2240 , 300 , 0 , "Not Available"]


برای دریافت مقادر داخل آرایه ها باید اندیس یا ایندکس ( Index ) آن ها را دانست. ایندکس ها از صفر شروع می شوند و در مثال اول Alireza دارای ایندکس صفر و Mohammad دارای ایندکس ۱ است.
برای چاپ نام Hamid باید اینگونه عمل کرد:

alert( Names[2] )


این کد نام Hamid را در یک آلرت به کاربر نمایش می دهد.

#JavaScript

Channel • @Cafe_Of_Code

Group • @IRdeveloperchat
👨‍💻82
معکوس کردن یک رشته در پایتون🔥

ساده‌ترین روش برای معکوس کردن ترتیب کاراکترها در یک رشته متنی به صورت زیر است :

name = "George"
name[::-1]


#python #programming

Channel ° @Cafe_Of_Code

Group ° @IRdeveloperchat
7👨‍💻2
🔥خواستم یه رهنمایی کنم تازه کار ها رو اگه تازه کارید و نیاز به مشاوره دارید تا آخر بخونید.🔥

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

شما وقتی که مثلاً مشخص کردید که چی رو دوست دارید میری از همون اشخاصی میپرسی که یچیزی می‌دونن‌ که مثلاً چه کامپیوتری بخرم یا از کدام زبان شروع کنم و اینا
به حرف همه گوش نکنید چون واقعا خیلی ها رهنمایی های میکنن که اصلا برای یک تازه کار خیلی سخته‌.
مثلا یکی میگه برای شروع وبسایت نویسی فرانت باید صد فی صد یه کامپیوتر قوی بخری مثلا باید 8GB رم و core 7 باشه.
خب این غلطه برای رهنمایی آیا اون شخص توانا نایی خرید رو داره یا که نه
یا مثلاً میگه باید روزانه 5 تا 8 ساعت وقت بگذاری تا که در یک سال مثلا Html , Css JavaScript رو بفهمی😳 این هم غلطه

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

من وقتی که برنامه نویسی رو شروع کردم یه کامپیوتر بشدت پایین داشتم 2Gb رم داشت core 5 هم بود خوب من نمیگم تو هم برو همون رو بخر.
و من روزانه 1 تا 1.5 ساعت برای برنامه نویسی وقت میگذاشتم مدرسه هم میرفتم ولی خوب بعد از یک ماه من کلا مباحث Html , Css رو فهمیدم بعد هم یکم رفتم سمت python و JavaScript هر دو رو با هم میرفتم ولی خب اینم اشتباه من بود واقعا برام سخت بود ولی بعد از چند هفته python رو ول کردم رفتم سمت JavaScript و جاوااسکریپت رو فقط روزانه 1.5 ساعت تو سه ماه یاد گرفتم فقط JavaScript و بعد رفتم سمت PHP و python و فرم ورک و اینا
بعد از JavaScript یک سیستم 4Gb رو و core 5 و یک گیگ هم گرافیک خریدم‌.
و بعد از PHP و python هم رفتم یک سیستم 8Gb رم و core 5 خریدم و واقعا که خیلی خوب هم کار میده برای فرانت و بک. و تا الان هر سه کامپیوترم را دارم🫠

اگه که شما میخواهید وارد دنیایی وبسایت نویسی شوید یک سیستم پایه بخرید با روزانه چند ساعت وقت گذاشتن

#coputer #programming #guidance

Channel ° @Cafe_Of_Code

Group ° @IRdeveloperchat
8👨‍💻4
🔥جلسه پنجم🔥

ما در جلسه قبل فهمیدیم که چگونه به صورت رندوم چند دایره با حرکت بسازیم

برای دیدن پست کلید کنید

خب توی این پست می‌خوام بهتون بگم چجوری مربع ، مثلث ، و مستطیل بسازیم خیلی راحت است

کد مربع
import pygame
import sys

# مقداردهی اولیه
pygame.init()
width, height = 800, 600
screen = pygame.display.set_mode((width, height))
pygame.display.set_caption('مربع')

# رنگ‌ها
white = (255, 255, 255)
black = (0, 0, 0)

# نقاشی روی صفحه
screen.fill(white)

#مربع
rect = pygame.Rect(300, 200, 200, 200)
pygame.draw.rect(screen, black, rect)

# نمایش صفحه
pygame.display.flip()

# حلقه اصلی برنامه
while True:
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            pygame.quit()
            sys.exit()

🥇خب طبق همیشه اول دو کتابخانه را وارد میکنیم بعد هم مراحل اولیه را قیمت گذاری میکنیم که میدونید و لازم به تشریح نیست فقط یک قسمت از کد قابل تشریح است
rect = pygame.Rect(300, 200, 200, 200)
pygame.draw.rect(screen, black, rect)

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

کد مثلث:-
خب لازم نیست که بیام تمام کد را بگم فقط یک قسمت از کد را میگم که فقط بجای اندازه مربع پیست کنید
points = [(400, 100), (200, 400), (600, 400)]
pygame.draw.polygon(screen, black, points)

این سه قیمتی که دادم برای ضلع های مثلث اند

کد مستطیل :-
باز هم بجای کد اندازه مثلث این کد را بگذارید
rect = pygame.Rect(200, 150, 400, 200)
pygame.draw.rect(screen, black, rect)

ببنید چهار قیمت دادم که تمام جهات مستطیل را رسم میکنیم

🔥تمام🔥

اگه کدام مشکلی داشتید کامنت ها بگید

#جلسه_پنجم_پایگیم #پایگیم #پایتون
#python #part_5_pygame #pygame

channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
🔥8
📱 اگر دوره آموزشی رایگان فلاتر به صورت انلاین برگذار شود، در این دوره شرکت میکنم و ترجیح میدهم در پلتفرم .......... برگذار شود. « پلتفرم هایی که با پرچم ایران 🇮🇷 مشخص شده اند داخلی هستند و مصرف اینترنت نیم بها دارند »
Anonymous Poll
46%
Google Meet
30%
Skyroom (🇮🇷)
3%
Dana Plus (🇮🇷)
9%
Adobe Connect
3%
Skype
9%
Others ( کامنت )
🔥9
کافه برنامه نویسان | 𝗣𝗿𝗼𝗴𝗿𝗮𝗺𝗲𝗿s 𝗖𝗮𝗳𝗲 pinned «📱 اگر دوره آموزشی رایگان فلاتر به صورت انلاین برگذار شود، در این دوره شرکت میکنم و ترجیح میدهم در پلتفرم .......... برگذار شود. « پلتفرم هایی که با پرچم ایران 🇮🇷 مشخص شده اند داخلی هستند و مصرف اینترنت نیم بها دارند »»
👾 چطور رایانه ها مک آدرس ما را می دانند؟
💥به طور معمول رایانه ها از مک آدرس گیرنده با خبر نیستند و طی یک پیام همگانی از تمام رایانه های داخل شبکه می پرسند که چه کسی فلان مک آدرس را دارد؟ به من بگوید

نام این نوع پکت ها ARP است
کلمه ARP مخفف عبارت Address Resolution Protocol است و وظیفه یافتن مک آدرس و آیپی مقصد را به عهده دارد.

آرپ بعد از پیدا کردن مک آدرس مقصد آن را در یک فضا مانند کش ذخیره می کند تا در آینده نیاز به دریافت مجدد آنها نداشته باشد برای مشاهده این فضای کش از دستور زیر استفاده کنید:

arp -a

این دستور خروجی مانند زیر به شما خواهد داد:

? (10.0.0.1) at 90:e2:fc:02:03:90 [ether] on wlan0

همانطور که مشخص است این پیام به ما می گوید 10.0.0.1 مک آدرس 90:e2:fc:02:03:90 را دارد و از طریق اینترفیس wlan0 قابل دسترسی است.

همانطور که می بینید این یک آیپی ورژن ۴ است. آیپی ها دو دسته ورژن ۴ و ورژن ۶ هستند که ورژن ۶ چندان محبوب نیست.

✳️ IPv4 : 10.0.0.1
✳️ IPv6 : 2001:db8:3333:4444:CCCC:DDDD:EEEE:FFFF


⚡️ تصویر بالا نمونه ای اژ پکت ارپ است که توسط وایرشارک کپچر شده.

#Network

channel ° @Cafe_Of_Code
👨‍💻62
شی گرایی در جاوا اسکریپت به چه معنا است؟

«برنامه نویسی شی‌گرا» (Object Oriented Programming Principles) نوعی الگو و شیوه تفکر است و به صورت کلی به معنای پرداختن به کدنویسی از جزء به کل است .

🙃 این یعنی برنامه ابتدا با استفاده از واحدهای کوچک ایجاد می‌شود و سپس این واحدهای کوچک با یکدیگر پیوند می‌خورند و برنامه اصلی و بزرگ‌تر را تشکیل می‌دهند. در برنامه نویسی شی گرا دو مفهوم اساسی «کلاس» (Class) و «شی» (Object) مدنظر هستند.

شی‌گرایی در جاوا اسکریپت و در سایر زبان‌های برنامه نویسی موجب ساده‌تر شدن فرآیند کدنویسی می‌شود .
مفاهیم شی گرایی به دنیای واقع نزدیک است


#programming #JavaScript

Channel • @Cafe_Of_Code

Group • @IRdeveloperchat
🔥8
This media is not supported in your browser
VIEW IN TELEGRAM
#This_is_javanoscript
🗿😁

🔆 اولویت اجرا شدن کد ها تو js در پشت صحنه و callstack اینجوریه که:

اول کد های اسکوپ گلوبال اجرا میشن.

بعد microtask queue که به عنوان مثال promise ها و داده هایی که fetch میشن در اون قرار میگیرن.

و در نهایت callback queue که میشه به setTimeout اشاره کرد.

#javanoscript #frontend

Channel ° @Cafe_Of_Code

Group ° @IRdeveloperchat
8
👾 دریافت آدرس آیپی اینترفیس در لینوکس:

برای دریافت آدرس آیپی اینترفیس در لینوکس، میتوان از دو دستور ifconfig و ip استفاده کرد. برای اینکار لازم است تا شما به یک شبکه متصل باشید و پس از آن دستور زیر را در محیط ترمینال لینوکس خود وارد کنید:

✳️ ifconfig
✳️ ip a s


بین دو دستور بالا تفاوت زیادی وجود ندارد اما در اکثر موارد دستور ifconfig نیاز به نصب به صورت دستی دارد و دستور ip به طور معمول در دیوایس های لینوکسی نصب است.

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

به این دستورات توجه کنید:

✳️ ifconfig wlan0
✳️ ip a s wlan0


در دو دستور بالا ما از اینترفیس وایرلس استفاده کردیم که نام آن در اغلب توزیع ها wlan0 می باشد و نام اینترفیس متصل به کابل هم معمولا enp3s0 یا eth0 است.

در زیر نمونه خروجی را از دو دستور بالا می بینیم.

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

#Network

@Cafe_Of_Code
👨‍💻9
اگه دارید برنامه نویسی فرانت اند میخونید حتما این دوتا مقاله رو راجب به امنیت سمت کلاینت بخونید که همینجوری پناه بر خدایی نتایج api رو وسط کد نزارید👇

https://systemweakness.com/securing-the-frontend-a-practical-guide-for-developers-fd3b52029b6e

https://medium.com/readytowork-org/frontend-security-best-practices-safeguarding-our-web-applications-5449de2800e1

#javanoscript #frontend #security

Channel ° @Cafe_Of_Code

Group ° @IRdeveloperchat
8
🔥Css Transform Scale 🔥

⚡️در CSS، Transform این امکان را فراهم می‌کند که عناصر HTML را تغییر اندازه دهیم. برای این کار می‌توان از پراپرتی transform: scale() استفاده کرد. این پراپرتی اندازه اولیه عنصر را تغییر داده و آن را بزرگتر یا کوچکتر می‌کند.

استفاده از scale():
- برای تغییر همه ابعاد از scale() استفاده می‌شود. برای مثال transform: scale(2); عرض، ارتفاع و عمق عنصر را دو برابر می‌کند.
- برای تغییر اندازه در جهت افقی یا عمودی می‌توان از scaleX() و scaleY() استفاده کرد. به عنوان مثال transform: scaleX(2); اندازه عرض عنصر را دو برابر می‌کند و transform: scaleY(0.5); ارتفاع عنصر را به نصف کاهش می‌دهد.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<noscript>Scale Example</noscript>
<style>
.scaled {
width: 100px;
height: 100px;
background-color: lightblue;
transform-origin: 50% 50%;
}

.scaled:hover {
transform: scale(1.5); /* تغییر همه ابعاد */
}

.scale-x {
transform: scaleX(2); /* افزایش عرض دو برابر */
}

.scale-y {
transform: scaleY(0.5); /* کاهش ارتفاع به نصف */
}

</style>
</head>
<body>

<div class="scaled">Hover to scale</div>
<div class="scaled scale-x">ScaleX</div>
<div class="scaled scale-y">ScaleY</div>

</body>
</html>

در این مثال، با هاور کردن روی عنصر اول (.scaled)، اندازه آن با ضریب 1.5 افزایش می‌یابد. عناصر دوم و سوم نیز با استفاده از کلاس‌های scale-x و scale-y به ترتیب عرض و ارتفاع را تغییر می‌دهند.
#css #transform #scale

#Ah_sear

Channel° @Cafe_Of_Code
Group° @Irdeveloperchat
8
👾 کنترل تگ های HTML با جاوا اسکریپت:

برای ساخت صفحات پویا یا Dynamic باید از زبان های فرانت اند مانند جاوا اسکریپت استفاده کنید. صفحات پویا صفحاتی هستند که محتوای آن ها با انتخاب های کاربر نغییر می کند.

به عنوان مثال ما می خواهیم صفحه ای بسازیم که به کاربر سلام کند؛‌ برای این کار باید یک ورودی نام برای کاربر بسازیم.

<input type="text" placeholder="Name" name="text" class="input" , id="userName">

در اینجا ما یک ورودی با آیدی userName ساختیم که کاربر نام خود را وارد می کند.

سپس باید مقدار دریافت شده را با Hello جمع کنیم و در یک تگ دیگر نمایش دهیم.
برای اینکار ابتدا یک تگ نتیجه (‌ Result ) میسازیم و به آن آیدی lblResult را اختصاص می دهیم.
<h2 id="lblResult"></h2>

تقریبا همه چیز آماده است اکنون یک تابع برای ساخت پیام سلام می سازیم و مقدار ها را در آن دریافت می کنیم:
 function sayHello()

{
var result = document.getElementById("lblResult");
var userName = document.getElementById("userName").value;
return "Hello" + userName + ", Welcome.";
}

حالا باید دکمه نمایش نتیجه را بسازیم و به آن یک رویداد (‌ Event ) اختصاص بدهیم تا هنگامی که کاربر کلیک کرد نتیجه در تگ lblResult نمایش داده شود.

 <button type="button" onclick="sayHello()">Say Hello</button>

اکنون این صفحه آماده است. کاربر پس از وارد کردن نام خود شاهد پیام زیر خواهد بود:

Hello name , Welcome.

برای دریافت سورس به قسمت کامنت های پست سر بزنید.

#JavaScript

Channel • @Cafe_Of_Code

Group • @IRdeveloperchat
🔥7
🔴امروز 1 July ، روز جهانی جوک گفتن .

+شمام تو کامنتا جوک بگید
5😍2💔1
💠هاب چیست؟

- هاب به وسیله ای در شبکه گفته می شود که برای متصل کردن چند گره ( Node ) یا رایانه به هم استفاده می شود.

- هاب ها دیگر در شبکه های امروزی استفاده نمی شوند چرا که معایب زیادی از نظر امنیتی و از نظر پرفورمنس داشتند.

🔰هاب ها هنگامی که یک پکت به آنها می رسد، آن پکت را به تمام رایانه های متصل به خود ارسال می کند و رایانه مقصد آن پکت را دریافت می کند و سایر دستگاه ها آن را Drop می کنند.

● این موضوع مشکلات زیادی را به وجود می آورد. مثلا اگر پکت را کامپیوتر A برای کامپیوتر D ارسال کند، این پکت را کامپیوتر های B و C نیز می بینند که این موضوع از نظر امنیتی بسیار بد است همچنین ترافیک بسیار زیادی هم ایجاد می کند.

● این موضوع می تواند تصادف پکت ها را هم ایجاد کند، فرض کنید کامپیوتر A و B هم زمان یک پکت را ارسال کنند، این موضوع باعث می شود تا بین پکت ها Collision ایجاد شود و از بین بروند.

🔺️نکته: سرعت هاب ها بین ۱۰ مگابیت تا ۱۰۰ مگابیت خواهد بود و این مقدار به ندرت به بالاترین حد خود می رسد.


پست های مرتبط روز های آینده

#Network


Channel • @Cafe_Of_Code

Group • @IRdeveloperchat
5👨‍💻3
امروز ۱۳ تیرماه ، روز ملی دماونده.❤️‍🔥
🔥72