چطوری عملکرد و سرعت برنامه‌های فرانت‌اند رو بهتر کنیم؟

پ.ن : دو ، سه صفحه س بده ترنسلیت اگر زبان ت خوب نیست.

#FrontEnd
✦ @programming_codiing

80 سوال مصاحبه فرانت اند با توضیح اختصاصی

مخصوص برای شما 🙃❤️

#FrontEnd
✦ @programming_codiing

💪 3 جمله که ذهنیت یک برنامه‌نویس رو متحول می‌کنه:

1️⃣ "هر برنامه‌نویسی روزی از صفر شروع کرده. تفاوت در اینه که کی تسلیم شد و کی ادامه داد."

2️⃣ "باگ‌ها شکست نیستن، قدم‌های کوچیک برای رسیدن به جواب درست هستن."

3️⃣ "بهترین زمان برای یادگیری برنامه‌نویسی 10 سال پیش بود. دومین بهترین زمان، امروز است."

🎯 امروز رو با یک commit کوچیک شروع کن. حتی 30 دقیقه کدنویسی هم ارزش داره.

✦ @programming_codiing

🚦 Status Code چیست؟

هر بار که مرورگر یا اپلیکیشن شما درخواستی به سرور ارسال می‌کند، سرور یک Status Code (کد وضعیت) برمی‌گرداند تا نتیجه‌ی درخواست را مشخص کند.

به زبان ساده، این کدها به ما می‌گویند:

- ✅ درخواست موفق بوده؟
- ❌ خطایی رخ داده؟
- 🔒 دسترسی مجاز بوده؟
- 🔄 باید به آدرس دیگری برویم؟

---

✅ 200 OK

درخواست با موفقیت انجام شد.

مثال: وارد صفحه‌ی پروفایل می‌شوی و اطلاعات بدون مشکل نمایش داده می‌شود.

---

✅ 201 Created

یک داده‌ی جدید با موفقیت ایجاد شد.

مثال: ثبت‌نام می‌کنی و حساب کاربری جدیدت ساخته می‌شود.

---

🚫 400 Bad Request

درخواست اشتباه یا ناقص است.

مثال: فرم ثبت‌نام را بدون وارد کردن شماره موبایل ارسال می‌کنی.

---

🔒 401 Unauthorized

برای دسترسی باید وارد حساب کاربری شوی.

مثال: بدون لاگین وارد پنل کاربری می‌شوی.

---

⛔ 403 Forbidden

وارد حساب شده‌ای، اما اجازه‌ی دسترسی نداری.

مثال: یک کاربر عادی می‌خواهد وارد پنل مدیریت شود.

---

🔍 404 Not Found

منبع یا صفحه پیدا نشد.

مثال: آدرس "/about-us" را وارد می‌کنی، اما چنین صفحه‌ای وجود ندارد.

---

⚠️ 500 Internal Server Error

مشکل از سمت سرور است.

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

---

💡 نکته

کدهای وضعیت به ۵ دسته تقسیم می‌شوند:

- 1xx → اطلاعات
- 2xx → موفقیت ✅
- 3xx → تغییر مسیر 🔄
- 4xx → خطای کاربر ❌
- 5xx → خطای سرور 🔥


اگر برنامه‌نویس وب باشی، شناخت این کدها موقع کار با APIها و رفع خطاها ضروری است.

✦ @programming_codiing

ما همانی می‌شویم که تمام روز به آن می‌اندیشیم...

✍ #فلورانس_اسکاول_شین

@programming_codiing

چطور بهتر یاد بگیریم؟

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

توی این ویس از کتاب «یاد بگیرید چگونه یاد بگیرید» می‌شنوی:
✨ دو حالت مهم ذهن در یادگیری
✨ چرا فراموش می‌کنیم و چطور جلوی اون رو بگیریم
✨ تکنیک پومودورو برای تمرکز
✨ ترفندهایی برای مبارزه با اهمال‌کاری
✨ نقش خواب در تثبیت آموخته‌ها

✦ @programming_codiing

آرشیو کتاب ها و دوره های رایگان برنامه نویسی🔥

توی این پست یه آرشیو بهتون معرفی میکنم که بهتون منابعی نظیر کتاب‌ها و دوره‌های رایگان برای زبان‌ها و تکنولوژی‌هایی مثل پایتون، جاوااسکریپت، ری‌اکت، جنگو، لینوکس و ... معرفی می‌کنه. با استفاده از این منابع، به راحتی میتونید مسیر یادگیری خودتون رو بدون هزینه و به زبان فارسی شروع کنید.

