Frontend

Hello everyone, earlier we have developed a react table view solution for frozen column, if you missed the post please find it here : https://reactcodes.blogspot.com/2019/11/react-fixed-table-header-code-without.html Today we will try to make the table header fixed but make the data vertically scrollable, below demo shows how the final result will be : To get the full codebase you may see my github link : https://github.com/reactcodes/react-sticky-table Explanation of process : Initially if you clone the codebase within App.js you will see that I have separated table header items and put those in an array const tableHeaders = [ "First Column", "Second Column", "Third Column", "Fourth Column", "Fifth Column", "Sixth Column", "Seventh Column", "Eight Column", ] Then I have the table data coming as a json I have the stickytableheader ...

Hello everyone, in this article I am going to explain how we can crop an image with irregular rectangular window and correct perspective to get a regular rectangular image frame. Find the final result below : How this cropping and perspective correction is done in this project, the below animation shows Well now lets discuss about the steps I followed to implement this.  I hope you have gone through my crop window making over an image post, if you have't please visit  https://reactcodes.blogspot.com/2019/11/creating-irregular-crop-window-on-image.html   It is important because, that is the first step. A quick summery of that post, I am taking an image in background, I am using d3 to create an svg element which is acting like an crop box, I have added some dragging function to adjust the corner, so that any image portion of any shape can be cropped. After this step, I have setup basic UI git show the output side by side. I have added canvas and us...