✨ساختار المان های اچ تی ام ال✨
⚡️ در تصویر بالا میتوانید نمونهای از ساختار کلی یک المان اچتیامال را مشاهده کنید.
ساختار المان ها و تگ های شروع و پایان در HTML 👨💻
💥 نکتهای در مورد بزرگی و کوچکی حروف در HTML
بهتر است بدانید HTML نسبت به بزرگی و کوچکی حروف حساس نیست.
#Web #Html
Channel • @Cafe_Of_Code
Group • @IRdeveloperchat
⚡️ در تصویر بالا میتوانید نمونهای از ساختار کلی یک المان اچتیامال را مشاهده کنید.
ساختار المان ها و تگ های شروع و پایان در HTML 👨💻
💥 نکتهای در مورد بزرگی و کوچکی حروف در HTML
بهتر است بدانید HTML نسبت به بزرگی و کوچکی حروف حساس نیست.
بنابراین تگهای <P> و <p> یا <IMG> و <img> با یکدیگر تفاوتی ندارد. با این حال به شدت توصیه میکنیم همیشه از حروف کوچک در نام تگهای HTML و … استفاده کنید
#Web #Html
Channel • @Cafe_Of_Code
Group • @IRdeveloperchat
❤4👨💻2
⚡️حرکت به بالای صفحه به نرمی با JavaScript
#javanoscript #smooth
#Ah_sear
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
#javanoscript #smooth
#Ah_sear
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
❤6🔥2
❤7
🔆 گاهی اوقات بهتره روز تعطیل رو در رختخواب خوابید تا اینکه تمام هفتهٔ بعد رو مجبور به دیباگ کردن کدهای آن روز تعطیل کرد.
⁉️موافقید؟
#programming
Channel • @Cafe_Of_Code
Group • @IRdeveloperchat
⁉️موافقید؟
#programming
Channel • @Cafe_Of_Code
Group • @IRdeveloperchat
❤8👨💻4
⚡️CHALLENGE⚡️
#javanoscript #CHALLENGE
#Ah_sear
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
function* gen() {
yield 1;
yield 2;
yield 3;
}
async function asyncFunc() {
for (let value of gen()) {
await new Promise(res => setTimeout(res, 100));
console.log(value);
}
return 'done';
}
const result = asyncFunc();
console.log(result instanceof Promise);#javanoscript #CHALLENGE
#Ah_sear
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
❤6
👨💻5❤1
✨ تبدیل دیکشنری به XML با پایتون🔥
💥 اگر میخواهید یک ساختار دیکشنری را به صورت XML در بیاورید ، به صورت زیر عمل کنید :)
#programming #python
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
💥 اگر میخواهید یک ساختار دیکشنری را به صورت XML در بیاورید ، به صورت زیر عمل کنید :)
from xml.etree.ElementTree import Element
def dict_to_xml(tag, d):
'''
Turn a simple dict of key/value pairs into XML
'''
elem = Element(tag)
for key, val in d.items():
child = Element(key)
child.text = str(val)
elem.append(child)
return elem
#programming #python
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
❤5👨💻2
چطور یک متن به گفتار با JavaScript بنویسم؟
⚡️توی این پست میخوام میگم
🥇قسمت اول کد Html یک textarea میسازیم که کاربر متن خود را بنویسه.
🥈 یک باتن ساختیم که onclick اش رو مساوی به فانکشن convertTextToSpeech دادیم که توی جاوااسکریپت تعریف کردیم
🥉کد جاوااسکریپت اول یک تابع تعریف کردیم بعد اومدیم با getElementById آیدی textarea رو گرفتیم
بعد یک متغیر تعریف کردیم
و در آخر هم
با استفاده از window اومدیم متن مون رو تبدیل به صدا کردیم
‼️ توجه داشته باشید اگه که با موبایل اجرا میکنید حتما یا مرورگر باز کنید با کامپایلر موبایل کار نمیده
#javanoscript #html #Convert #speech
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
⚡️توی این پست میخوام میگم
<!DOCTYPE html>
<html>
<head>
<noscript>Text to Speech</noscript>
</head>
<body>
<h1>Text to Speech Converter</h1>
<textarea id="text-to-convert" rows="4" cols="50"></textarea>
<button onclick="convertTextToSpeech()">Convert to Speech</button>
<noscript>
function convertTextToSpeech() {
const text = document.getElementById('text-to-convert').value;
const speech = new SpeechSynthesisUtterance();
speech.text = text;
speech.volume = 1;
speech.rate = 1;
speech.pitch = 1;
window.speechSynthesis.speak(speech);
}
</noscript>
</body>
</html>
🥇قسمت اول کد Html یک textarea میسازیم که کاربر متن خود را بنویسه.
🥈 یک باتن ساختیم که onclick اش رو مساوی به فانکشن convertTextToSpeech دادیم که توی جاوااسکریپت تعریف کردیم
🥉کد جاوااسکریپت اول یک تابع تعریف کردیم بعد اومدیم با getElementById آیدی textarea رو گرفتیم
بعد یک متغیر تعریف کردیم
و در آخر هم
window.speechSynthesis.speak(speech);
با استفاده از window اومدیم متن مون رو تبدیل به صدا کردیم
‼️
#javanoscript #html #Convert #speech
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
❤4👨💻3
✨ امروز 21 June، روز جهانی انسانیته ، چیزی که این روزا کمتر پیدا میشه .
❤7🕊3
🏅 اولین شخصی که در تاریخ به عنوان کدنویس شناخته شده است، زنی به نام آدا لاولیس بود😍👩💻
او در سال 1815 به دنیا آمد .
عدهای اعتقاد دارند که وی اولین فردی است که برای ماشین یک الگوریتم نوشته است.
#programming #fact
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
او در سال 1815 به دنیا آمد .
عدهای اعتقاد دارند که وی اولین فردی است که برای ماشین یک الگوریتم نوشته است.
#programming #fact
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
❤8😍3
داشتم توی ریپو های اپن سورس گوگل میگشتم که رسیدم به پروژه Mesop با شعار به سرعت برنامه های وب جذاب با پایتون بسازید
باهاش میتونید با استفاده از پایتون و کمترین میزان کد نویسی وپ اب بسازید و برای اپ های internal و دمو خیلی باحاله.
ویژگی هاش:
✨ پشتیبانی از Hot reload
✨ بدون نیاز به Javanoscript/CSS/HTML میتونید ui های کاستوم بسازید
✨ یادگیری آسون
✨ کامپوننت های آماده
و ..
دموها:
🔗 https://google.github.io/mesop/demo/
وبسایت:
🔗 https://google.github.io/mesop/
گیت هاب:
🔗 https://github.com/google/mesop
#python #programming
Channel • @Cafe_Of_Code
Group • @IRdeveloperchat
باهاش میتونید با استفاده از پایتون و کمترین میزان کد نویسی وپ اب بسازید و برای اپ های internal و دمو خیلی باحاله.
ویژگی هاش:
✨ پشتیبانی از Hot reload
✨ بدون نیاز به Javanoscript/CSS/HTML میتونید ui های کاستوم بسازید
✨ یادگیری آسون
✨ کامپوننت های آماده
و ..
دموها:
🔗 https://google.github.io/mesop/demo/
وبسایت:
🔗 https://google.github.io/mesop/
گیت هاب:
🔗 https://github.com/google/mesop
#python #programming
Channel • @Cafe_Of_Code
Group • @IRdeveloperchat
👨💻6
🔥جلسه چهارم Pygame 🔥
ما توی جلسه قبلی فهمیدیم که چگونه با pygame عکس مون رو نمایش بدیم
برای مشاهده پست کلید کنید
⚡️خب توی این پست میخوام که بهتون بگم چگونه میتونیم چند تا دایره شناور با pygame بسازیم
1⃣طبق همیشه اول میایم کتابخانه رو امپورت میکنیم
بعد میایم رنگ ها رو تعریف میکنم.
به این بخش میایم تعداد دایره ها مونو مینویسیم من 10 تا دایره را تعیین کردم
2⃣و بعد میایم میایم یک تابع تعریف میکنیم
که چهار قیمت داره این تابع برای رسم دایره ها بکار میره
بعد میایم دایره ها رو رسم میکنیم به هر کدوم یک قیمت یک اندازه یک حالت و یک رنگ رو میدیم
بعد دایره ها رو به حالت شناور تغییر میدیم
این بود از این جلسه
راستی بعد از هر بار اجرا رنگ و اندازه دایره ها تغییر میکنه
اگه مشکلی بود تو کامنت ها بپرسید
#پایتون #پایگیم #جلسه_چهارم_پایگیم
#python #pygame #part_4_pygame
#Ah_sear
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
ما توی جلسه قبلی فهمیدیم که چگونه با pygame عکس مون رو نمایش بدیم
برای مشاهده پست کلید کنید
⚡️خب توی این پست میخوام که بهتون بگم چگونه میتونیم چند تا دایره شناور با pygame بسازیم
import pygame
import random
# تعریف رنگها
BLACK = (0, 0, 0)
WHITE = (255, 255, 255)
# تنظیمات پنجره
SCREEN_WIDTH = 800
SCREEN_HEIGHT = 600
# تعداد دایرهها
NUM_CIRCLES = 10
# ایجاد صفحه
pygame.init()
screen = pygame.display.set_mode((SCREEN_WIDTH, SCREEN_HEIGHT))
pygame.display.set_caption('Drawing Circles with Pygame')
clock = pygame.time.Clock()
# تعریف تابع برای رسم دایره
def draw_circle(surface, color, pos, radius):
pygame.draw.circle(surface, color, pos, radius)
# حلقه اصلی برنامه
running = True
circle_info = []
for _ in range(NUM_CIRCLES):
circle_color = (random.randint(0, 255), random.randint(0, 255), random.randint(0, 255))
circle_pos = (random.randint(0, SCREEN_WIDTH), random.randint(0, SCREEN_HEIGHT))
circle_radius = random.randint(10, 50)
circle_speed = [random.uniform(-1, 1), random.uniform(-1, 1)]
circle_info.append({"color": circle_color, "pos": circle_pos, "radius": circle_radius, "speed": circle_speed})
while running:
for event in pygame.event.get():
if event.type == pygame.QUIT:
running = False
screen.fill(WHITE)
# رسم دایرهها و حرکت آنها
for circle in circle_info:
draw_circle(screen, circle["color"], circle["pos"], circle["radius"])
circle["pos"] = (circle["pos"][0] + circle["speed"][0], circle["pos"][1] + circle["speed"][1])
if circle["pos"][0] > SCREEN_WIDTH or circle["pos"][0] < 0:
circle["speed"][0] *= -1
if circle["pos"][1] > SCREEN_HEIGHT or circle["pos"][1] < 0:
circle["speed"][1] *= -1
pygame.display.flip()
clock.tick(60)
pygame.quit()
1⃣طبق همیشه اول میایم کتابخانه رو امپورت میکنیم
بعد میایم رنگ ها رو تعریف میکنم.
NUM_CIRCLES = 10
به این بخش میایم تعداد دایره ها مونو مینویسیم من 10 تا دایره را تعیین کردم
2⃣و بعد میایم میایم یک تابع تعریف میکنیم
def draw_circle(surface, color, pos, radius):
pygame.draw.circle(surface, color, pos, radius)
که چهار قیمت داره این تابع برای رسم دایره ها بکار میره
بعد میایم دایره ها رو رسم میکنیم به هر کدوم یک قیمت یک اندازه یک حالت و یک رنگ رو میدیم
بعد دایره ها رو به حالت شناور تغییر میدیم
for circle in circle_info:
draw_circle(screen, circle["color"], circle["pos"], circle["radius"])
circle["pos"] = (circle["pos"][0] + circle["speed"][0], circle["pos"][1] + circle["speed"][1])
if circle["pos"][0] > SCREEN_WIDTH or circle["pos"][0] < 0:
circle["speed"][0] *= -1
if circle["pos"][1] > SCREEN_HEIGHT or circle["pos"][1] < 0:
circle["speed"][1] *= -1
pygame.display.flip()
clock.tick(60)
این بود از این جلسه
راستی بعد از هر بار اجرا رنگ و اندازه دایره ها تغییر میکنه
اگه مشکلی بود تو کامنت ها بپرسید
#پایتون #پایگیم #جلسه_چهارم_پایگیم
#python #pygame #part_4_pygame
#Ah_sear
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
❤7
⚡️بچها میخوام توی این پست بهتون بگم که چجوری میتونیم سایت مون رو غیر قابل سلکت کنیم‼
️
1⃣خب لاین اول
میاد کاری میکنه مرورگر های مثل کروم، سافاری، و اوپرا نتونن متن رو سلکت یا انتخاب کنن.
2⃣لاین دوم
میاد کاری میکنه که مرورگر موزیلا فایرفاکس هم نتوته سلکت کنه🚫
3⃣لاین سوم
میاد کاری میکنه که مرورگر های استاندارد هم نتونن سلک کنن
کلا غیر قابل سلکت میشه سایت تون حالا چرا اینکار رو بکنیم⁉️
هیچی مگه مرض داریم😂
#Html #css #web #code #Fun
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
️
body {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}1⃣خب لاین اول
میاد کاری میکنه مرورگر های مثل کروم، سافاری، و اوپرا نتونن متن رو سلکت یا انتخاب کنن.
2⃣لاین دوم
میاد کاری میکنه که مرورگر موزیلا فایرفاکس هم نتوته سلکت کنه🚫
3⃣لاین سوم
میاد کاری میکنه که مرورگر های استاندارد هم نتونن سلک کنن
کلا غیر قابل سلکت میشه سایت تون حالا چرا اینکار رو بکنیم⁉️
#Html #css #web #code #Fun
Channel ° @Cafe_Of_Code
Group ° @IRdeveloperchat
👨💻8❤3🤣1
🔥برنامه خاموش کردن کامپیوتر با پایتون🔥
⚡️ برای این برنامه از کتابخانه OS استفاده شده است. میتوان این کتابخانه را با دستور «pip install os» نصب کرد .
⚡️ با استفاده از این بسته میتوان کامپیوتر را بازنشانی (ریاستارت) یا خاموش کرد . حتی امکان تنظیم یک زمانبندی برای خاموش یا ریاستارت کردن دستگاه نیز با استفاده از این پکیج وجود دارد.
💥پیش از اجرای این برنامه، باید از ذخیره کردن اسناد و برنامهها اطمینان حاصل کرد و از آنها خارج شد. زیرا پس از اجرای این برنامه، کامپیوتر خاموش میشود و ممکن است دادههای ذخیره نشده از بین بروند
#programming #python
Channel • @Cafe_Of_Code
Group • @IRdeveloperchat
⚡️ برای این برنامه از کتابخانه OS استفاده شده است. میتوان این کتابخانه را با دستور «pip install os» نصب کرد .
⚡️ با استفاده از این بسته میتوان کامپیوتر را بازنشانی (ریاستارت) یا خاموش کرد . حتی امکان تنظیم یک زمانبندی برای خاموش یا ریاستارت کردن دستگاه نیز با استفاده از این پکیج وجود دارد.
import os
shut down=input("do you want to shutdown your computer(yes/no):")
:'if shutdown=='yes
os.system("shutdown/s/t1")
:else
print('shutdown is not requested')
💥پیش از اجرای این برنامه، باید از ذخیره کردن اسناد و برنامهها اطمینان حاصل کرد و از آنها خارج شد. زیرا پس از اجرای این برنامه، کامپیوتر خاموش میشود و ممکن است دادههای ذخیره نشده از بین بروند
#programming #python
Channel • @Cafe_Of_Code
Group • @IRdeveloperchat
❤7💔2🕊1
⚡6💔2
۲۳ ژوئن روز جهانی دختران مهندس مبارکه همه ی خانم هایی باشه که بلدن ریاضی و منطق رو با احساس و عاطفه همراه کنن🔥
خانوم مهندسا و اونایی که میخواین مهندس شین روزتون مبارک❤️
Channel • @Cafe_Of_Code
Group • @IRdeveloperchat
خانوم مهندسا و اونایی که میخواین مهندس شین روزتون مبارک❤️
Channel • @Cafe_Of_Code
Group • @IRdeveloperchat
❤10🔥4
🔆مهارت هایی که مزیت محسوب میشن و یادگیری اونا میتونه چندین پله شما رو جلو بندازه ✨
💯 هر کدوم رو میتونید بعد مسلط شدن به جاوااسکریپت برید سراغش ✨
🎖 آموزش Webpack
🎖 آموزش WebSocket
🎖 آموزش GraphQL
🎖 آموزش Pwa
🎖 آموزش Canvas
#programming
Channel • @Cafe_Of_Code
Group • @IRdeveloperchat
💯 هر کدوم رو میتونید بعد مسلط شدن به جاوااسکریپت برید سراغش ✨
🎖 آموزش Webpack
🎖 آموزش WebSocket
🎖 آموزش GraphQL
🎖 آموزش Pwa
🎖 آموزش Canvas
#programming
Channel • @Cafe_Of_Code
Group • @IRdeveloperchat
❤5👨💻2