https://virgool.io/feed/@fa.ramezanpour برنامه نویس front در حال حاضر با reactjs و nextjs کار میکنم fa 2026-07-08 12:25:46 https://files.virgool.io/upload/users/41352/avatar/GSL2IY.png?height=120&width=120 https://virgool.io/@fa.ramezanpour https://virgool.io/@fa.ramezanpour/%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF-cli-%D8%A8%D8%B1%D8%A7%DB%8C-consolelog-%D8%AF%D8%B1-vscode-eddawjhchogc احتمالا برای شما هم پیش آمده که در کد نویسی زیاد از console.log استفاده کرده باشید و نوشتن پی در پی این دستور تکراری طاقت فرسا شده باشد.در این یادداشت راهی هایی را برای چلوگیری از نوشتن این دستور در ادیتور vscode بیان می‌کنم که با توجه به نیازهای خود می‌توانید یکی از این گزینه ها را انتخاب کنید.۱. تنظیم Keyboard Shortcuts در vscode۲. روش autocomplete تنظیم Keyboard Shortcuts در vscode در vscode به آدرس زیر رفتهFile > Preferences > Keyboard Shortcutsبه قسمت بالای سمت راست پنجره باز شده بروید، در آیکن های بالایی، آیکنی که با رفتن بر رویش عبارت open keyboard shortcuts دیده می‌شود را انتخاب کنید.کد زیر را به فایل باز شده اضافه کرده و save کنید.{ &quotkey&quot: &quotctrl+shift+l&quot, &quotcommand&quot: &quoteditor.action.insertSnippet&quot, &quotwhen&quot: &quoteditorTextFocus&quot, &quotargs&quot: { &quotsnippet&quot: &quotconsole.log('${TM_SELECTED_TEXT}$1')$2;&quot } }با زدن دکمه های ctrl+shift+l در فایل پروژه عبارت ;(' ')console.log ظاهر می‌شود.روش autocompleteدر vscode به آدرس زیر رفته File -> Preferences -> User Snippetمنویی برای شما باز می شود که با انتخاب new global snippets file , و نوشتن نام فایل مورد نظر خود و زدن دکمه enter، فایلی به اسم selectedName.code-snippets باز می‌شودکد زیر را داخل فایل بنویسید و save کنید.&quotPrint to console&quot: { &quotscope&quot: &quotjavascript,typescript&quot, &quotprefix&quot: &quotlog&quot, &quotbody&quot: [ &quotconsole.log('$1' , '$2');&quot, &quot$2&quot ], &quotdescription&quot: &quotLog output to console&quot }سپس با استفاده از ctrl + shift + p، داخل منویی که برایتان باز شده عبارت json و یا open settings را سرچ کنید و فایل را باز کنید. کد زیر را اضافه کنید.&quoteditor.snippetSuggestions&quot: &quottop&quotپس از ذخیره فایل در هر فایلی از پروژه با نوشتن عبارت مقابل prefix در selectedName.code-snippets ( در این مثال با نوشتن log) یک tooltip ظاهر میشود که میتوانید console.log را انتخاب کنید. فاطمه رمضانپور فاطمه رمضانپور Mon, 05 Apr 2021 16:25:58 +0430 https://virgool.io/@fa.ramezanpour/%D9%86%D9%85%D8%A7%DB%8C%D8%B4-localhost-%D8%AF%D8%B1-%D9%88%D8%A8-%D8%AF%D8%B1-50-%D8%AB%D8%A7%D9%86%DB%8C%D9%87-%D8%A8%D8%A7-ngrok-gs3nurdag7t4 تا حالا براتون پیش اومده که بخواین مواردی مثل rich snippet رو بعد از انجام دادنش، داخل local سیستم خودتون دیباگ کنید؟یا اینکه خروجی کدتون رو به شخصی که کنارتون نیست نشون بدین، در واقع یک لینک از سیستم local خودتون بدین بهش؟در روش سنتی باید کدتون رو روی یک سرور بذارید و لینک اختصاصی مربوط به اون سرور رو استفاده کنید که این روش دردسرهای خاص خودش رو داره.روش دیگه استفاده از سرویسی هست که یک url مجازی از localhost شما ایجاد کنه، یعنی به جای اینکه url لوکال رو تو مرورگر استفاده کنید، url ایجاد شده توسط این سرویس رو استفاده کنید.اسم این سرویس یا ابزار ngrok هست.دلایل استفاده از ngrok : ایجاد url عمومی از localhost سیستم خودتون، برای نمایش محصول به افراد دیگه ای که کنار شما نیستن و از سیستم خودشون استفاده میکنن. ایجاد url عمومی از localhost سیستم شما، برای اینکه بتونید داخل موبایل، صفحه موردنظرتون رو چک کنید. ایجاد url برای تست chatbot( و یک سری کارهای دیگه که میتونید با ngrok انجام بدید و با استفاده از لینک ngrok.com میتونید بقیه موارد رو ببینید.)نحوه استفاده از ngrok ۱. دانلود ngrok از لینک زیر https://ngrok.com/download ۲. استفاده از دستور زیر برای unzip کردن فایلی که دانلود کردین ۳. اجرای لوکال کدتون، نهایتا پورتی که پروژه روش تعریف شده رو نیاز دارید ۴. داخل تب دیگه از ترمینال، ngrok رو، روی پورتی که پروژه تون در حال اجرا هست، run کنید ۵. خروجی که با زدن این command می‌بینید به این صورت هستبا انتخاب یکی از دو لینکی که ngrok براتون تولید کرده و باز کردنش در مرورگر میتونید نمایشی از لوکال سیستمتون داشته باشید که به راحتی میتونید در اختیار دیگران قرار بدید.البته یادتون نره که این لینک تا زمانی که ngrok در حال اجرا باشه کاربرد داره.امیدوارم که متن کاربردی بوده باشه براتون. فاطمه رمضانپور فاطمه رمضانپور Sun, 21 Apr 2019 13:26:23 +0430