🔗 Link

✦ @programming_codiing

از لودینگ های معمولی خسته شدی؟ برو سراغ skeleton 💀

سایت skeletonreact ابزاری برای ایجاد کامپوننت‌های اسکلت انیمیشنی هست و از خروجی در قالب‌هایی نظیر React، ‏React Native‏، Vue و Vanilla HTML پشتیبانی می‌کنه. انیمیشن های اسکلتی رو میتونیم به‌ عنوان جایگزینی برای لودینگ‌های معمولی و خسته کننده در نظر بگیریم، و اونها به ما این قابلیت رو میدن که به کاربران پیش‌نمایشی از ساختار صفحات، مثل مکان‌نماهایی برای متون یا تصاویر ارائه بدیم تا تجربه کاربری بهتری در زمان بارگذاری داده‌ها فراهم بشه.

🔗 Link

✦ @programming_codiing

پول درآوردن يك عملهِ،
نگه داشتن پول يك رفتارهِ،
بیشتر کردن پول يك دانشهِ.

:| تو برنامه نویسی هم همین رو شامل می شه ... . فکر ت

💻 @programming_codiing

پالت رنگی پروژت رو پیدا کن 🩸

سایتی که در این پست بهتون معرفی میکنم، یک ابزار آنلاین برای ایجاد، مشاهده و انتخاب پالت‌های رنگی مناسب برای پروژه هاتون هست.

این سایت به طور خاص برای Tailwind طراحی شده. زمانی که پالت رنگیتون رو انتخاب کردید، این سایت نمونه کدهای مربوط به پیکربندی فایل tailwind.config.js رو برای شما تولید میکنه، تا به راحتی بتونید رنگ‌های سفارشیتون رو به فایل کانفیگ Tailwind اضافه کنید.

🔗 Link

#color #tailwind
✦ @programming_codiing

70 سوال مصاحبه ای جاوااسکریپت همراه با توضیح

صرفا برای مصاحبه نیست و می تونید مطالعه کنید و به دانشتون توی JS بیفزایید.
لذت ببرید❤️

✦ @programming_codiing

با این سایت یه آمار کلی از گیتهابت در بیار 🌪

سایت githubprofileviewer، یک سایت خلاقانه و کاربردیه که شما میتونید با وارد کردن آیدی اکانتتون یا هر اکانت دیگه ای، هر اطلاعاتی که مورد نیازتون هست رو ببینید!

🌐 Website

#github
✦ @programming_codiing

اگه در توسعه پروژتون نیاز به بک اند و دیتابیس داشتید، اما به هر دلیلی دسترسی به بک اند کار نداشتید و از فایربیس , سوپابیس و امثالهم خسته شدید، میتونید از ابزاری به نام Json-Server استفاده کنید و Api های مورد نیاز پروژتون رو توسعه بدید.

خب JSON Server چیه؟ 🔬

کلمه JSON مخفف عبارت JavaScript Object Notation هست و یک ابزار Node.js سبک و با کاربری آسونه که یک API RESTFUL و با استفاده از یک فایل JSON به عنوان data source شبیه‌سازی می‌کنه. توسعه‌ دهنده های فرانت‌اند با کمک JSON Server می‌تونن APIهای ساختگی و بدون نیاز به نوشتن کدهای پیچیده سمت سرور یا زمانی که API پشتیبان هنوز آماده نیست ایجاد کنن.

این API ساختگی درخواست‌ها رو به endpoint ای که تنظیم میکنید ارسال می‌کنه، به درخواست‌های HTTP پاسخ میده و به این ترتیب کار و برای توسعه سریع برای توسعه‌دهندگان ایده‌آل می‌کنه. JSON Server همچنین توسعه‌دهندگان و قادر می‌سازخ تا عملیات CRUD و انجام بدن و داده‌ها رو در فایل‌های JSON ذخیره کنند.


ویژگی‌های JSON Server 🔍

❗️راه‌اندازی آسان و سریع

❗️پشتیبانی از CRUD

❗️قدرتمند و ساده

❗️شبیه سازی داده ها


عملکرد Json server مثل یه بک‌اند واقعی هست. از این به بعد به جای استفاده از دیتابیس هایی مثل firebase که تحریم و مشکلاتی داره... میتونید از جیسون سرور برای توسعه نمونه کار هاتون استفاده کنید.

Document 🌐

✦ @programming_codiing

🤖 می‌خوای سایتت چهره‌ها رو بشناسه؟! 👀

