CodeHub
225 subscribers
141 photos
14 videos
2 files
162 links
آیا علاقه‌مند به خلق دنیایی بهتر هستی؟

برنامه نویسی کلید خلاقیت بی‌حد و حصر است🚀⚡️

🧑‍💻 @farzinhamzehi
Download Telegram
Forwarded from تِکبوکولوژی | Techbookology (Mahdi Jafari)
یه لیست فوق‌العاده از ۱۰۰ پروژه در دسته‌های مختلف که کمک می‌کنه در هر سطحی هستید، بتونید مهارت برنامه‌نویسیتون رو بهبود بدید

اگر دنبال ایده برای پروژه هستید از دستش ندید

https://github.com/florinpop17/app-ideas


@Techbookology
چند تا ترفند باحال برای افزایش سرعت اجرای برنامه‌های Next.js , این نکات به بهبود عملکرد برنامه‌ها کمک می‌کنن :

1️⃣ استفاده کمتر از useEffect: اگر بخشی از کدتون رو می‌شه خارج از useEffect مدیریت کرد، حتماً این کار رو بکنید تا رندر اولیه سریع‌تر انجام بشه.

2️⃣ استفاده از next/image: این کامپوننت تصاویر رو به صورت بهینه و lazy load بارگذاری می‌کنه که باعث می‌شه صفحه سریع‌تر نمایش داده بشه. 📸

3️⃣ انتقال محاسبات به سرور: سعی کنید کدهای سنگین محاسباتی رو به سمت سرور بفرستید تا کلاینت از بار اضافی رهایی پیدا کنه.

4️⃣ استفاده از getStaticProps: با این متد، محتواها در زمان build به صورت استاتیک تولید می‌شن، در نتیجه زمان بارگذاری صفحات کاهش پیدا می‌کنه. 🚀

5️⃣ بهینه‌سازی فونت‌ها: انتخاب فونت‌های مناسب و کاهش درخواست‌های اضافی فونت می‌تونه تاثیر زیادی در سرعت لود صفحه داشته باشه.

6️⃣ فشرده‌سازی (compress) و کشینگ: فعال کردن این فیچرها باعث می‌شه تا حجم فایل‌ها کاهش پیدا کنه و کاربرها سریع‌تر به اطلاعات دسترسی پیدا کنن. ⚡️

7️⃣ استفاده از dynamic imports: کدهایی که نیازی به بارگذاری همزمان با صفحه ندارن رو به صورت دینامیک ایمپورت کنید تا تنها زمانی که نیاز هست، لود بشن. 📦

8️⃣ بهینه‌سازی استایل‌ها: استفاده از روش‌های مدرن مثل CSS-in-JS یا استفاده از استایل‌های کم‌حجم، به کاهش زمان رندر کمک می‌کنه.

9️⃣ به کارگیری CDN: استفاده از Content Delivery Network برای فایل‌های استاتیک مثل تصاویر و ویدئوها، زمان بارگذاری رو به طرز چشمگیری کم می‌کنه. 🌐

برای اطلاعات بیشتر می‌تونید این مقاله جالب رو مطالعه کنید: لینک مقاله 📚

🔵 <CodeHub/>
3👍1🔥1
🚀 #WorldBackupDay
۳۱ مارس - روز جهانی بکاپ , امروز یه یادآوری برای همه ست که از داده‌های ارزشمندشون نسخه پشتیبان (بکاپ) تهیه کنن!

آمار جالب درباره بکاپ :
۳۰٪ افراد هیچ‌وقت از اطلاعاتشون بکاپ نمی‌گیرن!
۲۹٪ از مواقع، از دست دادن داده‌ها به دلیل خطای انسانی اتفاق می‌افته!
۱۱۳ تلفن در دقیقه گم یا دزدیده می‌شن! 📱
۶۰٪ از شرکت‌هایی که اطلاعات مهمشون رو از دست میدن، طی ۶ ماه تعطیل میشن!

