سلام سلام
ظاهرا باید همه ی پست های بله رو اینجا کپی کنیم و بریم سمت اتوماسیون برای بروز کردن هم زمان بله و تلگرام😅
ابزار خوب؟
N8N
#سامان

بچه ها یه کانال دیگه هم داریم که بد نیست بهش نگاهی بندازید
اونجا فقط ابزار معرفی میکنیم
@tech_screenshot

🚨در ادامه ی پست خیلی خوب مهندس رادمان عزیز٬ بریم یکم از خود گیت بگیم و نقش راهبردیش در تیم ها...

در این ویس در مورد گیت٬ برنچینگ٬ نام گذاری برنچ ها٬ کانفلیکت ها٬ ریبیس٬ مرج و چالش های تیمی و استاندارهایی که باید رعایت کنیم توضیح میدیم.

اگر سوال یا تجربه‌ای درباره این موضوع دارید، به آی‌دی خصوصی من یا گروه پیام بدید؛ حتماً جواب می‌دیم.

اگر این مطلب براتون مفید بود، با زدن روی تیک زیر پست اعلام حضور کنید ✅

#سامان #تکنولوژی #گیت #ویس


⚠️ آدرس کانال در تلگرام( حتما جوین بشید )
🚀 @devsourcech
سایت مستندات برنامه نویسی:
🥇 https://devsource.ir

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

مثلاً:

- DB Address
- API Key
- Token
- Dev / Production Setting

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

برای همین از Environment Variable ها استفاده می‌کنیم.

به جای اینکه مقدارها داخل کد باشن، از بیرون به برنامه پاس داده میشن. معمولاً هم داخل فایل ".env" نگهداری میشن.

این کار چند تا مزیت مهم داره:

✅ اطلاعات حساس وارد مخزن Git نمیشن
✅ برای هر محیط (Development، Test، Production) تنظیمات جدا داریم
✅ تغییر تنظیمات بدون دست زدن به کد انجام میشه
✅ امنیت و نگهداری پروژه بهتر میشه

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

#رادمان #برنامه‌نویسی #env

‌
⚠️ آدرس کانال در تلگرام( حتما جوین بشید )
🚀 https://t.me/devsourcech
گروه و کانال مربوط مجموعه:
🔸 Gp: @nodemaster
🔹 Ch: @devsource
سایت مستندات برنامه نویسی:
🥇 https://devsource.ir

Rate Limiting یعنی محدود کردن تعداد درخواست‌هایی که یک کاربر یا سرویس می‌تواند در یک بازه زمانی ارسال کند.

Rate Limiting فقط یه عدد نیست
خیلی وقت‌ها وقتی از Rate Limiting حرف می‌زنیم، یه تعریف ساده به ذهن می‌رسه:
هر کاربر مجاز به n درخواست در ثانیه است
اما این تعریف ناقصه. بذارید با یه مثال واقعی شروع کنیم.

مشکل از کجا شروع می‌شه؟
فرض کن یه کاربر فقط ۱۰ درخواست در ثانیه می‌فرسته. کاملاً در محدوده مجاز.
اما هر درخواست ۳۰ ثانیه طول می‌کشه.
10 × 30 = 300 درخواست همزمان
در این حالت، با اینکه Rate Limit نقض نشده، ممکن است Workerها پر شوند، دیتابیس تحت فشار برود و Latency (تاخیر در پاسخ) به شدت افزایش پیدا کند.
به همین دلیل در سیستم‌های بزرگ فقط Rate Limit وجود ندارد :
Rate Limit : تعداد درخواست‌ها رو کنترل می‌کنه
Concurrency Limit : تعداد درخواست‌های همزمان رو محدود می‌کنه
Load Shedding : زیر فشار بالا، ترافیک کم‌اهمیت رو حذف می‌کنه
Resource Limit : درخواست api های سنگین رو جداگانه محدود می‌کنه
بهتره برای اینکه سرور با مشکل رو به رو نشه همه رو با هم چک کنیم

#علی #برنامه_نویسی #ratelimit


🚀 @devsourcech

✅ Claude is cooking ...

دوستانی که windsurf دارن روی اون فعال شده و میتونید تستش کنید.

#AB #AI


🚀 @devsourcech
✅ در بله
🔹 @devsource