با Face-api.js می‌تونی قابلیت‌های تشخیص چهره رو مستقیماً به پروژه‌های وب اضافه کنی! 🚀

این کتابخانه با استفاده از مدل‌های Deep Learning و TensorFlow.js قابلیت‌هایی مثل:

👤 تشخیص چهره
😊 تشخیص لبخند و حالت چهره
🎂 تخمین سن
⚧️ تشخیص جنسیت
🕶️ تشخیص چهره با عینک
📹 تشخیص چهره به‌صورت Real-time

رو در اختیار دولوپرها قرار می‌ده.

اگه به JavaScript، هوش مصنوعی و Computer Vision علاقه داری، Face-api.js می‌تونه ابزار جالبی برای پروژه‌هات باشه. 🔥

📚 برای اطلاعات بیشتر، داکیومنت Face-api.js رو ببین.
:: ) Doc

✦ @programming_codiing

ChatGPT Plus
رایگان!

یکی از دوستان گفت که از طریق سایت
https://chatgptplus.cn/
می‌تونید از نسخه‌ی پلاس به صورت رایگان استفاده کنید.
خودم با ایمیلم نتونستم وارد بشم،
اگه شما تونستید، لذتش رو ببرید و توی کامنت به ما هم بگید.🌹

✦ @programming_codiing

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

⏰ چطور برای یادگیری برنامه‌نویسی، برنامه‌ریزی کنیم؟

یکی از بزرگ‌ترین اشتباهاتی که خیلی‌ها انجام میدن اینه که بدون برنامه شروع می‌کنن.

مثلاً:

- امروز ۸ ساعت دوره می‌بینن.
- فردا حوصله ندارن و هیچی کار نمی‌کنن.
- پس‌فردا فقط ۱ ساعت.
- چند روز بعد هم کلاً رهاش می‌کنن...

نتیجه؟ پیشرفت خیلی کند یا حتی توقف کامل. ❌

✅ راه درست چیه؟

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

• روزی چند ساعت واقعاً وقت دارم؟
• چند روز در هفته می‌تونم برای یادگیری وقت بذارم؟
• چه مقدار از این زمان رو به دیدن دوره و چه مقدارش رو به تمرین اختصاص بدم؟
• با این برنامه، حدوداً چند وقت طول می‌کشه دوره رو تموم کنم؟

مثلاً اگر یک دوره ۶۰ ساعته باشه:

- روزی ۲ ساعت (۱ ساعت دیدن دوره + ۱ ساعت تمرین)، حدود ۲ ماه طول می‌کشه.
- روزی ۳ ساعت (۱.۵ ساعت دیدن دوره + ۱.۵ ساعت تمرین)، حدود ۴۰ روز.
- روزی ۱ ساعت (۳۰ دقیقه دوره + ۳۰ دقیقه تمرین)، حدود ۴ ماه.

فقط یادت باشه: زمان تمرین رو دست‌کم نگیر. بخش زیادی از یادگیری واقعی، موقع تمرین کردن اتفاق می‌افته، نه فقط دیدن ویدیوهای آموزشی.

هیچ‌کدوم از این برنامه‌ها بد نیست؛ مهم اینه که به برنامه‌ات پایبند بمونی.

🎯 حتی اگر بعداً به خاطر امتحان، کار یا شرایط دیگه یک یا دو هفته بیشتر طول کشید، اشکالی نداره. بهتر از اینه که هر روز بدون برنامه جلو بری و آخرش مسیر رو نیمه‌کاره رها کنی.

💡 یک قانون ساده:

به‌جای اینکه بگی:
«هر وقت وقت داشتم دوره می‌بینم و تمرین می‌کنم.»

بگو:
«هر روز ساعت ۷ تا ۹ فقط برنامه‌نویسی؛ یک ساعت دیدن دوره و یک ساعت تمرین.»

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

🚀 یادت باشه؛ موفقیت در برنامه‌نویسی با چند روز تلاشِ سنگین به دست نمیاد، بلکه با پیشرفت‌های کوچک اما مداوم، دیدن دوره، تمرین مستمر و ادامه دادن ساخته می‌شه.

✦ 💻 @programming_codiing

:)))))

💻 @programming_codiing

🖥 لینکدین و 🌐 گیتهاب دو پلتفرم عالی برای شبکه سازی هستن و همون‌طور که میدونید، دولوپری که شبکه سازی خوبی نداشته باشه، مثل نوازنده‌ایه کِ ساز نداره.

