اذا تستخدم VS code وأنت ماتعرف هذي الاختصارات ( Extensions ) .. انت جالس تضيع وقتك 🥲
#ثريد غني بـ"اختصار الوقت للمبرمج" بيفيدك كثير أثناء البرمجة ⏱:
|| فضّل التغريدة أكيد بتحتاجها
#ثريد غني بـ"اختصار الوقت للمبرمج" بيفيدك كثير أثناء البرمجة ⏱:
|| فضّل التغريدة أكيد بتحتاجها
Live Server
مع كل تعديل تسويه أكيد تحتاج تشوفه بالمتصفح (Browser) بس مايطفشك انك تسوي Reload كل شوي؟ 👀
هالاختصار بمجرد ما تحفظ الكود وتفتح المتصفح بيسوي Reload بشكل تلقائي !
رهيييييب
مع كل تعديل تسويه أكيد تحتاج تشوفه بالمتصفح (Browser) بس مايطفشك انك تسوي Reload كل شوي؟ 👀
هالاختصار بمجرد ما تحفظ الكود وتفتح المتصفح بيسوي Reload بشكل تلقائي !
رهيييييب
Code Spell Checker
اذا كتبت أي كلمة غير السنتاكس بشكل غلط (المحتوى اللي بين الـ tags)، هالاختصار بيحط خط تحت الكلمة الخطأ لأنه بيبحث بالمعاجم عنها واذا ماحصلها بينبهك.
اذا كتبت أي كلمة غير السنتاكس بشكل غلط (المحتوى اللي بين الـ tags)، هالاختصار بيحط خط تحت الكلمة الخطأ لأنه بيبحث بالمعاجم عنها واذا ماحصلها بينبهك.
Bracket Pair Colorizer
قد فتحت أقواس أو tag ومع كثافة الكود ماعرفت وين نهايته؟ في الاختصار هذا بتنسى هالمشكلة للأبد😉
هو يغير لون بداية ونهاية كل tag بلون موحد عشان تعرفه وتميزه عن غيره ✅
قد فتحت أقواس أو tag ومع كثافة الكود ماعرفت وين نهايته؟ في الاختصار هذا بتنسى هالمشكلة للأبد😉
هو يغير لون بداية ونهاية كل tag بلون موحد عشان تعرفه وتميزه عن غيره ✅
Auto Rename Tag
لنفترض انك فتحت tag معين لكن بعد فترة حبيت تغيره .. اذا غيرت البداية يبيلك تحذف النهاية وترجع تكتبها .. ماتحس انه ياخذ وقت؟ 😅
هالاختصار بمجرد ماتغير أي tag على طول يغير نهايته !
يفك أزممممة
لنفترض انك فتحت tag معين لكن بعد فترة حبيت تغيره .. اذا غيرت البداية يبيلك تحذف النهاية وترجع تكتبها .. ماتحس انه ياخذ وقت؟ 😅
هالاختصار بمجرد ماتغير أي tag على طول يغير نهايته !
يفك أزممممة
GetLens
اذا تشتغل انت واكثر من شخص على نفس المشروع بـ Git، هالاختصار بمجرد تسوي click على أي سطر بيطلع لك مين اللي سواه، متى سواه، وكيف كان الكود قبل مايسويه 🤯!!
اذا تشتغل انت واكثر من شخص على نفس المشروع بـ Git، هالاختصار بمجرد تسوي click على أي سطر بيطلع لك مين اللي سواه، متى سواه، وكيف كان الكود قبل مايسويه 🤯!!
CSS Peek
لنفترض عندك id او class بـ HTML ..
اذا تبي تعرف ايش كتبت بالـ CSS لهذا الجزء، يبيلك تروح للـ External sheet وتدوره وبعدها تشوف..
لكن هالاختصار بينقذك، بمجرد تضغط على الـ class او id بيفتح لك pop up window ويوريك الـ CSS الخاص فيه !! واو
لنفترض عندك id او class بـ HTML ..
اذا تبي تعرف ايش كتبت بالـ CSS لهذا الجزء، يبيلك تروح للـ External sheet وتدوره وبعدها تشوف..
لكن هالاختصار بينقذك، بمجرد تضغط على الـ class او id بيفتح لك pop up window ويوريك الـ CSS الخاص فيه !! واو
Colorize
كتبت رقم اللون لكن شكيت بدرجته ؟
هالاختصار بيسنعك .. حرفيًا !
بيلون لك الارقام بدرجة اللون اللي اخترته بحيث يصير واضح لك قبل ماتسوي Run
كتبت رقم اللون لكن شكيت بدرجته ؟
هالاختصار بيسنعك .. حرفيًا !
بيلون لك الارقام بدرجة اللون اللي اخترته بحيث يصير واضح لك قبل ماتسوي Run
Bookmarks
اتوقع واضح من اسمه 😂
بيحط لك علامة على أي سطر تبيه بحيث اذا انت جالس تسوي debugging وتنقلت بين ملفاتك ورجعت للملف تعرف وين كنت بأي سطر ..
أسطوري 🥲🥲
اتوقع واضح من اسمه 😂
بيحط لك علامة على أي سطر تبيه بحيث اذا انت جالس تسوي debugging وتنقلت بين ملفاتك ورجعت للملف تعرف وين كنت بأي سطر ..
أسطوري 🥲🥲
Polacode
امممم .. قد واجهتك مشكلة وحبيت ترسل جزء من كودك لشخص ثاني عشان يسوي trace معك؟ اكيد سويت screenshot صح؟ ماكان واضح غالبا وصورت السكرين كامل وحوسة شوي تقص الصورة والخ..
مع هالاختصار بمجرد ماتسوي highlight على الكود اللي تبيه بيسوي لك صورة فيها الكود بشكل مرتب جدًا 🙏
امممم .. قد واجهتك مشكلة وحبيت ترسل جزء من كودك لشخص ثاني عشان يسوي trace معك؟ اكيد سويت screenshot صح؟ ماكان واضح غالبا وصورت السكرين كامل وحوسة شوي تقص الصورة والخ..
مع هالاختصار بمجرد ماتسوي highlight على الكود اللي تبيه بيسوي لك صورة فيها الكود بشكل مرتب جدًا 🙏
Tabnine
هالاختصار اتوقع بيغطي عليهم كلهم !!
تخيل انك يوم تكتب أي كود فيه شخص يساعدك
هالاختصار عبارة عن ذكاء اصطناعي يمشي معك ويتوقع الكود اللي بتكمل فيه السطر 🤯!!!!
قوووي 🔥🔥
هالاختصار اتوقع بيغطي عليهم كلهم !!
تخيل انك يوم تكتب أي كود فيه شخص يساعدك
هالاختصار عبارة عن ذكاء اصطناعي يمشي معك ويتوقع الكود اللي بتكمل فيه السطر 🤯!!!!
قوووي 🔥🔥
طيب الحين بركز شوي على بعض الاختصارات لكتابة الـ tags في HTML داخل الـ VS code ..
ركز معي يلا
ركز معي يلا
اذا جيت تكتب اي tag وبتحط له class ..
انسى طريقتك القديمة وطبق هذي 👇🏻
tag.className ثم Enter
مثال : nav.main
انسى طريقتك القديمة وطبق هذي 👇🏻
tag.className ثم Enter
مثال : nav.main
اذا جيت تكتب اي نص داخل tag
انسى طريقتك القديمة وطبق هذي 👇🏻
tag{النص} ثم Enter
مثال : li{coffee}
انسى طريقتك القديمة وطبق هذي 👇🏻
tag{النص} ثم Enter
مثال : li{coffee}
اذا جيت تكتب عناصر متداخلة ..
tag داخل tag داخل tag
انسى طريقتك القديمة وطبق هذي 👇🏻
tag>tag>tag ثم Enter
مثال : nav>p>span
tag داخل tag داخل tag
انسى طريقتك القديمة وطبق هذي 👇🏻
tag>tag>tag ثم Enter
مثال : nav>p>span
تبي تكتب أكثر من tag من نفس النوع ؟ ليه تكتبهم حبة حبة 😂!
مثلًا تبي تكتب أكثر من li
كل اللي عليك تكتبها كذا:
tag*numberOfDuplications ثم Enter
مثال : li*7
مثلًا تبي تكتب أكثر من li
كل اللي عليك تكتبها كذا:
tag*numberOfDuplications ثم Enter
مثال : li*7
تبي تكتب أكثر من tag لكنهم مختلفين ؟ ليه تكتبهم حبة حبة 😂!!
مثلًا تبي تكتب div وبعدها p وبعدها nav
كل اللي عليك تسويه:
tag1+tag2+tag3 ثم Enter
مثال : div+p+nav
مثلًا تبي تكتب div وبعدها p وبعدها nav
كل اللي عليك تسويه:
tag1+tag2+tag3 ثم Enter
مثال : div+p+nav
طيب .. خلنا نصعبها شوي 👀
اذا جيت بتسوي مثلا عشرين li وكل واحد تبي له اسم الكلاس نفسه لكن متبوع برقم Unique ..
اكيد بتقول بضيف الاسم بنفسي وبكل مرة بغير الرقم ..
ماتحسه مرهق؟ جبت لك الحل 😎
اذا جيت بتسوي مثلا عشرين li وكل واحد تبي له اسم الكلاس نفسه لكن متبوع برقم Unique ..
اكيد بتقول بضيف الاسم بنفسي وبكل مرة بغير الرقم ..
ماتحسه مرهق؟ جبت لك الحل 😎
$
هي سر الحل (الترقيم يبدا من 1)
كل اللي عليك تسويه:
tag.className$*numberOfDuplications
مثال :
li.item$*20 ثم Enter
انصدم معي 🤯👇🏻
هي سر الحل (الترقيم يبدا من 1)
كل اللي عليك تسويه:
tag.className$*numberOfDuplications
مثال :
li.item$*20 ثم Enter
انصدم معي 🤯👇🏻
فيه كثيييررر اختصارات موجودة، اكتشف اللي يسهل شغلك ويخليك مروق وانت تكتب أي جزء منه ..
موفقييييين❤️❤️
موفقييييين❤️❤️
جاري تحميل الاقتراحات...