#debug #challenge #javanoscript
🐞 دوستان توی کد پایین چند تا مشکل ریز وجود داره برسی کنید و دیباگ کنید و داخل کامنت ها بگین و کد رو شرح بدید.
🔍 صورت مسئله:
یک تابع محاسبه جمع اعداد در یک آرایه برای شما پیاده‌سازی شده است. اما یک یا چند خطا در کد وجود دارد که منطق اجرایی را به هم می‌ریزد. شما باید این خطا‌ها را پیدا کنید و تصحیح کنید تا تابع به صورت صحیح عمل کند.💻 کد:
function calcuteSum(array) {
var total = 0;
for (var i = 0; i <= array.lenght; i++) {
total += array[i];
}
return totl;
}
const result = calcuteSum([1, 2, 3, 4, 5]);
console.log('The sum of the array is:', result);🔧 اگه ببینم این پست مورد پسندتون بود، ادامه میدیمش و سخت تر و جالب تر میکنیمش.
👍43
#javanoscript
👨🏻💻 JSchallenger
این سایت به شما معرفی مختصری از مفاهیم اولیه در زبان برنامه نویسی جاوا اسکریپت می دهد. این سایت ویژگی های زیر را ارائه می دهد:
- تمرین های کدنویسی
- آموزش گام به گام
- پروفایل شخصی🔗 لینک سایت
✍🏽 ¦ @DevYara
👍32❤1
70-JavaScript-Interview-Questions-Ditty_ir.pdf
12 MB
#javanoscript
⛈️ 70 سوال مصاحبه ای جاوااسکریپت همراه با توضیح
بسیار کامل و جامع هست، حتمی یکجا سیو کنید.
منبع: ditty.ir
✍🏽 ¦ @DevYara
👍33❤🔥11⚡1
#react
زیباترین React Icon Library!!
🟣 27000+ آیکون زیبا🔵 بیش از 3800 آیکون رایگان
🟡 SVG، React، React Native، npm
🔗 hugeicons.com
✍🏽 ¦ @DevYara
🔥33👍5
#FrontEnd
مسیر 160 روزه یادگیری FrontEnd
روز 1 تا 5 : یادگیری HTML
روزه 5 تا 15 : یادگیری Css
روز 15 تا 20 : طراحی ریسپانسیو
روز 20 تا 30 : یادگیری Flex و Css Grid
روز 30 تا 50 : تمرین و پروژه
روز 50 تا 70 : یادگیری تیلویند / بوت استرپ
روز 70 تا 80 : یادگیری Sass / less
روز 80 تا 110 : یادگیری جاوااسکریپت
روز 110 تا 150 : یادگیری React
روز 150 تا 160 : یادگیری Git و Github
روز 160 به بعد : ساخت پروژه و تمرین
✍🏽 ¦ @DevYara
🔥41👍8😁4💔1
This media is not supported in your browser
VIEW IN TELEGRAM
#vscode
پلاگین "px to rem"
این افزونه به شما امکان تبدیل px به rem و بالعکس را می دهد.
Alt+Z Px - rem، rem - px🌀 دانلود این افزونه
✍🏽 ¦ @DevYara
👍34🔥4❤🔥3⚡1😁1
#jest #javanoscript
🌟 تست نویسی: راهی برای اطمینان از عملکرد بهتر برنامه‌نویسی!
چرا تست نویسی؟ 🤔🛠️
تست نویسی یک عنصر بسیار اساسی در فعالیت برنامه‌نویسان است که به آنها کمک می‌کند از عملکرد صحیح و پایدار نرم‌افزار اطمینان حاصل کنند. این هنر به برنامه نویسان امکان می‌دهد با اعتماد بالا به کد خود و توانایی جلب توجه جامعه برنامه‌نویسی، خدمتی بی‌نظیر ارائه دهند. 🧪🖥️🌿 تعریف تست نویسی :
تست نویسی، فرایندی است که در آن محدوده عملکرد نرم‌افزار به صورت خودکار یا دستی بررسی می‌شود. در حقیقت، تست نویسی به انجام عملیات آزمایشی روی کد و بازیابی نتایج و تطابق آنها با خروجیهای مورد انتظار اختصاص دارد.مزایای ایجاد تست‌های قوی! 💪🚀
- افزایش اطمینان از خواص عملکردی برنامه
- کاهش زمان و هزینه‌های لازم برای اصلاح باگ‌ها
- ایجاد کد قابل نگهداری و توسعه
🧩 حالا jest چیست؟
یک فریمورک محبوب برای نوشتن تست در جاوا اسکریپت است که با تمامی فریمورک های محبوب جاوا اسکریپت مثل React, Angular, Vue, Node و … کار میکنه.✍🏽 ¦ @DevYara
منبع برای یادگیری jest در یوتیوب
❤🔥37👍4
#Text
زیر این پست فیلم یا سریال مورد علاقتون رو بنویسید، سعی کنید تکراری نباشه...
👍27
#Telegram
⭕️ سرچ جهانی با هشتگ در تلگرام
پاول دورف، گفته که آخر این ماه(میلادی) با زدن روی هشتگ در هر پستی، میتونی یه عالمه پست دیگه از تمام کانال های عمومی رو با همون هشتگ پیدا کنی!
یعنی کافیه روی یه هشتگ بزنی و غرق توی یه دنیای از مطالب جذاب بشی!
این قابلیت جدید، یه قدم دیگه، تلگرام رو به پلتفرمی فوق العاده برای کشف محتواهای تازه و سرگرم کننده تبدیل میکنه.
منتظر این آپدیت خفن باشید!
➖➖➖➖➖➖➖➖➖➖➖➖
✍🏽 ¦ @DevYara
🔥51👍4
#debug #challenge #javanoscript
🛠 چالش دیباگ کد 🛠
📝 صورت مسئله:
ما یک صفحه وب ساده داریم که با فشردن دکمه "Fetch Data" باید اطلاعاتی را از یک API دریافت کند و آنها را در صفحه نمایش دهد. اما به نظر می‌رسد که کد JavaScript دچار مشکلی است و اطلاعات به درستی نمایش داده نمی‌شود. وظیفه شما این است که مشکل را پیدا کرده و کد را اصلاح کنید تا داده‌ها به درستی نمایش داده شوند.📄 کد HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<noscript>Debug Challenge</noscript>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div id="app">
<h1>Welcome to Debug Challenge!</h1>
<button id="fetch-data">Fetch Data</button>
<div id="data"></div>
</div>
<noscript src="noscript.js"></noscript>
</body>
</html>
🎨 کد CSS
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
#app {
background: #fff;
padding: 20px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
text-align: center;
}
button {
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
}📜 کد JavaScript
document.getElementById('fetch-data').addEventListener('click', function() {
fetchData();
});
function fetchData() {
fetch('https://jsonplaceholder.typicode.com/posts')
.then(response => response.json())
.then(data => {
let output = '<h2>Posts</h2>';
data.forEach(post => {
output += `
<div>
<h3>${post.noscript}</h3>
<p>${post.body}</p>
</div>
`;
});
document.getElementById('data').innerHTML = output;
})
.catch(error => {
console.error('Error fetching data:', error);
});
}🔍 نکات:
کد HTML، CSS، و JavaScript را بررسی کنید.
دکمه "Fetch Data" را کلیک کنید و رفتار صفحه را مشاهده کنید.
اگر صفحه به درستی داده‌ها را نمایش نمی‌دهد، خطای موجود در کنسول مرورگر را چک کنید.
موفق باشید! 💪
🔥29👍6
#JobSkills #Cv
نکات رزومه نویسی ‼️
آیا می‌دانستید؟ هر شرکتی روزانه هزاران رزومه دریافت می‌کند! 📑 بیشتر آنها در بررسی سیستمی رد می‌شوند و در بررسی انسانی نیز معمولاً بیشتر از نصف صفحه اول خوانده نمی‌شود! 📉واقعیت این است که هدف رزومه فقط ورود به مصاحبه است و ادامه داستان در مصاحبه انجام می‌شود. رزومه شما باید این نکات را داشته باشد:
1. کلمات کلیدی و مهارتی مرتبط 🔑
- مطمئن شوید که کلمات کلیدی و مهارت‌های مرتبط با شغلی که برای آن اپلای می‌کنید، در رزومه شما وجود داشته باشد. این به شما کمک می‌کند تا در بررسی سیستمی هماهنگی بیشتری با آگهی کار داشته باشید.2. جواب دادن به سوال "چرا باید شما را استخدام کنند" 📋
- در نیم صفحه اول، به صورت غیر مستقیم به این سوال پاسخ دهید. این کار را می‌توانید با روش‌های زیر انجام دهید:
1. تاثیرگذاری در کارهای قبلی 📈
- توضیح دهید در کارهای قبلی یا دانشگاه چه کار مفیدی انجام داده‌اید و چه تاثیری در پروژه‌ها داشته‌اید.
2. استفاده از اعداد و ارقام 📊
- با عدد و رقم صحبت کنید؛ مثلاً چند درصد کارایی سیستم با کمک کار تیمی شما افزایش یافته است.
3. نشان دادن علاقه به تکنولوژی‌های شرکت 💻
- علاقه خود را به تکنولوژی‌های مورد استفاده در آن شرکت نشان دهید.
و در نهایت، می‌توانید با کمک ChatGPT رزومه‌تان را برای هر شغلی شخصی‌سازی و حرفه‌ای کنید و برای مصاحبه آماده شوید. 🚀
✍🏽 ¦ @DevYara
👍35❤🔥4
#tools
⭕️ این سایت براتون یک اسکرول بار می‌سازه و در پایان میتونید کد Css آن رو بگیرید و استفاده کنید
scrollbar.app
➖➖➖➖➖➖➖➖➖➖
🔥32👍5