🚨 خیلی دوست دارم ابزاری رو معرفی کنم که باهاش می‌تونید از دل کد (چه توی محیط توسعه و چه پروداکشن) کندی‌های سیستم رو با جزئیات کامل بکشید بیرون.

داستان از اینجا شروع میشه که حتماً برای همه‌تون پیش اومده؛ یه ریکوئست میاد، سیستم کنده، اما نمی‌دونید دقیقاً کدوم سرویس یا کدوم کوئری دیتابیس داره وقت رو تلف می‌کنه…

اینجاست که قصه Zipkin شروع میشه.

🛠 Zipkin دقیقاً چیکار می‌کنه؟
زیپکین ابزارِ "Distributed Tracing" هست. یعنی چی؟ فرض کنید یه میکروسرویس دارید که برای گرفتن یه دیتای ساده، باید به ۳ تا سرویس دیگه درخواست بزنه، از اون طرف هم دیتابیسِ سرویس سوم کنده. پیدا کردنِ اینکه این وسط کجای این زنجیره، زمان هدر میره، بدون ابزار عملاً غیرممکنه.

زیپکین میاد برای هر درخواست یه Trace ID میسازه و تمامِ مسیرهایی که اون درخواست طی می‌کنه رو (از سرویس A به B، از B به دیتابیس و...) براتون مانیتور می‌کنه.

💡 مثال واقعی:
توی یک پروژه، ما یه سرویس “تخفیف” داشتیم که گاهی اوقات باعث می‌شد کل سبد خرید با تاخیر ۵ ثانیه‌ای لود بشه. وقتی لاگ‌ها رو چک می‌کردیم، همه سرویس‌ها می‌گفتن “ما اوکی هستیم”.
با Zipkin که مسیر رو نگاه کردیم، فهمیدیم مشکل از دیتابیس یا کد نیست؛ بلکه سرویسِ سبد خرید، برای چک کردنِ وضعیتِ هر آیتم، به جای اینکه یکبار به سرویسِ تخفیف درخواست بزنه، توی یک حلقه (Loop) به ازای هر محصولِ کاربر، یک ریکوئست HTTP جداگانه می‌فرستاد!

حالا اینجا یه سؤال پیش میاد…
آیا برای هر پروژه کوچیکی نیاز به Zipkin داریم؟ نه! این ابزار برای معماری‌های میکروسرویسی و سیستم‌هایی که پیچیدگی‌شون بالاست حکمِ طلا رو داره. اگر یه سرویسِ تکیِ ساده دارید، احتمالاً overkill محسوب میشه.

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

اگر سوال یا تجربه‌ای درباره این موضوع دارید، به آی‌دی خصوصی من یا گروه پیام بدید؛ حتماً جواب می‌دیم.

#سامان #تکنولوژی
اگر این مطلب براتون مفید بود، با زدن روی تیک زیر پست اعلام حضور کنید ✅

⚠️ آدرس کانال در تلگرام( حتما جوین بشید )
🚀 @devsourcech
✅ در بله
🔹 Ch: @devsource
سایت مستندات برنامه نویسی:
🥇 https://devsource.ir

🚀 مسیر یادگیری React در سال ۲۰۲۶

اگر می‌خوای وارد دنیای فرانت‌اند بشی یا سطح کارت رو حرفه‌ای کنی، React یکی از مهم‌ترین ابزارهای این مسیره. 🌐

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

🔹 از پایه شروع می‌کنیم: HTML, CSS, JavaScript (بدون اینا React معنی نداره) 🧱
🔹 بعد می‌ریم سراغ: React Basics (Component, Props, State) ⚛️
🔹 بعدش: Hooks (useState, useEffect, useMemo...) 🪝
🔹 در ادامه: Routing, API, پروژه‌های واقعی 🛠️
🔹 و در نهایت: ساخت پروژه‌های واقعی + آمادگی ورود به بازار کار 💼

💡 هدف این کانال: یادگیری اصولی، ساده و پروژه‌محور React — بدون حاشیه و گیج شدن 🎯

#Hame
#تکنولوژی
اگر این مطلب براتون مفید بود، با زدن روی تیک زیر پست اعلام حضور کنید ✅
‌
⚠️ آدرس کانال در تلگرام( حتما جوین بشید )
🚀 @devsourcech
✅ در بله
🔹 Ch: @devsource
سایت مستندات برنامه نویسی:
🥇 https://devsource.ir

