🧹 ۱۰ نشونه که کدت نیاز به Refactor داره

یک Function خیلی بزرگه
یک کد چند بار تکرار شده
اسم متغیرها نامفهومه
شرط‌های تو در تو زیادن
تغییر یک چیز چند فایل رو خراب می‌کنه
یک فایل هزاران خط شده
Function چند کار مختلف انجام میده
کامنت‌های عجیب برای توضیح کد لازم شده
حذف یک Feature خیلی سخت شده
خودت از خواندن کد می‌ترسی

📌 Refactor
یعنی بهتر کردن ساختار کد، بدون تغییر رفتار اصلی برنامه.

#CleanCode #Refactoring #Programming #Developer #کدنویسی

😵‍💫 چرا با اینکه زیاد آموزش می‌بینی، هنوز نمی‌تونی پروژه بزنی؟

شاید مشکل از هوش یا استعدادت نباشه.
مشکل اینه که بیشتر وقتت صرف دیدن آموزش میشه، نه ساختن.

یک آموزش ۲ ساعته می‌بینی و آخرش حس می‌کنی خیلی چیزها یاد گرفتی.

اما وقتی صفحه رو می‌بندی و می‌خوای خودت شروع کنی، نمی‌دونی از کجا.

این یعنی باید نسبتِ «آموزش دیدن» به «تمرین کردن» رو تغییر بدی.

📌 آموزش باید شروع یادگیری باشه، نه پایانش.

#برنامه_نویسی #یادگیری #فرانت_اند #Frontend #Developer

📲 می‌دونستی بخش زیادی از سایت‌های معروفی که هر روز می‌بینی، با React و next ساخته شدن؟

🏆 از اینستاگرام و دیجی‌کالا گرفته تا کلی وب‌سایت و اپلیکیشن محبوب، React , next یکی از تکنولوژی‌های پرکاربرد برای ساخت رابط کاربریه.

🔥 اگه به دنیای فرانت‌اند علاقه داری، React , next یکی از مهم‌ترین تکنولوژی‌هاییه که باید یاد بگیری!

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

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

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

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

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

«اگه برنامه‌نویسی بلدی، این ۷ کار رو می‌تونی بفروشی»

خیلی‌ها فکر می‌کنن برای درآمد گرفتن باید حتماً پروژه‌های خیلی بزرگ بگیرن.

درحالی‌که کلی کار کوچک وجود داره:

🔹 تبدیل Figma به سایت
🔹 رفع Bug
🔹 ساخت Landing Page
🔹 اتصال API
🔹 ساخت Dashboard
🔹 بهینه‌سازی سرعت
🔹 اضافه کردن Feature به پروژه موجود

اولین پول برنامه‌نویسی‌ات قرار نیست از یک پروژه ۵۰۰ میلیونی بیاد.

از حل یک مشکل واقعی شروع میشه.

#درآمد_برنامه_نویسی #فریلنسری #برنامه_نویسی #Frontend #Developer #Codelines

📄 اگه فریلنسری کار می‌کنی، اینو جدی بگیر!

قبل از اینکه پروژه رو شروع کنی، حتماً یه قرارداد داشته باش.

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

باور کن یه قرارداد ساده، می‌تونه جلوی کلی دردسر و بحث بیخودی رو بگیره. 😉

⏳ «وقت ندارم برنامه‌نویسی یاد بگیرم!»

لازم نیست هر روز ۵ ساعت وقت بذاری.

اگر روزی فقط ۴۵ دقیقه وقت داری:
۱۵ دقیقه → یادگیری
۲۰ دقیقه → کدنویسی
۱۰ دقیقه → مرور

بعد از چند ماه، همین زمان‌های کوچک جمع میشن.

📌 مشکل خیلی وقت‌ها کمبود زمان نیست؛

نداشتن برنامه مشخصه.

🕵️ می‌خوای بفهمی یک سایت با چی ساخته شده؟

این ابزارها رو امتحان کن:

🔍 Wappalyzer 🔍 BuiltWith 🔍 WhatRuns

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

Framework
CMS
Analytics
Server
CDN
و تکنولوژی‌های استفاده‌شده
پیدا کنی.

📌 برای تحقیق و بررسی سایت‌های مختلف خیلی کاربردیه.

#Wappalyzer #WebDevelopment
#Frontend #برنامه_نویسی #Developer #توسعه_وب

از کجا شروع کنیم؟

خب، حالا که فهمیدیم فرانت‌اند چیه...
سؤال بعدی:
از کجا باید شروع کنیم؟
مسیر شروع فرانت‌اند اینه:
HTML CSS
⬇️
JavaScript
⬇️
React , typescript
⬇️
nextjs
⬇️
git github

