CINXE.COM
JavaScript - Forem
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>JavaScript - Forem</title> <meta name="last-updated" content="2025-04-08 11:41:30 UTC"> <meta name="user-signed-in" content="false"> <meta name="head-cached-at" content="1744112490"> <meta name="environment" content="production"> <link rel="stylesheet" href="https://assets.dev.to/assets/minimal-6f5c5ed9c571b36ab9c316526d7032b5a4c789f3a4c35503492eb03376615fca.css" media="all" id="main-minimal-stylesheet" /> <link rel="stylesheet" href="https://assets.dev.to/assets/views-1c703342dce6eac414f19ca7fd07bcf83cbe44088659758144e52e7fa1e92dd3.css" media="all" id="main-views-stylesheet" /> <link rel="stylesheet" href="https://assets.dev.to/assets/crayons-0f2fc85bc159498f8ae6fba58c460e6deba863d02d59dfa994c1954976ddb6cc.css" media="all" id="main-crayons-stylesheet" /> <script src="https://assets.dev.to/assets/base-b8bdff515245fe895f3035d77697afb35d5d7e114bdf68291667479d4b289751.js" defer="defer"></script> <script src="https://assets.dev.to/assets/application-7258612fccf5d56314a6e4ad1898b4f818f474c4bb3485e302428d489a769a17.js" defer="defer"></script> <script src="https://assets.dev.to/assets/baseInitializers-b74902d56433062a87f5f1ce74769baf2a1a698772f46952b0ac72bc95c4abfd.js" defer="defer"></script> <script src="https://assets.dev.to/assets/baseTracking-b6bf73e5ee66633e151e7d5b7c6bbccedfa4c59e3615be97b98c4c0f543ddae7.js" defer="defer"></script> <meta name="search-script" content="https://assets.dev.to/assets/Search-7dcdad3172ab4501a4598fe8b716c7a88146e79fd42256d36fb1b83e27bf77cf.js"> <link rel="canonical" href="https://forem.com/t/javascript" /> <meta name="description" content="javascript content on Forem"> <meta name="keywords" content="software development, engineering, javascript"> <meta property="og:type" content="website" /> <meta property="og:url" content="https://forem.com/t/javascript" /> <meta property="og:title" content="JavaScript" /> <meta property="og:description" content="JavaScript content on Forem" /> <meta property="og:site_name" content="Forem" /> <meta name="twitter:site" content="@"> <meta name="twitter:creator" content="@JavaScript"> <meta name="twitter:title" content="JavaScript"> <meta name="twitter:description" content="JavaScript content on Forem"> <meta name="twitter:card" content="summary_large_image"> <meta property="og:image" content="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xwqjxhl12sg768xrlmlv.png"> <meta name="twitter:image:src" content="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xwqjxhl12sg768xrlmlv.png"> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover"> <link rel="icon" type="image/x-icon" href="https://media2.dev.to/dynamic/image/width=32,height=,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwalhydbusoe2o1pzxfwj.png" /> <link rel="apple-touch-icon" href="https://media2.dev.to/dynamic/image/width=180,height=,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwalhydbusoe2o1pzxfwj.png"> <link rel="apple-touch-icon" sizes="152x152" href="https://media2.dev.to/dynamic/image/width=152,height=,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwalhydbusoe2o1pzxfwj.png"> <link rel="apple-touch-icon" sizes="180x180" href="https://media2.dev.to/dynamic/image/width=180,height=,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwalhydbusoe2o1pzxfwj.png"> <link rel="apple-touch-icon" sizes="167x167" href="https://media2.dev.to/dynamic/image/width=167,height=,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwalhydbusoe2o1pzxfwj.png"> <link href="https://media2.dev.to/dynamic/image/width=192,height=,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwalhydbusoe2o1pzxfwj.png" rel="icon" sizes="192x192" /> <link href="https://media2.dev.to/dynamic/image/width=128,height=,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwalhydbusoe2o1pzxfwj.png" rel="icon" sizes="128x128" /> <meta name="apple-mobile-web-app-title" content="forem.com"> <meta name="application-name" content="forem.com"> <meta name="theme-color" content="#ffffff" media="(prefers-color-scheme: light)"> <meta name="theme-color" content="#000000" media="(prefers-color-scheme: dark)"> <link rel="search" href="https://forem.com/open-search.xml" type="application/opensearchdescription+xml" title="Forem" /> <meta property="forem:name" content="Forem" /> <meta property="forem:logo" content="https://media2.dev.to/dynamic/image/width=512,height=,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwalhydbusoe2o1pzxfwj.png" /> <meta property="forem:domain" content="forem.com" /> </head> <body class="sans-serif-article-body default-header" data-user-status="logged-out" data-community-name="DEV Community" data-subscription-icon="https://assets.dev.to/assets/subscription-icon-805dfa7ac7dd660f07ed8d654877270825b07a92a03841aa99a1093bd00431b2.png" data-locale="en" data-honeybadger-key="hbp_nqu4Y66HuEKlD6YRGssZuRQnPOjDm50J8Zkr" data-deployed-at="2025-04-07T20:36:49Z" data-latest-commit-id="64b51b416494e2398dbb49482c2354f1ebbbd896" data-ga-tracking="UA-71991109-1" data-cookie-banner-user-context="logged_out_only" data-cookie-banner-platform-context="off" data-algolia-id="PRSOBFP46H" data-algolia-search-key="9aa7d31610cba78851c9b1f63776a9dd" data-algolia-display="true" data-dynamic-url-component="bmar11" data-ga4-tracking-id="G-TYEM8Y3JN3"> <script> if (navigator.userAgent === 'ForemWebView/1' || window.frameElement) { document.body.classList.add("hidden-shell"); } </script> <link rel="stylesheet" href="https://assets.dev.to/assets/minimal-6f5c5ed9c571b36ab9c316526d7032b5a4c789f3a4c35503492eb03376615fca.css" media="all" id="secondary-minimal-stylesheet" /> <link rel="stylesheet" href="https://assets.dev.to/assets/views-1c703342dce6eac414f19ca7fd07bcf83cbe44088659758144e52e7fa1e92dd3.css" media="all" id="secondary-views-stylesheet" /> <link rel="stylesheet" href="https://assets.dev.to/assets/crayons-0f2fc85bc159498f8ae6fba58c460e6deba863d02d59dfa994c1954976ddb6cc.css" media="all" id="secondary-crayons-stylesheet" /> <div id="body-styles"> <style> :root { --accent-brand-lighter-rgb: 80, 99, 301; --accent-brand-rgb: 59, 73, 223; --accent-brand-darker-rgb: 47, 58, 178; } </style> </div> <div id="audiocontent" data-podcast=""> </div> <div class="navigation-progress" id="navigation-progress"></div> <header id="topbar" class="crayons-header topbar print-hidden"> <span id="route-change-target" tabindex="-1"></span> <a href="#main-content" class="skip-content-link">Skip to content</a> <div class="crayons-header__container"> <span class="inline-block m:hidden "> <button class="c-btn c-btn--icon-alone js-hamburger-trigger mx-2"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="a5ck4x68ebkjfc89ohflj9b9tsa4rq1d" class="crayons-icon"><title id="a5ck4x68ebkjfc89ohflj9b9tsa4rq1d">Navigation menu</title> <path d="M3 4h18v2H3V4zm0 7h18v2H3v-2zm0 7h18v2H3v-2z"></path> </svg> </button> </span> <a href="/" class="site-logo" aria-label="DEV Community Home"> <img class="site-logo__img" src="https://dev-to-uploads.s3.amazonaws.com/uploads/logos/resized_logo_kyjiPyA0XdMwJmQGGBvv.png" style="aspect-ratio: 170 / 72" alt="DEV Community"> </a> <div class="crayons-header--search js-search-form" id="header-search"> <form accept-charset="UTF-8" method="get" action="/search" role="search"> <div class="crayons-fields crayons-fields--horizontal"> <div class="crayons-field flex-1 relative"> <input id="search-input" class="crayons-header--search-input crayons-textfield js-search-input" type="text" id="nav-search" name="q" placeholder="Search..." autocomplete="off" /> <button type="submit" aria-label="Search" class="c-btn c-btn--icon-alone absolute inset-px right-auto mt-0 py-0"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="a4evkdo3471pqxnpjye2lytm76zqvzjp" aria-hidden="true" class="crayons-icon"><title id="a4evkdo3471pqxnpjye2lytm76zqvzjp">Search</title> <path d="M18.031 16.617l4.283 4.282-1.415 1.415-4.282-4.283A8.96 8.96 0 0111 20c-4.968 0-9-4.032-9-9s4.032-9 9-9 9 4.032 9 9a8.96 8.96 0 01-1.969 5.617zm-2.006-.742A6.977 6.977 0 0018 11c0-3.868-3.133-7-7-7-3.868 0-7 3.132-7 7 0 3.867 3.132 7 7 7a6.977 6.977 0 004.875-1.975l.15-.15z"></path> </svg> </button> <a class="crayons-header--search-brand-indicator" href="https://www.algolia.com/developers/?utm_source=devto&utm_medium=referral" target="_blank" rel="noopener noreferrer"> Powered by <svg xmlns="http://www.w3.org/2000/svg" id="Layer_1" width="24" height="24" viewBox="0 0 500 500.34" role="img" aria-labelledby="a6rha9bmjcvv8f4bsh01apajqds7m8sr" aria-hidden="true" class="crayons-icon"><title id="a6rha9bmjcvv8f4bsh01apajqds7m8sr">Search</title> <defs></defs><path class="cls-1" d="M250,0C113.38,0,2,110.16,.03,246.32c-2,138.29,110.19,252.87,248.49,253.67,42.71,.25,83.85-10.2,120.38-30.05,3.56-1.93,4.11-6.83,1.08-9.52l-23.39-20.74c-4.75-4.22-11.52-5.41-17.37-2.92-25.5,10.85-53.21,16.39-81.76,16.04-111.75-1.37-202.04-94.35-200.26-206.1,1.76-110.33,92.06-199.55,202.8-199.55h202.83V407.68l-115.08-102.25c-3.72-3.31-9.43-2.66-12.43,1.31-18.47,24.46-48.56,39.67-81.98,37.36-46.36-3.2-83.92-40.52-87.4-86.86-4.15-55.28,39.65-101.58,94.07-101.58,49.21,0,89.74,37.88,93.97,86.01,.38,4.28,2.31,8.28,5.53,11.13l29.97,26.57c3.4,3.01,8.8,1.17,9.63-3.3,2.16-11.55,2.92-23.6,2.07-35.95-4.83-70.39-61.84-127.01-132.26-131.35-80.73-4.98-148.23,58.18-150.37,137.35-2.09,77.15,61.12,143.66,138.28,145.36,32.21,.71,62.07-9.42,86.2-26.97l150.36,133.29c6.45,5.71,16.62,1.14,16.62-7.48V9.49C500,4.25,495.75,0,490.51,0H250Z"></path> </svg> Algolia </a> </div> </div> </form> </div> <div class="flex items-center h-100 ml-auto"> <div class="flex" id="authentication-top-nav-actions"> <span class="hidden m:block"> <a href="https://dev.to/enter" class="c-link c-link--block mr-2 whitespace-nowrap ml-auto" data-no-instant> Log in </a> </span> <a href="https://dev.to/enter?state=new-user" data-tracking-id="ca_top_nav" data-tracking-source="top_navbar" class="c-cta c-cta--branded whitespace-nowrap mr-2" data-no-instant> Create account </a> </div> </div> </div> </header> <div class="hamburger"> <div class="hamburger__content"> <header class="hamburger__content__header"> <h2 class="fs-l fw-bold flex-1 break-word lh-tight">DEV Community</h2> <button class="c-btn c-btn--icon-alone js-hamburger-trigger shrink-0" aria-label="Close"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="a2ab1sw8aw6nqgrqk0i035hilbo1mzo3" aria-hidden="true" class="crayons-icon c-btn__icon"><title id="a2ab1sw8aw6nqgrqk0i035hilbo1mzo3">Close</title><path d="M12 10.586l4.95-4.95 1.414 1.414-4.95 4.95 4.95 4.95-1.414 1.414-4.95-4.95-4.95 4.95-1.414-1.414 4.95-4.95-4.95-4.95L7.05 5.636l4.95 4.95z"></path></svg> </button> </header> <div class="p-2 js-navigation-links-container" id="authentication-hamburger-actions"> </div> </div> <div class="hamburger__overlay js-hamburger-trigger"></div> </div> <div id="active-broadcast" class="broadcast-wrapper"></div> <div id="page-content" class="wrapper tagged_articles tagged_articles-index" data-current-page="tagged_articles-index"> <div id="page-content-inner" data-internal-nav="false"> <div id="page-route-change" class="screen-reader-only" aria-live="polite" aria-atomic="true"></div> <div data-tag-id="6" data-tag-name="javascript" id="tag-6" class="crayons-layout js-tag-card"> <header class="crayons-card branded-4 p-4 l:p-6 spec__tag-header" style="border-top-color: #f7df1e "> <div class="flex"> <img src="https://media2.dev.to/dynamic/image/width=64,height=,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fbadge%2Fbadge_image%2F16%2Fjs-badge.png" alt="" class="mr-4" style="transform: rotate(5deg); width: 64px; height: 64px;" /> <div class="flex flex-col w-100 justify-center"> <div class="flex justify-between items-center"> <h1 class="crayons-title"> JavaScript </h1> <div id="tag-buttons-6" class="mt-auto flex items-end justify-between"> <div class="flex gap-2"> <button class="c-btn c-btn--primary js-follow-tag-button" aria-label="Follow tag: javascript"> Follow </button> <button class="c-btn js-hide-tag-button" aria-label="Hide tag: javascript"> Hide </button> </div> </div> </div> <p class="max-w-100 m:max-w-75 pt-2 s:pt-4"> Once relegated to the browser as one of the 3 core technologies of the web, JavaScript can now be found almost anywhere you find code. JavaScript developers move fast and push software development forward; they can be as opinionated as the frameworks they use, so let's keep it clean here and make it a place to learn from each other! </p> </div> </div> </header> </div> <div class="home sub-home" id="index-container" data-params="{"tag":"javascript","sort_by":"hotness_score","sort_direction":"desc"}" data-which="" data-tag="javascript" data-feed="base-feed" data-requires-approval="false" data-articles-since=""> <div id="sidebar-wrapper-left" class="sidebar-wrapper sidebar-wrapper-left"> <div class="sidebar-bg" id="sidebar-bg-left"></div> <aside class="side-bar"> <div class="widget js-policy-article-create"> <a class="crayons-btn crayons-btn--s" href="/new/javascript"> Create Post </a> </div> <div class="widget"> <header> <h4>submission guidelines</h4> </header> <div class="widget-body"> <p>Client-side, server-side, it doesn't matter. This tag should be used for anything <strong><em>JavaScript</em></strong> focused. If the topic is about a JavaScript <em>framework</em> or <em>library</em>, just remember to include the framework's tag as well.</p> </div> </div> <div class="widget"> <header> <h4>about #javascript</h4> </header> <div class="widget-body"> <p>How should the tag be written? All lower-case letters for the tag: <code>javascript</code>.</p> </div> </div> <div class="sidebar-data"> <div> 0 Posts Published </div> </div> </aside> </div> <main class="articles-list" id="main-content" data-follow-button-container="true"> <header class="flex items-center p-2 m:p-0 m:pb-2" id="on-page-nav-controls"> <h1 class="screen-reader-only">Posts</h1> <button type="button" class="crayons-btn crayons-btn--ghost crayons-btn--icon mr-2 inline-block m:hidden mb-auto" id="on-page-nav-butt-left" aria-label="nav-button-left"> <div class="crayons-icon nav-icon "> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="a4qtgq41lpznbo404ze3l46yfjai97pn" class="crayons-icon"><title id="a4qtgq41lpznbo404ze3l46yfjai97pn">Left menu</title> <path d="M3 4h18v2H3V4zm0 7h18v2H3v-2zm0 7h18v2H3v-2z"></path> </svg> </div> </button> <div class="flex-1 flex items-center justify-between"> <div class="crayons-notice w-100" aria-live="polite">👋 <a href="/enter">Sign in</a> for the ability to sort posts by <strong>relevant</strong>, <strong>latest</strong>, or <strong>top</strong>.</div> </div> <button type="button" class="crayons-btn crayons-btn--ghost crayons-btn--icon ml-2 inline-block l:hidden mb-auto" id="on-page-nav-butt-right" aria-label="nav-button-right"> <div class="crayons-icon nav-icon "> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="atgzrwiqjv1vb1rxr78d9cw31g4bxk6z" class="crayons-icon"><title id="atgzrwiqjv1vb1rxr78d9cw31g4bxk6z">Right menu</title> <path d="M3 4h18v2H3V4zm0 7h18v2H3v-2zm0 7h18v2H3v-2z"></path> </svg> </div> </button> </header> <div class="substories" id="substories"> <div class="crayons-story " data-feed-content-id="2391290" data-content-user-id="2985351"> <a href="https://dev.to/alexander_shagin_6604f9bd/tsparticles-21li" aria-labelledby="article-link-2391290" class="crayons-story__hidden-navigation-link">tsParticles</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/alexander_shagin_6604f9bd" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2985351%2F6a209923-717c-4676-991c-5290adfafff4.png" alt="alexander_shagin_6604f9bd profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/alexander_shagin_6604f9bd" class="crayons-story__secondary fw-medium m:hidden"> Alexander Shagin </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2391290" aria-controls="story-author-preview-content-2391290" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Alexander Shagin profile details"> Alexander Shagin </button> <div id="story-author-preview-content-2391290" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/alexander_shagin_6604f9bd" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2985351%2F6a209923-717c-4676-991c-5290adfafff4.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Alexander Shagin</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":2985351,"className":"User","name":"Alexander Shagin"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="2985351"></div> </div> </div> </div> </div> <a href="https://dev.to/alexander_shagin_6604f9bd/tsparticles-21li" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T10:56:16Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744109776"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/alexander_shagin_6604f9bd/tsparticles-21li" data-preload-image="" id="article-link-2391290"> tsParticles </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(9, 27, 71, 0.10); --tag-prefix: #091b47; --tag-bg-hover: rgba(9, 27, 71, 0.10); --tag-prefix-hover: #091b47; " href="/t/showdev"><span class="crayons-tag__prefix">#</span>showdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(59, 73, 223, 0.10); --tag-prefix: #3b49df; --tag-bg-hover: rgba(59, 73, 223, 0.10); --tag-prefix-hover: #3b49df; " href="/t/webdesign"><span class="crayons-tag__prefix">#</span>webdesign</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(0, 0, 0, 0.10); --tag-prefix: #000000; --tag-bg-hover: rgba(0, 0, 0, 0.10); --tag-prefix-hover: #000000; " href="/t/github"><span class="crayons-tag__prefix">#</span>github</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/alexander_shagin_6604f9bd/tsparticles-21li#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - tsParticles"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="amysgcizuwtnlezk1dz3cwa1unw83jjw" class="crayons-icon"><title id="amysgcizuwtnlezk1dz3cwa1unw83jjw">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> <button type="button" id="article-save-button-2391290" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2391290" data-article-author-id="2985351" aria-label="Save post tsParticles to reading list" title="Save post tsParticles to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2391139" data-content-user-id="2696112"> <a href="https://dev.to/woai3c/analysis-of-key-technical-principles-for-a-visual-drag-and-drop-component-library-2-1hkb" aria-labelledby="article-link-2391139" class="crayons-story__hidden-navigation-link">Analysis of Key Technical Principles for a Visual Drag-and-Drop Component Library - 2</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/woai3c" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2696112%2F24abd4b6-60e4-424e-b9f9-415f0742db8e.jpg" alt="woai3c profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/woai3c" class="crayons-story__secondary fw-medium m:hidden"> woai3c </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2391139" aria-controls="story-author-preview-content-2391139" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="woai3c profile details"> woai3c </button> <div id="story-author-preview-content-2391139" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/woai3c" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2696112%2F24abd4b6-60e4-424e-b9f9-415f0742db8e.jpg" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">woai3c</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":2696112,"className":"User","name":"woai3c"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="2696112"></div> </div> </div> </div> </div> <a href="https://dev.to/woai3c/analysis-of-key-technical-principles-for-a-visual-drag-and-drop-component-library-2-1hkb" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T09:52:54Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744105974"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/woai3c/analysis-of-key-technical-principles-for-a-visual-drag-and-drop-component-library-2-1hkb" data-preload-image="https://media2.dev.to/dynamic/image/width=1000,height=1000,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fq41e5o3n5nvz1zgk2x24.png" id="article-link-2391139"> Analysis of Key Technical Principles for a Visual Drag-and-Drop Component Library - 2 </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(255, 51, 224, 0.10); --tag-prefix: #ff33e0; --tag-bg-hover: rgba(255, 51, 224, 0.10); --tag-prefix-hover: #ff33e0; " href="/t/frontend"><span class="crayons-tag__prefix">#</span>frontend</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(146, 0, 0, 0.10); --tag-prefix: #920000; --tag-bg-hover: rgba(146, 0, 0, 0.10); --tag-prefix-hover: #920000; " href="/t/lowcode"><span class="crayons-tag__prefix">#</span>lowcode</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/woai3c/analysis-of-key-technical-principles-for-a-visual-drag-and-drop-component-library-2-1hkb#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Analysis of Key Technical Principles for a Visual Drag-and-Drop Component Library - 2"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a3g3agi8b4ksncy3bqeeyc5k297ey124" class="crayons-icon"><title id="a3g3agi8b4ksncy3bqeeyc5k297ey124">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 13 min read </small> <button type="button" id="article-save-button-2391139" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2391139" data-article-author-id="2696112" aria-label="Save post Analysis of Key Technical Principles for a Visual Drag-and-Drop Component Library - 2 to reading list" title="Save post Analysis of Key Technical Principles for a Visual Drag-and-Drop Component Library - 2 to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2391130" data-content-user-id="1168538"> <a href="https://dev.to/keploy/static-code-analysis-ensuring-code-quality-before-execution-5hmm" aria-labelledby="article-link-2391130" class="crayons-story__hidden-navigation-link">Static Code Analysis: Ensuring Code Quality Before Execution</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/keploy" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1168538%2F3953214c-124c-46fc-b7c1-1ce50c8ec4ab.png" alt="keploy profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/keploy" class="crayons-story__secondary fw-medium m:hidden"> keploy </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2391130" aria-controls="story-author-preview-content-2391130" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="keploy profile details"> keploy </button> <div id="story-author-preview-content-2391130" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/keploy" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1168538%2F3953214c-124c-46fc-b7c1-1ce50c8ec4ab.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">keploy</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":1168538,"className":"User","name":"keploy"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="1168538"></div> </div> </div> </div> </div> <a href="https://dev.to/keploy/static-code-analysis-ensuring-code-quality-before-execution-5hmm" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T09:49:58Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744105798"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/keploy/static-code-analysis-ensuring-code-quality-before-execution-5hmm" data-preload-image="" id="article-link-2391130"> Static Code Analysis: Ensuring Code Quality Before Execution </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(137, 6, 6, 0.10); --tag-prefix: #890606; --tag-bg-hover: rgba(137, 6, 6, 0.10); --tag-prefix-hover: #890606; " href="/t/programming"><span class="crayons-tag__prefix">#</span>programming</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(0, 131, 53, 0.10); --tag-prefix: #008335; --tag-bg-hover: rgba(0, 131, 53, 0.10); --tag-prefix-hover: #008335; " href="/t/beginners"><span class="crayons-tag__prefix">#</span>beginners</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(23, 253, 26, 0.10); --tag-prefix: #17fd1a; --tag-bg-hover: rgba(23, 253, 26, 0.10); --tag-prefix-hover: #17fd1a; " href="/t/ai"><span class="crayons-tag__prefix">#</span>ai</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/keploy/static-code-analysis-ensuring-code-quality-before-execution-5hmm#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Static Code Analysis: Ensuring Code Quality Before Execution"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a8jw94eluf82jwc7ltri3jh9k787mvhv" class="crayons-icon"><title id="a8jw94eluf82jwc7ltri3jh9k787mvhv">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 3 min read </small> <button type="button" id="article-save-button-2391130" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2391130" data-article-author-id="1168538" aria-label="Save post Static Code Analysis: Ensuring Code Quality Before Execution to reading list" title="Save post Static Code Analysis: Ensuring Code Quality Before Execution to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2391133" data-content-user-id="425236"> <a href="https://dev.to/esraanasr92/react-tabs-component-gkf" aria-labelledby="article-link-2391133" class="crayons-story__hidden-navigation-link">React Tabs Component</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/esraanasr92" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F425236%2F6b95bcef-f09c-47f9-8c41-68fa9f89a1fa.jpg" alt="esraanasr92 profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/esraanasr92" class="crayons-story__secondary fw-medium m:hidden"> Esraa Nasr </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2391133" aria-controls="story-author-preview-content-2391133" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Esraa Nasr profile details"> Esraa Nasr </button> <div id="story-author-preview-content-2391133" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/esraanasr92" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F425236%2F6b95bcef-f09c-47f9-8c41-68fa9f89a1fa.jpg" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Esraa Nasr</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":425236,"className":"User","name":"Esraa Nasr"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="425236"></div> </div> </div> </div> </div> <a href="https://dev.to/esraanasr92/react-tabs-component-gkf" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T09:50:13Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744105813"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/esraanasr92/react-tabs-component-gkf" data-preload-image="" id="article-link-2391133"> React Tabs Component </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(0, 131, 53, 0.10); --tag-prefix: #008335; --tag-bg-hover: rgba(0, 131, 53, 0.10); --tag-prefix-hover: #008335; " href="/t/beginners"><span class="crayons-tag__prefix">#</span>beginners</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(59, 73, 223, 0.10); --tag-prefix: #3b49df; --tag-bg-hover: rgba(59, 73, 223, 0.10); --tag-prefix-hover: #3b49df; " href="/t/reactjsdevelopment"><span class="crayons-tag__prefix">#</span>reactjsdevelopment</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/esraanasr92/react-tabs-component-gkf#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - React Tabs Component"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aot0qnc2b5tuw726f0pfsvfrnwc94e0k" class="crayons-icon"><title id="aot0qnc2b5tuw726f0pfsvfrnwc94e0k">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 2 min read </small> <button type="button" id="article-save-button-2391133" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2391133" data-article-author-id="425236" aria-label="Save post React Tabs Component to reading list" title="Save post React Tabs Component to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2391082" data-content-user-id="1384797"> <a href="https://dev.to/palo/j-box-totaljs-2bah" aria-labelledby="article-link-2391082" class="crayons-story__hidden-navigation-link">j-Box - Total.js</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/palo" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1384797%2F222e02ab-0f2e-4b22-9cf9-bcf958519b8f.jpg" alt="palo profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/palo" class="crayons-story__secondary fw-medium m:hidden"> Pavol </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2391082" aria-controls="story-author-preview-content-2391082" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Pavol profile details"> Pavol </button> <div id="story-author-preview-content-2391082" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/palo" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1384797%2F222e02ab-0f2e-4b22-9cf9-bcf958519b8f.jpg" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Pavol</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":1384797,"className":"User","name":"Pavol"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="1384797"></div> </div> </div> </div> </div> <a href="https://dev.to/palo/j-box-totaljs-2bah" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T09:33:40Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744104820"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/palo/j-box-totaljs-2bah" data-preload-image="https://media2.dev.to/dynamic/image/width=1000,height=1000,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F21k624wfz0z1f9u6xfla.png" id="article-link-2391082"> j-Box - Total.js </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(123, 104, 190, 0.10); --tag-prefix: #7b68be; --tag-bg-hover: rgba(123, 104, 190, 0.10); --tag-prefix-hover: #7b68be; " href="/t/ui"><span class="crayons-tag__prefix">#</span>ui</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(59, 73, 223, 0.10); --tag-prefix: #3b49df; --tag-bg-hover: rgba(59, 73, 223, 0.10); --tag-prefix-hover: #3b49df; " href="/t/totaljs"><span class="crayons-tag__prefix">#</span>totaljs</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/palo/j-box-totaljs-2bah#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - j-Box - Total.js"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a4pzp3yeyzugqsgbquvqnobgewxzmbf2" class="crayons-icon"><title id="a4pzp3yeyzugqsgbquvqnobgewxzmbf2">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 6 min read </small> <button type="button" id="article-save-button-2391082" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2391082" data-article-author-id="1384797" aria-label="Save post j-Box - Total.js to reading list" title="Save post j-Box - Total.js to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2391138" data-content-user-id="1320259"> <a href="https://dev.to/joodi/free-nextjs-hosting-providers-in-2025-pros-and-cons-2a0e" aria-labelledby="article-link-2391138" class="crayons-story__hidden-navigation-link">Free Next.js Hosting Providers in 2025: Pros and Cons</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/joodi" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1320259%2Fcf5661b9-1a87-46bd-ac45-5fc6813c7237.png" alt="joodi profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/joodi" class="crayons-story__secondary fw-medium m:hidden"> Joodi </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2391138" aria-controls="story-author-preview-content-2391138" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Joodi profile details"> Joodi </button> <div id="story-author-preview-content-2391138" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/joodi" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1320259%2Fcf5661b9-1a87-46bd-ac45-5fc6813c7237.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Joodi</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":1320259,"className":"User","name":"Joodi"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="1320259"></div> </div> </div> </div> </div> <a href="https://dev.to/joodi/free-nextjs-hosting-providers-in-2025-pros-and-cons-2a0e" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T09:51:28Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744105888"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/joodi/free-nextjs-hosting-providers-in-2025-pros-and-cons-2a0e" data-preload-image="" id="article-link-2391138"> Free Next.js Hosting Providers in 2025: Pros and Cons </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(0, 0, 0, 0.10); --tag-prefix: #000000; --tag-bg-hover: rgba(0, 0, 0, 0.10); --tag-prefix-hover: #000000; " href="/t/nextjs"><span class="crayons-tag__prefix">#</span>nextjs</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(59, 73, 223, 0.10); --tag-prefix: #3b49df; --tag-bg-hover: rgba(59, 73, 223, 0.10); --tag-prefix-hover: #3b49df; " href="/t/vercel"><span class="crayons-tag__prefix">#</span>vercel</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(35, 74, 132, 0.10); --tag-prefix: #234A84; --tag-bg-hover: rgba(35, 74, 132, 0.10); --tag-prefix-hover: #234A84; " href="/t/typescript"><span class="crayons-tag__prefix">#</span>typescript</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/joodi/free-nextjs-hosting-providers-in-2025-pros-and-cons-2a0e" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="2391138" aria-label="Add a comment to post - Free Next.js Hosting Providers in 2025: Pros and Cons"> <div class="multiple_reactions_aggregate"> <span class="multiple_reactions_icons_container" dir="rtl"> <span class="crayons_icon_container"> <img src="https://assets.dev.to/assets/fire-f60e7a582391810302117f987b22a8ef04a2fe0df7e3258a5f49332df1cec71e.svg" width="18" height="18" /> </span> <span class="crayons_icon_container"> <img src="https://assets.dev.to/assets/raised-hands-74b2099fd66a39f2d7eed9305ee0f4553df0eb7b4f11b01b6b1b499973048fe5.svg" width="18" height="18" /> </span> <span class="crayons_icon_container"> <img src="https://assets.dev.to/assets/exploding-head-daceb38d627e6ae9b730f36a1e390fca556a4289d5a41abb2c35068ad3e2c4b5.svg" width="18" height="18" /> </span> <span class="crayons_icon_container"> <img src="https://assets.dev.to/assets/multi-unicorn-b44d6f8c23cdd00964192bedc38af3e82463978aa611b4365bd33a0f1f4f3e97.svg" width="18" height="18" /> </span> <span class="crayons_icon_container"> <img src="https://assets.dev.to/assets/sparkle-heart-5f9bee3767e18deb1bb725290cb151c25234768a0e9a2bd39370c382d02920cf.svg" width="18" height="18" /> </span> </span> <span class="aggregate_reactions_counter">6<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="https://dev.to/joodi/free-nextjs-hosting-providers-in-2025-pros-and-cons-2a0e#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Free Next.js Hosting Providers in 2025: Pros and Cons"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ae0jzolggwd3hjig4099o7jndvdztkeq" class="crayons-icon"><title id="ae0jzolggwd3hjig4099o7jndvdztkeq">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 4 min read </small> <button type="button" id="article-save-button-2391138" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2391138" data-article-author-id="1320259" aria-label="Save post Free Next.js Hosting Providers in 2025: Pros and Cons to reading list" title="Save post Free Next.js Hosting Providers in 2025: Pros and Cons to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2390994" data-content-user-id="1168538"> <a href="https://dev.to/keploy/static-code-analysis-ensuring-code-quality-before-execution-4pk9" aria-labelledby="article-link-2390994" class="crayons-story__hidden-navigation-link">Static Code Analysis: Ensuring Code Quality Before Execution</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/keploy" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1168538%2F3953214c-124c-46fc-b7c1-1ce50c8ec4ab.png" alt="keploy profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/keploy" class="crayons-story__secondary fw-medium m:hidden"> keploy </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2390994" aria-controls="story-author-preview-content-2390994" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="keploy profile details"> keploy </button> <div id="story-author-preview-content-2390994" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/keploy" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1168538%2F3953214c-124c-46fc-b7c1-1ce50c8ec4ab.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">keploy</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":1168538,"className":"User","name":"keploy"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="1168538"></div> </div> </div> </div> </div> <a href="https://dev.to/keploy/static-code-analysis-ensuring-code-quality-before-execution-4pk9" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T09:08:56Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744103336"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/keploy/static-code-analysis-ensuring-code-quality-before-execution-4pk9" data-preload-image="" id="article-link-2390994"> Static Code Analysis: Ensuring Code Quality Before Execution </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(137, 6, 6, 0.10); --tag-prefix: #890606; --tag-bg-hover: rgba(137, 6, 6, 0.10); --tag-prefix-hover: #890606; " href="/t/programming"><span class="crayons-tag__prefix">#</span>programming</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(23, 253, 26, 0.10); --tag-prefix: #17fd1a; --tag-bg-hover: rgba(23, 253, 26, 0.10); --tag-prefix-hover: #17fd1a; " href="/t/ai"><span class="crayons-tag__prefix">#</span>ai</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/keploy/static-code-analysis-ensuring-code-quality-before-execution-4pk9#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Static Code Analysis: Ensuring Code Quality Before Execution"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ad3cv8ioa8evadcmtnktwzn848b9pjxi" class="crayons-icon"><title id="ad3cv8ioa8evadcmtnktwzn848b9pjxi">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 3 min read </small> <button type="button" id="article-save-button-2390994" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2390994" data-article-author-id="1168538" aria-label="Save post Static Code Analysis: Ensuring Code Quality Before Execution to reading list" title="Save post Static Code Analysis: Ensuring Code Quality Before Execution to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2390797" data-content-user-id="1555182"> <a href="https://dev.to/syed_mudasseranayat_e251/integrating-chatgpt-with-nodejs-build-your-own-ai-chatbot-4p1i" aria-labelledby="article-link-2390797" class="crayons-story__hidden-navigation-link">Integrating ChatGPT with Node.js: Build Your Own AI Chatbot</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/syed_mudasseranayat_e251" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1555182%2Fc578e90f-b53c-4f17-8ac6-abf28993d770.png" alt="syed_mudasseranayat_e251 profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/syed_mudasseranayat_e251" class="crayons-story__secondary fw-medium m:hidden"> Syed Mudasser Anayat </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2390797" aria-controls="story-author-preview-content-2390797" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Syed Mudasser Anayat profile details"> Syed Mudasser Anayat </button> <div id="story-author-preview-content-2390797" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/syed_mudasseranayat_e251" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1555182%2Fc578e90f-b53c-4f17-8ac6-abf28993d770.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Syed Mudasser Anayat</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":1555182,"className":"User","name":"Syed Mudasser Anayat"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="1555182"></div> </div> </div> </div> </div> <a href="https://dev.to/syed_mudasseranayat_e251/integrating-chatgpt-with-nodejs-build-your-own-ai-chatbot-4p1i" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T08:14:36Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744100076"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/syed_mudasseranayat_e251/integrating-chatgpt-with-nodejs-build-your-own-ai-chatbot-4p1i" data-preload-image="https://media2.dev.to/dynamic/image/width=1000,height=1000,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fekrutt7p51vkdsftktr4.jpg" id="article-link-2390797"> Integrating ChatGPT with Node.js: Build Your Own AI Chatbot </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(23, 253, 26, 0.10); --tag-prefix: #17fd1a; --tag-bg-hover: rgba(23, 253, 26, 0.10); --tag-prefix-hover: #17fd1a; " href="/t/ai"><span class="crayons-tag__prefix">#</span>ai</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(0, 131, 53, 0.10); --tag-prefix: #008335; --tag-bg-hover: rgba(0, 131, 53, 0.10); --tag-prefix-hover: #008335; " href="/t/beginners"><span class="crayons-tag__prefix">#</span>beginners</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(61, 136, 54, 0.10); --tag-prefix: #3d8836; --tag-bg-hover: rgba(61, 136, 54, 0.10); --tag-prefix-hover: #3d8836; " href="/t/node"><span class="crayons-tag__prefix">#</span>node</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/syed_mudasseranayat_e251/integrating-chatgpt-with-nodejs-build-your-own-ai-chatbot-4p1i#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Integrating ChatGPT with Node.js: Build Your Own AI Chatbot"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a7l9bfcxwawxe63d22fswr7jk0fc2kic" class="crayons-icon"><title id="a7l9bfcxwawxe63d22fswr7jk0fc2kic">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 2 min read </small> <button type="button" id="article-save-button-2390797" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2390797" data-article-author-id="1555182" aria-label="Save post Integrating ChatGPT with Node.js: Build Your Own AI Chatbot to reading list" title="Save post Integrating ChatGPT with Node.js: Build Your Own AI Chatbot to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2391155" data-content-user-id="775"> <a href="https://dev.to/pmbanugo/building-runtime-agnostic-appspackages-with-javascript-41b" aria-labelledby="article-link-2391155" class="crayons-story__hidden-navigation-link">Building Runtime-agnostic Apps/Packages with JavaScript</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/pmbanugo" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F775%2Fb53040cb-edbb-4c37-94ec-96bae8c67084.jpg" alt="pmbanugo profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/pmbanugo" class="crayons-story__secondary fw-medium m:hidden"> Peter Mbanugo </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2391155" aria-controls="story-author-preview-content-2391155" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Peter Mbanugo profile details"> Peter Mbanugo </button> <div id="story-author-preview-content-2391155" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/pmbanugo" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F775%2Fb53040cb-edbb-4c37-94ec-96bae8c67084.jpg" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Peter Mbanugo</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":775,"className":"User","name":"Peter Mbanugo"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="775"></div> </div> </div> </div> </div> <a href="https://dev.to/pmbanugo/building-runtime-agnostic-appspackages-with-javascript-41b" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T09:59:20Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744106360"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/pmbanugo/building-runtime-agnostic-appspackages-with-javascript-41b" data-preload-image="https://media2.dev.to/dynamic/image/width=1000,height=1000,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fj3pzy07evolxjqz9svab.png" id="article-link-2391155"> Building Runtime-agnostic Apps/Packages with JavaScript </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(35, 74, 132, 0.10); --tag-prefix: #234A84; --tag-bg-hover: rgba(35, 74, 132, 0.10); --tag-prefix-hover: #234A84; " href="/t/typescript"><span class="crayons-tag__prefix">#</span>typescript</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/pmbanugo/building-runtime-agnostic-appspackages-with-javascript-41b#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Building Runtime-agnostic Apps/Packages with JavaScript"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="amdzzj2lewhmje1tukmnr5f0fht4nl4o" class="crayons-icon"><title id="amdzzj2lewhmje1tukmnr5f0fht4nl4o">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 4 min read </small> <button type="button" id="article-save-button-2391155" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2391155" data-article-author-id="775" aria-label="Save post Building Runtime-agnostic Apps/Packages with JavaScript to reading list" title="Save post Building Runtime-agnostic Apps/Packages with JavaScript to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2390789" data-content-user-id="1555182"> <a href="https://dev.to/syed_mudasseranayat_e251/how-to-handle-file-uploads-in-nodejs-using-multer-2770" aria-labelledby="article-link-2390789" class="crayons-story__hidden-navigation-link">How to Handle File Uploads in Node.js Using Multer</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/syed_mudasseranayat_e251" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1555182%2Fc578e90f-b53c-4f17-8ac6-abf28993d770.png" alt="syed_mudasseranayat_e251 profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/syed_mudasseranayat_e251" class="crayons-story__secondary fw-medium m:hidden"> Syed Mudasser Anayat </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2390789" aria-controls="story-author-preview-content-2390789" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Syed Mudasser Anayat profile details"> Syed Mudasser Anayat </button> <div id="story-author-preview-content-2390789" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/syed_mudasseranayat_e251" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1555182%2Fc578e90f-b53c-4f17-8ac6-abf28993d770.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Syed Mudasser Anayat</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":1555182,"className":"User","name":"Syed Mudasser Anayat"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="1555182"></div> </div> </div> </div> </div> <a href="https://dev.to/syed_mudasseranayat_e251/how-to-handle-file-uploads-in-nodejs-using-multer-2770" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T08:11:56Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744099916"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/syed_mudasseranayat_e251/how-to-handle-file-uploads-in-nodejs-using-multer-2770" data-preload-image="https://media2.dev.to/dynamic/image/width=1000,height=1000,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fnwkkego7dpmj6e2d5xbi.png" id="article-link-2390789"> How to Handle File Uploads in Node.js Using Multer </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(137, 6, 6, 0.10); --tag-prefix: #890606; --tag-bg-hover: rgba(137, 6, 6, 0.10); --tag-prefix-hover: #890606; " href="/t/programming"><span class="crayons-tag__prefix">#</span>programming</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(0, 131, 53, 0.10); --tag-prefix: #008335; --tag-bg-hover: rgba(0, 131, 53, 0.10); --tag-prefix-hover: #008335; " href="/t/beginners"><span class="crayons-tag__prefix">#</span>beginners</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/syed_mudasseranayat_e251/how-to-handle-file-uploads-in-nodejs-using-multer-2770#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - How to Handle File Uploads in Node.js Using Multer"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aiipxc7s42b45np5jbocxrclor7j5dps" class="crayons-icon"><title id="aiipxc7s42b45np5jbocxrclor7j5dps">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 2 min read </small> <button type="button" id="article-save-button-2390789" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2390789" data-article-author-id="1555182" aria-label="Save post How to Handle File Uploads in Node.js Using Multer to reading list" title="Save post How to Handle File Uploads in Node.js Using Multer to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2390770" data-content-user-id="2899330"> <a href="https://dev.to/omriluz1/shadow-realms-and-secure-javascript-execution-28hh" aria-labelledby="article-link-2390770" class="crayons-story__hidden-navigation-link">Shadow Realms and Secure JavaScript Execution</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/omriluz1" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2899330%2F31f0aeb7-2c6f-45f1-8b64-334861666c08.jpeg" alt="omriluz1 profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/omriluz1" class="crayons-story__secondary fw-medium m:hidden"> omri luz </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2390770" aria-controls="story-author-preview-content-2390770" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="omri luz profile details"> omri luz </button> <div id="story-author-preview-content-2390770" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/omriluz1" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2899330%2F31f0aeb7-2c6f-45f1-8b64-334861666c08.jpeg" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">omri luz</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":2899330,"className":"User","name":"omri luz"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="2899330"></div> </div> </div> </div> </div> <a href="https://dev.to/omriluz1/shadow-realms-and-secure-javascript-execution-28hh" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T07:59:39Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744099179"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/omriluz1/shadow-realms-and-secure-javascript-execution-28hh" data-preload-image="" id="article-link-2390770"> Shadow Realms and Secure JavaScript Execution </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(137, 6, 6, 0.10); --tag-prefix: #890606; --tag-bg-hover: rgba(137, 6, 6, 0.10); --tag-prefix-hover: #890606; " href="/t/programming"><span class="crayons-tag__prefix">#</span>programming</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(59, 73, 223, 0.10); --tag-prefix: #3b49df; --tag-bg-hover: rgba(59, 73, 223, 0.10); --tag-prefix-hover: #3b49df; " href="/t/advanced"><span class="crayons-tag__prefix">#</span>advanced</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/omriluz1/shadow-realms-and-secure-javascript-execution-28hh#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Shadow Realms and Secure JavaScript Execution"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="achm1cnxmyv3ds30sovpjad5qmcdzlv2" class="crayons-icon"><title id="achm1cnxmyv3ds30sovpjad5qmcdzlv2">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 5 min read </small> <button type="button" id="article-save-button-2390770" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2390770" data-article-author-id="2899330" aria-label="Save post Shadow Realms and Secure JavaScript Execution to reading list" title="Save post Shadow Realms and Secure JavaScript Execution to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2390777" data-content-user-id="1168538"> <a href="https://dev.to/keploy/how-to-run-and-debug-tests-in-vs-code-with-keploy-integration-27lc" aria-labelledby="article-link-2390777" class="crayons-story__hidden-navigation-link">How to Run and Debug Tests in VS Code (With Keploy Integration)</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/keploy" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1168538%2F3953214c-124c-46fc-b7c1-1ce50c8ec4ab.png" alt="keploy profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/keploy" class="crayons-story__secondary fw-medium m:hidden"> keploy </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2390777" aria-controls="story-author-preview-content-2390777" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="keploy profile details"> keploy </button> <div id="story-author-preview-content-2390777" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/keploy" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1168538%2F3953214c-124c-46fc-b7c1-1ce50c8ec4ab.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">keploy</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":1168538,"className":"User","name":"keploy"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="1168538"></div> </div> </div> </div> </div> <a href="https://dev.to/keploy/how-to-run-and-debug-tests-in-vs-code-with-keploy-integration-27lc" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T08:04:02Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744099442"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/keploy/how-to-run-and-debug-tests-in-vs-code-with-keploy-integration-27lc" data-preload-image="" id="article-link-2390777"> How to Run and Debug Tests in VS Code (With Keploy Integration) </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(137, 6, 6, 0.10); --tag-prefix: #890606; --tag-bg-hover: rgba(137, 6, 6, 0.10); --tag-prefix-hover: #890606; " href="/t/programming"><span class="crayons-tag__prefix">#</span>programming</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(23, 253, 26, 0.10); --tag-prefix: #17fd1a; --tag-bg-hover: rgba(23, 253, 26, 0.10); --tag-prefix-hover: #17fd1a; " href="/t/ai"><span class="crayons-tag__prefix">#</span>ai</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/keploy/how-to-run-and-debug-tests-in-vs-code-with-keploy-integration-27lc#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - How to Run and Debug Tests in VS Code (With Keploy Integration)"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aoevkdxop885egql7iqa79a3e9v7ypet" class="crayons-icon"><title id="aoevkdxop885egql7iqa79a3e9v7ypet">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 3 min read </small> <button type="button" id="article-save-button-2390777" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2390777" data-article-author-id="1168538" aria-label="Save post How to Run and Debug Tests in VS Code (With Keploy Integration) to reading list" title="Save post How to Run and Debug Tests in VS Code (With Keploy Integration) to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2388664" data-content-user-id="2984856"> <a href="https://dev.to/d-libro-digital-skills/understanding-javascript-modules-and-libraries-with-a-little-help-from-ai-74" aria-labelledby="article-link-2388664" class="crayons-story__hidden-navigation-link">Understanding JavaScript Modules and Libraries (With a Little Help from AI)</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a class="crayons-logo crayons-logo--l" href="/d-libro-digital-skills"> <img alt="D-Libro logo" src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Forganization%2Fprofile_image%2F10591%2F3864734f-27fd-488a-bc14-d3fd43b6d4eb.png" class="crayons-logo__image" loading="lazy" /> </a> <a href="/david_ocean_d-libro" class="crayons-avatar crayons-avatar--s absolute -right-2 -bottom-2 border-solid border-2 border-base-inverted "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2984856%2Fe93cc9aa-5ab0-484f-9ba4-bea5173552c5.png" alt="david_ocean_d-libro profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/david_ocean_d-libro" class="crayons-story__secondary fw-medium m:hidden"> David Ocean </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2388664" aria-controls="story-author-preview-content-2388664" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="David Ocean profile details"> David Ocean </button> <div id="story-author-preview-content-2388664" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/david_ocean_d-libro" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2984856%2Fe93cc9aa-5ab0-484f-9ba4-bea5173552c5.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">David Ocean</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":2984856,"className":"User","name":"David Ocean"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="2984856"></div> </div> </div> </div> <span> <span class="crayons-story__tertiary fw-normal"> for </span><a href="/d-libro-digital-skills" class="crayons-story__secondary fw-medium">D-Libro</a> </span> </div> <a href="https://dev.to/d-libro-digital-skills/understanding-javascript-modules-and-libraries-with-a-little-help-from-ai-74" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T06:05:54Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744092354"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/d-libro-digital-skills/understanding-javascript-modules-and-libraries-with-a-little-help-from-ai-74" data-preload-image="https://media2.dev.to/dynamic/image/width=1000,height=1000,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Faypoaah0032w8gqqa46h.png" id="article-link-2388664"> Understanding JavaScript Modules and Libraries (With a Little Help from AI) </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(137, 6, 6, 0.10); --tag-prefix: #890606; --tag-bg-hover: rgba(137, 6, 6, 0.10); --tag-prefix-hover: #890606; " href="/t/programming"><span class="crayons-tag__prefix">#</span>programming</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(23, 253, 26, 0.10); --tag-prefix: #17fd1a; --tag-bg-hover: rgba(23, 253, 26, 0.10); --tag-prefix-hover: #17fd1a; " href="/t/ai"><span class="crayons-tag__prefix">#</span>ai</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(175, 39, 242, 0.10); --tag-prefix: #af27f2; --tag-bg-hover: rgba(175, 39, 242, 0.10); --tag-prefix-hover: #af27f2; " href="/t/coding"><span class="crayons-tag__prefix">#</span>coding</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/d-libro-digital-skills/understanding-javascript-modules-and-libraries-with-a-little-help-from-ai-74#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Understanding JavaScript Modules and Libraries (With a Little Help from AI)"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aqqkgheyw6rlplkvezxk66yzr5gywwoi" class="crayons-icon"><title id="aqqkgheyw6rlplkvezxk66yzr5gywwoi">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 4 min read </small> <button type="button" id="article-save-button-2388664" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2388664" data-article-author-id="2984856" aria-label="Save post Understanding JavaScript Modules and Libraries (With a Little Help from AI) to reading list" title="Save post Understanding JavaScript Modules and Libraries (With a Little Help from AI) to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2390522" data-content-user-id="2887296"> <a href="https://dev.to/albert_kavin_186c1005a3a8/stop-losing-revenue-automate-your-saas-subscription-billing-the-smart-way-3170" aria-labelledby="article-link-2390522" class="crayons-story__hidden-navigation-link">Stop Losing Revenue: Automate Your SaaS Subscription Billing the Smart Way</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/albert_kavin_186c1005a3a8" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2887296%2F997d7587-cdfb-40c7-a5c1-148cdf0223b6.png" alt="albert_kavin_186c1005a3a8 profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/albert_kavin_186c1005a3a8" class="crayons-story__secondary fw-medium m:hidden"> Albert Kavin </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2390522" aria-controls="story-author-preview-content-2390522" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Albert Kavin profile details"> Albert Kavin </button> <div id="story-author-preview-content-2390522" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/albert_kavin_186c1005a3a8" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2887296%2F997d7587-cdfb-40c7-a5c1-148cdf0223b6.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Albert Kavin</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":2887296,"className":"User","name":"Albert Kavin"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="2887296"></div> </div> </div> </div> </div> <a href="https://dev.to/albert_kavin_186c1005a3a8/stop-losing-revenue-automate-your-saas-subscription-billing-the-smart-way-3170" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T06:13:50Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744092830"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/albert_kavin_186c1005a3a8/stop-losing-revenue-automate-your-saas-subscription-billing-the-smart-way-3170" data-preload-image="" id="article-link-2390522"> Stop Losing Revenue: Automate Your SaaS Subscription Billing the Smart Way </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(137, 6, 6, 0.10); --tag-prefix: #890606; --tag-bg-hover: rgba(137, 6, 6, 0.10); --tag-prefix-hover: #890606; " href="/t/programming"><span class="crayons-tag__prefix">#</span>programming</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(0, 131, 53, 0.10); --tag-prefix: #008335; --tag-bg-hover: rgba(0, 131, 53, 0.10); --tag-prefix-hover: #008335; " href="/t/beginners"><span class="crayons-tag__prefix">#</span>beginners</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/albert_kavin_186c1005a3a8/stop-losing-revenue-automate-your-saas-subscription-billing-the-smart-way-3170#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Stop Losing Revenue: Automate Your SaaS Subscription Billing the Smart Way"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a9p6yq1a0rfrq7d1k2r86po99du81qwz" class="crayons-icon"><title id="a9p6yq1a0rfrq7d1k2r86po99du81qwz">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 4 min read </small> <button type="button" id="article-save-button-2390522" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2390522" data-article-author-id="2887296" aria-label="Save post Stop Losing Revenue: Automate Your SaaS Subscription Billing the Smart Way to reading list" title="Save post Stop Losing Revenue: Automate Your SaaS Subscription Billing the Smart Way to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2390511" data-content-user-id="3028780"> <a href="https://dev.to/hayk_ghukasyan_b2dc1a0849/a-brief-overview-of-how-we-choose-our-architecture-eoc" aria-labelledby="article-link-2390511" class="crayons-story__hidden-navigation-link">A Brief Overview of How We Choose Our Architecture</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/hayk_ghukasyan_b2dc1a0849" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3028780%2F0e121a86-8853-42f3-8c37-09d61090c342.png" alt="hayk_ghukasyan_b2dc1a0849 profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/hayk_ghukasyan_b2dc1a0849" class="crayons-story__secondary fw-medium m:hidden"> Hayk Ghukasyan </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2390511" aria-controls="story-author-preview-content-2390511" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Hayk Ghukasyan profile details"> Hayk Ghukasyan </button> <div id="story-author-preview-content-2390511" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/hayk_ghukasyan_b2dc1a0849" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3028780%2F0e121a86-8853-42f3-8c37-09d61090c342.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Hayk Ghukasyan</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":3028780,"className":"User","name":"Hayk Ghukasyan"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="3028780"></div> </div> </div> </div> </div> <a href="https://dev.to/hayk_ghukasyan_b2dc1a0849/a-brief-overview-of-how-we-choose-our-architecture-eoc" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T06:14:29Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744092869"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/hayk_ghukasyan_b2dc1a0849/a-brief-overview-of-how-we-choose-our-architecture-eoc" data-preload-image="" id="article-link-2390511"> A Brief Overview of How We Choose Our Architecture </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(137, 6, 6, 0.10); --tag-prefix: #890606; --tag-bg-hover: rgba(137, 6, 6, 0.10); --tag-prefix-hover: #890606; " href="/t/programming"><span class="crayons-tag__prefix">#</span>programming</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(235, 223, 55, 0.10); --tag-prefix: #ebdf37; --tag-bg-hover: rgba(235, 223, 55, 0.10); --tag-prefix-hover: #ebdf37; " href="/t/architecture"><span class="crayons-tag__prefix">#</span>architecture</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(0, 0, 0, 0.10); --tag-prefix: #000000; --tag-bg-hover: rgba(0, 0, 0, 0.10); --tag-prefix-hover: #000000; " href="/t/microservices"><span class="crayons-tag__prefix">#</span>microservices</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/hayk_ghukasyan_b2dc1a0849/a-brief-overview-of-how-we-choose-our-architecture-eoc#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - A Brief Overview of How We Choose Our Architecture"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ajhyu54hqc0vtih8ombb8ekpjlhgyb96" class="crayons-icon"><title id="ajhyu54hqc0vtih8ombb8ekpjlhgyb96">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 2 min read </small> <button type="button" id="article-save-button-2390511" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2390511" data-article-author-id="3028780" aria-label="Save post A Brief Overview of How We Choose Our Architecture to reading list" title="Save post A Brief Overview of How We Choose Our Architecture to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2390480" data-content-user-id="2971491"> <a href="https://dev.to/vishal_more_02990955c9358/testing-and-qa-ensuring-software-excellence-3h48" aria-labelledby="article-link-2390480" class="crayons-story__hidden-navigation-link">Testing and QA: Ensuring Software Excellence</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/vishal_more_02990955c9358" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2971491%2Ffacebf75-f056-4673-a4bb-8b84171cc7c3.png" alt="vishal_more_02990955c9358 profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/vishal_more_02990955c9358" class="crayons-story__secondary fw-medium m:hidden"> vishal more </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2390480" aria-controls="story-author-preview-content-2390480" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="vishal more profile details"> vishal more </button> <div id="story-author-preview-content-2390480" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/vishal_more_02990955c9358" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2971491%2Ffacebf75-f056-4673-a4bb-8b84171cc7c3.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">vishal more</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":2971491,"className":"User","name":"vishal more"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="2971491"></div> </div> </div> </div> </div> <a href="https://dev.to/vishal_more_02990955c9358/testing-and-qa-ensuring-software-excellence-3h48" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T05:56:45Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744091805"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/vishal_more_02990955c9358/testing-and-qa-ensuring-software-excellence-3h48" data-preload-image="https://media2.dev.to/dynamic/image/width=1000,height=1000,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F9w4xd90lp12zmntpp2tf.png" id="article-link-2390480"> Testing and QA: Ensuring Software Excellence </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(137, 6, 6, 0.10); --tag-prefix: #890606; --tag-bg-hover: rgba(137, 6, 6, 0.10); --tag-prefix-hover: #890606; " href="/t/programming"><span class="crayons-tag__prefix">#</span>programming</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(23, 253, 26, 0.10); --tag-prefix: #17fd1a; --tag-bg-hover: rgba(23, 253, 26, 0.10); --tag-prefix-hover: #17fd1a; " href="/t/ai"><span class="crayons-tag__prefix">#</span>ai</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/vishal_more_02990955c9358/testing-and-qa-ensuring-software-excellence-3h48#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Testing and QA: Ensuring Software Excellence"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aljoqo26abja08gi1f6cfm2um4871u84" class="crayons-icon"><title id="aljoqo26abja08gi1f6cfm2um4871u84">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 2 min read </small> <button type="button" id="article-save-button-2390480" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2390480" data-article-author-id="2971491" aria-label="Save post Testing and QA: Ensuring Software Excellence to reading list" title="Save post Testing and QA: Ensuring Software Excellence to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2390474" data-content-user-id="2981173"> <a href="https://dev.to/abdullah_al_masud/make-your-textareas-auto-expand-with-just-3-lines-of-javascript-40d5" aria-labelledby="article-link-2390474" class="crayons-story__hidden-navigation-link">Make your textareas auto-expand with just 3 lines of JavaScript! 📝</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/abdullah_al_masud" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2981173%2F05801cad-a38d-425c-a611-e3b925ec5a76.png" alt="abdullah_al_masud profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/abdullah_al_masud" class="crayons-story__secondary fw-medium m:hidden"> Abdullah Al Masud </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2390474" aria-controls="story-author-preview-content-2390474" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Abdullah Al Masud profile details"> Abdullah Al Masud </button> <div id="story-author-preview-content-2390474" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/abdullah_al_masud" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2981173%2F05801cad-a38d-425c-a611-e3b925ec5a76.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Abdullah Al Masud</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":2981173,"className":"User","name":"Abdullah Al Masud"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="2981173"></div> </div> </div> </div> </div> <a href="https://dev.to/abdullah_al_masud/make-your-textareas-auto-expand-with-just-3-lines-of-javascript-40d5" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T05:53:48Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744091628"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/abdullah_al_masud/make-your-textareas-auto-expand-with-just-3-lines-of-javascript-40d5" data-preload-image="https://media2.dev.to/dynamic/image/width=1000,height=1000,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fmnnbxu83trgv4z6td6tm.png" id="article-link-2390474"> Make your textareas auto-expand with just 3 lines of JavaScript! 📝 </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(255, 51, 224, 0.10); --tag-prefix: #ff33e0; --tag-bg-hover: rgba(255, 51, 224, 0.10); --tag-prefix-hover: #ff33e0; " href="/t/frontend"><span class="crayons-tag__prefix">#</span>frontend</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(59, 73, 223, 0.10); --tag-prefix: #3b49df; --tag-bg-hover: rgba(59, 73, 223, 0.10); --tag-prefix-hover: #3b49df; " href="/t/uidesign"><span class="crayons-tag__prefix">#</span>uidesign</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/abdullah_al_masud/make-your-textareas-auto-expand-with-just-3-lines-of-javascript-40d5#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Make your textareas auto-expand with just 3 lines of JavaScript! 📝"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a63stwmwegr5unfkwavbk3bqfhfc303n" class="crayons-icon"><title id="a63stwmwegr5unfkwavbk3bqfhfc303n">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> <button type="button" id="article-save-button-2390474" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2390474" data-article-author-id="2981173" aria-label="Save post Make your textareas auto-expand with just 3 lines of JavaScript! 📝 to reading list" title="Save post Make your textareas auto-expand with just 3 lines of JavaScript! 📝 to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2390336" data-content-user-id="1401039"> <a href="https://dev.to/athuldas/ag-grid-react-crashes-inside-tableau-extension-due-to-invalid-css-selector-nottitle-meta-2odm" aria-labelledby="article-link-2390336" class="crayons-story__hidden-navigation-link">AG Grid React Crashes Inside Tableau Extension Due to Invalid CSS Selector ':not(title, meta)' DOMException</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/athuldas" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1401039%2Fce112ce7-5b05-4403-a6d5-c30afb3d7461.png" alt="athuldas profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/athuldas" class="crayons-story__secondary fw-medium m:hidden"> Athul Das </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2390336" aria-controls="story-author-preview-content-2390336" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Athul Das profile details"> Athul Das </button> <div id="story-author-preview-content-2390336" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/athuldas" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1401039%2Fce112ce7-5b05-4403-a6d5-c30afb3d7461.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Athul Das </span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":1401039,"className":"User","name":"Athul Das "}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="1401039"></div> </div> </div> </div> </div> <a href="https://dev.to/athuldas/ag-grid-react-crashes-inside-tableau-extension-due-to-invalid-css-selector-nottitle-meta-2odm" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T04:54:03Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744088043"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/athuldas/ag-grid-react-crashes-inside-tableau-extension-due-to-invalid-css-selector-nottitle-meta-2odm" data-preload-image="" id="article-link-2390336"> AG Grid React Crashes Inside Tableau Extension Due to Invalid CSS Selector ':not(title, meta)' DOMException </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(113, 234, 139, 0.10); --tag-prefix: #71EA8B; --tag-bg-hover: rgba(113, 234, 139, 0.10); --tag-prefix-hover: #71EA8B; " href="/t/discuss"><span class="crayons-tag__prefix">#</span>discuss</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(34, 34, 34, 0.10); --tag-prefix: #222222; --tag-bg-hover: rgba(34, 34, 34, 0.10); --tag-prefix-hover: #222222; " href="/t/react"><span class="crayons-tag__prefix">#</span>react</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(41, 101, 241, 0.10); --tag-prefix: #2965F1; --tag-bg-hover: rgba(41, 101, 241, 0.10); --tag-prefix-hover: #2965F1; " href="/t/css"><span class="crayons-tag__prefix">#</span>css</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/athuldas/ag-grid-react-crashes-inside-tableau-extension-due-to-invalid-css-selector-nottitle-meta-2odm#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - AG Grid React Crashes Inside Tableau Extension Due to Invalid CSS Selector ':not(title, meta)' DOMException"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a2x2gj9hwzt6j5mut36hjulay7jd1a1v" class="crayons-icon"><title id="a2x2gj9hwzt6j5mut36hjulay7jd1a1v">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> <button type="button" id="article-save-button-2390336" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2390336" data-article-author-id="1401039" aria-label="Save post AG Grid React Crashes Inside Tableau Extension Due to Invalid CSS Selector ':not(title, meta)' DOMException to reading list" title="Save post AG Grid React Crashes Inside Tableau Extension Due to Invalid CSS Selector ':not(title, meta)' DOMException to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2390970" data-content-user-id="3029381"> <a href="https://dev.to/caisy_b3dab8bba6a26f388ca/the-headless-cms-mindset-rethinking-content-architecture-in-2025-470" aria-labelledby="article-link-2390970" class="crayons-story__hidden-navigation-link">The Headless CMS Mindset: Rethinking Content Architecture in 2025</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/caisy_b3dab8bba6a26f388ca" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3029381%2Fd08adfe8-51d9-4c0e-8c9f-27fa73c38aab.png" alt="caisy_b3dab8bba6a26f388ca profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/caisy_b3dab8bba6a26f388ca" class="crayons-story__secondary fw-medium m:hidden"> Caisy </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2390970" aria-controls="story-author-preview-content-2390970" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Caisy profile details"> Caisy </button> <div id="story-author-preview-content-2390970" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/caisy_b3dab8bba6a26f388ca" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3029381%2Fd08adfe8-51d9-4c0e-8c9f-27fa73c38aab.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Caisy</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":3029381,"className":"User","name":"Caisy"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="3029381"></div> </div> </div> </div> </div> <a href="https://dev.to/caisy_b3dab8bba6a26f388ca/the-headless-cms-mindset-rethinking-content-architecture-in-2025-470" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T08:59:15Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744102755"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/caisy_b3dab8bba6a26f388ca/the-headless-cms-mindset-rethinking-content-architecture-in-2025-470" data-preload-image="" id="article-link-2390970"> The Headless CMS Mindset: Rethinking Content Architecture in 2025 </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(59, 73, 223, 0.10); --tag-prefix: #3b49df; --tag-bg-hover: rgba(59, 73, 223, 0.10); --tag-prefix-hover: #3b49df; " href="/t/cms"><span class="crayons-tag__prefix">#</span>cms</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(0, 131, 53, 0.10); --tag-prefix: #008335; --tag-bg-hover: rgba(0, 131, 53, 0.10); --tag-prefix-hover: #008335; " href="/t/beginners"><span class="crayons-tag__prefix">#</span>beginners</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/caisy_b3dab8bba6a26f388ca/the-headless-cms-mindset-rethinking-content-architecture-in-2025-470#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - The Headless CMS Mindset: Rethinking Content Architecture in 2025"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a7c7jt9pos3iwlbvj9l37o8f92g7y7pl" class="crayons-icon"><title id="a7c7jt9pos3iwlbvj9l37o8f92g7y7pl">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 3 min read </small> <button type="button" id="article-save-button-2390970" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2390970" data-article-author-id="3029381" aria-label="Save post The Headless CMS Mindset: Rethinking Content Architecture in 2025 to reading list" title="Save post The Headless CMS Mindset: Rethinking Content Architecture in 2025 to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2390223" data-content-user-id="753450"> <a href="https://dev.to/hasunnilupul/the-future-of-web-animations-css-vs-javascript-3b8d" aria-labelledby="article-link-2390223" class="crayons-story__hidden-navigation-link">The Future of Web Animations: CSS vs. JavaScript</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/hasunnilupul" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F753450%2Fada74e63-208b-4426-aa92-70d85f23a880.jpg" alt="hasunnilupul profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/hasunnilupul" class="crayons-story__secondary fw-medium m:hidden"> Nilupul Perera </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2390223" aria-controls="story-author-preview-content-2390223" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Nilupul Perera profile details"> Nilupul Perera </button> <div id="story-author-preview-content-2390223" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/hasunnilupul" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F753450%2Fada74e63-208b-4426-aa92-70d85f23a880.jpg" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Nilupul Perera</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":753450,"className":"User","name":"Nilupul Perera"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="753450"></div> </div> </div> </div> </div> <a href="https://dev.to/hasunnilupul/the-future-of-web-animations-css-vs-javascript-3b8d" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T03:55:54Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744084554"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/hasunnilupul/the-future-of-web-animations-css-vs-javascript-3b8d" data-preload-image="" id="article-link-2390223"> The Future of Web Animations: CSS vs. JavaScript </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(41, 101, 241, 0.10); --tag-prefix: #2965F1; --tag-bg-hover: rgba(41, 101, 241, 0.10); --tag-prefix-hover: #2965F1; " href="/t/css"><span class="crayons-tag__prefix">#</span>css</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/hasunnilupul/the-future-of-web-animations-css-vs-javascript-3b8d#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - The Future of Web Animations: CSS vs. JavaScript"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aigk1ozbtoiwgjt3hhbffgxuv4xw1bdf" class="crayons-icon"><title id="aigk1ozbtoiwgjt3hhbffgxuv4xw1bdf">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 2 min read </small> <button type="button" id="article-save-button-2390223" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2390223" data-article-author-id="753450" aria-label="Save post The Future of Web Animations: CSS vs. JavaScript to reading list" title="Save post The Future of Web Animations: CSS vs. JavaScript to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2387929" data-content-user-id="478242"> <a href="https://dev.to/shib_itsme/getting-started-with-ai-in-javascript-a-beginners-guide-to-the-future-of-web-development-part-1p46" aria-labelledby="article-link-2387929" class="crayons-story__hidden-navigation-link">🤖 Getting Started with AI in JavaScript: A Beginner's Guide to the Future of Web Development : Part -II</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/shib_itsme" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F478242%2F694309e9-83c2-4f6b-bcb1-08b8ac046abe.png" alt="shib_itsme profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/shib_itsme" class="crayons-story__secondary fw-medium m:hidden"> SHIBAM </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2387929" aria-controls="story-author-preview-content-2387929" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="SHIBAM profile details"> SHIBAM </button> <div id="story-author-preview-content-2387929" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/shib_itsme" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F478242%2F694309e9-83c2-4f6b-bcb1-08b8ac046abe.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">SHIBAM</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":478242,"className":"User","name":"SHIBAM"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="478242"></div> </div> </div> </div> </div> <a href="https://dev.to/shib_itsme/getting-started-with-ai-in-javascript-a-beginners-guide-to-the-future-of-web-development-part-1p46" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T03:24:00Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744082640"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/shib_itsme/getting-started-with-ai-in-javascript-a-beginners-guide-to-the-future-of-web-development-part-1p46" data-preload-image="https://media2.dev.to/dynamic/image/width=1000,height=1000,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fe5iw0ihmt2ddzrdoji98.png" id="article-link-2387929"> 🤖 Getting Started with AI in JavaScript: A Beginner's Guide to the Future of Web Development : Part -II </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(23, 253, 26, 0.10); --tag-prefix: #17fd1a; --tag-bg-hover: rgba(23, 253, 26, 0.10); --tag-prefix-hover: #17fd1a; " href="/t/ai"><span class="crayons-tag__prefix">#</span>ai</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(0, 131, 53, 0.10); --tag-prefix: #008335; --tag-bg-hover: rgba(0, 131, 53, 0.10); --tag-prefix-hover: #008335; " href="/t/beginners"><span class="crayons-tag__prefix">#</span>beginners</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(229, 255, 227, 0.10); --tag-prefix: #E5FFE3; --tag-bg-hover: rgba(229, 255, 227, 0.10); --tag-prefix-hover: #E5FFE3; " href="/t/machinelearning"><span class="crayons-tag__prefix">#</span>machinelearning</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/shib_itsme/getting-started-with-ai-in-javascript-a-beginners-guide-to-the-future-of-web-development-part-1p46#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - 🤖 Getting Started with AI in JavaScript: A Beginner's Guide to the Future of Web Development : Part -II"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aarnufm95npvpxtwv6p62a3e0z69nkhk" class="crayons-icon"><title id="aarnufm95npvpxtwv6p62a3e0z69nkhk">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 3 min read </small> <button type="button" id="article-save-button-2387929" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2387929" data-article-author-id="478242" aria-label="Save post 🤖 Getting Started with AI in JavaScript: A Beginner's Guide to the Future of Web Development : Part -II to reading list" title="Save post 🤖 Getting Started with AI in JavaScript: A Beginner's Guide to the Future of Web Development : Part -II to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2386872" data-content-user-id="97500"> <a href="https://dev.to/nullvoxpopuli/emberjs-acquires-react-in-hostile-takeover-demands-it-learn-real-reactivity-3629" aria-labelledby="article-link-2386872" class="crayons-story__hidden-navigation-link">Ember.js Acquires React in Hostile Takeover, Demands it Learn Real Reactivity</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/nullvoxpopuli" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F97500%2F90cf8ece-0827-4731-bdf0-865a563d43be.png" alt="nullvoxpopuli profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/nullvoxpopuli" class="crayons-story__secondary fw-medium m:hidden"> NullVoxPopuli </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2386872" aria-controls="story-author-preview-content-2386872" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="NullVoxPopuli profile details"> NullVoxPopuli </button> <div id="story-author-preview-content-2386872" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/nullvoxpopuli" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F97500%2F90cf8ece-0827-4731-bdf0-865a563d43be.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">NullVoxPopuli</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":97500,"className":"User","name":"NullVoxPopuli"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="97500"></div> </div> </div> </div> </div> <a href="https://dev.to/nullvoxpopuli/emberjs-acquires-react-in-hostile-takeover-demands-it-learn-real-reactivity-3629" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-06T21:07:36Z">Apr 6</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1743973656"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/nullvoxpopuli/emberjs-acquires-react-in-hostile-takeover-demands-it-learn-real-reactivity-3629" data-preload-image="https://media2.dev.to/dynamic/image/width=1000,height=1000,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fcdn.bsky.app%2Fimg%2Ffeed_thumbnail%2Fplain%2Fdid%3Aplc%3Age6cnpneodmysqqgv5wylvaz%2Fbafkreih2fsd2w53vx4fyuznjfe5shov5h76vampodekdjvj7c6bi7n5iuu%40jpeg" id="article-link-2386872"> Ember.js Acquires React in Hostile Takeover, Demands it Learn Real Reactivity </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(224, 78, 57, 0.10); --tag-prefix: #E04E39; --tag-bg-hover: rgba(224, 78, 57, 0.10); --tag-prefix-hover: #E04E39; " href="/t/ember"><span class="crayons-tag__prefix">#</span>ember</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(34, 34, 34, 0.10); --tag-prefix: #222222; --tag-bg-hover: rgba(34, 34, 34, 0.10); --tag-prefix-hover: #222222; " href="/t/react"><span class="crayons-tag__prefix">#</span>react</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/nullvoxpopuli/emberjs-acquires-react-in-hostile-takeover-demands-it-learn-real-reactivity-3629" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="2386872" aria-label="Add a comment to post - Ember.js Acquires React in Hostile Takeover, Demands it Learn Real Reactivity"> <div class="multiple_reactions_aggregate"> <span class="multiple_reactions_icons_container" dir="rtl"> <span class="crayons_icon_container"> <img src="https://assets.dev.to/assets/exploding-head-daceb38d627e6ae9b730f36a1e390fca556a4289d5a41abb2c35068ad3e2c4b5.svg" width="18" height="18" /> </span> <span class="crayons_icon_container"> <img src="https://assets.dev.to/assets/multi-unicorn-b44d6f8c23cdd00964192bedc38af3e82463978aa611b4365bd33a0f1f4f3e97.svg" width="18" height="18" /> </span> <span class="crayons_icon_container"> <img src="https://assets.dev.to/assets/sparkle-heart-5f9bee3767e18deb1bb725290cb151c25234768a0e9a2bd39370c382d02920cf.svg" width="18" height="18" /> </span> </span> <span class="aggregate_reactions_counter">3<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="https://dev.to/nullvoxpopuli/emberjs-acquires-react-in-hostile-takeover-demands-it-learn-real-reactivity-3629#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Ember.js Acquires React in Hostile Takeover, Demands it Learn Real Reactivity"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a8xi6x38oun65p287odniwoi62il4lkg" class="crayons-icon"><title id="a8xi6x38oun65p287odniwoi62il4lkg">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> <button type="button" id="article-save-button-2386872" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2386872" data-article-author-id="97500" aria-label="Save post Ember.js Acquires React in Hostile Takeover, Demands it Learn Real Reactivity to reading list" title="Save post Ember.js Acquires React in Hostile Takeover, Demands it Learn Real Reactivity to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2390446" data-content-user-id="2924029"> <a href="https://dev.to/davinceleecode/systematic-approach-4gc" aria-labelledby="article-link-2390446" class="crayons-story__hidden-navigation-link">Systematic Approach</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/davinceleecode" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2924029%2Fa7a931b0-9105-4578-895b-65f039beffc1.jpeg" alt="davinceleecode profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/davinceleecode" class="crayons-story__secondary fw-medium m:hidden"> davinceleecode </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2390446" aria-controls="story-author-preview-content-2390446" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="davinceleecode profile details"> davinceleecode </button> <div id="story-author-preview-content-2390446" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/davinceleecode" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2924029%2Fa7a931b0-9105-4578-895b-65f039beffc1.jpeg" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">davinceleecode</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":2924029,"className":"User","name":"davinceleecode"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="2924029"></div> </div> </div> </div> </div> <a href="https://dev.to/davinceleecode/systematic-approach-4gc" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T05:44:21Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744091061"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/davinceleecode/systematic-approach-4gc" data-preload-image="" id="article-link-2390446"> Systematic Approach </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(137, 6, 6, 0.10); --tag-prefix: #890606; --tag-bg-hover: rgba(137, 6, 6, 0.10); --tag-prefix-hover: #890606; " href="/t/programming"><span class="crayons-tag__prefix">#</span>programming</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(0, 131, 53, 0.10); --tag-prefix: #008335; --tag-bg-hover: rgba(0, 131, 53, 0.10); --tag-prefix-hover: #008335; " href="/t/beginners"><span class="crayons-tag__prefix">#</span>beginners</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/davinceleecode/systematic-approach-4gc#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Systematic Approach"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a9f89nuzmr4e1fvmvz1mbsdsssmodhky" class="crayons-icon"><title id="a9f89nuzmr4e1fvmvz1mbsdsssmodhky">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> <button type="button" id="article-save-button-2390446" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2390446" data-article-author-id="2924029" aria-label="Save post Systematic Approach to reading list" title="Save post Systematic Approach to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2389923" data-content-user-id="3023629"> <a href="https://dev.to/ramondiniz27/no-final-tudo-e-typescriptjavascript--487c" aria-labelledby="article-link-2389923" class="crayons-story__hidden-navigation-link">No final tudo é typescript/javascript ?</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/ramondiniz27" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3023629%2Fd8e7ee8e-c6c4-4e61-88d1-14e82f4dd761.png" alt="ramondiniz27 profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/ramondiniz27" class="crayons-story__secondary fw-medium m:hidden"> Ramon Diniz de Alcantara Marinho </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2389923" aria-controls="story-author-preview-content-2389923" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Ramon Diniz de Alcantara Marinho profile details"> Ramon Diniz de Alcantara Marinho </button> <div id="story-author-preview-content-2389923" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/ramondiniz27" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3023629%2Fd8e7ee8e-c6c4-4e61-88d1-14e82f4dd761.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Ramon Diniz de Alcantara Marinho</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":3023629,"className":"User","name":"Ramon Diniz de Alcantara Marinho"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="3023629"></div> </div> </div> </div> </div> <a href="https://dev.to/ramondiniz27/no-final-tudo-e-typescriptjavascript--487c" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T00:47:23Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744073243"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/ramondiniz27/no-final-tudo-e-typescriptjavascript--487c" data-preload-image="" id="article-link-2389923"> No final tudo é typescript/javascript ? </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(137, 6, 6, 0.10); --tag-prefix: #890606; --tag-bg-hover: rgba(137, 6, 6, 0.10); --tag-prefix-hover: #890606; " href="/t/programming"><span class="crayons-tag__prefix">#</span>programming</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/ramondiniz27/no-final-tudo-e-typescriptjavascript--487c#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - No final tudo é typescript/javascript ?"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aot0jikuod8hz1kj38ov42g59wkgkwhm" class="crayons-icon"><title id="aot0jikuod8hz1kj38ov42g59wkgkwhm">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> <button type="button" id="article-save-button-2389923" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2389923" data-article-author-id="3023629" aria-label="Save post No final tudo é typescript/javascript ? to reading list" title="Save post No final tudo é typescript/javascript ? to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="2389910" data-content-user-id="2599059"> <a href="https://dev.to/shaikr786/stock-management-system-frontend-2e37" aria-labelledby="article-link-2389910" class="crayons-story__hidden-navigation-link">Stock Management System - Frontend</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/shaikr786" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2599059%2F390acddc-faa4-451e-9a9d-53a98d305c44.png" alt="shaikr786 profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/shaikr786" class="crayons-story__secondary fw-medium m:hidden"> Reshma Shaik </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-2389910" aria-controls="story-author-preview-content-2389910" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Reshma Shaik profile details"> Reshma Shaik </button> <div id="story-author-preview-content-2389910" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0" style="border-top-color: var(--card-color);" data-repositioning-dropdown="true" data-testid="profile-preview-card"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/shaikr786" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2599059%2F390acddc-faa4-451e-9a9d-53a98d305c44.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Reshma Shaik</span> </a> </div> <div class="print-hidden"> <button class="crayons-btn follow-action-button whitespace-nowrap follow-user w-100" data-info='{"style":"full","id":2599059,"className":"User","name":"Reshma Shaik"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="2599059"></div> </div> </div> </div> </div> <a href="https://dev.to/shaikr786/stock-management-system-frontend-2e37" class="crayons-story__tertiary fs-xs"><time datetime="2025-04-08T00:37:54Z">Apr 8</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1744072674"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="https://dev.to/shaikr786/stock-management-system-frontend-2e37" data-preload-image="" id="article-link-2389910"> Stock Management System - Frontend </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(86, 39, 101, 0.10); --tag-prefix: #562765; --tag-bg-hover: rgba(86, 39, 101, 0.10); --tag-prefix-hover: #562765; " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(137, 6, 6, 0.10); --tag-prefix: #890606; --tag-bg-hover: rgba(137, 6, 6, 0.10); --tag-prefix-hover: #890606; " href="/t/programming"><span class="crayons-tag__prefix">#</span>programming</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(247, 223, 30, 0.10); --tag-prefix: #f7df1e; --tag-bg-hover: rgba(247, 223, 30, 0.10); --tag-prefix-hover: #f7df1e; " href="/t/javascript"><span class="crayons-tag__prefix">#</span>javascript</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(0, 131, 53, 0.10); --tag-prefix: #008335; --tag-bg-hover: rgba(0, 131, 53, 0.10); --tag-prefix-hover: #008335; " href="/t/beginners"><span class="crayons-tag__prefix">#</span>beginners</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/shaikr786/stock-management-system-frontend-2e37#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Stock Management System - Frontend"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aooc6imbf84n7tew7r81m8hgolu3ljm1" class="crayons-icon"><title id="aooc6imbf84n7tew7r81m8hgolu3ljm1">Comments</title><path d="M10.5 5h3a6 6 0 110 12v2.625c-3.75-1.5-9-3.75-9-8.625a6 6 0 016-6zM12 15.5h1.5a4.501 4.501 0 001.722-8.657A4.5 4.5 0 0013.5 6.5h-3A4.5 4.5 0 006 11c0 2.707 1.846 4.475 6 6.36V15.5z"></path></svg> <span class="hidden s:inline">Add Comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 15 min read </small> <button type="button" id="article-save-button-2389910" class="c-btn c-btn--icon-alone bookmark-button" data-reactable-id="2389910" data-article-author-id="2599059" aria-label="Save post Stock Management System - Frontend to reading list" title="Save post Stock Management System - Frontend to reading list"> <span class="bm-initial"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75zM16.5 6h-9v11.574l4.5-2.82 4.5 2.82V6z"></path></svg> </span> <span class="bm-success"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" aria-hidden="true"><path d="M6.75 4.5h10.5a.75.75 0 01.75.75v14.357a.375.375 0 01-.575.318L12 16.523l-5.426 3.401A.375.375 0 016 19.607V5.25a.75.75 0 01.75-.75z"></path></svg> </span> </button> </div> </div> </div> </div> </div> <div class="placeholder-div"></div> <div class="single-article-small-pic" id="article-index-hidden-div" style="display:none"></div> </div> <div class="loading-articles" id="loading-articles"> loading... </div> </main> <div id="sidebar-wrapper-right" class="sidebar-wrapper sidebar-wrapper-right"> <div class="sidebar-bg" id="sidebar-bg-right"></div> <aside class="side-bar sidebar-additional showing" id="sidebar-additional"> <div class="widget"> <header> <h4>trending guides/resources</h4> </header> <div class="widget-body"> <div class="widget-link-list"> <a class="crayons-link crayons-link--contentful" href="/anmolbaranwal/10-common-backend-tasks-and-how-to-automate-them-4c79"> 10 common backend tasks and how to automate them </a> <a class="crayons-link crayons-link--contentful" href="/mattlewandowski93/stop-chasing-new-javascript-frameworks-build-with-fundamentals-instead-1lni"> Stop Chasing New JavaScript Frameworks: Build with Fundamentals Instead 🏗️ </a> <a class="crayons-link crayons-link--contentful" href="/holasoymalva/why-the-latest-javascript-frameworks-are-a-waste-of-time-52pc"> Why the Latest JavaScript Frameworks Are a Waste of Time </a> <a class="crayons-link crayons-link--contentful" href="/shubhamtiwari909/mastering-api-handling-in-javascript-react-a-complete-guide-45kk"> API Handling in JavaScript & React: From Basics to Pro-Level </a> <a class="crayons-link crayons-link--contentful" href="/jay818/javascript-basics-for-a-senior-dev-1lob"> JavaScript Basics for a Senior Dev </a> <a class="crayons-link crayons-link--contentful" href="/composiodev/gemma-3-27b-vs-qwq-32b-vs-deepseek-r1-comparison-4o90"> 🔥 Gemma 3 27B vs. QwQ 32B vs. Deepseek R1 comparison ✅ </a> <a class="crayons-link crayons-link--contentful" href="/encore/build-a-production-ready-saas-application-44nb"> Build a Production-Ready SaaS Application in TypeScript </a> <a class="crayons-link crayons-link--contentful" href="/leapcell/mastering-oauth-20-step-by-step-2726"> Mastering OAuth 2.0: Step by Step </a> <a class="crayons-link crayons-link--contentful" href="/ruppysuppy/17-react-interview-questions-you-must-know-as-a-developer-in-2025-1o6f"> 17 React Interview Questions You Must Know as a Developer in 2025 </a> <a class="crayons-link crayons-link--contentful" href="/anthonymax/typescript-7-10x-speedup-and-the-go-language-1mkf"> TypeScript 7: 10x Speedup and the Go Language 🚨 </a> <a class="crayons-link crayons-link--contentful" href="/holasoymalva/stop-using-typescript-for-small-projects-47hl"> Why Stop Using TypeScript for Small Projects? </a> <a class="crayons-link crayons-link--contentful" href="/leapcell/typescript-to-go-the-real-reasons-behind-the-10x-typescript-416"> TypeScript to Go: The Real Reasons Behind the 10x TypeScript </a> <a class="crayons-link crayons-link--contentful" href="/wimadev/i-tried-5-content-management-systems-which-one-is-the-best-l28"> I tried 5 Content Management Systems - Which One is Best? </a> <a class="crayons-link crayons-link--contentful" href="/woai3c/24-front-end-performance-optimization-tips-4a6c"> 24 Front-end Performance Optimization Tips </a> <a class="crayons-link crayons-link--contentful" href="/alishirani/finally-i-found-the-best-ai-ide-and-it-might-surprise-you-55ad"> Finally, I Found The Best AI IDE! (And It Might Surprise You...) </a> <a class="crayons-link crayons-link--contentful" href="/composiodev/gemini-25-pro-vs-claude-37-sonnet-coding-comparison-37cp"> ✨ Gemini 2.5 Pro vs. Claude 3.7 Sonnet Coding Comparison 🔥 </a> <a class="crayons-link crayons-link--contentful" href="/wasp/from-you-will-fail-to-15000-github-stars-the-story-of-wasp-a-laravel-for-js-full-stack-1fil"> From “You will fail” to 15,000 GitHub stars: The story of Wasp, a "Laravel for JS" full-stack fra... </a> <a class="crayons-link crayons-link--contentful" href="/keploy/cicd-a-comprehensive-guide-to-continuous-integration-and-continuous-deployment-3fin"> CI/CD: A Comprehensive Guide to Continuous Integration and Continuous Deployment </a> <a class="crayons-link crayons-link--contentful" href="/andyrewlee/use-your-own-mcp-on-cursor-in-5-minutes-1ag4"> Build and use your own MCP in Cursor in 5 minutes </a> <a class="crayons-link crayons-link--contentful" href="/lovestaco/object-oriented-programming-encapsulation-moving-parts-and-functional-paradigms-30d0"> Object-Oriented Programming: Encapsulation, Moving Parts, and Functional Paradigms </a> </div> </div> </div> </aside> </div> </div> <script src="https://assets.dev.to/assets/storiesList-b9c50cbd898a3a64258a3a49db1c531651b0a4a11937be35ed4651111802b5b5.js" defer="defer"></script> <script src="https://assets.dev.to/assets/followButtons-f2455d1f50a862b83fa006b1953e3a1644598781243cae25d3e75b13c04184fd.js" defer="defer"></script> <script src="https://assets.dev.to/assets/tagFollows-25496b4e3bf8bec41c7881be6b330ac8e9aa612d1ce876863a984d934d839384.js" defer="defer"></script> <script src="https://assets.dev.to/assets/feedPreviewCards-8d16b0b656456a28c0a290f756cf6e21e19833111c4796f48c631bfea8323d51.js" defer="defer"></script> <script src="https://assets.dev.to/assets/hideBookmarkButtons-0cc08aac1c422e6b6f75e5284b5350215abf211b59fb3eb8d8a4ef85e205b607.js" defer="defer"></script> <script src="https://assets.dev.to/assets/drawerSliders-823098a874684cfb50f32368b8dd1c7854954b83a588b8b6cfaef1e8fd30d858.js" defer="defer"></script> <script src="https://assets.dev.to/assets/localizeArticleDates-70147c5c6bfe350b42e020ebb2a3dd37419d83978982b5a67b6389119bf162ac.js" defer="defer"></script> <div id="runtime-banner-container"></div> </div> </div> <footer id="footer" class="crayons-footer print-hidden"> <div id="footer-container" class="crayons-footer__container"> <style> .long-bb-body { max-height: calc(100vh - 200px); overflow: hidden; } .long-bb-bottom { height: 180px; background: linear-gradient(to top, var(--card-bg), transparent); margin-top: -180px; position:relative; z-index: 5; } </style> <div style="" data-display-unit data-id="146443" data-category-click="click" data-category-impression="impression" data-context-type="home" data-special="nothing" data-article-id="" data-type-of="in_house"> <p style="font-weight: bold;margin-bottom: 10px"> Thank you to our Diamond Sponsor <a href="https://neon.tech/?bb=146443">Neon</a> for supporting our community. </p> </div> <p class="fs-s crayons-footer__description"> <a class="c-link c-link--branded fw-medium" aria-label="Forem Home" href="/">Forem</a> — A blogging-forward open source social network where our members connect and learn from one another </p> <ul class="footer__nav-links flex gap-2 justify-center flex-wrap fs-s p-0" style="" /> <li class="footer__nav-link flex items-center"> <a href="/"> Home </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/tags"> Tags </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/about"> About </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/contact"> Contact </a> <span class="dot ml-2"></span> </li> </ul> <ul class="footer__nav-links flex gap-2 justify-center flex-wrap fs-s p-0" style="" /> <li class="footer__nav-link flex items-center"> <a href="/code-of-conduct"> Code of Conduct </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/privacy"> Privacy Policy </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/terms"> Terms of use </a> <span class="dot ml-2"></span> </li> </ul> <div class="fs-s"> <p>Built on <a class="c-link c-link--branded" target="_blank" rel="noopener" href="https://www.forem.com">Forem</a> — the <a target="_blank" rel="noopener" class="c-link c-link--branded" href="https://dev.to/t/opensource">open source</a> software that powers <a target="_blank" rel="noopener" class="c-link c-link--branded" href="https://dev.to">DEV</a> and other inclusive communities.</p> <p>Made with love and <a target="_blank" rel="noopener" class="c-link c-link--branded" href="https://dev.to/t/rails">Ruby on Rails</a>. Forem <span title="copyright">©</span> 2016 - 2025.</p> </div> </div> </footer> <div id="snack-zone"></div> <div id="global-signup-modal" class="authentication-modal hidden"> <div class="authentication-modal__container"> <figure class="authentication-modal__image-container"> <img class="authentication-modal__image" src="https://media2.dev.to/dynamic/image/width=190,height=,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8j7kvp660rqzt99zui8e.png" alt="Forem" loading="lazy" /> </figure> <div class="authentication-modal__content"> <p class="authentication-modal__description"> We're a place where coders share, stay up-to-date and grow their careers. </p> </div> <div class="authentication-modal__actions"> <a href="/enter" class="crayons-btn" aria-label="Log in" data-no-instant> Log in </a> <a href="/enter?state=new-user" class="crayons-btn crayons-btn--ghost-brand js-global-signup-modal__create-account" aria-label="Create new account" data-no-instant> Create account </a> </div> </div> </div> <script src="https://assets.dev.to/assets/signupModalShortcuts-0b25469b985100a01e94cbd7fccaf7f0a4d776e129aac65c766aa32cb28ab29a.js" defer="defer"></script> <div id="cookie-consent"></div> <div id="i18n-translations" data-translations="{"en":{"core":{"add_comment":"Add comment","beta":"beta","comment":"Comment","copy_link":"Copy link","edit_profile":"Edit profile","follow":"Follow","follow_back":"Follow back","following":"Following","like":"Like","loading":"loading...","reaction":"Reaction","report_abuse":"Report abuse","search":"Search","success_settings":"Successfully updated settings.","counted_organization":{"one":"%{count} organization","other":"%{count} organizations"},"counted_user":{"one":"%{count} person","other":"%{count} people"},"not_following":"You're not following anyone","following_everyone":"You're following %{details} (everyone)","you_are_following":"You're following","and":"and"}}}"></div> <div id="reaction-category-resources" class="hidden" aria-hidden="true"> <img data-name="Like" data-slug="like" data-position="1" src="https://assets.dev.to/assets/sparkle-heart-5f9bee3767e18deb1bb725290cb151c25234768a0e9a2bd39370c382d02920cf.svg" width="18" height="18" /> <img data-name="Unicorn" data-slug="unicorn" data-position="2" src="https://assets.dev.to/assets/multi-unicorn-b44d6f8c23cdd00964192bedc38af3e82463978aa611b4365bd33a0f1f4f3e97.svg" width="18" height="18" /> <img data-name="Exploding Head" data-slug="exploding_head" data-position="3" src="https://assets.dev.to/assets/exploding-head-daceb38d627e6ae9b730f36a1e390fca556a4289d5a41abb2c35068ad3e2c4b5.svg" width="18" height="18" /> <img data-name="Raised Hands" data-slug="raised_hands" data-position="4" src="https://assets.dev.to/assets/raised-hands-74b2099fd66a39f2d7eed9305ee0f4553df0eb7b4f11b01b6b1b499973048fe5.svg" width="18" height="18" /> <img data-name="Fire" data-slug="fire" data-position="5" src="https://assets.dev.to/assets/fire-f60e7a582391810302117f987b22a8ef04a2fe0df7e3258a5f49332df1cec71e.svg" width="18" height="18" /> </div> <script> var userSignedIn = false; if (document.readyState === 'complete' || document.readyState === 'interactive') { initAuth(); } else { document.addEventListener('DOMContentLoaded', initAuth); } function initAuth() { var paramToken = new URLSearchParams(window.location.search).get('jwt'); if (paramToken && !userSignedIn) { authenticateUser(paramToken); } else { var iframe = document.createElement('iframe'); iframe.style.display = 'none'; iframe.src = 'https://dev.to/auth_pass/iframe'; document.body.appendChild(iframe); window.addEventListener('message', function(event) { if (event.origin !== 'https://dev.to' && event.origin !== window.location.origin) { return; } var data = event.data; if (data.authenticated && !userSignedIn) { authenticateUser(data.token); } else if(data.authenticated && window.ReactNativeWebView && window.ReactNativeWebView.postMessage) { window.ReactNativeWebView.postMessage(JSON.stringify({ action: 'login', token: data.token, })); } }); } function authenticateUser(token) { fetch('/auth_pass/token_login', { method: 'POST', credentials: 'include', headers: { 'Content-Type': 'application/json', 'X-CSRF-Token': getMetaContent('csrf-token'), }, body: JSON.stringify({ token: token }), }) .then(function(response) { return response.json(); }) .then(function(data) { if (data.success) { if (document.head.querySelector('meta[name="user-signed-in"][content="false"]')) { // Reload the page to update the user's state location.reload(); } } }) .catch(function(error) { console.error('Error during authentication:', error); }); } function getMetaContent(name) { var element = document.querySelector('meta[name="' + name + '"]'); return element ? element.getAttribute('content') : ''; } } </script> </body> </html>