⚛️ قبل از شروع آموزش React اینا رو بلد باش.

نه در حد اینکه اسمشون رو شنیده باشی:

DOM
Event
Promise
async/await
Array Methods
Destructuring
Modules
Scope
Closure
Fetch API

چون React قرار نیست JavaScript رو برات یاد بگیره.

اگر JavaScript رو نفهمیده باشی،
React
فقط مشکل رو پیچیده‌تر می‌کنه.

📌 این پست رو برای کسی بفرست که تازه می‌خواد React شروع کنه.

#JavaScript #React #فرانت_اند #جاوااسکریپت #یادگیری_برنامه_نویسی #برنامه_نویسی

⚡️ Arrow Function

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

function sum(a, b) {
  return a + b;
}

میتونی خیلی خلاصه‌تر بنویسی:

const sum = (a, b) => a + b;

هم کد کوتاه‌تره، هم خواناتر.

📌 فقط یادت باشه Arrow Function همیشه جای Function معمولی رو نمی‌گیره و توی بحث this رفتار متفاوتی داره.

ولی برای اکثر کارهای روزمره، انتخاب فوق‌العاده‌ایه.

#JavaScript #Frontend

اگه می‌خوای Frontend Developer بشی:

❌ هر روز دنبال Framework جدید نباش.

✅ JavaScript
رو عمیق یاد بگیر.

چون Frameworkها عوض می‌شن؛
ولی JavaScript هنوز سر جاشه. 🔥

#Frontend #JavaScript #React #WebDevelopment #برنامه_نویسی

⚡️ Arrow Function

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

function sum(a, b) {
  return a + b;
}

میتونی خیلی خلاصه‌تر بنویسی:

const sum = (a, b) => a + b;

هم کد کوتاه‌تره، هم خواناتر.

📌 فقط یادت باشه Arrow Function همیشه جای Function معمولی رو نمی‌گیره و توی بحث this رفتار متفاوتی داره.

ولی برای اکثر کارهای روزمره، انتخاب فوق‌العاده‌ایه.

#JavaScript #Frontend

🔥 این ترفند JavaScript رو خیلی‌ها نمی‌دونن

فرض کن اینو داری:

const user = {
  name: "Ali",
  age: 22
};



می‌خوای name رو ازش بگیری.
احتمالاً می‌نویسی:

const name = user.name;



اما می‌تونی خیلی تمیزتر بنویسی:

const { name } = user;



این قابلیت اسمش Destructuringـه.

حتی می‌تونی چندتا مقدار بگیری:

const { name, age } = user;



و جالب‌تر اینکه می‌تونی اسم متغیر رو هم عوض کنی:

const { name: username } = user;





console.log(username);



📌 اینو زیاد توی React، کار با API و پروژه‌های واقعی می‌بینی.
اگر JavaScript می‌زنی، Destructuring از اون چیزهاییه که باید واقعاً بلد باشی، نه فقط اسمش رو شنیده باشی.

#JavaScript #JS #Frontend #React
#Programming #کدنویسی #برنامه_نویسی #Codelines

«اگر فقط ۳ ماه وقت داشتی برای ورود به بازار کار آماده بشی...»

این کارها رو می‌کردم:

ماه اول:
JavaScript + Git + API
ماه دوم:
React + یک پروژه واقعی
ماه سوم:
TypeScript + next + پروژه دوم + Portfolio + تمرین مصاحبه

نه اینکه:
۵ Framework
۳ زبان
۱۰ دوره
رو نصفه شروع کنم.

هدف ورود به بازار کاره، نه جمع کردن تکنولوژی.

#بازار_کار #مسیر_یادگیری #Frontend #JavaScript #React #Programming #Codelines

🔥 ۷ چیزی که قبل از استخدام شدن به‌عنوان Frontend Developer باید بلد باشی

Git و GitHub
کار با API
Authentication
مدیریت State
Error Handling
Debugging
Deploy کردن پروژه

ولی نکته اینجاست 👇
خیلی‌ها اینا رو تئوری بلدن.

ولی وقتی میگی:
«خب حالا یه پروژه از صفر بساز.»
گیر میکنن
اینجاست که تفاوت بلد بودن و تونستن مشخص میشه.

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

#برنامه_نویسی #فرانت_اند #جاوااسکریپت #Frontend #JavaScript #React #Git #GitHub #برنامه_نویس #بازار_کار #استخدام #Codelines

اگه می‌خوای Frontend Developer بشی:

❌ هر روز دنبال Framework جدید نباش.

✅ JavaScript
رو عمیق یاد بگیر.

چون Frameworkها عوض می‌شن؛
ولی JavaScript هنوز سر جاشه. 🔥

#Frontend #JavaScript #React #WebDevelopment #برنامه_نویسی

🤔 null و undefined
چه فرقی دارن؟

این دوتا خیلی شبیه هم به نظر میان، ولی
یکی نیستن!

let name;

console.log(name);



خروجی:
undefined

یعنی هنوز هیچ مقداری به متغیر ندادی.
حالا اینو ببین:

let name = null;



اینجا خودت عمداً گفتی که این متغیر فعلاً هیچ مقداری نداره.

💡 خلاصه:
✅ undefined = هنوز مقداردهی نشده.

✅ null = عمداً خالیه.

همین تفاوت کوچیک، موقع کار با APIها
خیلی مهم میشه.

#JavaScript #Frontend

🤔 Library
و Framework چه فرقی دارن؟

خیلی ساده:

🔹 Library → تو تصمیم می‌گیری کِی ازش استفاده کنی.
🔹 Framework → ساختار و جریان کلی پروژه بیشتر توسط Framework
مشخص میشه.

مثلاً در دنیای Front-End:
React
معمولاً به‌عنوان Library شناخته میشه،

در حالی که Next.js یک Framework بر پایه React محسوب میشه.

📌 این تفاوت رو برای مصاحبه هم بلد باش.

#React #NextJS #JavaScript #فرانت_اند #برنامه_نویسی #FrontEnd

🔥 چرا از Template Literal استفاده کنیم؟

قبلاً برای چسبوندن متن‌ها این شکلی می‌نوشتیم:

let name = "Ali";

console.log("سلام " + name);


ولی الان یه راه تمیزتر داریم:

let name = "Ali";

console.log(`سلام ${name}`);



مزیتش چیه؟ 🤔

✅ خواناتر میشه.
✅ نوشتن متن‌های چندخطی راحت‌تره.
✅ دیگه لازم نیست هی از + استفاده کنی.
از ES6 به بعد، این روش استاندارد پروژه‌های جدیده.

#JavaScript #ES6