نکته مهم اینجاست:
لازم نیست روز اول بری React بخونی.
لازم نیست Next.js بلد باشی.
لازم نیست حتی بدونی GitHub چیه.

هیچی لازم نیست بدونی فقط خواستم مسیر رو برات روشن کنم چون من همه رو بدون اینکه اصلا هیچی بدونی با کلی پروژه تمرین یادت میدم

و دقیقاً به همین دلیل شروع برنامه‌نویسی خیلی ساده‌تر از چیزیه که وقتی اسم ۲۰ تا تکنولوژی رو کنار هم می‌بینی فکر می‌کنی.

حالا سؤال بعدی:
چقدر طول می‌کشه یاد بگیری؟

چقدر طول می‌کشه؟

این یکی از پرتکرارترین سؤال‌هاست:
چقدر زمان می‌بره فرانت‌اند یاد بگیرم؟
جوابش بستگی داره به اینکه چقدر وقت بذاری.
ولی یه چیز رو از همین اول بدون:
قرار نیست ۲ هفته‌ای برنامه‌نویس بشی.
و قرار هم نیست ۳ سال صبر کنی تا اولین سایتت رو بسازی.
اگر منظم جلو بری، از همون هفته‌های اول می‌تونی چیزهایی بسازی.
مثلاً:
هفته‌های اول → صفحات ساده
بعدش → سایت‌های خوشگل‌تر
بعدش → سایت‌های تعاملی
بعدش → پروژه‌های واقعی‌تر
پس به جای اینکه بپرسی:
«چند ماه طول می‌کشه حرفه‌ای بشم؟»
این رو بپرس:
«اگه امروز شروع کنم، یک ماه دیگه چه چیزی می‌تونم بسازم؟»
این سؤال خیلی بهتره.

عکس نقشه بالا برای فردیه که هیچ منبع مشخص آموزشی نداره و خودآموز داره مسیر رو بدون برنامه و پشتیبان طی میکنه

۱۰
Extension
کاربردی Chrome برای Developerها

React Developer Tools
Redux DevTools
JSON Viewer
Lighthouse
Wappalyzer
WhatFont
ColorZilla
CSS Viewer
EditThisCookie
VisBug

📌 لازم نیست مرورگرت رو با ۵۰ تا Extension پر کنی؛ فقط چیزهایی رو نصب کن که واقعاً در Workflowت استفاده می‌شن.

#Chrome #DevTools #Frontend #Developer #Programming

❓ برای یادگیری برنامه نویسی فرانت‌اند و طراحی سایت، خودآموز بهتره یا شرکت تو دوره؟

🧠 خودآموز رفتن ممکنه،
اما باید انرژی زیادی بذاری واسه پیدا کردن منابع مطمئن توی این طوفان اطلاعاتی 🌪

📺 آموزشای یوتیوب چطور؟ اونام خوبن ولی:
❌ پراکنده‌ن
❌ بدون پشتیبانی
❌ بدون مسیر مشخص

و نتیجه؟
👉 وقتت می‌ره، انرژیت تموم میشه، ولی پیشرفت کم!

🎯 بهترین کار؟
شرکت تو دوره‌ای که دقیقاً برای بازار کار طراحی شده
نه فقط یادگیری تئوری، بلکه ساختن مسیر شغلی واقعی! 💼💻

✨ من همه‌ی مسیر رو برات چیدم:
ابزارها، تمرین‌ها، پروژه‌ها، پشتیبانی — هر چی لازم داری تا یه برنامه‌نویس حرفه‌ای و درآمدزا بشی 💪💰


https://codelines.ir/package

🌳 اگه Front-End Developer هستی، حداقل این دستورات Gitها رو بلد باش:

clone → گرفتن پروژه
branch → ساخت شاخه
checkout → جابه‌جایی
add → آماده کردن تغییرات
commit → ثبت تغییرات
pull → گرفتن تغییرات
push → فرستادن تغییرات
merge → ترکیب Branchها

❌ Git
فقط push و pull نیست!

📌 Save
کن؛ برای کار تیمی لازمت میشه.

❓ از کجا بفهمم برای برنامه‌نویسی ساخته شدم؟

🧠 لازم نیست از قبل بدونی!
باید امتحانش کنی 💻
فقط یه مدت باهاش کار کن، اگه:

🧱 از ساختن یه چیز جدید لذت بردی
👨‍💼 حس کردی کارت واسه خودته
💸 آزادی مالی برات جذابه
🧩 از حل کردن مشکل‌ها خسته نمی‌شی
🌱 دیدی که داری رشد می‌کنی...

💡 بدون که مسیر درستو پیدا کردی!

✋ هیچ‌کس از اول نمی‌دونه واسه چی ساخته شده،
ولی کسی که امتحان نکنه، هیچ‌وقت نمی‌فهمه! 🚀