Posts

Sorting in Typescript (Simple Arrays & Array of Objects)

Image
Hi Friends, This post is not regarding the SharePoint but it is a very common functionality that we need in day to day coding. So I thought to write down here. This functionality is of sorting in Typescript. Sorting simple Arrays Sorting is the very basic functionality that is required and when it comes to typescript  we do get OOB method, but that is for the simple array.    let  fruits : string []  =  [ ' Banana ' ,  ' Orange ' ,  ' Apple ' ,  ' Pineapple ' ] ;    console . log (fruits. sort ()); Output : Apple, Banana, Orange, Pineapple Sorting an Array of Objects When it comes to sorting the array of objects, we do not have any OOB method which can serve our purpose. for this, we have to write our small custom logic within the sort method let  fruits :   any []  =  [{ Name :   ' Banana '  }, { Name :   ' Orange '  },  { Name :   ' Appl...

Know your SharePoint Framework (SPFx) version

Image
Hi Friends, Most of the time when we are working on the SharePoint Framework or SPFx solutions, the version of each component can create issues while building the solutions. One of the common issues is with the SPFx version. SPFx version is the version of the SharePoint Framework yeomen generator installed on your machine. With the difference in the version, a solution might differ in the import versions of other libraries, change in solution scaffolding, and more... ➡️Steps to know your SPFx version Open the console  Type in the following command  npm ls -g --depth=0 @microsoft/generator-sharepoint Hit enter and wait for a few seconds. You'll get the response   Happy Coding #Microsoft #SharePoint #SharePointWidgets

4 Useful VS Code extensions for SharePoint Framework components

Image
Hi Friends, Today I will talk about the most useful VS Code extensions, that will help in the productivity of specifically SharePoint Framework projects. 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 ca...

SharePoint Online list conditional formatting and list forms formatting

Image
Hi Friends, As of today's update Microsoft is coming up with some new features as part of the SharePoint list and list forms formatting are concerned. Below are the highlights of the video: New Term has been introduced: RULES Using these rules one can do the column formatting without writing the JSON Customization of list forms (apart from PowerApps) Show/Hide of columns conditionally Re-arrange the rendering of the fields (sorting) Happy Coding Sumit Kanchan #Microsoft #SharePointWidgets

Powershell script to delete the Modern Pages in SharePoint Online

Image
Hi Friends, In one of the scenarios I have written a PowerShell script to delete large number of pages. Since this activity can be very common, so I thought to share it here as well. Here is the PowerShell script. Happy Coding Sumit Kanchan #SharePointWidgets #Powershell

Random Color Generator using js

Image
Hi friends, Today I felt the need to get the random color in one of my tasks, so i thought to share the code here as well, as sometimes they are great time savers. So in this code below, it will generate the random color everytime the method is called Happy coding Sumit Kanchan #SharePointWidgets

SharePoint Framework (SPFx) Tab Control (react)

Image
Hi Friends, This time I have worked upon a tab control which is still missing from Microsoft sample collection. I personally felt this tab control webpart can be of use in many scenarios. I have used the Rich Text editor for the implementation, where whenever a new tab is added , the text editor automatically gets associated with the tab. Since it is the rich text editor so you can do almost everything you want to display with all the custom formatting options available. Source Code on GitHub Features ! No configuration for the webpart to use Safe and fast as there is no external saving of data Rich Text editor increases lot of possibilities how you use it Light weight control Installation $ npm install $ gulp clean $ gulp bundle --ship $ gulp package-solution --ship Below are some of the images that demonstrates the webpart. View Mode Edit Mode Please provide your comments , if you need any more feature or how you like the control. Hap...