4 Useful VS Code extensions for SharePoint Framework components

Hi Friends,

Today I will talk about the most useful VS Code extensions, that will help in the productivity of specifically SharePoint Framework projects.

www.SharePointWidgets.com

As a developer, we waste a lot of time in the tasks that could be done easily via extensions support or shortcut keys. In this blog post, I will discuss some of these extensions that will increase the productivity and the style of your code.

With an increase in productivity, the styling also holds an important value as it makes the code more readable and understandable which increases the focus time. So let's dive then !!

VS Code Extensions !!

  • Debugger for Chrome: 
A very important extension if you are a SharePoint online developer (developing SharePoint framework components) then it is a must to have this extension. This extension helps in debugging the SharePoint Framework components just as we used to do in the C# server-side coding. For details on how to configure, you can read my previous post on Debug SharePoint Framework solutions in Visual Code
  • Git Lens
If you are working as a team and make use of GIT repositories, this is a very good tool. It is very powerful and gives you a lot of insights. The most interesting part that I found is the updates of each code line updated by other members, history of each file, compare etc.. Explore and you'll find it useful
  • Better Comments
Do you often forget some of the common comments such as "TODO"? Then this extension will highlight your comments based upon the severity. This extension makes all the comments visible based upon the type. Now I do not miss any comments :P



  • Markdown Lint, Markdown Preview Enhanced, Markdown all in one
Since we are moving to GIT repositories and in all the SharePoint Framework solution, we have ReadMe.md file. Most of the people find it troublesome in writing markdown, but it is pretty simple and this extension helps a lot
    • Markdown lint: Checks if the syntax you are writing is correct or not
    • Markdown all in one: Offers a lot of shortcut keys for styling the markup
    • Markdown Preview Enhanced: As the name suggests, it displays the preview of the file. Just split the screen and see what you are writing

Happy Coding!!
#Microsoft #SharePoint #SharePointWidgets


Comments

Post a Comment

Popular posts from this blog

Rename Folder using Microsoft Flow / Power Automate in a Document Library in SharePoint Online

Image
Hi Friends, Today blog is about renaming the folder in the document library using the MS FLOW or MS Power Automate. When I started working on this it seems to be an easy job, but if you look into the connectors you'll find it really difficult as there is no straight forwards connector to do the job. Issues encountered If you try using the " Get Folder Metadata " connector, you'll not be able to get the ID of the folder as it is returning as the negative value. If you get the ID somehow and try to update the folder name using the " Update File Properties " connector, you'll end up renaming only the title of the folder, but it will still have the old name as the display name which in case is again a failure. There is no other connector which can be utilized to achieve the task of renaming the folder in a document library directly. Solution The solution is a simple three-step (at least in this example). Step 1: Initialize variables In case you are computing
Read more

Power Automate: How to Add "New Line" to the text in SharePoint multiline text field

Image
  Q. How to add "New Line", while adding the text to the SharePoint multiline text field?  A . In order to add the new line while adding a text to the multiline SharePoint field, I will demonstrate the simplest approach. Although you can find multiple approaches, but this one seems to be very easy and quick. You need to append the below expression to the text to make it to the new line: decodeUriComponent('%0A') If you are adding any array, then join the array using this expression or if you are building this string, then append this expression to the string. Step 1:  Add a variable and add the below expression (Write the code under the Expression tab) STEP 2: This is how your variable will look like      STEP 3: Output of the Address columns which is of Type Multiline text field Happy Coding..!! #Microsft #SharePointWidgets #PowerAutomate
Read more

Power Automate: Rename file in SharePoint Online

Image
  We often get to change the name of the file, so in this article, I will explain how to rename the file in SharePoint Online using Microsoft Power Automate. Below is the file which I will be renaming. Step 1: Get the file properties We only need to have the SharePoint item id, for which we want to rename the file Step 2: Update the File Name Add the "Send an HTTP request to SharePoint" connector, and update the following properties Method : POST Uri : _api/web/lists/GetByTitle(' <LIBRARY TITLE> ')/items( <ITEM ID> )/ValidateUpdateListItem Body: {     "formValues" :[         {             "FieldName" : "FileLeafRef" ,             "FieldValue" : "<New File Name>"         }     ] } Execute the flow, and the file will be renamed Happy Automating..!! #PowerAutomate #SharePointWidgets #Microsoft
Read more