توی این پست میخوایم یه اکستنشن کاربردی بهتون معرفی کنیم بخصوص برای برنامه نویسا که ارور هارو سرچ میکنن...
وقتی که نصبش کردید یه اکانت میسازید داخلش و بعد هر وقت که توی گوگل سرچ کنید بدون نیاز به وارد شدن به سایتی براتون بالای نتایج سرچ رو مینویسه (که معمولا هم جواب ها یک بک گراند مشکی ای دارن) شما میتونین درست مثل Stackoverflow به نتایج با فلش های کنارشون رای بدید! و طبیعتا خودتون هم میتونید برای هر سرچی یک کامنتی بنویسید...
📥 لینک دانلود برای گوگل کروم
📥 لینک دانلود برای فایرفاکس
#grepper #extension
☕️ @CodeExplore
وقتی که نصبش کردید یه اکانت میسازید داخلش و بعد هر وقت که توی گوگل سرچ کنید بدون نیاز به وارد شدن به سایتی براتون بالای نتایج سرچ رو مینویسه (که معمولا هم جواب ها یک بک گراند مشکی ای دارن) شما میتونین درست مثل Stackoverflow به نتایج با فلش های کنارشون رای بدید! و طبیعتا خودتون هم میتونید برای هر سرچی یک کامنتی بنویسید...
📥 لینک دانلود برای گوگل کروم
📥 لینک دانلود برای فایرفاکس
#grepper #extension
☕️ @CodeExplore
❤🔥10⚡4🔥3
افزونه های کاربردی کروم برای توسعه دهندگان سمت وب ! 👌
دوستان پیشنهاد میکنم حتما از این افزونه های رسمی استفاده کنید خیلی کاربردی هستن
#extension
☕️ @CodeExplore
دوستان پیشنهاد میکنم حتما از این افزونه های رسمی استفاده کنید خیلی کاربردی هستن
#extension
☕️ @CodeExplore
⚡16❤🔥3🔥3
فکر کنم کمتر کسی باشه با افزونه Live Preview آشنا باشه 🤔 :
افزونه Live Preview تو VSCode یک ابزار قدرتمندی هست که به شما این امکان رو میده تا در حالت زنده نتایج تغییرات خودتون را تو صفحات وب مشاهده کنید🤓 با استفاده از این افزونه، شما می تونید به سرعت و به راحتی تغییرات خودتون رو در کدهای HTML، CSS و JavaScript ببینید و بررسی کنید 🤙
•••••••••••••••••••••••••••••••••••••••••••••••••••••••••
برای استفاده از افزونه Live Preview، مراحل زیر رو باید انجام بدید 👇:
1) نصب و فعالسازی : برای نصب افزونه، اول به قسمت Extensions تو VSCode برید و "Live Preview" رو سرچ کنید. بعدش اون رو نصب و فعال کنید🙈
2) باز کردن فایل HTML : فایل HTML خودتون رو تو VSCode باز کنید 😌
3) شروع پیش نمایش : برای شروع پیش نمایش، روی دکمه "Go Live" در پایین سمت چپ صفحه کلیک کنید. یک پنجره جدید با آدرس URL لوکال شما باز میشه 😉
4) مشاهده تغییرات: هرگاه تغییرات خودتون رو تو فایل HTML اعمال کردید، صفحه پیش نمایش به طور خودکار بروزرسانی میشه و بعدش تعغیرات جدید رو نشون میده ✌️
5) توقف پخش : برای توقف پخش، دکمه "Stop" در پانل Live Server در VSCode کلیک کنید حتما 🤟
دوستان با استفاده از این افزونه دیگه لازم نیست داخل مرورگر خروجی رو ببینیم و می تونیم تو همون VSCode ببینیم 😎
اگه روش بالا جوابگو نبود براتون از روش زیر استفاده کنید حتما 👇 :
باید رو HTML التون کلیک راست کنید و گزینه show preview رو بزنید ✌️
👈 برای دانلود افزونه Live Preview کلیک کنید
#extension #live_preview #vscode
☕️ @CodeExplore
افزونه Live Preview تو VSCode یک ابزار قدرتمندی هست که به شما این امکان رو میده تا در حالت زنده نتایج تغییرات خودتون را تو صفحات وب مشاهده کنید🤓 با استفاده از این افزونه، شما می تونید به سرعت و به راحتی تغییرات خودتون رو در کدهای HTML، CSS و JavaScript ببینید و بررسی کنید 🤙
•••••••••••••••••••••••••••••••••••••••••••••••••••••••••
برای استفاده از افزونه Live Preview، مراحل زیر رو باید انجام بدید 👇:
1) نصب و فعالسازی : برای نصب افزونه، اول به قسمت Extensions تو VSCode برید و "Live Preview" رو سرچ کنید. بعدش اون رو نصب و فعال کنید🙈
2) باز کردن فایل HTML : فایل HTML خودتون رو تو VSCode باز کنید 😌
3) شروع پیش نمایش : برای شروع پیش نمایش، روی دکمه "Go Live" در پایین سمت چپ صفحه کلیک کنید. یک پنجره جدید با آدرس URL لوکال شما باز میشه 😉
4) مشاهده تغییرات: هرگاه تغییرات خودتون رو تو فایل HTML اعمال کردید، صفحه پیش نمایش به طور خودکار بروزرسانی میشه و بعدش تعغیرات جدید رو نشون میده ✌️
5) توقف پخش : برای توقف پخش، دکمه "Stop" در پانل Live Server در VSCode کلیک کنید حتما 🤟
دوستان با استفاده از این افزونه دیگه لازم نیست داخل مرورگر خروجی رو ببینیم و می تونیم تو همون VSCode ببینیم 😎
اگه روش بالا جوابگو نبود براتون از روش زیر استفاده کنید حتما 👇 :
باید رو HTML التون کلیک راست کنید و گزینه show preview رو بزنید ✌️
👈 برای دانلود افزونه Live Preview کلیک کنید
#extension #live_preview #vscode
☕️ @CodeExplore
🔥17❤🔥5⚡4
یه اکستنشنِ کروم و فایرفاکس پیدا کردیم که نمیدونیم چرا هیچکس تا حالا این بنده خدا رو ندیده بود 😅
💢 معرفی میکنیم ، اکستنشن web developer با یک میلیون یوزر، مخصوص طراحان وب . حالا چرا انقدر تعریفش رو میکنیم؟ بزارید از قابلیت هاش براتون بگیم.
1️⃣ میتونید css کامل یک وب سایت رو ببینید
2️⃣ میتونید مشخصات دقیق هر المنت رو ببینید (میدونیم بخش developer tools همچین اطلاعاتی داشت ولی این دقیق تره)
3️⃣ میتونید جاوا اسکریپت کامل یک وب سایت رو ببینید.
4️⃣ میتونید عکس ها رو پنهان کنید ، به طور فول سایز ببینید ، دورشون border بندازید و ...
5️⃣ میتونید جاوا اسکریپت و کوکی های سایت رو غیرفعال کنید ، هرجا بخواید کوکی اد کنید یا اطلاعاتش رو بخونید
6️⃣ کلی قابلیت های دیگه مثل فعال کردن color picker ، تنظیم سایز صفحه ، مشخص کردن لینک ها ، پاک کردن کش ، هیستوری ، نمایش خط کش ، نمایش المنت های پنهان شده و ...
⚠️ خیلی قابلیت هاش بیشتر از این چیزهایی هست که گفتیم ، میشه براش دوره ساخت حتی!
🧐 شما چه اکستنشن های دیگه ای میشناسید که دیده نشدن؟
📥 دانلود برای: کروم - فایرفاکس
#extension
☕️ @CodeExplore
💢 معرفی میکنیم ، اکستنشن web developer با یک میلیون یوزر، مخصوص طراحان وب . حالا چرا انقدر تعریفش رو میکنیم؟ بزارید از قابلیت هاش براتون بگیم.
1️⃣ میتونید css کامل یک وب سایت رو ببینید
2️⃣ میتونید مشخصات دقیق هر المنت رو ببینید (میدونیم بخش developer tools همچین اطلاعاتی داشت ولی این دقیق تره)
3️⃣ میتونید جاوا اسکریپت کامل یک وب سایت رو ببینید.
4️⃣ میتونید عکس ها رو پنهان کنید ، به طور فول سایز ببینید ، دورشون border بندازید و ...
5️⃣ میتونید جاوا اسکریپت و کوکی های سایت رو غیرفعال کنید ، هرجا بخواید کوکی اد کنید یا اطلاعاتش رو بخونید
6️⃣ کلی قابلیت های دیگه مثل فعال کردن color picker ، تنظیم سایز صفحه ، مشخص کردن لینک ها ، پاک کردن کش ، هیستوری ، نمایش خط کش ، نمایش المنت های پنهان شده و ...
⚠️ خیلی قابلیت هاش بیشتر از این چیزهایی هست که گفتیم ، میشه براش دوره ساخت حتی!
🧐 شما چه اکستنشن های دیگه ای میشناسید که دیده نشدن؟
📥 دانلود برای: کروم - فایرفاکس
#extension
☕️ @CodeExplore
⚡15❤🔥4🔥2
💠 بهتر کامنت گذاشتن ( Better Comments )
💫 دوستانی که از VsCode استفاده میکنند حتما افزونه Better Comments رو نصب کنید.
🔺 افزونه Better Comments به شما کمک میکنه تا کامنتهای بهتری را در کد خودتون ایجاد کنید. شما میتونید حاشیه نویسیهای خود را به هشدارها، سوالات، TODOها، موارد برجسته و ... دسته بندی کنید. علاوه بر این میتونید کامنتی را نوشت تا مشخص شود این قسمت از کد نباید وجود داشته باشد و آن را استایل دهی کرد.
#extension
@CodeExplore
💫 دوستانی که از VsCode استفاده میکنند حتما افزونه Better Comments رو نصب کنید.
🔺 افزونه Better Comments به شما کمک میکنه تا کامنتهای بهتری را در کد خودتون ایجاد کنید. شما میتونید حاشیه نویسیهای خود را به هشدارها، سوالات، TODOها، موارد برجسته و ... دسته بندی کنید. علاوه بر این میتونید کامنتی را نوشت تا مشخص شود این قسمت از کد نباید وجود داشته باشد و آن را استایل دهی کرد.
#extension
@CodeExplore
⚡11❤🔥3🔥2
اکستنشن tabnine برای VSCode🔥
🔹️این اکستنشن یک نوع AutoCompleter هستش ، بله بله بله میدونیم که خود vscode هم اتوکامپلتر داره! ولی سطح این افزونه با سطح vscode خیلی اختلاف فاحشی داره! طبق گفته خودشون از AI استفاده میکنن؛ و واقعا از نصب کردن این افزونه پشیمون نمیشید ، واقعا فوق العاده اس👌
🔸️فقط کافیه بزنید نصب و تمام! اول شاید زیاد چیزی نبینید چون داره کدتون رو تحلیل میکنه، راه که بیوفته ممکنه بعضی وقتا تا ۳ خط بهتون پیشنهاد بده و واقعا هم ۳ خط درستی باشه!
📥 لینک دانلود
شما چه اتوکامپلتر های دیگه یا افزونه های دیگه ای میشناسید؟ حتما توی کامنت ها بگین❤️🔥
#extension
☕️ @CodeExplore
🔹️این اکستنشن یک نوع AutoCompleter هستش ، بله بله بله میدونیم که خود vscode هم اتوکامپلتر داره! ولی سطح این افزونه با سطح vscode خیلی اختلاف فاحشی داره! طبق گفته خودشون از AI استفاده میکنن؛ و واقعا از نصب کردن این افزونه پشیمون نمیشید ، واقعا فوق العاده اس👌
🔸️فقط کافیه بزنید نصب و تمام! اول شاید زیاد چیزی نبینید چون داره کدتون رو تحلیل میکنه، راه که بیوفته ممکنه بعضی وقتا تا ۳ خط بهتون پیشنهاد بده و واقعا هم ۳ خط درستی باشه!
📥 لینک دانلود
شما چه اتوکامپلتر های دیگه یا افزونه های دیگه ای میشناسید؟ حتما توی کامنت ها بگین❤️🔥
#extension
☕️ @CodeExplore
❤🔥14🔥4⚡1💔1
یکی از دوستان درخواست کرده بود كه چطور تم دارک مود رو همه ی سایت ها فعال کنیم ؟🤔
🔥 اگه میخواید علاوه بر تم مرورگرتون ، دارک مود روی همه سایت هایی که باز میکنید اعمال بشه می تونید از اکستنشن Dark-Reader استفاده کنید 🫡
➕ تنظیمات و آپشن های جالبی داره که میتونید توی سایتش مشاهده کنید
🔗 برای مشاهده کردن اکستنشن کلیک کنید
#پست_پیشنهادی
#extension #site #browser #theme
☕️ @CodeExplore
#پست_پیشنهادی
#extension #site #browser #theme
☕️ @CodeExplore
Please open Telegram to view this post
VIEW IN TELEGRAM
⚡15🔥3❤🔥2
This media is not supported in your browser
VIEW IN TELEGRAM
console.log
های برنامه آوردیم console.log
های برنامه رو توی همون VsCode و به صورت آنلاین ببینیم ، براتون لینک نصب اکستنشن رو پایین می زارم (بهتون پیشنهاد میکنم حتما ویدیو رو ببینید )
#extension #vscode
☕️ @CodeExplore
Please open Telegram to view this post
VIEW IN TELEGRAM
⚡12🔥4❤🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
#vscode #extension
☕️ @CodeExplore
Please open Telegram to view this post
VIEW IN TELEGRAM
⚡11🔥3❤🔥1
دسترسی به متنِ داخل عکس؟🤔
◀️خب یک افزونه کروم براتون آوردیم به اسم Project Naptha که باهاش میتونید به متنِ داخل عکس دسترسی بیشتری داشته باشید(نسبت به بقیه افزونه ها)!
◀️چیزی که این اکستنشن رو نسبتا متفاوت میکنه اینه که شما علاوه بر توانایی کپی کردن متن میتونید هایلایتش هم بکنید، اینطوری موقع خوندن متنِ داخل عکس دیگه خط رو هم گم نمیکنید!
🗃 لینک دانلود
#extension
☕️ @CodeExplore
◀️خب یک افزونه کروم براتون آوردیم به اسم Project Naptha که باهاش میتونید به متنِ داخل عکس دسترسی بیشتری داشته باشید(نسبت به بقیه افزونه ها)!
◀️چیزی که این اکستنشن رو نسبتا متفاوت میکنه اینه که شما علاوه بر توانایی کپی کردن متن میتونید هایلایتش هم بکنید، اینطوری موقع خوندن متنِ داخل عکس دیگه خط رو هم گم نمیکنید!
🗃 لینک دانلود
#extension
☕️ @CodeExplore
❤🔥11🔥3⚡2
This media is not supported in your browser
VIEW IN TELEGRAM
#extension
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥14⚡4😁4❤🔥1
امروز میخوام بهتون یک اکستنشن خفن معرفی کنم 🔥
اومدید و سایت زدین برای کارفرما، ولی خب بعد تحویل پروژه بهتون پولش رو واریز نمیکنه.🥲
👀 یک اکستنشنی هست که شما میاید یک بازه زمانی (ددلاین) تعریف میکنید مثلاً 60 روز ، حالا این اکستنشن میاد به ازای هر روز یک واحد از opacity سایت کم میکنه و نهایتاً بعد از 60 روز opacity به صفر میرسه و سایت کلاً محو میشه.
⭕️ پس همیشه اکستنشن زیر رو به سایت اضافه کنید :
🌐 https://github.com/kleampa/not-paid
#github #extension
☕️ @CodeExplore
اومدید و سایت زدین برای کارفرما، ولی خب بعد تحویل پروژه بهتون پولش رو واریز نمیکنه.
#github #extension
Please open Telegram to view this post
VIEW IN TELEGRAM
GitHub
GitHub - kleampa/not-paid: Client did not pay? Add opacity to the body tag and decrease it every day until their site completely…
Client did not pay? Add opacity to the body tag and decrease it every day until their site completely fades away - kleampa/not-paid
😁30⚡6🔥5
This media is not supported in your browser
VIEW IN TELEGRAM
حالا چیکار میکنه
به این شکل هست که مثلاً اگه ما بخوایم کدهای بین پرانتزها، بلاکها، یا حتی تگها رو انتخاب کنیم، با این اکستنشن خیلی راحت میتونیم از دکمههای Shift+Alt+Right استفاده کنیم
راستی یک اکستنشن جالب برای VS Code قبلاً معرفی شده به اسم Smart Clicks که کمک میکنه با یک دابل کلیک ماوس کارهای مشابهی انجام بدیم
#extension #github
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥14❤🔥2⚡2
#extension #codesnippets #vscode
Please open Telegram to view this post
VIEW IN TELEGRAM
⚡12🔥3❤🔥1
برای دسترسی به مقالات Medium و TowradsDataScience، این اکستنشن رو از این ریپو گیتهاب نصب کنید(نصبش هم خیلی راحته) و با خیال راحت و بدون دردسر مطالعه کنید.
🌐 https://github.com/iamadamdev/bypass-paywalls-chrome?tab=readme-ov-file
#extension #github
☕️ @CodeExplore || </NEGAR>
#extension #github
Please open Telegram to view this post
VIEW IN TELEGRAM
⚡11🔥3❤🔥1
📥 لینک دانلود
#extension #gofullpage
Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥7🔥4⚡2
دوستان اکستنشن هایی که در VsCode استفاده میکنید و فکر میکنید کاربردی هستن رو حتما اسمشون رو تو کامنت ها بگید تا بقیه دوستان هم استفاده کنند.
#extension #vsc #vscode
☕️ @CodeExplore
#extension #vsc #vscode
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥12⚡5❤🔥2😁2
اکستنشن Prettier در VSCode ⌨️
👀 میدونین که برنامه نویسی به شکل مرتب، یکسری اصول خاص داره، که شاید بعضی وقتا ناخواسته رعایتش نکنید. این اکستنشن براتون کدتون رو مرتب میکنه، میتونید هم بهش بگید چه زبانهایی رو براتون مرتب نکنه و ...
✔️ از اینها هم پشتیبانی میکنه:
🔗 لینک دانلود
#vscode #extension
☕️ @CodeExplore
JavaScript · TypeScript · Flow · JSX · JSON · CSS · SCSS · Less · HTML · Vue · Angular HANDLEBARS · Ember · Glimmer · GraphQL · Markdown · YAML
#vscode #extension
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥10❤🔥3⚡3
ابزار کاربردی برای فرانت اند، با این ابزار ها پادشاهی کن!
☄️ در این مقاله قصد داریم سه ابزار کاربردی را به شما معرفی کنیم که میتواند کمک شایانی به توسعهدهندگان فرانتاند کند. این ابزارها شامل دو سایت و یک افزونه (Extension) هستند که بدون شک فرآیند طراحی و توسعه صفحات وب را برای شما سادهتر، سریعتر و حرفهایتر میکنند.
🌕 برای مشاهده کامل مقاله کلیک کنید.
#frontend #site #extension
☕️ @CodeExplore
#frontend #site #extension
Please open Telegram to view this post
VIEW IN TELEGRAM
⚡32❤🔥13🔥10😁5💔3
چند تا اکستنشن با حال و کاربردی VS Code
🔍 StackFinder
این ابزار سریع میگرده و جواب های مربوط به مشکلات کدتون رو از Stack Overflow پیدا میکنه (هرچند با اومدن AI کمتر استفاده میشه)
👀 Emoji Sense
میتونید باهاش توی کدتون ایموجی استفاده کنید.
🔰 Bracket Pair Colorizer
براکتهای باز و بستهی هر بلاک رو با رنگهای متفاوت نشون میده تا راحتتر متوجه بشید کدوم به کدومه؛ خصوصا توی کدهای تو در تو خیلی کمک میکنه.
🎨 Color Highlight
هر جا کد رنگی مثل #ff5733 یا RGB توی کدت بنویسید، رنگش رو میتونین همونجا ببینید.
📁 Path Intellisense
وقتی مسیر فایل یا عکس مینویسید، بهتون مسیر رو پیشنهاد میده.
#extension #vscode
☕️Telegram | Website | Discord
🔍 StackFinder
این ابزار سریع میگرده و جواب های مربوط به مشکلات کدتون رو از Stack Overflow پیدا میکنه (هرچند با اومدن AI کمتر استفاده میشه)
👀 Emoji Sense
میتونید باهاش توی کدتون ایموجی استفاده کنید.
🔰 Bracket Pair Colorizer
براکتهای باز و بستهی هر بلاک رو با رنگهای متفاوت نشون میده تا راحتتر متوجه بشید کدوم به کدومه؛ خصوصا توی کدهای تو در تو خیلی کمک میکنه.
🎨 Color Highlight
هر جا کد رنگی مثل #ff5733 یا RGB توی کدت بنویسید، رنگش رو میتونین همونجا ببینید.
📁 Path Intellisense
وقتی مسیر فایل یا عکس مینویسید، بهتون مسیر رو پیشنهاد میده.
#extension #vscode
☕️Telegram | Website | Discord
❤🔥14🔥4⚡2