در بخش دایرکت بفرستین برام خودم زیر کامنت ها قرار می دم ، لینک گیتهاب و لینکدین خودتون رو، تا با بقیه دولوپر‌ها آشنا بشید و کانکشن‌های جدید پیدا کنید 💬

✦ @programming_codiing

چرا لینوکس رو به ویندوز ترجیح بدیم؟🖼

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

1️⃣لینوکس پایدار و مستحکمه

در واقع بیشتر کاربرای لینوکس، هيچوقت يک توقف و خرابی در سرور رو نميبينن و اين ویژگی برای كاربرا، با ارزش می‌تونه باشه. مخصوصا برای کسب و کارها که از کار افتادگی سرور میتونه عواقب فاجعه بار براشون داشته باشه.

👌لینوکس خيلی بهتر از ويندوز ميتونه تعداد زیادی از پردازش هارو در يک لحظه اجرا كنه.


2️⃣لینوکس امنه

لینوکس ذاتا امن تر از ویندوزه. چه روی سرور و چه روی دسکتاپ، و به همین دليله که بر اساس يونيكس ساخته شده. در لینوکس فقط مدیر یا کاربر root، دارای اختیارات مدیریتیه، و کمتر به کاربرای معمولی و برنامه های کاربردی اجازه دسترسی به کرنل داده میشه و همین باعث ميشه همه چیز ماژولار و حفاظت شده باشه.

🟢البته لینوکس کمتر توسط ویروس ها و هكرها مورد حمله قرار میگيره و آسیب پذیری تو سیستم عامل لينوكس، زودتر و سريعتر پیدا و تصحيح میشه.

3️⃣لینوکس رایگانه

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

4️⃣ لینوکس اوپن سورسه

یکی دیگه از مزایای لینوکس Open Source بودنشه. این مسئله مزیت زیادی به خصوص برای افرادی که به برنامه نویسی آشنا هستن داره. چرا که اونها با دسترسی به کدهای لینوکس، میتونن تغییرات مورد نیاز و دلخواهی رو روش اعمال کنن. در واقع هر برنامه نویسی میتونه مطابق با نیازهاش سیستم عامل لینوکسشو شخصی سازی کنه و اونو تغییر بده. در حالی که کدهای سیستم عامل ویندوز غیر قابل مشاهده و استفادست، و امکان توسعه و تغییرش فقط توسط خود مایکروسافت امکان پذیره.

5️⃣لینوکس هر نوع فایلی رو اجرا می‌کنه

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

این سیستم عامل محبوب و دوست داشتنی مزایای دیگه ای هم داره، اما ترجیح دادیم به مهم ترین و حیاتی ترین تفاوت هاشون بپردازیم.امیدوارم لذت برده باشید🔥 و البته برای خیلی از افراد هم مناسب نیست , برای گیمر ها , برای کسایی که با ابزار های ادیت و... مثل فوتوشاپ کار می کنن و .. .

✦ @programming_codiing

⌨️ 5 سرویس API کارآمد و رایگان

پیدا کردن Api مناسب برای وبسایت و پروژه کار سختی بوده و معمولا افراد، در این زمینه با چالش‌های مختلفی روبرو میشن. در پست قبلی که ریپلای کردم یه api معرفی کردم ولی توی این پست قصد داریم با 5 مورد از سرویس‌های api کاربردی آشنا بشیم . 

1️⃣‏Random User Generator
این سرویس به شما اجازه میده تا به صورت خودکار کاربر جعلی درست کنید، و میتونید از این سرویس برای تست دیتابیس یا سایت استفاده کنید.

2️⃣‏Cloud Convert
یک سرویس تبدیل فایل که یک API رایگان برای تبدیل هر فرمت به فرمت دیگه ای رو ارائه میده، و میتونید باهاش یک ابزار
کاربردی برای خودتون بنویسید.

3️⃣‏Open Weather Map
یک سرویس برای وضعیت آب و هوا و پیش‌بینی اون، که از 40 هزار پایگاه آب و هوا اطلاعات رو جمع آوری میکنه. 

4️⃣‏Free Music Archive
یک سرویس خیلی کاربردی برای دریافت اطلاعاتی درمورد هنرمندان، آلبوم‌ها، تِرَک ها و ژانرهای مختلف.

5️⃣‏The Movie Database
یک سرویس قدرتمند و کاربردی برای دریافت اطلاعات کامل راجع به فیلم‌های مختلف، اعم از نام و سال ساخت و کپشن و ...

✦ @programming_codiing