🔥 شروع مسیر یادگیری React

قبل از اینکه React رو شروع کنیم، باید یه چیز مهم رو بدونی:

بدون JavaScript
عملاً React هیچی نیست.
پس اگر می‌خوای حرفه‌ای یاد بگیری، باید این پایه‌ها رو محکم کنی 👇

🧠 نقشه راه قبل از React
🔹 1. HTML ساختار صفحه
🔹 2. CSS ظاهر و استایل‌دهی
🔹 3. JavaScript (مهم‌ترین بخش)

متغیرها (let, const)
شرط‌ها (if/else)
حلقه‌ها (for, map)
آرایه و آبجکت
یکسریfunction ها
کار با DOM
⚡ نکته مهم

اگر JavaScript رو بلد نباشی، React برات فقط یه سری کلمه عجیب میشه.

🎯 پیشنهاد میکنم من که قبل از رفتن سراغ React:
حداقل 30 روز فقطhtml css JS کار کن + تمرین حل کن.


اما نگران نباش
ما همراهت هستیم و این مسیر رو باهاهت همراه میشم

📌 پست بعدی: «برنامه 30 روزه html css JavaScript برای React»

#Hamed
#تکنولوژی
اگر این مطلب براتون مفید بود، با زدن روی تیک زیر پست اعلام حضور کنید ✅
‌
⚠️ آدرس کانال در تلگرام( حتما جوین بشید )
🚀 @devsourcech
✅ در بله
🔹 Ch: @devsource
سایت مستندات برنامه نویسی:
🥇 https://devsource.ir

راهنمای دوره📢
جهت استفاده از دوره، روی هشتگ‌ها بزنید و مطالب را دنبال کنید 👇
دوره ۳۰ روزه رایگان HTML, CSS, JavaScript 🎓
جهت آمادگی برای ورود به React.js 🚀

شامل سه فاز:

فاز اول: آموزش HTML 🪜
#html_lessons@devsourcech

فاز دوم: آموزش CSS 🎨
#css_lessons@devsourcech

فاز سوم: آموزش JavaScript ⚡
#javaScript@devsourcech

همچنین بخش معرفی وب‌سایت‌های کاربردی 🌐
#معرفی_وبسایت_فرانت_اند@devsourcech

نکات کاربردی فرانت اند 💡
#hints_frontend@devsourcech

نمونه کدها و سورس‌کد مربوطه 💻
#نمونه_کد_فرانت_اند@devsourcech
#سورس_کد_فرانت_اند@devsourcech

#Hamed
#تکنولوژی
اگر این مطلب براتون مفید بود، با زدن روی تیک زیر پست اعلام حضور کنید ✅
‌
⚠️ آدرس کانال در تلگرام( حتما جوین بشید )
🚀 @devsourcech
✅ در بله
🔹 Ch: @devsource
سایت مستندات برنامه نویسی:
🥇 https://devsource.ir

🚀 برنامه ۳۰ روزه HTML + CSS + JavaScript (مخصوص React)
🟢 فاز 1: HTML (روز 1 تا 5)
هدف: ساختار صفحه رو کامل بفهمی
روز 1:
ساختار کلی HTML
تگ‌های پایه (div, h1, p, span)
روز 2:
لینک‌ها و تصاویر
مسیرها (relative / absolute)
روز 3:
فرم‌ها (input, button, form)
روز 4:
لیست‌ها (ul, ol, li)
جدول ساده (table)
روز 5:
ساخت یک صفحه کامل HTML (Login Page ساده)
🎯 خروجی: یک صفحه کامل بدون CSS

#html_lessons@devsourcech

#Hamed
#تکنولوژی
اگر این مطلب براتون مفید بود، با زدن روی تیک زیر پست اعلام حضور کنید ✅
‌
⚠️ آدرس کانال در تلگرام( حتما جوین بشید )
🚀 @devsourcech
✅ در بله
🔹 Ch: @devsource
سایت مستندات برنامه نویسی:
🥇 https://devsource.ir