📌 امروز وقتشه که یه بکاپ از اطلاعات مهمت بگیری و خیال خودتو راحت کنی! 😉💾
👍1
بخونید جالبه
The difference between a $120K developer and a $250K tech lead isn't coding skills.

It's this one thing:

Communication.

Specifically, how you translate technical concepts into business value.
I've watched brilliant coders get stuck at mid-level while others with average technical skills zoom past them into leadership roles.

The secret? Senior developers understand that leadership doesn't speak "code" - they speak business outcomes.

Let me show you what this looks like:
JUNIOR DEV: "We need to refactor our authentication service because the JWT implementation has significant technical debt. The current singleton pattern is causing memory leaks."
[Leadership's reaction: blank stares, immediate mental checkout]

SENIOR DEV: "Our user login system is at risk of failing during peak traffic, which could cost us $20K per hour in lost transactions. I've identified a two-week solution that would prevent these outages AND reduce our AWS costs by 15% monthly."
[Leadership's reaction: immediate prioritization and resources]

After observing successful senior devs, I've identified their 3-part "Business Translation Framework":
1️⃣ Business Impact First - Always lead with cost, revenue, risk, or time savings
2️⃣ Stakeholder-Specific Language - Executives care about strategy, PMs care about features, designers care about user experience
3️⃣ Visual Simplification - Use analogies and simple diagrams ("Our current architecture is like a single-lane highway during rush hour")

The truth is, your technical expertise only matters if others understand its value. The career multiplier isn't writing more code - it's communicating that code's value to decision-makers.
👍7
#js

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

🔴<CodeHub/>
3
CodeHub
یه ویدئوی عالی درباره‌ی نحوه کار Event Loop، Web APIs و Task Queue در جاوااسکریپت که خیلی جالب بود! https://youtu.be/eiC58R16hb8?si=rFgZIo_I0Lh3rQ03 🔴<CodeHub/>
جاوااسکریپت یک زبان تک‌ترد است، به این معنی که در هر لحظه فقط می‌تواند یک عملیات را اجرا کند. برای مدیریت عملیات‌های غیرهم‌زمان (asynchronous)، مفاهیمی مانند حلقه رویداد (Event Loop)، وب APIها (Web APIs) و صف‌های وظیفه (Task Queues) در این زبان وجود دارند.

پشته فراخوانی (Call Stack): محل ذخیره‌سازی توابعی است که قرار است اجرا شوند. هر زمان که تابعی فراخوانی می‌شود، به بالای پشته افزوده می‌شود و پس از اتمام اجرا، از پشته خارج می‌شود.

وب APIها (Web APIs): مرورگرها مجموعه‌ای از APIها را فراهم می‌کنند که امکان انجام عملیات‌های غیرهم‌زمانی مثل تایمرها (setTimeout)، درخواست‌های شبکه‌ای (fetch) و مدیریت رویدادها را می‌دهند. این عملیات‌ها خارج از پشته فراخوانی و در محیط مرورگر انجام می‌شوند.

صف وظایف (Task Queue): زمانی که یک عملیات غیرهم‌زمان به پایان می‌رسد، تابع بازگشتی آن در صف وظایف قرار می‌گیرد تا زمانی که پشته فراخوانی خالی شود، در نوبت اجرا قرار گیرد.

حلقه رویداد (Event Loop): مکانیزمی است که به‌طور مداوم بررسی می‌کند آیا پشته فراخوانی خالی است یا خیر. اگر خالی باشد، اولین تابع از صف وظایف را به پشته اضافه کرده و اجرا می‌کند. این فرایند به جاوااسکریپت این امکان را می‌دهد که عملیات‌های غیرهم‌زمان را مدیریت کند و یک رابط کاربری پاسخ‌گو ایجاد نماید.

صف میکروتسک‌ها (Microtask Queue): این صف حاوی وظایفی با اولویت بالاتر است، مانند توابع بازگشتی مربوط به Promiseها. حلقه رویداد ابتدا تمام میکروتسک‌ها را قبل از پردازش تسک‌های عادی از صف وظایف اجرا می‌کند.

🔴<CodeHub/>
🔥6
‏من کتاب مهندسی پرامپت گوگل که چند روزه وایرال شده رو به فارسی ترجمه کردم و گذاشتم روی گیتهاب.

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

بخونین و به اشتراک بذارید
https://teal33t.github.io/prompt-engineering/

@DevTwitter | <Saman/>
👍3
برخلاف نظرات این همه آدم مبنی بر یاد نگرفتن Programming حالا نظر مدیر عامل GitHub برعکس هست، میگه از دوران کودکی باید Programming در مدرسه آموزش داده بشه چون آینده در اختیار Software خواهد بود و هرکسی میتونه وارد این فضا بشه و با AI این امکان راحت تر شده.

https://www.youtube.com/watch?v=5UhnQ2h-5BY

@DevTwitter | <Max Shahdoost/>
👍2
🔥 یه ابزار خفن برای دولوپرای React!
اگه می‌خوای بدون دردسر بفهمی کدوم کامپوننت‌ها توی پروژه‌ت باعث کندی شدن اپ شدن، React Scan رو از دست نده!

🧠 چی کار می‌کنه؟
ابزار React Scan به‌صورت خودکار مشکلات پرفورمنس رو توی اپ Reactت شناسایی می‌کنه. لازم نیست هیچ تغییری تو کدت بدی یا دیباگرهای پیچیده استفاده کنی. فقط اسکریپتش رو بذار، خودش باقی کارا رو انجام می‌ده 😎

بدون نیاز به تغییر کد
کامپوننت‌هایی که نیاز به بهینه‌سازی دارن رو هایلایت می‌کنه
با همه‌چی سازگاره: Next.js، Vite، Remix و حتی با یه تگ ساده <script> توی HTML هم راه می‌افته!

دموی آنلاینشم داره،
🧪 لینک دمو

🔵 <CodeHub/>
👍5
This media is not supported in your browser
VIEW IN TELEGRAM
این کتابخونه ی FastAPI-MCP خیلی کار و آسون کرده..

یه نگاهی بش بندازین، باش می‌تونین به‌صورت خودکار تمام endpoint‌هاتون رو به ابزار MCP تبدیل کنین

لینکش:
https://github.com/tadata-org/fastapi_mcp

@DevTwitter | <Sam92/>
تفاوت بین SSR, CSR, SSG و ISR : بررسی دقیق و کاربردی

بعضی وقتا توی دنیای وب، وقتی میخوایم سایت‌هامون رو بسازیم، با اصطلاحاتی مثل SSR، CSR، SSG و ISR روبه‌رو میشیم. اما اینا چیا هستن و چه تفاوت‌هایی با هم دارن؟ 🤔

🔸 (رندر سمت کلاینت) CSR :
در این روش، محتوا در مرورگر کاربر با استفاده از جاوا اسکریپت رندر میشه. در اینجا، سرور فقط داده‌های خام رو میفرسته و بارگذاری صفحه با استفاده از جاوا اسکریپت و استایل‌ها در مرورگر کاربر اتفاق میفته. این روش برای اپلیکیشن‌های پیچیده و با محتوای پویا مناسب‌تره، ولی یه مشکل اصلی داره: SEO به خاطر اینکه موتورهای جستجو نمی‌تونن محتوای جاوا اسکریپت رو درست ایندکس کنن.


🔸 (رندر سمت سرور) SSR :
این روش یه مزیت بزرگ برای سئو داره چون محتوای HTML قبل از ارسال به مرورگر روی سرور رندر میشه. یعنی سرور مسئولیت ساخت محتوای صفحه رو بر عهده می‌گیره و به کاربر یک صفحه کامل و آماده میده. البته بار سرور بالا میره و ممکنه واکشی داده‌ها زمان‌بر بشه.


🔸 (تولید سایت ایستا) SSG :
در این روش، تمام صفحات سایت در زمان ساخت به صورت HTML ایستا رندر میشن. این یعنی صفحات از قبل آماده‌سازی میشن و وقتی کاربر درخواست میده، سریع بهش داده میشه. این استراتژی برای سایت‌هایی که نیاز به محتوای ثابت دارن عالیه، چون بارگذاری خیلی سریع‌تره و امنیت بیشتره.


🔸(بازسازی استاتیک افزایشی) ISR :
این روش ترکیبی از SSR و SSG هست. یعنی میشه صفحات ایستا رو پیش از زمان ساخت آماده کرد و به‌طور دوره‌ای صفحات خاصی رو با داده‌های جدید به‌روز کرد. این مدل برای سایت‌هایی که هم نیاز به سرعت بالا و هم نیاز به داده‌های به‌روز دارند، بهترین گزینه است.


🕔 زمان مناسب استفاده از هر کدوم:

🔹 (رندر سمت کلاینت) CSR: برای اپلیکیشن‌های پیچیده و پویا

🔹 (رندر سمت سرور) SSR: برای سایت‌هایی که نیاز به SEO بالا و سرعت بارگذاری اولیه دارند

🔹 (تولید سایت ایستا) SSG : برای سایت‌های ثابت و کم تغییر

🔹 (بازسازی استاتیک افزایشی) ISR : برای سایت‌هایی که نیاز به محتوای ثابت و به‌روز دارند بدون نیاز به استقرار مجدد


🔵 <CodeHub/>
🔥5👍2
اگر از Git استفاده می‌کنید، احتمالاً با gitignore. آشنا هستید. ولی یه فایل دیگه هم هست به اسم exclude
حالا این دوتا چه فرقی دارن؟

gitignore.
این فایل توی ریشه‌ی پروژه‌ است و برای نادیده گرفتن فایل‌هایی استفاده میشه که همه‌ی اعضای تیم نباید پیگیری‌شون کنن. خودش هم commit میشه و داخل repo میمونه.

exclude
مسیرش توی git/info/exclude. هست و فقط روی سیستم شخصی شما تأثیر داره. ایده‌آله برای فایل‌هایی که فقط خودت نمی‌خوای track بشن، بدون اینکه توی repo دیده بشن.

پس اگر فایل لوکال خاصی داری و نمی‌خوای توی gitignore. بذاری، برو سراغ exclude

@DevTwitter | <Amir Mohammad Rezvaninia/>
👍2👌2
Forwarded from IranCoderz (Farid Ghaderi)
This media is not supported in your browser
VIEW IN TELEGRAM
بدین شکل می‌تونید از هر رپو گیت‌هابی که می‌خواید یک ویکی درست کنید.

🆔 @IranCoderz | 👩‍💻🧑‍💻
2
🚀 فایرفاکس سورس‌کدش رو پابلیک کرده!
می‌خوای ببینی یه مرورگر واقعی چجوری ساخته می‌شه؟
https://github.com/mozilla-firefox/firefox
🔥1🤓1
Forwarded from جادی | Jadi
#خبر #لینک

نمودار تعداد سوال‌های سایت استک اورفلو (که زمانی اصلی‌ترین مرجع بحث و سوال و جواب برنامه‌نویسی بود) در طول زمان.

به نظر می‌رسه که خیلی زودتر از پیش‌بینی‌ها، مدل‌های زبانی بزرگ استک اورفلو رو از دور خارج کردن؛ اما سوال جالبتر اینه که مدل‌های زبانی بزرگ که با خوندن چیزهایی مثل استک اورفلو برنامه نویس شدن، قراره در آینده با خوندن چی رشد کنن؟ تولیدات خودشون؟ شاید.

https://blog.pragmaticengineer.com/stack-overflow-is-almost-dead/
Forwarded from IranCoderz (Farid Ghaderi)
گرفتن مصاحبه شغلی با هوش‌مصنوعی رو کم داشتیم که خداروشکر داره بین شرکت‌ها راه میوفته.
خیلی جالب و در عین حال ترسناکه🫣

🆔 @IranCoderz | 👩‍💻🧑‍💻
😨8
#Figma_Template

Figma Template: Carea (Car Marketplace)

Difficulty :  ⭐️⭐️⭐️⭐️⭐️

🔗Click for Get Link

🔴 </CodeHub>
🔥2