The latest articles on DEV Community by 1manav_itihash (@member_29cf5563). https://dev.to/member_29cf5563 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3267938%2Ff1d375d1-480e-4584-b52c-468055667744.jpg https://dev.to/member_29cf5563 en 1manav_itihash Tue, 09 Jun 2026 03:10:17 +0000 https://dev.to/member_29cf5563/data-visualizer-4j27 https://dev.to/member_29cf5563/data-visualizer-4j27 <h1> Data Visualizer </h1> <h2> Live Demo </h2> <p>🌐 <strong>Try it live:</strong> <a href="https://datavisualizer.urlmediainspector.dev/" rel="noopener noreferrer">https://datavisualizer.urlmediainspector.dev/</a></p> <h2> What It Is </h2> <p>Data Visualizer is a visual workspace where developers can explore, transform, execute, and understand data using interconnected nodes on an infinite canvas.</p> <p>Instead of jumping between API tools, JSON viewers, spreadsheets, code editors, schema inspectors, and visualization platforms, everything happens inside a single interactive environment.</p> <p>Each node represents a specific capability and can be connected together to create powerful workflows for data exploration, processing, automation, and analysis.</p> <h2> Key Features </h2> <h3> Infinite Visual Workspace </h3> <p>Work on an unlimited canvas where data, code, APIs, documents, and visualizations can be organized as connected workflows instead of isolated files and tabs.</p> <h3> API Exploration </h3> <p>Connect to APIs, inspect responses, analyze payloads, and build reusable visual pipelines for data processing.</p> <h3> JSON &amp; YAML Visualization </h3> <p>Navigate deeply nested structures through interactive visual representations that make complex data easier to understand.</p> <h3> JavaScript &amp; TypeScript Execution </h3> <p>Run JavaScript and TypeScript directly inside workflow nodes to transform, filter, and manipulate data in real time.</p> <h3> Browser-Based Python Runtime </h3> <p>Execute real Python entirely in the browser without requiring local installations or external servers.</p> <h3> CSV &amp; Dataset Analysis </h3> <p>Import and explore tabular data visually, making it easier to inspect records, understand relationships, and process large datasets.</p> <h3> Schema Exploration </h3> <p>Visualize schemas and nested structures to quickly understand how data is organized and connected.</p> <h3> PDF, Image &amp; Video Support </h3> <p>Work with documents and media assets directly inside the workspace without constantly switching applications.</p> <h3> Visual Data Pipelines </h3> <p>Create workflows by connecting nodes together, allowing data to flow naturally between APIs, transformations, code execution, schemas, and visualizations.</p> <h3> Interactive Data Transformation </h3> <p>Modify and reshape data visually while instantly seeing the results throughout the workflow.</p> <h3> Developer Playground </h3> <p>Experiment safely with APIs, code, data structures, and workflows in an environment designed for exploration and learning.</p> <h2> Why It Matters </h2> <p>Developers spend a significant amount of time understanding data before they can build with it.</p> <p>Traditional workflows often require switching between multiple tools:</p> <ul> <li>API Clients</li> <li>JSON Viewers</li> <li>Code Editors</li> <li>Spreadsheets</li> <li>Documentation</li> <li>Terminal Windows</li> <li>Visualization Tools</li> </ul> <p>Data Visualizer brings these experiences together into a single connected workspace where developers can focus on understanding and building instead of managing tools.</p> <h2> Use Cases </h2> <ul> <li>API debugging and exploration</li> <li>JSON and YAML inspection</li> <li>Data transformation workflows</li> <li>Dataset analysis</li> <li>Schema visualization</li> <li>Learning and experimentation</li> <li>Integration development</li> <li>Rapid prototyping</li> <li>Visual programming</li> <li>Data-driven automation</li> </ul> <h2> Vision </h2> <p>Our goal is to create a visual operating system for developers where data, code, APIs, documents, and media become connected building blocks that can be explored, transformed, and understood through intuitive visual workflows.</p> <p>Instead of thinking in files and tabs, developers can think in flows, relationships, and systems.</p> datavisualizer json yaml visualworkflow 1manav_itihash Sat, 27 Sep 2025 06:53:07 +0000 https://dev.to/member_29cf5563/jupyterlab-kendo-grid-extension-for-pandas-dataframes-57kk https://dev.to/member_29cf5563/jupyterlab-kendo-grid-extension-for-pandas-dataframes-57kk <p><em>This is a submission for the <a href="https://dev.to/challenges/kendoreact-2025-09-10">KendoReact Free Components Challenge</a>.</em></p> <h2> 🚀 What I Built </h2> <p>We embedded a <strong>Kendo React DataGrid</strong> directly inside <strong>JupyterLab</strong>. </p> <p>From within a notebook, you can now: </p> <ul> <li>🔎 <strong>Interactively filter and sort data</strong> </li> <li>📋 <strong>Select specific cells or rectangular ranges</strong> </li> <li>📑 <strong>Copy data in different formats</strong> </li> <li>🔍 <strong>Search across the grid</strong> </li> <li>📊 <strong>Visualize the same data in charts</strong> (bar, pie, scatter) — all <strong>without leaving JupyterLab</strong> </li> </ul> <h2> 🎬 Demo </h2> <p> <iframe src="https://www.youtube.com/embed/azxmUiqGYFg"> </iframe> </p> <p><a href="https://github.com/Karan09542/jupyterlab-kendo-grid" rel="noopener noreferrer">View the repository</a></p> <h2> 🛠 KendoReact Components Used </h2> <p><strong>Grid &amp; Data Components:</strong> </p> <ul> <li>Grid <ul> <li>Column </li> <li>GridToolbar </li> <li>GridPdfExport </li> <li>ExcelExport </li> <li>ExcelExportColumn </li> </ul> </li> </ul> <p><strong>Input &amp; Controls:</strong> </p> <ul> <li>Button </li> <li>ButtonGroup </li> <li>Checkbox </li> <li>Input </li> <li>DropDownList </li> <li>MultiSelect </li> </ul> <p><strong>UI &amp; Feedback:</strong> </p> <ul> <li>Popup </li> <li>Notification </li> <li>NotificationGroup </li> <li>Slide </li> <li>Dialog </li> <li>DialogActionBar </li> </ul> <p><strong>Additional Packages:</strong> </p> <ul> <li> <code>@progress/kendo-data-query</code> </li> <li> <code>@progress/kendo-react-icons</code> </li> </ul> <p>✨ <strong>Key Highlights:</strong> </p> <ul> <li>Fully interactive <strong>data exploration inside JupyterLab</strong> </li> <li> <strong>Charts and data grids</strong> work seamlessly in one environment </li> <li>Developers can quickly <strong>analyze, filter, and export data</strong> without switching apps </li> </ul> devchallenge kendoreactchallenge react webdev