🟡 فاز ۲: CSS (روز ۶ تا ۱۵) 🎨
هدف: ساخت UI واقعی 💻
روز ۶:
selector ها + رنگ + فونت 🎨🔤
روز ۷:
box model (margin, padding, border) 📦
روز ۸:
display (block / inline / inline-block) 🔲
روز ۹:
position (relative, absolute, fixed) 📍
روز ۱۰:
Flexbox (خیلی مهم 🚨) ⚡
روز ۱۱:
Flexbox ادامه + تمرین 🏋️‍♂️
روز ۱۲:
Grid 🧱
روز ۱۳:
hover / transition ✨
روز ۱۴:
responsive design (media query) 📱💻
روز ۱۵:
ساخت یک UI کامل (مثلاً landing page ساده) 🖼️
🎯 خروجی: یک صفحه شبیه سایت واقعی 🌐

#css_lessons@devsourcech
#Hamed
#تکنولوژی
اگر این مطلب براتون مفید بود، با زدن روی تیک زیر پست اعلام حضور کنید ✅
‌
⚠️ آدرس کانال در تلگرام( حتما جوین بشید )
🚀 @devsourcech
✅ در بله
🔹 Ch: @devsource
سایت مستندات برنامه نویسی:
🥇 https://devsource.ir

🔵 فاز 3: JavaScript (روز 16 تا 30) 📅
هدف: رسیدن به سطح React-ready 🎯

روز 16:
let / const 📝
انواع داده‌ها 🧾

روز 17:
شرط‌ها (if / else) ⚖️

روز 18:
حلقه‌ها (for / while) 🔄

روز 19:
آموزش function ها ⚙️

روز 20:
آموزش array ها 📊

روز 21:
map / filter / find (خیلی مهم 🚨) 🔍

روز 22:
آموزش object ها 🧱

روز 23:
آموزش destructuring ساده 🧩

روز 24:
DOM (querySelector, innerText) 🌐

روز 25:
آموزش event ها (click, input) ⚡

روز 26:
کار با فرم‌ها 📝

روز 27:
mini project 1: Todo List ✅

روز 28:
mini project 2: calculator ساده ➗

روز 29:
تمرین ترکیبی (array + DOM) 🤝

روز 30:
جمع‌بندی + رفع ضعف‌ها + آماده ورود به React 🚀

#javaScript_lessons@devsourcech

#Hamed
#تکنولوژی
اگر این مطلب براتون مفید بود، با زدن روی تیک زیر پست اعلام حضور کنید ✅
‌
⚠️ آدرس کانال در تلگرام( حتما جوین بشید )
🚀 @devsourcech
✅ در بله
🔹 Ch: @devsource
سایت مستندات برنامه نویسی:
🥇 https://devsource.ir

🎯 خروجی این ۳۰ روز:
بعدش تو می‌تونی:
✅ React رو بدون ترس شروع کنی
🚀 مفهوم state و props رو سریع بگیری
💻 پروژه بزنی

پس با من همراه شو تا با هم به دنیای برنامه‌نویسی بریم و سفرمونو شروع کنیم 🛠️🌍✨

برای دوره های فرانت هشتگ های مربوطه را دنبال
#javaScript_lessons@devsourcech

#css_lessons@devsourcech

#html_lessons@devsourcech


#Hamed
#تکنولوژی
اگر این مطلب براتون مفید بود، با زدن روی تیک زیر پست اعلام حضور کنید ✅
‌
⚠️ آدرس کانال در تلگرام( حتما جوین بشید )
🚀 @devsourcech
✅ در بله
🔹 Ch: @devsource
سایت مستندات برنامه نویسی:
🥇 https://devsource.ir

خب قبل از اینکه وارد آموزش بشیم، باید محیط کارمون رو آماده کنیم. 🛠️

مثلاً آماده کردن وسایل قبل از سفر میمونه ✈️

قراره VS Code رو نصب کنیم و چندتا ابزار مهم بهش اضافه کنیم.

💻 اول VS Code چیه؟

برنامه VS Code یه ادیتور کد سبک و قدرتمنده که باهاش کدنویسی می‌کنیم 💻. تقریباً همه‌ی فرانت‌اند دولوپرها از همین استفاده می‌کنن.

📦 مرحله 1: نصب VS Code
🔗 دانلود از سایت رسمی: https://code.visualstudio.com/
✔️ وارد سایت شو
✔️ روی Download برای سیستم عاملت کلیک کن
✔️ نصبش کن (مثل برنامه‌های معمولی Next → Next) ✅

⚙️ مرحله 2: تنظیمات اولیه (مهم)
بعد از نصب:
وارد Settings شو ⚙️
این گزینه‌ها رو فعال کن:
Auto Save → روشن 🔒
Word Wrap → روشن (برای اسکرول نکردن افقی) 📜

🔌 مرحله 3: اکستنشن‌های ضروری (خیلی مهم 🚨)
این اکستنشن‌ها رو حتما نصب کن:
🎯 1. Live Server
برای دیدن تغییرات سایت به صورت زنده بدون رفرش 🔄
🎨 2. Prettier – Code Formatter
برای مرتب کردن خودکار کدها 🧹
🧠 3. ES7+ React/Redux Snippets
برای کدنویسی سریع React (بعداً خیلی به درد می‌خوره) ⚛️
🌈 4. Material Icon Theme
برای قشنگ‌تر شدن فایل‌ها و فولدرها 📂
⚡ 5. Auto Rename Tag
وقتی یه تگ HTML رو تغییر میدی، تگ جفتش هم تغییر می‌کنه 🏷️

🧠 نکات مهم (خیلی مهم‌تر از نصب)
✔️ هیچوقت کد نامرتب ننویس 🚫
✔️ از همون اول عادت به تمیز نوشتن کد کن ✨
✔️ هر چیزی رو خودت تایپ کن، کپی نکن ⌨️
✔️ با VS Code راحت شو، این ابزار اصلی توئه 🚀

#Hamed
#تکنولوژی
اگر این مطلب براتون مفید بود، با زدن روی تیک زیر پست اعلام حضور کنید ✅
‌
⚠️ آدرس کانال در تلگرام( حتما جوین بشید )
🚀 @devsourcech
✅ در بله
🔹 Ch: @devsource
سایت مستندات برنامه نویسی:
🥇 https://devsource.ir

بریم شروع کنیم دوره ۳۰ روزه فشرده HTML, CSS, JS جهت آمادگی برای ورود به React.js 🚀💻📅

#javaScript_lessons@devsourcech

#css_lessons@devsourcech

#html_lessons@devsourcech


#Hamed
#تکنولوژی
اگر این مطلب براتون مفید بود، با زدن روی تیک زیر پست اعلام حضور کنید ✅
‌
⚠️ آدرس کانال در تلگرام( حتما جوین بشید )
🚀 @devsourcech
✅ در بله
🔹 Ch: @devsource
سایت مستندات برنامه نویسی:
🥇 https://devsource.ir

📅 روز 1: شروع HTML
🎯 ساختار صفحه و تگ‌های پایه
🧠خود HTML چیه؟
دوستانHTML زبان ساختاردهی صفحه‌های وبه و بیشتر تحت عنوان یک مارک آپ شناخته میشه تا زبان
یعنی با HTML مشخص می‌کنی:
چی عنوانه
چی متن عادیه
چی بخشه
🏗️ ساختار کلی یک فایل HTML
هر صفحه HTML یه ساختار ثابت داره:

<!DOCTYPE html>
<html>
  <head>
    <title>My First Page</title>
  </head>
  <body>
    محتوا اینجا قرار می‌گیره
  </body>
</html>

🧱 تگ‌های پایه
🔹 1. div
برای ساختن بخش‌بندی صفحه استفاده میشه

<div>
  این یک بخش از صفحه است
</div>

🔹 2. h1
برای عنوان‌های اصلی استفاده میشه

<h1>سلام به دنیای وب</h1>

🔹 3. p
برای متن‌های معمولی استفاده میشه

<p>این یک متن ساده است</p>

🔹 4. span
برای متن‌های کوچک داخل یک جمله استفاده میشه

<p>سلام من <span>حامد</span> هستم</p>

🎯 تمرین امروز
یک فایل HTML بساز و داخلش این کارها رو انجام بده:
یک عنوان با h1
یک متن با p
یک بخش با div
داخل یک متن از span استفاده کن
هدف امروز:
فقط اینو بفهمی که HTML یعنی: 👉 ساختار دادن به صفحه، نه ظاهرش

#html_lessons@devsourcech

نکته : HTML زبان برنامه‌نویسی نیست، مارک اپ و ساختاردهی است 📝🏗️
#hints@devsourcech

🌐
#معرفی_وبسایت_فرانت_اند@devsourcech

دوستان برای تمرین هم میتونید از سایت freecodecamp.org 🎓 استفاده کنید