Chloe - DEV Community

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Chloe - DEV Community</title> <meta name="last-updated" content="2024-12-03 12:43:23 UTC"> <meta name="user-signed-in" content="false"> <meta name="head-cached-at" content="1733229803"> <meta name="environment" content="production"> <link rel="stylesheet" href="https://assets.dev.to/assets/minimal-6206ee9219dabd8e1168cebeb1f34c12ab133f7723e45d4b24dd76b43fee1fbc.css" media="all" id="main-minimal-stylesheet" /> <link rel="stylesheet" href="https://assets.dev.to/assets/views-4dd5770daa5d9d443ed73a724fb1913af9b093295bf1a72307f0fb322e5df1d9.css" media="all" id="main-views-stylesheet" /> <link rel="stylesheet" href="https://assets.dev.to/assets/crayons-f94476cf86ce9153627fd53a77e651ec54b82b6be20ddb1bf93e3dd40b81aeab.css" media="all" id="main-crayons-stylesheet" /> <script src="https://assets.dev.to/assets/base-e0fa4f0ebd0f1ec157e6b07c08f9222f8c0cca3d10cfde4cd8c951b43985b10b.js" defer="defer"></script> <script src="https://assets.dev.to/assets/application-147cebefc5c4cddde055e8f5eb0055e811469b08405170e2411fbd7944b5ac04.js" defer="defer"></script> <script src="https://assets.dev.to/assets/baseInitializers-bc498cfd7bb7d2a2da59d68d0b2055cc2dd26fee3669ab88edbb396d37bc3369.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-cc5e8a352578866203771def747f37c3ec6a0869de0458328e0fcba3d5d2fceb.js"> <link rel="canonical" href="https://dev.to/cguttweb" /> <meta name="description" content="Web developer looking to develop my skills further particularly around JavaScript and Vue/Nuxt"> <meta name="keywords" content="software development, engineering, rails, javascript, ruby"> <meta property="og:type" content="website" /> <meta property="og:url" content="https://dev.to/cguttweb" /> <meta property="og:title" content="Chloe — DEV Community Profile" /> <meta property="og:image" content="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3otvb2z646ytpt1hl2rv.jpg" /> <meta property="og:description" content="Web developer looking to develop my skills further particularly around JavaScript and Vue/Nuxt" /> <meta property="og:site_name" content="DEV Community" /> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content="@thepracticaldev"> <meta name="twitter:creator" content="@cguttweb"> <meta name="twitter:title" content="Chloe — DEV Community Profile"> <meta name="twitter:description" content="Web developer looking to develop my skills further particularly around JavaScript and Vue/Nuxt"> <meta name="twitter:image:src" content="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3otvb2z646ytpt1hl2rv.jpg" /> <link rel="alternate" type="application/rss+xml" title="DEV Community RSS Feed" href="https://dev.to/feed/cguttweb" /> <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%2F8j7kvp660rqzt99zui8e.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%2F8j7kvp660rqzt99zui8e.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%2F8j7kvp660rqzt99zui8e.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%2F8j7kvp660rqzt99zui8e.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%2F8j7kvp660rqzt99zui8e.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%2F8j7kvp660rqzt99zui8e.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%2F8j7kvp660rqzt99zui8e.png" rel="icon" sizes="128x128" /> <meta name="apple-mobile-web-app-title" content="dev.to"> <meta name="application-name" content="dev.to"> <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://dev.to/open-search.xml" type="application/opensearchdescription+xml" title="DEV Community" /> <meta property="forem:name" content="DEV Community" /> <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%2F8j7kvp660rqzt99zui8e.png" /> <meta property="forem:domain" content="dev.to" /> </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="2024-11-28T14:26:33Z" data-latest-commit-id="4b49fb8266fd9b978bc78cbd8ffc1340c5bd5a1c" 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-ga4-tracking-id="G-TYEM8Y3JN3"> <link rel="stylesheet" href="https://assets.dev.to/assets/minimal-6206ee9219dabd8e1168cebeb1f34c12ab133f7723e45d4b24dd76b43fee1fbc.css" media="all" id="secondary-minimal-stylesheet" /> <link rel="stylesheet" href="https://assets.dev.to/assets/views-4dd5770daa5d9d443ed73a724fb1913af9b093295bf1a72307f0fb322e5df1d9.css" media="all" id="secondary-views-stylesheet" /> <link rel="stylesheet" href="https://assets.dev.to/assets/crayons-f94476cf86ce9153627fd53a77e651ec54b82b6be20ddb1bf93e3dd40b81aeab.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="asvsi6r1u7ja019xgicufoxwh6ty9c7w" class="crayons-icon"><title id="asvsi6r1u7ja019xgicufoxwh6ty9c7w">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://media2.dev.to/dynamic/image/quality=100/https://dev-to-uploads.s3.amazonaws.com/uploads/logos/resized_logo_UQww2soKuUsjaOGNB38o.png" style="aspect-ratio: 10 / 8" 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="ao1m4ydy24ii1z43nr3zgynk1dmt2dsx" aria-hidden="true" class="crayons-icon"><title id="ao1m4ydy24ii1z43nr3zgynk1dmt2dsx">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="aqdjia4jrf482ze76vf1bynfbm8fp201" aria-hidden="true" class="crayons-icon"><title id="aqdjia4jrf482ze76vf1bynfbm8fp201">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"> <a class="c-link c-link--icon-alone c-link--block m:hidden mx-1" id="search-link" aria-label="Search" href="/search"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="a4xe9ngxc9oq5cfqfmuwv51twx3m7kek" class="crayons-icon"><title id="a4xe9ngxc9oq5cfqfmuwv51twx3m7kek">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> </a> <div class="flex" id="authentication-top-nav-actions"> <span class="hidden m:block"> <a href="/enter" class="c-link c-link--block mr-2 whitespace-nowrap ml-auto" data-no-instant> Log in </a> </span> <a href="/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="akq3tooc3uswbbga9j3ux5wzhl5v0w2k" aria-hidden="true" class="crayons-icon c-btn__icon"><title id="akq3tooc3uswbbga9j3ux5wzhl5v0w2k">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 stories stories-index" data-current-page="stories-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> <main id="main-content"> <script type="application/ld+json"> {"@context":"http://schema.org","@type":"Person","mainEntityOfPage":{"@type":"WebPage","@id":"https://dev.to/cguttweb"},"url":"https://dev.to/cguttweb","sameAs":["https://twitter.com/cguttweb","https://github.com/cguttweb","https://www.cgweb.co.uk"],"image":"https://media2.dev.to/dynamic/image/width=320,height=320,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png","name":"Chloe","description":"Web developer looking to develop my skills further particularly around JavaScript and Vue/Nuxt"} </script> <style> :root { --profile-brand-color: #b40000; } </style> <div class="brand-bg"> <div class="crayons-layout crayons-layout--limited-l pt-7 m:pt-9"> <header class="profile-header crayons-card mt-2"> <div class="relative profile-header__top"> <span class="crayons-avatar crayons-avatar--3xl"> <img src="https://media2.dev.to/dynamic/image/width=320,height=320,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" width="128" height="128" alt="Chloe profile picture" class="crayons-avatar__image"> </span> <div class="profile-header__actions"> <button id="user-follow-butt" class="crayons-btn whitespace-nowrap follow-action-button follow-user" data-info='{"id":164594,"className":"User","name":"Chloe"}'>Follow</button> <div class="profile-dropdown ml-2 s:relative hidden" data-username="cguttweb"> <button id="user-profile-dropdown" aria-expanded="false" aria-controls="user-profile-dropdownmenu" aria-haspopup="true" class="crayons-btn crayons-btn--ghost-dimmed crayons-btn--icon"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a88wtxzp1is2l9bbkeco2bzkw7c241iq" class="crayons-icon dropdown-icon"><title id="a88wtxzp1is2l9bbkeco2bzkw7c241iq">User actions</title><path fill-rule="evenodd" clip-rule="evenodd" d="M7 12a2 2 0 11-4 0 2 2 0 014 0zm7 0a2 2 0 11-4 0 2 2 0 014 0zm5 2a2 2 0 100-4 2 2 0 000 4z"></path></svg> </button> <div id="user-profile-dropdownmenu" class="crayons-dropdown left-2 right-2 s:right-0 s:left-auto top-100 mt-1"> <span class="report-abuse-link-wrapper" data-path="/report-abuse?url=https://dev.to/cguttweb"></span> </div> </div> </div> </div> <div class="profile-header__details" data-url="/users/164594"> <div class="items-center js-username-container mb-2"> <h1 class="crayons-title lh-tight"> Chloe <span class="ml-2"></span> </h1> </div> <p class="fs-base profile-header__bio m:fs-l color-base-90 mb-4 mx-auto max-w-100 m:max-w-75">Web developer looking to develop my skills further particularly around JavaScript and Vue/Nuxt</p> <div class="profile-header__meta"> <span class="profile-header__meta__item"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="a4n5v4zfji99l3lewvarvwqoe003osom" class="crayons-icon mr-2 shrink-0"><title id="a4n5v4zfji99l3lewvarvwqoe003osom">Location</title> <path d="M18.364 17.364L12 23.728l-6.364-6.364a9 9 0 1112.728 0zM12 13a2 2 0 100-4 2 2 0 000 4z"></path> </svg> <span> UK </span> </span> <span class="profile-header__meta__item"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="aetgyxhx6i9b9zdl111j3n6623zi5m1k" class="crayons-icon mr-2 shrink-0"><title id="aetgyxhx6i9b9zdl111j3n6623zi5m1k">Joined</title> <path d="M8 6v3.999h3V6h2v3.999h3V6h2v3.999L19 10a3 3 0 012.995 2.824L22 13v1c0 1.014-.377 1.94-.999 2.645L21 21a1 1 0 01-1 1H4a1 1 0 01-1-1v-4.36a4.025 4.025 0 01-.972-2.182l-.022-.253L2 14v-1a3 3 0 012.824-2.995L5 10l1-.001V6h2zm11 6H5a1 1 0 00-.993.883L4 13v.971l.003.147a2 2 0 003.303 1.4c.363-.312.602-.744.674-1.218l.015-.153.005-.176c.036-1.248 1.827-1.293 1.989-.134l.01.134.004.147a2 2 0 003.992.031l.012-.282c.124-1.156 1.862-1.156 1.986 0l.012.282a2 2 0 003.99 0L20 14v-1a1 1 0 00-.883-.993L19 12zM7 1c1.32.871 1.663 2.088 1.449 2.888a1.5 1.5 0 11-2.898-.776C5.85 2.002 7 2.5 7 1zm5 0c1.32.871 1.663 2.088 1.449 2.888a1.5 1.5 0 01-2.898-.776C10.85 2.002 12 2.5 12 1zm5 0c1.32.871 1.663 2.088 1.449 2.888a1.5 1.5 0 01-2.898-.776C15.85 2.002 17 2.5 17 1z"></path> </svg> <span> Joined on <time datetime="2019-05-06T17:16:13Z" class="date">May 6, 2019</time> </span> </span> <a href="https://www.cgweb.co.uk" target="_blank" rel="noopener me " class="profile-header__meta__item"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="abzjxp0xqgur2q65sykrxrbpal1do6ti" class="crayons-icon mr-2 shrink-0"><title id="abzjxp0xqgur2q65sykrxrbpal1do6ti">Personal website</title><path d="M10.667 8v1.333H7.333v7.334h7.334v-3.334H16v4a.666.666 0 01-.667.667H6.667A.666.666 0 016 17.333V8.667A.667.667 0 016.667 8h4zM18 6v5.333h-1.333V8.275l-5.196 5.196-.942-.942 5.194-5.196h-3.056V6H18z"></path></svg> <span> https://www.cgweb.co.uk </span> </a> <a href="https://github.com/cguttweb" target="_blank" rel="noopener me" class="profile-header__meta__item p-1"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="aaz88jei61ffokhvyda6i5mjggjujood" class="crayons-icon shrink-0"><title id="aaz88jei61ffokhvyda6i5mjggjujood">github website</title> <path d="M12 2C6.475 2 2 6.475 2 12a9.994 9.994 0 006.838 9.488c.5.087.687-.213.687-.476 0-.237-.013-1.024-.013-1.862-2.512.463-3.162-.612-3.362-1.175-.113-.288-.6-1.175-1.025-1.413-.35-.187-.85-.65-.013-.662.788-.013 1.35.725 1.538 1.025.9 1.512 2.338 1.087 2.912.825.088-.65.35-1.087.638-1.337-2.225-.25-4.55-1.113-4.55-4.938 0-1.088.387-1.987 1.025-2.688-.1-.25-.45-1.275.1-2.65 0 0 .837-.262 2.75 1.026a9.28 9.28 0 012.5-.338c.85 0 1.7.112 2.5.337 1.912-1.3 2.75-1.024 2.75-1.024.55 1.375.2 2.4.1 2.65.637.7 1.025 1.587 1.025 2.687 0 3.838-2.337 4.688-4.562 4.938.362.312.675.912.675 1.85 0 1.337-.013 2.412-.013 2.75 0 .262.188.574.688.474A10.016 10.016 0 0022 12c0-5.525-4.475-10-10-10z"></path> </svg> </a> <a href="https://twitter.com/cguttweb" target="_blank" rel="noopener me" class="profile-header__meta__item p-1"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="aamm1560zzbx02r7owl5j19rhdvjjoi8" class="crayons-icon shrink-0"><title id="aamm1560zzbx02r7owl5j19rhdvjjoi8">twitter website</title> <path d="M14.095479,10.316482L22.286354,1h-1.940718l-7.115352,8.087682L7.551414,1H1l8.589488,12.231093L1,23h1.940717l7.509372-8.542861L16.448587,23H23L14.095479,10.316482z M11.436522,13.338465l-0.871624-1.218704l-6.924311-9.68815h2.981339l5.58978,7.82155l0.867949,1.218704l7.26506,10.166271h-2.981339L11.436522,13.338465z"></path> </svg> </a> </div> </div> <div class="profile-header__bottom fs-base"> <div class="crayons-definition"> <strong class="crayons-definition__title"> <p>Education</p> </strong> <p class="crayons-definition__value"> <p>Self taught</p> </p> </div> </div> <div class="crayons-card crayons-card--secondary"> <div class="crayons-card__body"> <div class="grid gap-4 grid-cols-6 s:grid-cols-7 m:grid-cols-7 align-center items-center js-profile-badges"> <div role="button" onclick="window.Forem.showModal({size: 'medium', showHeader: false, contentSelector: '#badge-91', overlay: true})" title="Five Year Club" class="js-profile-badge relative"> <img src="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%2Fbadge%2Fbadge_image%2F91%2FVersion2-04.png" alt="Five Year Club" class="mx-auto w-75 h-auto align-middle" style="object-fit: contain; cursor: pointer; width: 100%; aspect-ratio: 1 / 1; max-width: 80px;" loading="lazy" /> </div> <div id="badge-91" class="hidden"> <div class="badge_details"> <div class="badge-image-container p-3"> <img class="badge-image" src="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%2Fbadge%2Fbadge_image%2F91%2FVersion2-04.png" alt="Five Year Club badge" title="Five Year Club" loading="lazy" /> </div> <div class="badge_text_content"> <h4 class="title fw-800 fs-l">Five Year Club</h4> <p class="description">This badge celebrates the longevity of those who have been a registered member of the DEV Community for at least five years.</p> <button class="got-it-btn items-start c-btn c-btn--primary" onclick="window.Forem.closeModal()">Got it</button> </div> <div class="close" onclick="window.Forem.closeModal()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" aria-hidden="true" class="close_icon"><title>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> </div> </div> </div> <div role="button" onclick="window.Forem.showModal({size: 'medium', showHeader: false, contentSelector: '#badge-280', overlay: true})" title="Writing Debut" class="js-profile-badge relative"> <img src="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%2Fbadge%2Fbadge_image%2F280%2FWriting_Streak_Badges-05.png" alt="Writing Debut" class="mx-auto w-75 h-auto align-middle" style="object-fit: contain; cursor: pointer; width: 100%; aspect-ratio: 1 / 1; max-width: 80px;" loading="lazy" /> </div> <div id="badge-280" class="hidden"> <div class="badge_details"> <div class="badge-image-container p-3"> <img class="badge-image" src="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%2Fbadge%2Fbadge_image%2F280%2FWriting_Streak_Badges-05.png" alt="Writing Debut badge" title="Writing Debut" loading="lazy" /> </div> <div class="badge_text_content"> <h4 class="title fw-800 fs-l">Writing Debut</h4> <p class="description">Awarded for writing and sharing your first DEV post! Continue sharing your work to earn the 4 Week Writing Streak Badge.</p> <button class="got-it-btn items-start c-btn c-btn--primary" onclick="window.Forem.closeModal()">Got it</button> </div> <div class="close" onclick="window.Forem.closeModal()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" aria-hidden="true" class="close_icon"><title>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> </div> </div> </div> <div role="button" onclick="window.Forem.showModal({size: 'medium', showHeader: false, contentSelector: '#badge-75', overlay: true})" title="Four Year Club" class="js-profile-badge relative"> <img src="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%2Fbadge%2Fbadge_image%2F75%2FVersion2-05.png" alt="Four Year Club" class="mx-auto w-75 h-auto align-middle" style="object-fit: contain; cursor: pointer; width: 100%; aspect-ratio: 1 / 1; max-width: 80px;" loading="lazy" /> </div> <div id="badge-75" class="hidden"> <div class="badge_details"> <div class="badge-image-container p-3"> <img class="badge-image" src="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%2Fbadge%2Fbadge_image%2F75%2FVersion2-05.png" alt="Four Year Club badge" title="Four Year Club" loading="lazy" /> </div> <div class="badge_text_content"> <h4 class="title fw-800 fs-l">Four Year Club</h4> <p class="description">This badge celebrates the longevity of those who have been a registered member of the DEV Community for at least four years.</p> <button class="got-it-btn items-start c-btn c-btn--primary" onclick="window.Forem.closeModal()">Got it</button> </div> <div class="close" onclick="window.Forem.closeModal()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" aria-hidden="true" class="close_icon"><title>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> </div> </div> </div> <div role="button" onclick="window.Forem.showModal({size: 'medium', showHeader: false, contentSelector: '#badge-10', overlay: true})" title="Three Year Club" class="js-profile-badge relative"> <img src="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%2Fbadge%2Fbadge_image%2F10%2FVersion2-06.png" alt="Three Year Club" class="mx-auto w-75 h-auto align-middle" style="object-fit: contain; cursor: pointer; width: 100%; aspect-ratio: 1 / 1; max-width: 80px;" loading="lazy" /> </div> <div id="badge-10" class="hidden"> <div class="badge_details"> <div class="badge-image-container p-3"> <img class="badge-image" src="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%2Fbadge%2Fbadge_image%2F10%2FVersion2-06.png" alt="Three Year Club badge" title="Three Year Club" loading="lazy" /> </div> <div class="badge_text_content"> <h4 class="title fw-800 fs-l">Three Year Club</h4> <p class="description">This badge celebrates the longevity of those who have been a registered member of the DEV Community for at least three years.</p> <button class="got-it-btn items-start c-btn c-btn--primary" onclick="window.Forem.closeModal()">Got it</button> </div> <div class="close" onclick="window.Forem.closeModal()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" aria-hidden="true" class="close_icon"><title>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> </div> </div> </div> <div role="button" onclick="window.Forem.showModal({size: 'medium', showHeader: false, contentSelector: '#badge-9', overlay: true})" title="Two Year Club" class="js-profile-badge relative"> <img src="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%2Fbadge%2Fbadge_image%2F9%2FVersion2-07.png" alt="Two Year Club" class="mx-auto w-75 h-auto align-middle" style="object-fit: contain; cursor: pointer; width: 100%; aspect-ratio: 1 / 1; max-width: 80px;" loading="lazy" /> </div> <div id="badge-9" class="hidden"> <div class="badge_details"> <div class="badge-image-container p-3"> <img class="badge-image" src="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%2Fbadge%2Fbadge_image%2F9%2FVersion2-07.png" alt="Two Year Club badge" title="Two Year Club" loading="lazy" /> </div> <div class="badge_text_content"> <h4 class="title fw-800 fs-l">Two Year Club</h4> <p class="description">This badge celebrates the longevity of those who have been a registered member of the DEV Community for at least two years.</p> <button class="got-it-btn items-start c-btn c-btn--primary" onclick="window.Forem.closeModal()">Got it</button> </div> <div class="close" onclick="window.Forem.closeModal()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" aria-hidden="true" class="close_icon"><title>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> </div> </div> </div> <div role="button" onclick="window.Forem.showModal({size: 'medium', showHeader: false, contentSelector: '#badge-2', overlay: true})" title="One Year Club" class="js-profile-badge relative"> <img src="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%2Fbadge%2Fbadge_image%2F2%2FVersion2-08.png" alt="One Year Club" class="mx-auto w-75 h-auto align-middle" style="object-fit: contain; cursor: pointer; width: 100%; aspect-ratio: 1 / 1; max-width: 80px;" loading="lazy" /> </div> <div id="badge-2" class="hidden"> <div class="badge_details"> <div class="badge-image-container p-3"> <img class="badge-image" src="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%2Fbadge%2Fbadge_image%2F2%2FVersion2-08.png" alt="One Year Club badge" title="One Year Club" loading="lazy" /> </div> <div class="badge_text_content"> <h4 class="title fw-800 fs-l">One Year Club</h4> <p class="description">This badge celebrates the longevity of those who have been a registered member of the DEV Community for at least one year.</p> <button class="got-it-btn items-start c-btn c-btn--primary" onclick="window.Forem.closeModal()">Got it</button> </div> <div class="close" onclick="window.Forem.closeModal()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" aria-hidden="true" class="close_icon"><title>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> </div> </div> </div> <div role="button" onclick="window.Forem.showModal({size: 'medium', showHeader: false, contentSelector: '#badge-11', overlay: true})" title="4 Week Writing Streak" class="js-profile-badge relative"> <img src="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%2Fbadge%2Fbadge_image%2F11%2FWriting_Streak_Badges-02.png" alt="4 Week Writing Streak" class="mx-auto w-75 h-auto align-middle" style="object-fit: contain; cursor: pointer; width: 100%; aspect-ratio: 1 / 1; max-width: 80px;" loading="lazy" /> </div> <div id="badge-11" class="hidden"> <div class="badge_details"> <div class="badge-image-container p-3"> <img class="badge-image" src="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%2Fbadge%2Fbadge_image%2F11%2FWriting_Streak_Badges-02.png" alt="4 Week Writing Streak badge" title="4 Week Writing Streak" loading="lazy" /> </div> <div class="badge_text_content"> <h4 class="title fw-800 fs-l">4 Week Writing Streak</h4> <p class="description">You've posted at least one post per week for 4 consecutive weeks!</p> <button class="got-it-btn items-start c-btn c-btn--primary" onclick="window.Forem.closeModal()">Got it</button> </div> <div class="close" onclick="window.Forem.closeModal()"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" aria-hidden="true" class="close_icon"><title>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> </div> </div> </div> </div> </div> </div> <div class="p-3 block m:hidden js-user-info-trigger-wrapper"> <button type="button" class="my-3 crayons-btn crayons-btn--outlined w-100 js-user-info-trigger">More info about @cguttweb</button> </div> </header> </div> </div> <div class="crayons-layout crayons-layout--limited-l crayons-layout--2-cols crayons-layout--2-cols--1-2 pt-4 m:pt-0" id="index-container" data-params="{"user_id":164594,"class_name":"Article","sort_by":"published_at","sort_direction":"desc"}" data-which="articles" data-tag="" data-feed="base-feed" data-articles-since="0"> <div class="crayons-layout__sidebar-left crayons-layout__content"> <div class="m:gap-4 hidden m:grid js-user-info"> <div class="crayons-card crayons-card--secondary"> <header class="crayons-card__header"> <h3 class="crayons-subtitle-3 flex items-center">GitHub Repositories</h3> </header> <div> <a href="https://github.com/cguttweb/nuxt-portfolio-blog" target="_blank" rel="noopener" class="crayons-link crayons-link--contentful"> <p class="fw-bold flex items-center"> nuxt-portfolio-blog </p> <p class="fs-s color-base-80 mb-1">My personal site and blog built with Nuxt version 2</p> <p class="fs-s color-base-60 flex items-center"> Vue </p> </a> </div> </div> <div class="crayons-card crayons-card--secondary"> <header class="crayons-card__header"> <h3 class="crayons-subtitle-3"> <p>Skills/Languages</p> </h3> </header> <div class="crayons-card__body"> <p>HTML emails (most of my job) <br>JS <br>CSS/SCSS</p> </div> </div> <div class="crayons-card crayons-card--secondary"> <header class="crayons-card__header"> <h3 class="crayons-subtitle-3"> <p>Currently learning</p> </h3> </header> <div class="crayons-card__body"> <p>Vanilla JavaScript <br>Vue and Nuxt 3 <br>Basics of PHP and SQL</p> </div> </div> <div class="crayons-card crayons-card--secondary"> <header class="crayons-card__header"> <h3 class="crayons-subtitle-3"> <p>Currently hacking on</p> </h3> </header> <div class="crayons-card__body"> <p>My Nuxt Portfolio and Blog <br>Nuxt/Vue based projects </p> </div> </div> <div class="crayons-card crayons-card--secondary"> <header class="crayons-card__header"> <h3 class="crayons-subtitle-3"> <p>Available for</p> </h3> </header> <div class="crayons-card__body"> <p>Any LFC fans up the Redmen! :) <br>Working with someone on anything Vue related</p> </div> </div> <div class="crayons-card crayons-card--secondary p-4"> <div class="flex items-center mb-4"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="ared5j1ermbi7qhanincdhfk4ceuuth0" class="crayons-icon mr-3 color-base-50"><title id="ared5j1ermbi7qhanincdhfk4ceuuth0">Post</title> <path d="M19 22H5a3 3 0 01-3-3V3a1 1 0 011-1h14a1 1 0 011 1v12h4v4a3 3 0 01-3 3zm-1-5v2a1 1 0 002 0v-2h-2zm-2 3V4H4v15a1 1 0 001 1h11zM6 7h8v2H6V7zm0 4h8v2H6v-2zm0 4h5v2H6v-2z"></path> </svg> 44 posts published </div> <div class="flex items-center mb-4"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="ahjnx1zvkyp12r38m59yuzgdbtq8sw7j" class="crayons-icon mr-3 color-base-50"><title id="ahjnx1zvkyp12r38m59yuzgdbtq8sw7j">Comment</title> <path d="M10 3h4a8 8 0 010 16v3.5c-5-2-12-5-12-11.5a8 8 0 018-8zm2 14h2a6 6 0 000-12h-4a6 6 0 00-6 6c0 3.61 2.462 5.966 8 8.48V17z"></path> </svg> 93 comments written </div> <div class="flex items-center"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="aqpwmplun0ilfc21lzj7emve3v400oar" class="crayons-icon mr-3 color-base-50"><title id="aqpwmplun0ilfc21lzj7emve3v400oar">Tag</title> <path d="M7.784 14l.42-4H4V8h4.415l.525-5h2.011l-.525 5h3.989l.525-5h2.011l-.525 5H20v2h-3.784l-.42 4H20v2h-4.415l-.525 5h-2.011l.525-5H9.585l-.525 5H7.049l.525-5H4v-2h3.784zm2.011 0h3.99l.42-4h-3.99l-.42 4z"></path> </svg> 22 tags followed </div> </div> </div> </div> <main class="crayons-layout__content articles-list" id="articles-list"> <div class="substories" id="substories"> <div class="crayons-story " data-feed-content-id="1027158" data-content-user-id="164594"> <a href="/cguttweb/how-to-add-vue-to-a-laravel-app-46j1" aria-labelledby="article-link-1027158" class="crayons-story__hidden-navigation-link">How to add Vue to a Laravel app?</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-1027158" aria-controls="story-author-preview-content-1027158" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-1027158" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/how-to-add-vue-to-a-laravel-app-46j1" class="crayons-story__tertiary fs-xs"><time datetime="2022-03-18T15:04:51Z">Mar 18 '22</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1647615891"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/how-to-add-vue-to-a-laravel-app-46j1" data-preload-image="" id="article-link-1027158"> How to add Vue to a Laravel app? </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(65, 184, 131, 0.10); --tag-prefix: #41b883; --tag-bg-hover: rgba(65, 184, 131, 0.10); --tag-prefix-hover: #41b883; " href="/t/vue"><span class="crayons-tag__prefix">#</span>vue</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(220, 45, 23, 0.10); --tag-prefix: #dc2d17; --tag-bg-hover: rgba(220, 45, 23, 0.10); --tag-prefix-hover: #dc2d17; " href="/t/laravel"><span class="crayons-tag__prefix">#</span>laravel</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/how-to-add-vue-to-a-laravel-app-46j1" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="1027158" aria-label="Add a comment to post - How to add Vue to a Laravel app?"> <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/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">8<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/how-to-add-vue-to-a-laravel-app-46j1#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 add Vue to a Laravel app?"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="amkk11fwf3w5j5199amwdtr5u139npv4" class="crayons-icon"><title id="amkk11fwf3w5j5199amwdtr5u139npv4">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> 3<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div id="comments-locked-cta" class="crayons-card mt-2 m:mt-0 mb-2 m:p-8 p-4"> <div class="align-center"> <svg xmlns="http://www.w3.org/2000/svg" width="132" height="102" viewBox="0 0 132 102" fill="none" aria-hidden="true"> <g filter="url(#a)"> <rect y="6" width="128" height="92" rx="8" fill="url(#b)"></rect> <rect x=".5" y="6.5" width="127" height="91" rx="7.5" stroke="#171717"></rect> </g> <path d="M.5 14A7.5 7.5 0 0 1 8 6.5h112a7.5 7.5 0 0 1 7.5 7.5v11.5H.5V14Z" fill="url(#c)" stroke="#171717"></path> <path opacity=".2" d="M13 63h27v2H13v-2ZM13 70h21v2H13v-2ZM13 77h28v2H13v-2ZM13 84h24v2H13v-2Z" fill="#171717"></path> <g filter="url(#d)"> <circle cx="64" cy="24" r="24" fill="url(#e)"></circle> <circle cx="64" cy="24" r="23.571" stroke="#171717" stroke-width=".857"></circle> </g> <circle cx="64" cy="16.286" r="5.571" fill="url(#f)" stroke="#171717" stroke-width=".857"></circle> <path d="M75.571 33.03c0 1.32-.535 2.285-1.373 3.008-.854.736-2.033 1.23-3.306 1.552-2.545.645-5.319.569-6.174.525a5.576 5.576 0 0 0-.579 0c-.855.044-3.629.12-6.174-.525-1.273-.322-2.452-.816-3.305-1.552-.84-.723-1.374-1.688-1.374-3.009 0-3.077 1.237-5.424 3.228-7.012 2-1.596 4.792-2.446 7.915-2.446 3.122 0 5.913.85 7.915 2.446 1.99 1.588 3.227 3.936 3.227 7.012Z" fill="url(#g)" stroke="#171717" stroke-width=".857"></path> <path d="M49.5 64a3.5 3.5 0 0 1 3.5-3.5h64a3.5 3.5 0 0 1 3.5 3.5v33.5h-71V64Z" fill="url(#h)" stroke="#171717"></path> <circle cx="59" cy="72" r="3.5" fill="#A7F3D0" stroke="#171717"></circle> <path fill="#171717" d="M66 71h20v2H66z"></path> <path opacity=".2" d="M66 80h30v2H66v-2ZM66 87h44v2H66v-2Z" fill="#171717"></path> <defs> <linearGradient id="b" x1="64" y1="6" x2="64" y2="98" gradientUnits="userSpaceOnUse"> <stop offset=".736" stop-color="#fff"></stop> <stop offset="1" stop-color="#D7D7D7"></stop> </linearGradient> <linearGradient id="c" x1="64" y1="6" x2="64" y2="98" gradientUnits="userSpaceOnUse"> <stop offset=".736" stop-color="#fff"></stop> <stop offset="1" stop-color="#D7D7D7"></stop> </linearGradient> <linearGradient id="e" x1="64" y1="0" x2="64" y2="48" gradientUnits="userSpaceOnUse"> <stop stop-color="#FFE89E"></stop> <stop offset="1" stop-color="#FFC50A"></stop> </linearGradient> <linearGradient id="f" x1="64" y1="10.286" x2="64" y2="23.623" gradientUnits="userSpaceOnUse"> <stop offset=".292" stop-color="#fff"></stop> <stop offset="1" stop-color="#E7E7E7"></stop> </linearGradient> <linearGradient id="g" x1="64.429" y1="23.143" x2="64.429" y2="40.291" gradientUnits="userSpaceOnUse"> <stop offset=".292" stop-color="#fff"></stop> <stop offset="1" stop-color="#E7E7E7"></stop> </linearGradient> <linearGradient id="h" x1="85" y1="52" x2="85" y2="114" gradientUnits="userSpaceOnUse"> <stop offset=".292" stop-color="#fff"></stop> <stop offset="1" stop-color="#E7E7E7"></stop> </linearGradient> <filter id="a" x="0" y="6" width="132" height="96" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> <feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood> <feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix> <feOffset dx="4" dy="4"></feOffset> <feComposite in2="hardAlpha" operator="out"></feComposite> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0"></feColorMatrix> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_811_2367"></feBlend> <feBlend in="SourceGraphic" in2="effect1_dropShadow_811_2367" result="shape"></feBlend> </filter> <filter id="d" x="40" y="0" width="51.429" height="51.429" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> <feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood> <feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix> <feOffset dx="3.429" dy="3.429"></feOffset> <feComposite in2="hardAlpha" operator="out"></feComposite> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0"></feColorMatrix> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_811_2367"></feBlend> <feBlend in="SourceGraphic" in2="effect1_dropShadow_811_2367" result="shape"></feBlend> </filter> </defs> </svg> </div> <h3 class="crayons-subtitle-3 mt-5 fs-l align-center"> Want to connect with Chloe? </h3> <p class="align-center mt-1 color-base-60 fs-base"> Create an account to connect with Chloe. You can also sign in below to proceed if you already have an account. </p> <div class="align-center mt-4"> <a href="/enter?state=new-user" class="crayons-btn crayons-btn--l w-75" data-tracking-id="ca_profile_comment_section_locked" data-tracking-source="comments_locked_cta" data-no-instant> Create Account </a> </div> <div class="align-center mt-4"> <span> Already have an account? <a href="/enter" data-tracking-id="si_profile_comment_section_locked" data-tracking-source="comments_locked_cta"> Sign in </a> </span> </div> </div> <div class="crayons-story " data-feed-content-id="964999" data-content-user-id="164594"> <a href="/cguttweb/til-css-conic-gradient-57pd" aria-labelledby="article-link-964999" class="crayons-story__hidden-navigation-link">TIL CSS conic gradient</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-964999" aria-controls="story-author-preview-content-964999" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-964999" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/til-css-conic-gradient-57pd" class="crayons-story__tertiary fs-xs"><time datetime="2022-01-23T17:18:25Z">Jan 23 '22</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1642958305"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/til-css-conic-gradient-57pd" data-preload-image="" id="article-link-964999"> TIL CSS conic gradient </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 237, 201, 0.10); --tag-prefix: #ffedc9; --tag-bg-hover: rgba(255, 237, 201, 0.10); --tag-prefix-hover: #ffedc9; " href="/t/todayilearned"><span class="crayons-tag__prefix">#</span>todayilearned</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(59, 73, 223, 0.10); --tag-prefix: #3b49df; --tag-bg-hover: rgba(59, 73, 223, 0.10); --tag-prefix-hover: #3b49df; " href="/t/gradients"><span class="crayons-tag__prefix">#</span>gradients</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/til-css-conic-gradient-57pd" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="964999" aria-label="Add a comment to post - TIL CSS conic gradient"> <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/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">2<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/til-css-conic-gradient-57pd#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - TIL CSS conic gradient"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aoch8c9d48u4ucz22ctcm7y1voq5wqu1" class="crayons-icon"><title id="aoch8c9d48u4ucz22ctcm7y1voq5wqu1">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="868021" data-content-user-id="164594"> <a href="/cguttweb/css-selectors-3hh" aria-labelledby="article-link-868021" class="crayons-story__hidden-navigation-link">CSS Selectors</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-868021" aria-controls="story-author-preview-content-868021" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-868021" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/css-selectors-3hh" class="crayons-story__tertiary fs-xs"><time datetime="2022-01-15T14:53:32Z">Jan 15 '22</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1642258410"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/css-selectors-3hh" data-preload-image="" id="article-link-868021"> CSS Selectors </a> </h2> <div class="crayons-story__tags"> <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="/cguttweb/css-selectors-3hh" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="868021" aria-label="Add a comment to post - CSS Selectors"> <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/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">5<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/css-selectors-3hh#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - CSS Selectors"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="abcdtzgtxue0bl8omny3pf5y61tis661" class="crayons-icon"><title id="abcdtzgtxue0bl8omny3pf5y61tis661">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="955583" data-content-user-id="164594"> <a href="/cguttweb/how-to-add-blog-posts-to-github-readme-k39" aria-labelledby="article-link-955583" class="crayons-story__hidden-navigation-link">How to add blog posts to github readme?</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-955583" aria-controls="story-author-preview-content-955583" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-955583" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/how-to-add-blog-posts-to-github-readme-k39" class="crayons-story__tertiary fs-xs"><time datetime="2022-01-14T23:16:12Z">Jan 14 '22</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1642202172"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/how-to-add-blog-posts-to-github-readme-k39" data-preload-image="" id="article-link-955583"> How to add blog posts to github readme? </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/github"><span class="crayons-tag__prefix">#</span>github</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(5, 4, 56, 0.10); --tag-prefix: #050438; --tag-bg-hover: rgba(5, 4, 56, 0.10); --tag-prefix-hover: #050438; " href="/t/nuxt"><span class="crayons-tag__prefix">#</span>nuxt</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(65, 184, 131, 0.10); --tag-prefix: #41b883; --tag-bg-hover: rgba(65, 184, 131, 0.10); --tag-prefix-hover: #41b883; " href="/t/vue"><span class="crayons-tag__prefix">#</span>vue</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(255, 255, 255, 0.10); --tag-prefix: #FFFFFF; --tag-bg-hover: rgba(255, 255, 255, 0.10); --tag-prefix-hover: #FFFFFF; " href="/t/markdown"><span class="crayons-tag__prefix">#</span>markdown</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/how-to-add-blog-posts-to-github-readme-k39" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="955583" aria-label="Add a comment to post - How to add blog posts to github readme?"> <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/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="/cguttweb/how-to-add-blog-posts-to-github-readme-k39#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 add blog posts to github readme?"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aenkpszr8nrhknwndrj8jppvk1zixb6o" class="crayons-icon"><title id="aenkpszr8nrhknwndrj8jppvk1zixb6o">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> 1<span class="hidden s:inline"> comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="943478" data-content-user-id="164594"> <a href="/cguttweb/2022-goals-4o86" aria-labelledby="article-link-943478" class="crayons-story__hidden-navigation-link">2022 Goals</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-943478" aria-controls="story-author-preview-content-943478" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-943478" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/2022-goals-4o86" class="crayons-story__tertiary fs-xs"><time datetime="2022-01-11T19:43:58Z">Jan 11 '22</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1641930237"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/2022-goals-4o86" data-preload-image="" id="article-link-943478"> 2022 Goals </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/goals"><span class="crayons-tag__prefix">#</span>goals</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(255, 102, 237, 0.10); --tag-prefix: #ff66ed; --tag-bg-hover: rgba(255, 102, 237, 0.10); --tag-prefix-hover: #ff66ed; " href="/t/learning"><span class="crayons-tag__prefix">#</span>learning</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/2022"><span class="crayons-tag__prefix">#</span>2022</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/2022-goals-4o86#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - 2022 Goals"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="agbeq67w012beiyc3ub8wvi1phsdjka8" class="crayons-icon"><title id="agbeq67w012beiyc3ub8wvi1phsdjka8">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="789942" data-content-user-id="164594"> <a href="/cguttweb/css-supports-rule-182h" aria-labelledby="article-link-789942" class="crayons-story__hidden-navigation-link">CSS @supports rule</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-789942" aria-controls="story-author-preview-content-789942" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-789942" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/css-supports-rule-182h" class="crayons-story__tertiary fs-xs"><time datetime="2021-09-26T17:56:01Z">Sep 26 '21</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1632678960"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/css-supports-rule-182h" data-preload-image="" id="article-link-789942"> CSS @supports rule </a> </h2> <div class="crayons-story__tags"> <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="/cguttweb/css-supports-rule-182h" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="789942" aria-label="Add a comment to post - CSS @supports rule"> <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/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="/cguttweb/css-supports-rule-182h#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - CSS @supports rule"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a7e5r3010gizkdf9ra3ymjzopw4xqwty" class="crayons-icon"><title id="a7e5r3010gizkdf9ra3ymjzopw4xqwty">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="655826" data-content-user-id="164594"> <a href="/cguttweb/vscode-plugins-4af6" aria-labelledby="article-link-655826" class="crayons-story__hidden-navigation-link">VSCode Plugins</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-655826" aria-controls="story-author-preview-content-655826" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-655826" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/vscode-plugins-4af6" class="crayons-story__tertiary fs-xs"><time datetime="2021-08-04T20:20:34Z">Aug 4 '21</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1628108433"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/vscode-plugins-4af6" data-preload-image="" id="article-link-655826"> VSCode Plugins </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(60, 165, 234, 0.10); --tag-prefix: #3ca5ea; --tag-bg-hover: rgba(60, 165, 234, 0.10); --tag-prefix-hover: #3ca5ea; " href="/t/vscode"><span class="crayons-tag__prefix">#</span>vscode</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/plugins"><span class="crayons-tag__prefix">#</span>plugins</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/vscode-plugins-4af6#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - VSCode Plugins"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="as5gs83pz63136f4mj2ep02r0q52wnqo" class="crayons-icon"><title id="as5gs83pz63136f4mj2ep02r0q52wnqo">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="620210" data-content-user-id="164594"> <a href="/cguttweb/working-with-git-4078" aria-labelledby="article-link-620210" class="crayons-story__hidden-navigation-link">Working with Git</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-620210" aria-controls="story-author-preview-content-620210" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-620210" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/working-with-git-4078" class="crayons-story__tertiary fs-xs"><time datetime="2021-04-17T19:17:30Z">Apr 17 '21</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1618687050"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/working-with-git-4078" data-preload-image="" id="article-link-620210"> Working with Git </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(245, 77, 39, 0.10); --tag-prefix: #F54D27; --tag-bg-hover: rgba(245, 77, 39, 0.10); --tag-prefix-hover: #F54D27; " href="/t/git"><span class="crayons-tag__prefix">#</span>git</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/working-with-git-4078" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="620210" aria-label="Add a comment to post - Working with Git"> <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/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">4<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/working-with-git-4078#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Working with Git"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aqbhgcc4dmlgxf57pzjaq0dloltrnb9p" class="crayons-icon"><title id="aqbhgcc4dmlgxf57pzjaq0dloltrnb9p">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> 1<span class="hidden s:inline"> comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 2 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="613098" data-content-user-id="164594"> <a href="/cguttweb/javascript-objects-48a8" aria-labelledby="article-link-613098" class="crayons-story__hidden-navigation-link">JavaScript Objects</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-613098" aria-controls="story-author-preview-content-613098" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-613098" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/javascript-objects-48a8" class="crayons-story__tertiary fs-xs"><time datetime="2021-04-17T17:59:31Z">Apr 17 '21</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1618682371"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/javascript-objects-48a8" data-preload-image="" id="article-link-613098"> JavaScript Objects </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> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/javascript-objects-48a8" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="613098" aria-label="Add a comment to post - JavaScript Objects"> <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/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">14<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/javascript-objects-48a8#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - JavaScript Objects"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a5h6iq34l95ydoqhxzzrb91lk3gg9s7x" class="crayons-icon"><title id="a5h6iq34l95ydoqhxzzrb91lk3gg9s7x">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="581269" data-content-user-id="164594"> <a href="/cguttweb/css-variables-5689" aria-labelledby="article-link-581269" class="crayons-story__hidden-navigation-link">CSS Variables</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-581269" aria-controls="story-author-preview-content-581269" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-581269" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/css-variables-5689" class="crayons-story__tertiary fs-xs"><time datetime="2021-02-07T20:40:12Z">Feb 7 '21</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1612730412"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/css-variables-5689" data-preload-image="" id="article-link-581269"> CSS Variables </a> </h2> <div class="crayons-story__tags"> <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="/cguttweb/css-variables-5689" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="581269" aria-label="Add a comment to post - CSS Variables"> <div class="multiple_reactions_aggregate"> <span class="multiple_reactions_icons_container" dir="rtl"> </span> <span class="aggregate_reactions_counter">1<span class="hidden s:inline"> reaction</span></span> </div> </a> <a href="/cguttweb/css-variables-5689#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - CSS Variables"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aixnr8i21oi7olcvld4snguwy9a88f51" class="crayons-icon"><title id="aixnr8i21oi7olcvld4snguwy9a88f51">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="594846" data-content-user-id="164594"> <a href="/cguttweb/how-to-access-subfolders-using-nuxt-content-module-14bm" aria-labelledby="article-link-594846" class="crayons-story__hidden-navigation-link">How to access subfolders using nuxt content module?</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-594846" aria-controls="story-author-preview-content-594846" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-594846" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/how-to-access-subfolders-using-nuxt-content-module-14bm" class="crayons-story__tertiary fs-xs"><time datetime="2021-02-07T20:35:56Z">Feb 7 '21</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1612730156"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/how-to-access-subfolders-using-nuxt-content-module-14bm" data-preload-image="" id="article-link-594846"> How to access subfolders using nuxt content module? </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(5, 4, 56, 0.10); --tag-prefix: #050438; --tag-bg-hover: rgba(5, 4, 56, 0.10); --tag-prefix-hover: #050438; " href="/t/nuxt"><span class="crayons-tag__prefix">#</span>nuxt</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(65, 184, 131, 0.10); --tag-prefix: #41b883; --tag-bg-hover: rgba(65, 184, 131, 0.10); --tag-prefix-hover: #41b883; " href="/t/vue"><span class="crayons-tag__prefix">#</span>vue</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/how-to-access-subfolders-using-nuxt-content-module-14bm#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 access subfolders using nuxt content module?"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aevdtq9jtf23j5g32kw3jw3uuiak458u" class="crayons-icon"><title id="aevdtq9jtf23j5g32kw3jw3uuiak458u">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> 1<span class="hidden s:inline"> comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="497375" data-content-user-id="164594"> <a href="/cguttweb/react-not-easy-to-learn-4bbh" aria-labelledby="article-link-497375" class="crayons-story__hidden-navigation-link">React not easy to learn?</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-497375" aria-controls="story-author-preview-content-497375" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-497375" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/react-not-easy-to-learn-4bbh" class="crayons-story__tertiary fs-xs"><time datetime="2020-10-25T17:42:30Z">Oct 25 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1603647750"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/react-not-easy-to-learn-4bbh" data-preload-image="" id="article-link-497375"> React not easy to learn? </a> </h2> <div class="crayons-story__tags"> <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="/cguttweb/react-not-easy-to-learn-4bbh" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="497375" aria-label="Add a comment to post - React not easy to learn?"> <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/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">10<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/react-not-easy-to-learn-4bbh#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 not easy to learn?"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a3dhiw8eaa8n7990rpozav5n8jicu8z3" class="crayons-icon"><title id="a3dhiw8eaa8n7990rpozav5n8jicu8z3">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> 23<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="487097" data-content-user-id="164594"> <a href="/cguttweb/pagination-in-nuxt-3080" aria-labelledby="article-link-487097" class="crayons-story__hidden-navigation-link">Pagination in Nuxt</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-487097" aria-controls="story-author-preview-content-487097" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-487097" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/pagination-in-nuxt-3080" class="crayons-story__tertiary fs-xs"><time datetime="2020-10-14T19:28:22Z">Oct 14 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1602703702"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/pagination-in-nuxt-3080" data-preload-image="" id="article-link-487097"> Pagination in Nuxt </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(5, 4, 56, 0.10); --tag-prefix: #050438; --tag-bg-hover: rgba(5, 4, 56, 0.10); --tag-prefix-hover: #050438; " href="/t/nuxt"><span class="crayons-tag__prefix">#</span>nuxt</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(65, 184, 131, 0.10); --tag-prefix: #41b883; --tag-bg-hover: rgba(65, 184, 131, 0.10); --tag-prefix-hover: #41b883; " href="/t/vue"><span class="crayons-tag__prefix">#</span>vue</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/pagination-in-nuxt-3080" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="487097" aria-label="Add a comment to post - Pagination in Nuxt"> <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/sparkle-heart-5f9bee3767e18deb1bb725290cb151c25234768a0e9a2bd39370c382d02920cf.svg" width="18" height="18" /> </span> </span> <span class="aggregate_reactions_counter">12<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/pagination-in-nuxt-3080#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Pagination in Nuxt"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ati6vcu8vd5nwryliqc5uxk1sn0mdmt9" class="crayons-icon"><title id="ati6vcu8vd5nwryliqc5uxk1sn0mdmt9">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> 6<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="469953" data-content-user-id="164594"> <a href="/cguttweb/nuxt-feed-module-help-2n7c" aria-labelledby="article-link-469953" class="crayons-story__hidden-navigation-link">Nuxt feed module help</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-469953" aria-controls="story-author-preview-content-469953" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-469953" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/nuxt-feed-module-help-2n7c" class="crayons-story__tertiary fs-xs"><time datetime="2020-09-30T08:56:53Z">Sep 30 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1601456213"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/nuxt-feed-module-help-2n7c" data-preload-image="" id="article-link-469953"> Nuxt feed module help </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(5, 4, 56, 0.10); --tag-prefix: #050438; --tag-bg-hover: rgba(5, 4, 56, 0.10); --tag-prefix-hover: #050438; " href="/t/nuxt"><span class="crayons-tag__prefix">#</span>nuxt</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(65, 184, 131, 0.10); --tag-prefix: #41b883; --tag-bg-hover: rgba(65, 184, 131, 0.10); --tag-prefix-hover: #41b883; " href="/t/vue"><span class="crayons-tag__prefix">#</span>vue</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/blog"><span class="crayons-tag__prefix">#</span>blog</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/nuxt-feed-module-help-2n7c" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="469953" aria-label="Add a comment to post - Nuxt feed module help"> <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/sparkle-heart-5f9bee3767e18deb1bb725290cb151c25234768a0e9a2bd39370c382d02920cf.svg" width="18" height="18" /> </span> </span> <span class="aggregate_reactions_counter">1<span class="hidden s:inline"> reaction</span></span> </div> </a> <a href="/cguttweb/nuxt-feed-module-help-2n7c#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Nuxt feed module help"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ap64crr64vogngx0sgdcanr5fvcepd7t" class="crayons-icon"><title id="ap64crr64vogngx0sgdcanr5fvcepd7t">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="465550" data-content-user-id="164594"> <a href="/cguttweb/for-of-for-in-or-foreach-4npp" aria-labelledby="article-link-465550" class="crayons-story__hidden-navigation-link">for of, for in or forEach?</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-465550" aria-controls="story-author-preview-content-465550" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-465550" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/for-of-for-in-or-foreach-4npp" class="crayons-story__tertiary fs-xs"><time datetime="2020-09-25T10:31:26Z">Sep 25 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1601029886"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/for-of-for-in-or-foreach-4npp" data-preload-image="" id="article-link-465550"> for of, for in or forEach? </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</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="/cguttweb/for-of-for-in-or-foreach-4npp" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="465550" aria-label="Add a comment to post - for of, for in or forEach?"> <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/multi-unicorn-b44d6f8c23cdd00964192bedc38af3e82463978aa611b4365bd33a0f1f4f3e97.svg" width="18" height="18" /> </span> </span> <span class="aggregate_reactions_counter">2<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/for-of-for-in-or-foreach-4npp#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - for of, for in or forEach?"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ah87xobkmrs00e341yd7ekja5ehhczkg" class="crayons-icon"><title id="ah87xobkmrs00e341yd7ekja5ehhczkg">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> 3<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="460641" data-content-user-id="164594"> <a href="/cguttweb/nuxt-or-gridsome-113b" aria-labelledby="article-link-460641" class="crayons-story__hidden-navigation-link">Nuxt or Gridsome</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-460641" aria-controls="story-author-preview-content-460641" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-460641" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/nuxt-or-gridsome-113b" class="crayons-story__tertiary fs-xs"><time datetime="2020-09-19T17:36:28Z">Sep 19 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1600536988"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/nuxt-or-gridsome-113b" data-preload-image="" id="article-link-460641"> Nuxt or Gridsome </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(65, 184, 131, 0.10); --tag-prefix: #41b883; --tag-bg-hover: rgba(65, 184, 131, 0.10); --tag-prefix-hover: #41b883; " href="/t/vue"><span class="crayons-tag__prefix">#</span>vue</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(5, 4, 56, 0.10); --tag-prefix: #050438; --tag-bg-hover: rgba(5, 4, 56, 0.10); --tag-prefix-hover: #050438; " href="/t/nuxt"><span class="crayons-tag__prefix">#</span>nuxt</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/gridsome"><span class="crayons-tag__prefix">#</span>gridsome</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/nuxt-or-gridsome-113b" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="460641" aria-label="Add a comment to post - Nuxt or Gridsome"> <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/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="/cguttweb/nuxt-or-gridsome-113b#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Nuxt or Gridsome"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="af7zrm6mx9mxrub5kr3wha8wjzqxrnej" class="crayons-icon"><title id="af7zrm6mx9mxrub5kr3wha8wjzqxrnej">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> 4<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="460784" data-content-user-id="164594"> <a href="/cguttweb/vue-router-1a09" aria-labelledby="article-link-460784" class="crayons-story__hidden-navigation-link">Vue Router</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-460784" aria-controls="story-author-preview-content-460784" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-460784" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/vue-router-1a09" class="crayons-story__tertiary fs-xs"><time datetime="2020-09-25T09:53:14Z">Sep 25 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1598192694"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/vue-router-1a09" data-preload-image="" id="article-link-460784"> Vue Router </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(65, 184, 131, 0.10); --tag-prefix: #41b883; --tag-bg-hover: rgba(65, 184, 131, 0.10); --tag-prefix-hover: #41b883; " href="/t/vue"><span class="crayons-tag__prefix">#</span>vue</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/vue-router-1a09#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Vue Router"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aogd2802hnekypknrgfkm5bgu4bv5xq8" class="crayons-icon"><title id="aogd2802hnekypknrgfkm5bgu4bv5xq8">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="402161" data-content-user-id="164594"> <a href="/cguttweb/lacking-focus-learning-struggle-16mg" aria-labelledby="article-link-402161" class="crayons-story__hidden-navigation-link">Lacking focus/learning struggle</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-402161" aria-controls="story-author-preview-content-402161" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-402161" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/lacking-focus-learning-struggle-16mg" class="crayons-story__tertiary fs-xs"><time datetime="2020-07-17T19:37:28Z">Jul 17 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1595014648"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/lacking-focus-learning-struggle-16mg" data-preload-image="" id="article-link-402161"> Lacking focus/learning struggle </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(255, 102, 237, 0.10); --tag-prefix: #ff66ed; --tag-bg-hover: rgba(255, 102, 237, 0.10); --tag-prefix-hover: #ff66ed; " href="/t/learning"><span class="crayons-tag__prefix">#</span>learning</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> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/lacking-focus-learning-struggle-16mg" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="402161" aria-label="Add a comment to post - Lacking focus/learning struggle"> <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/multi-unicorn-b44d6f8c23cdd00964192bedc38af3e82463978aa611b4365bd33a0f1f4f3e97.svg" width="18" height="18" /> </span> </span> <span class="aggregate_reactions_counter">2<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/lacking-focus-learning-struggle-16mg#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Lacking focus/learning struggle"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a12x4pgs5dndkj4yuh1u3vfv1jp69x1k" class="crayons-icon"><title id="a12x4pgs5dndkj4yuh1u3vfv1jp69x1k">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> 4<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="374212" data-content-user-id="164594"> <a href="/cguttweb/tailwind-vs-bootstrap-2mo9" aria-labelledby="article-link-374212" class="crayons-story__hidden-navigation-link">Tailwind vs Bootstrap</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-374212" aria-controls="story-author-preview-content-374212" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-374212" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/tailwind-vs-bootstrap-2mo9" class="crayons-story__tertiary fs-xs"><time datetime="2020-06-30T11:25:08Z">Jun 30 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1593388800"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/tailwind-vs-bootstrap-2mo9" data-preload-image="" id="article-link-374212"> Tailwind vs Bootstrap </a> </h2> <div class="crayons-story__tags"> <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(0, 0, 0, 0.10); --tag-prefix: #000000; --tag-bg-hover: rgba(0, 0, 0, 0.10); --tag-prefix-hover: #000000; " href="/t/tailwindcss"><span class="crayons-tag__prefix">#</span>tailwindcss</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/bootstrap"><span class="crayons-tag__prefix">#</span>bootstrap</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/tailwind-vs-bootstrap-2mo9" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="374212" aria-label="Add a comment to post - Tailwind vs Bootstrap"> <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/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">7<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/tailwind-vs-bootstrap-2mo9#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Tailwind vs Bootstrap"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="atew2ohwxrh6raq99nkc050ot99vxnio" class="crayons-icon"><title id="atew2ohwxrh6raq99nkc050ot99vxnio">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="372812" data-content-user-id="164594"> <a href="/cguttweb/nuxt-instead-of-wordpress-4b3m" aria-labelledby="article-link-372812" class="crayons-story__hidden-navigation-link">Nuxt instead of Wordpress?</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-372812" aria-controls="story-author-preview-content-372812" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-372812" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/nuxt-instead-of-wordpress-4b3m" class="crayons-story__tertiary fs-xs"><time datetime="2020-06-28T17:22:38Z">Jun 28 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1593364958"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/nuxt-instead-of-wordpress-4b3m" data-preload-image="" id="article-link-372812"> Nuxt instead of Wordpress? </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(5, 4, 56, 0.10); --tag-prefix: #050438; --tag-bg-hover: rgba(5, 4, 56, 0.10); --tag-prefix-hover: #050438; " href="/t/nuxt"><span class="crayons-tag__prefix">#</span>nuxt</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/gridsome"><span class="crayons-tag__prefix">#</span>gridsome</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(65, 184, 131, 0.10); --tag-prefix: #41b883; --tag-bg-hover: rgba(65, 184, 131, 0.10); --tag-prefix-hover: #41b883; " href="/t/vue"><span class="crayons-tag__prefix">#</span>vue</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/nuxt-instead-of-wordpress-4b3m" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="372812" aria-label="Add a comment to post - Nuxt instead of Wordpress?"> <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/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="/cguttweb/nuxt-instead-of-wordpress-4b3m#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Nuxt instead of Wordpress?"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ad5d9equy6qj5k1txhkysv68a1r44xga" class="crayons-icon"><title id="ad5d9equy6qj5k1txhkysv68a1r44xga">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> 8<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="355132" data-content-user-id="164594"> <a href="/cguttweb/getting-started-with-accessibility-1eh9" aria-labelledby="article-link-355132" class="crayons-story__hidden-navigation-link">Getting started with accessibility</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-355132" aria-controls="story-author-preview-content-355132" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-355132" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/getting-started-with-accessibility-1eh9" class="crayons-story__tertiary fs-xs"><time datetime="2020-06-13T18:06:13Z">Jun 13 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1592071573"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/getting-started-with-accessibility-1eh9" data-preload-image="" id="article-link-355132"> Getting started with accessibility </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(8, 59, 21, 0.10); --tag-prefix: #083b15; --tag-bg-hover: rgba(8, 59, 21, 0.10); --tag-prefix-hover: #083b15; " href="/t/a11y"><span class="crayons-tag__prefix">#</span>a11y</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(245, 57, 0, 0.10); --tag-prefix: #F53900; --tag-bg-hover: rgba(245, 57, 0, 0.10); --tag-prefix-hover: #F53900; " href="/t/html"><span class="crayons-tag__prefix">#</span>html</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/getting-started-with-accessibility-1eh9" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="355132" aria-label="Add a comment to post - Getting started with accessibility"> <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/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">4<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/getting-started-with-accessibility-1eh9#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 accessibility"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="affml3pqsbl4j92m6g3jb9h0tqkaxmzt" class="crayons-icon"><title id="affml3pqsbl4j92m6g3jb9h0tqkaxmzt">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> 11<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="355083" data-content-user-id="164594"> <a href="/cguttweb/alternatives-to-wordpress-5hb6" aria-labelledby="article-link-355083" class="crayons-story__hidden-navigation-link">Alternatives to Wordpress</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-355083" aria-controls="story-author-preview-content-355083" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-355083" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/alternatives-to-wordpress-5hb6" class="crayons-story__tertiary fs-xs"><time datetime="2020-06-13T17:06:43Z">Jun 13 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1592068003"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/alternatives-to-wordpress-5hb6" data-preload-image="" id="article-link-355083"> Alternatives to Wordpress </a> </h2> <div class="crayons-story__tags"> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/alternatives-to-wordpress-5hb6" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="355083" aria-label="Add a comment to post - Alternatives to Wordpress"> <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/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">15<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/alternatives-to-wordpress-5hb6#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Alternatives to Wordpress"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a6sazhrqpfg969hdvt9lrg4afrcudcyv" class="crayons-icon"><title id="a6sazhrqpfg969hdvt9lrg4afrcudcyv">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> 3<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="330630" data-content-user-id="164594"> <a href="/cguttweb/prismjs-34d3" aria-labelledby="article-link-330630" class="crayons-story__hidden-navigation-link">PrismJS</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-330630" aria-controls="story-author-preview-content-330630" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-330630" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/prismjs-34d3" class="crayons-story__tertiary fs-xs"><time datetime="2020-05-08T20:48:03Z">May 8 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1588970883"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/prismjs-34d3" data-preload-image="" id="article-link-330630"> PrismJS </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</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/formatting"><span class="crayons-tag__prefix">#</span>formatting</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/prismjs-34d3#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - PrismJS"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="am3hk5jae8ar0bik1yk59nwi6r3xjnvp" class="crayons-icon"><title id="am3hk5jae8ar0bik1yk59nwi6r3xjnvp">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> 1<span class="hidden s:inline"> comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="329415" data-content-user-id="164594"> <a href="/cguttweb/personal-documentation-2c5k" aria-labelledby="article-link-329415" class="crayons-story__hidden-navigation-link">Personal Documentation</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-329415" aria-controls="story-author-preview-content-329415" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-329415" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/personal-documentation-2c5k" class="crayons-story__tertiary fs-xs"><time datetime="2020-05-07T07:58:26Z">May 7 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1588838306"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/personal-documentation-2c5k" data-preload-image="" id="article-link-329415"> Personal Documentation </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</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/vuepress"><span class="crayons-tag__prefix">#</span>vuepress</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(65, 184, 131, 0.10); --tag-prefix: #41b883; --tag-bg-hover: rgba(65, 184, 131, 0.10); --tag-prefix-hover: #41b883; " href="/t/vue"><span class="crayons-tag__prefix">#</span>vue</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/personal-documentation-2c5k" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="329415" aria-label="Add a comment to post - Personal Documentation"> <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/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">4<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/personal-documentation-2c5k#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Personal Documentation"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="amvupivjamb8o0ph8n9918evga60h7ai" class="crayons-icon"><title id="amvupivjamb8o0ph8n9918evga60h7ai">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> 2<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="326531" data-content-user-id="164594"> <a href="/cguttweb/referencing-relative-images-in-vue-3o76" aria-labelledby="article-link-326531" class="crayons-story__hidden-navigation-link">Referencing relative images in Vue</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-326531" aria-controls="story-author-preview-content-326531" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-326531" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/referencing-relative-images-in-vue-3o76" class="crayons-story__tertiary fs-xs"><time datetime="2020-05-03T18:12:16Z">May 3 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1588529536"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/referencing-relative-images-in-vue-3o76" data-preload-image="" id="article-link-326531"> Referencing relative images in Vue </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(65, 184, 131, 0.10); --tag-prefix: #41b883; --tag-bg-hover: rgba(65, 184, 131, 0.10); --tag-prefix-hover: #41b883; " href="/t/vue"><span class="crayons-tag__prefix">#</span>vue</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/referencing-relative-images-in-vue-3o76" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="326531" aria-label="Add a comment to post - Referencing relative images in Vue"> <div class="multiple_reactions_aggregate"> <span class="multiple_reactions_icons_container" dir="rtl"> </span> <span class="aggregate_reactions_counter">2<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/referencing-relative-images-in-vue-3o76#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Referencing relative images in Vue"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ah52aoaqk237kzljn8696oobwovwu4ri" class="crayons-icon"><title id="ah52aoaqk237kzljn8696oobwovwu4ri">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> 3<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="319242" data-content-user-id="164594"> <a href="/cguttweb/attribute-selectors-1fme" aria-labelledby="article-link-319242" class="crayons-story__hidden-navigation-link">Attribute Selectors</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-319242" aria-controls="story-author-preview-content-319242" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-319242" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/attribute-selectors-1fme" class="crayons-story__tertiary fs-xs"><time datetime="2020-04-29T18:11:17Z">Apr 29 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1587772800"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/attribute-selectors-1fme" data-preload-image="" id="article-link-319242"> Attribute Selectors </a> </h2> <div class="crayons-story__tags"> <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="/cguttweb/attribute-selectors-1fme" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="319242" aria-label="Add a comment to post - Attribute Selectors"> <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/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="/cguttweb/attribute-selectors-1fme#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Attribute Selectors"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ab2q5xalbpelsvjwjnn6zlwjvx4l2uvc" class="crayons-icon"><title id="ab2q5xalbpelsvjwjnn6zlwjvx4l2uvc">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="316532" data-content-user-id="164594"> <a href="/cguttweb/tags-in-gridsome-5eh" aria-labelledby="article-link-316532" class="crayons-story__hidden-navigation-link">Tags in Gridsome</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-316532" aria-controls="story-author-preview-content-316532" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-316532" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/tags-in-gridsome-5eh" class="crayons-story__tertiary fs-xs"><time datetime="2020-04-23T13:41:35Z">Apr 23 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1587649295"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/tags-in-gridsome-5eh" data-preload-image="" id="article-link-316532"> Tags in Gridsome </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</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/gridsome"><span class="crayons-tag__prefix">#</span>gridsome</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(65, 184, 131, 0.10); --tag-prefix: #41b883; --tag-bg-hover: rgba(65, 184, 131, 0.10); --tag-prefix-hover: #41b883; " href="/t/vue"><span class="crayons-tag__prefix">#</span>vue</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/tags-in-gridsome-5eh" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="316532" aria-label="Add a comment to post - Tags in Gridsome"> <div class="multiple_reactions_aggregate"> <span class="multiple_reactions_icons_container" dir="rtl"> </span> <span class="aggregate_reactions_counter">1<span class="hidden s:inline"> reaction</span></span> </div> </a> <a href="/cguttweb/tags-in-gridsome-5eh#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Tags in Gridsome"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ac7ns2xabiam5wq8ebu8z2k248ca4soq" class="crayons-icon"><title id="ac7ns2xabiam5wq8ebu8z2k248ca4soq">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> 5<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="307757" data-content-user-id="164594"> <a href="/cguttweb/pseudo-classes-and-elements-4bc1" aria-labelledby="article-link-307757" class="crayons-story__hidden-navigation-link">Pseudo Classes and Elements</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-307757" aria-controls="story-author-preview-content-307757" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-307757" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/pseudo-classes-and-elements-4bc1" class="crayons-story__tertiary fs-xs"><time datetime="2020-04-19T11:34:52Z">Apr 19 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1586736000"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/pseudo-classes-and-elements-4bc1" data-preload-image="" id="article-link-307757"> Pseudo Classes and Elements </a> </h2> <div class="crayons-story__tags"> <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="/cguttweb/pseudo-classes-and-elements-4bc1#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Pseudo Classes and Elements"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a50sz0izuxbki55ugwd0iuz4mp5sng9x" class="crayons-icon"><title id="a50sz0izuxbki55ugwd0iuz4mp5sng9x">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="305325" data-content-user-id="164594"> <a href="/cguttweb/vue-and-localstorage-4430" aria-labelledby="article-link-305325" class="crayons-story__hidden-navigation-link">Vue and localStorage?</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-305325" aria-controls="story-author-preview-content-305325" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-305325" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/vue-and-localstorage-4430" class="crayons-story__tertiary fs-xs"><time datetime="2020-04-11T12:31:49Z">Apr 11 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1586608309"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/vue-and-localstorage-4430" data-preload-image="" id="article-link-305325"> Vue and localStorage? </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(65, 184, 131, 0.10); --tag-prefix: #41b883; --tag-bg-hover: rgba(65, 184, 131, 0.10); --tag-prefix-hover: #41b883; " href="/t/vue"><span class="crayons-tag__prefix">#</span>vue</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/vue-and-localstorage-4430" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="305325" aria-label="Add a comment to post - Vue and localStorage?"> <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/sparkle-heart-5f9bee3767e18deb1bb725290cb151c25234768a0e9a2bd39370c382d02920cf.svg" width="18" height="18" /> </span> </span> <span class="aggregate_reactions_counter">5<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/vue-and-localstorage-4430#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Vue and localStorage?"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ahf0ffu0qowb55verk65mokwj5s1gy29" class="crayons-icon"><title id="ahf0ffu0qowb55verk65mokwj5s1gy29">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> 6<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="296674" data-content-user-id="164594"> <a href="/cguttweb/styling-in-gatsby-2991" aria-labelledby="article-link-296674" class="crayons-story__hidden-navigation-link">Styling in Gatsby</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-296674" aria-controls="story-author-preview-content-296674" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-296674" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/styling-in-gatsby-2991" class="crayons-story__tertiary fs-xs"><time datetime="2020-04-01T17:49:57Z">Apr 1 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1585763397"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/styling-in-gatsby-2991" data-preload-image="" id="article-link-296674"> Styling in Gatsby </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(102, 51, 153, 0.10); --tag-prefix: #663399; --tag-bg-hover: rgba(102, 51, 153, 0.10); --tag-prefix-hover: #663399; " href="/t/gatsby"><span class="crayons-tag__prefix">#</span>gatsby</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="/cguttweb/styling-in-gatsby-2991" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="296674" aria-label="Add a comment to post - Styling in Gatsby"> <div class="multiple_reactions_aggregate"> <span class="multiple_reactions_icons_container" dir="rtl"> </span> <span class="aggregate_reactions_counter">2<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/styling-in-gatsby-2991#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Styling in Gatsby"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aaqwgg69prmqw3ybayaxnri1aehadswv" class="crayons-icon"><title id="aaqwgg69prmqw3ybayaxnri1aehadswv">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> 10<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="294343" data-content-user-id="164594"> <a href="/cguttweb/learning-react-2cbk" aria-labelledby="article-link-294343" class="crayons-story__hidden-navigation-link">Learning React</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-294343" aria-controls="story-author-preview-content-294343" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-294343" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/learning-react-2cbk" class="crayons-story__tertiary fs-xs"><time datetime="2020-03-29T12:33:47Z">Mar 29 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1585485227"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/learning-react-2cbk" data-preload-image="" id="article-link-294343"> Learning React </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</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> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/learning-react-2cbk" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="294343" aria-label="Add a comment to post - Learning React"> <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/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="/cguttweb/learning-react-2cbk#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Learning React"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aqmv0ipvv4dzb59m56h44u08hrsoilm4" class="crayons-icon"><title id="aqmv0ipvv4dzb59m56h44u08hrsoilm4">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> 4<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="294416" data-content-user-id="164594"> <a href="/cguttweb/initial-impressions-of-gatsby-cms-2j6g" aria-labelledby="article-link-294416" class="crayons-story__hidden-navigation-link">Initial impressions of Gatsby + CMS</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-294416" aria-controls="story-author-preview-content-294416" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-294416" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/initial-impressions-of-gatsby-cms-2j6g" class="crayons-story__tertiary fs-xs"><time datetime="2020-06-25T15:53:38Z">Jun 25 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1585440000"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/initial-impressions-of-gatsby-cms-2j6g" data-preload-image="" id="article-link-294416"> Initial impressions of Gatsby + CMS </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(102, 51, 153, 0.10); --tag-prefix: #663399; --tag-bg-hover: rgba(102, 51, 153, 0.10); --tag-prefix-hover: #663399; " href="/t/gatsby"><span class="crayons-tag__prefix">#</span>gatsby</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(59, 73, 223, 0.10); --tag-prefix: #3b49df; --tag-bg-hover: rgba(59, 73, 223, 0.10); --tag-prefix-hover: #3b49df; " href="/t/styling"><span class="crayons-tag__prefix">#</span>styling</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/initial-impressions-of-gatsby-cms-2j6g#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Initial impressions of Gatsby + CMS"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a8uojwcfcifuz7d2u05mzc3f75qwvqrn" class="crayons-icon"><title id="a8uojwcfcifuz7d2u05mzc3f75qwvqrn">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="277452" data-content-user-id="164594"> <a href="/cguttweb/mechanical-keyboards-247c" aria-labelledby="article-link-277452" class="crayons-story__hidden-navigation-link">Mechanical Keyboards</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-277452" aria-controls="story-author-preview-content-277452" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-277452" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/mechanical-keyboards-247c" class="crayons-story__tertiary fs-xs"><time datetime="2020-03-09T22:22:16Z">Mar 9 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1583792536"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/mechanical-keyboards-247c" data-preload-image="" id="article-link-277452"> Mechanical Keyboards </a> </h2> <div class="crayons-story__tags"> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/mechanical-keyboards-247c" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="277452" aria-label="Add a comment to post - Mechanical Keyboards"> <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/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">8<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/mechanical-keyboards-247c#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Mechanical Keyboards"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aj5fgjjximlsl1sb2f39yikv0ao5ii81" class="crayons-icon"><title id="aj5fgjjximlsl1sb2f39yikv0ao5ii81">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> 6<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="276615" data-content-user-id="164594"> <a href="/cguttweb/gatsby-how-much-react-do-you-need-to-know-1mnj" aria-labelledby="article-link-276615" class="crayons-story__hidden-navigation-link">Gatsby how much React do you need to know?</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-276615" aria-controls="story-author-preview-content-276615" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-276615" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/gatsby-how-much-react-do-you-need-to-know-1mnj" class="crayons-story__tertiary fs-xs"><time datetime="2020-03-08T13:27:32Z">Mar 8 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1583674052"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/gatsby-how-much-react-do-you-need-to-know-1mnj" data-preload-image="" id="article-link-276615"> Gatsby how much React do you need to know? </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(102, 51, 153, 0.10); --tag-prefix: #663399; --tag-bg-hover: rgba(102, 51, 153, 0.10); --tag-prefix-hover: #663399; " href="/t/gatsby"><span class="crayons-tag__prefix">#</span>gatsby</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> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/gatsby-how-much-react-do-you-need-to-know-1mnj" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="276615" aria-label="Add a comment to post - Gatsby how much React do you need to know?"> <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/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">8<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/gatsby-how-much-react-do-you-need-to-know-1mnj#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Gatsby how much React do you need to know?"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a5cvtbaqlyvjopr1ymlwz0owtym9qbcm" class="crayons-icon"><title id="a5cvtbaqlyvjopr1ymlwz0owtym9qbcm">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> 2<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="271696" data-content-user-id="164594"> <a href="/cguttweb/semantic-html-bp2" aria-labelledby="article-link-271696" class="crayons-story__hidden-navigation-link">Semantic HTML</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-271696" aria-controls="story-author-preview-content-271696" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-271696" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/semantic-html-bp2" class="crayons-story__tertiary fs-xs"><time datetime="2020-03-20T22:15:04Z">Mar 20 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1583020800"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/semantic-html-bp2" data-preload-image="" id="article-link-271696"> Semantic HTML </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(245, 57, 0, 0.10); --tag-prefix: #F53900; --tag-bg-hover: rgba(245, 57, 0, 0.10); --tag-prefix-hover: #F53900; " href="/t/html"><span class="crayons-tag__prefix">#</span>html</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/semantic-html-bp2" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="271696" aria-label="Add a comment to post - Semantic HTML"> <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/sparkle-heart-5f9bee3767e18deb1bb725290cb151c25234768a0e9a2bd39370c382d02920cf.svg" width="18" height="18" /> </span> </span> <span class="aggregate_reactions_counter">7<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/semantic-html-bp2#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Semantic HTML"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ao01r9qzu1hn8zx7ampoc7sf80sht9cx" class="crayons-icon"><title id="ao01r9qzu1hn8zx7ampoc7sf80sht9cx">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="269668" data-content-user-id="164594"> <a href="/cguttweb/where-to-learn-graphql-4mlj" aria-labelledby="article-link-269668" class="crayons-story__hidden-navigation-link">Where to learn GraphQL?</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-269668" aria-controls="story-author-preview-content-269668" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-269668" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jLjOOk5U--/c_fill,f_auto,fl_progressive,h_90,q_auto,w_90/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/164594/491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/where-to-learn-graphql-4mlj" class="crayons-story__tertiary fs-xs"><time datetime="2020-02-26T20:52:03Z">Feb 26 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1582750323"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/where-to-learn-graphql-4mlj" data-preload-image="" id="article-link-269668"> Where to learn GraphQL? </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(23, 30, 38, 0.10); --tag-prefix: #171e26; --tag-bg-hover: rgba(23, 30, 38, 0.10); --tag-prefix-hover: #171e26; " href="/t/graphql"><span class="crayons-tag__prefix">#</span>graphql</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/where-to-learn-graphql-4mlj" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="269668" aria-label="Add a comment to post - Where to learn GraphQL?"> <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/multi-unicorn-b44d6f8c23cdd00964192bedc38af3e82463978aa611b4365bd33a0f1f4f3e97.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="/cguttweb/where-to-learn-graphql-4mlj#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Where to learn GraphQL?"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="adm98x1nkwsm7qtruhqn34klu3mr8tft" class="crayons-icon"><title id="adm98x1nkwsm7qtruhqn34klu3mr8tft">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> 4<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="263627" data-content-user-id="164594"> <a href="/cguttweb/javascript-string-methods-3i09" aria-labelledby="article-link-263627" class="crayons-story__hidden-navigation-link">JavaScript String methods</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-263627" aria-controls="story-author-preview-content-263627" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-263627" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/javascript-string-methods-3i09" class="crayons-story__tertiary fs-xs"><time datetime="2020-02-23T12:13:27Z">Feb 23 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1582329600"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/javascript-string-methods-3i09" data-preload-image="" id="article-link-263627"> JavaScript String methods </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> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/javascript-string-methods-3i09" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="263627" aria-label="Add a comment to post - JavaScript String methods"> <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/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">8<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/javascript-string-methods-3i09#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - JavaScript String methods"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="atdvv45apv25jbivav8rlo0kdynkq06e" class="crayons-icon"><title id="atdvv45apv25jbivav8rlo0kdynkq06e">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="260532" data-content-user-id="164594"> <a href="/cguttweb/learning-plan-and-2020-goals-3f6d" aria-labelledby="article-link-260532" class="crayons-story__hidden-navigation-link">Learning Plan and 2020 Goals</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-260532" aria-controls="story-author-preview-content-260532" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-260532" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/learning-plan-and-2020-goals-3f6d" class="crayons-story__tertiary fs-xs"><time datetime="2020-02-23T14:22:34Z">Feb 23 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1581206400"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/learning-plan-and-2020-goals-3f6d" data-preload-image="" id="article-link-260532"> Learning Plan and 2020 Goals </a> </h2> <div class="crayons-story__tags"> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/learning-plan-and-2020-goals-3f6d" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="260532" aria-label="Add a comment to post - Learning Plan and 2020 Goals"> <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/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="/cguttweb/learning-plan-and-2020-goals-3f6d#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Learning Plan and 2020 Goals"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aqfp15n8o17iab7j6ck772x6esheurpd" class="crayons-icon"><title id="aqfp15n8o17iab7j6ck772x6esheurpd">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="240889" data-content-user-id="164594"> <a href="/cguttweb/learning-routine-struggle-5d18" aria-labelledby="article-link-240889" class="crayons-story__hidden-navigation-link">Learning routine struggle</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-240889" aria-controls="story-author-preview-content-240889" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-240889" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/learning-routine-struggle-5d18" class="crayons-story__tertiary fs-xs"><time datetime="2020-01-18T13:35:49Z">Jan 18 '20</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1579354549"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/learning-routine-struggle-5d18" data-preload-image="" id="article-link-240889"> Learning routine struggle </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(255, 102, 237, 0.10); --tag-prefix: #ff66ed; --tag-bg-hover: rgba(255, 102, 237, 0.10); --tag-prefix-hover: #ff66ed; " href="/t/learning"><span class="crayons-tag__prefix">#</span>learning</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/learning-routine-struggle-5d18" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="240889" aria-label="Add a comment to post - Learning routine struggle"> <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/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">7<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/learning-routine-struggle-5d18#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Learning routine struggle"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ar52smy0fdcyllkc2x9jq5hd8gyade0x" class="crayons-icon"><title id="ar52smy0fdcyllkc2x9jq5hd8gyade0x">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> 1<span class="hidden s:inline"> comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="199937" data-content-user-id="164594"> <a href="/cguttweb/is-sass-worth-learning-in-2019-20-1d54" aria-labelledby="article-link-199937" class="crayons-story__hidden-navigation-link">Is Sass worth learning in 2019/20?</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-199937" aria-controls="story-author-preview-content-199937" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-199937" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/is-sass-worth-learning-in-2019-20-1d54" class="crayons-story__tertiary fs-xs"><time datetime="2019-11-03T19:54:50Z">Nov 3 '19</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1572810890"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/is-sass-worth-learning-in-2019-20-1d54" data-preload-image="" id="article-link-199937"> Is Sass worth learning in 2019/20? </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(59, 73, 223, 0.10); --tag-prefix: #3b49df; --tag-bg-hover: rgba(59, 73, 223, 0.10); --tag-prefix-hover: #3b49df; " href="/t/sass"><span class="crayons-tag__prefix">#</span>sass</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="/cguttweb/is-sass-worth-learning-in-2019-20-1d54" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="199937" aria-label="Add a comment to post - Is Sass worth learning in 2019/20?"> <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/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">11<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/is-sass-worth-learning-in-2019-20-1d54#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Is Sass worth learning in 2019/20?"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="at5p7gznc218plpccxyqmt0q9onmnzwd" class="crayons-icon"><title id="at5p7gznc218plpccxyqmt0q9onmnzwd">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> 7<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="195689" data-content-user-id="164594"> <a href="/cguttweb/setting-up-rss-feed-for-my-gridsome-blog-3g9i" aria-labelledby="article-link-195689" class="crayons-story__hidden-navigation-link">Setting up RSS feed for my Gridsome blog</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-195689" aria-controls="story-author-preview-content-195689" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-195689" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/setting-up-rss-feed-for-my-gridsome-blog-3g9i" class="crayons-story__tertiary fs-xs"><time datetime="2019-10-26T14:22:34Z">Oct 26 '19</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1572048000"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/setting-up-rss-feed-for-my-gridsome-blog-3g9i" data-preload-image="" id="article-link-195689"> Setting up RSS feed for my Gridsome blog </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/blog"><span class="crayons-tag__prefix">#</span>blog</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/rss"><span class="crayons-tag__prefix">#</span>rss</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/gridsome"><span class="crayons-tag__prefix">#</span>gridsome</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/setting-up-rss-feed-for-my-gridsome-blog-3g9i" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="195689" aria-label="Add a comment to post - Setting up RSS feed for my Gridsome blog"> <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/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">15<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/setting-up-rss-feed-for-my-gridsome-blog-3g9i#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Setting up RSS feed for my Gridsome blog"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="aec6zl1a20gpy0jk36wntkuwnndj97wv" class="crayons-icon"><title id="aec6zl1a20gpy0jk36wntkuwnndj97wv">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> 5<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 2 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="195478" data-content-user-id="164594"> <a href="/cguttweb/rss-help-4i4p" aria-labelledby="article-link-195478" class="crayons-story__hidden-navigation-link">RSS Help</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-195478" aria-controls="story-author-preview-content-195478" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-195478" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/rss-help-4i4p" class="crayons-story__tertiary fs-xs"><time datetime="2019-10-25T21:45:56Z">Oct 25 '19</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1572039956"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/rss-help-4i4p" data-preload-image="" id="article-link-195478"> RSS Help </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--filled " style=" --tag-bg: rgba(255, 50, 50, 0.10); --tag-prefix: #ff3232; --tag-bg-hover: rgba(255, 50, 50, 0.10); --tag-prefix-hover: #ff3232; " href="/t/help"><span class="crayons-tag__prefix">#</span>help</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/rsshelp"><span class="crayons-tag__prefix">#</span>rsshelp</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/gridsome"><span class="crayons-tag__prefix">#</span>gridsome</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/blogging"><span class="crayons-tag__prefix">#</span>blogging</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/rss-help-4i4p" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="195478" aria-label="Add a comment to post - RSS Help"> <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/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">7<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/rss-help-4i4p#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - RSS Help"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="ast7mfvumyba0eivv7qg9sobj9yv1dt1" class="crayons-icon"><title id="ast7mfvumyba0eivv7qg9sobj9yv1dt1">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> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="188627" data-content-user-id="164594"> <a href="/cguttweb/dotgrid-notebooks-2259" aria-labelledby="article-link-188627" class="crayons-story__hidden-navigation-link">dotgrid notebooks</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-188627" aria-controls="story-author-preview-content-188627" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-188627" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/dotgrid-notebooks-2259" class="crayons-story__tertiary fs-xs"><time datetime="2019-10-13T19:01:37Z">Oct 13 '19</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1570993297"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/dotgrid-notebooks-2259" data-preload-image="" id="article-link-188627"> dotgrid notebooks </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/development"><span class="crayons-tag__prefix">#</span>development</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(6, 255, 106, 0.10); --tag-prefix: #06ff6a; --tag-bg-hover: rgba(6, 255, 106, 0.10); --tag-prefix-hover: #06ff6a; " href="/t/design"><span class="crayons-tag__prefix">#</span>design</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/notes"><span class="crayons-tag__prefix">#</span>notes</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/dotgrid"><span class="crayons-tag__prefix">#</span>dotgrid</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/dotgrid-notebooks-2259" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="188627" aria-label="Add a comment to post - dotgrid notebooks"> <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/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">7<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/dotgrid-notebooks-2259#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - dotgrid notebooks"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a5tuw25swnvrnnep6exstfhvaaoe9egv" class="crayons-icon"><title id="a5tuw25swnvrnnep6exstfhvaaoe9egv">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> 1<span class="hidden s:inline"> comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> </div> </div> </div> </div> </div> <div class="crayons-story " data-feed-content-id="188523" data-content-user-id="164594"> <a href="/cguttweb/learning-javascript-and-vue-b33" aria-labelledby="article-link-188523" class="crayons-story__hidden-navigation-link">Learning JavaScript and Vue</a> <div class="crayons-story__body"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/cguttweb" class="crayons-avatar crayons-avatar--l "> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" alt="cguttweb profile" class="crayons-avatar__image" loading="lazy" /> </a> </div> <div> <div> <a href="/cguttweb" class="crayons-story__secondary fw-medium m:hidden"> Chloe </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> <button id="story-author-preview-trigger-188523" aria-controls="story-author-preview-content-188523" class="profile-preview-card__trigger fs-s p-1 -ml-1 -my-2 crayons-btn crayons-btn--ghost" aria-label="Chloe profile details"> Chloe </button> <div id="story-author-preview-content-188523" 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="/cguttweb" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media.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%2F164594%2F491d4044-8d2a-4a33-be1b-5af3ad666b17.png" class="crayons-avatar__image" alt="" loading="lazy" /> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Chloe</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":164594,"className":"User","name":"Chloe"}'> Follow </button> </div> <div class="author-preview-metadata-container" data-author-id="164594"></div> </div> </div> </div> </div> <a href="/cguttweb/learning-javascript-and-vue-b33" class="crayons-story__tertiary fs-xs"><time datetime="2019-10-13T14:01:26Z">Oct 13 '19</time><span class="time-ago-indicator-initial-placeholder" data-seconds="1570975286"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title"> <a href="/cguttweb/learning-javascript-and-vue-b33" data-preload-image="" id="article-link-188523"> Learning JavaScript and Vue </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(65, 184, 131, 0.10); --tag-prefix: #41b883; --tag-bg-hover: rgba(65, 184, 131, 0.10); --tag-prefix-hover: #41b883; " href="/t/vue"><span class="crayons-tag__prefix">#</span>vue</a> <a class="crayons-tag crayons-tag--monochrome " style=" --tag-bg: rgba(255, 102, 237, 0.10); --tag-prefix: #ff66ed; --tag-bg-hover: rgba(255, 102, 237, 0.10); --tag-prefix-hover: #ff66ed; " href="/t/learning"><span class="crayons-tag__prefix">#</span>learning</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> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="/cguttweb/learning-javascript-and-vue-b33" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left" data-reaction-count data-reactable-id="188523" aria-label="Add a comment to post - Learning JavaScript and Vue"> <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/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">33<span class="hidden s:inline"> reactions</span></span> </div> </a> <a href="/cguttweb/learning-javascript-and-vue-b33#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center" aria-label="Add a comment to post - Learning JavaScript and Vue"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" role="img" aria-labelledby="a467txjswuo9v7zn1eht3wixgulsz7yk" class="crayons-icon"><title id="a467txjswuo9v7zn1eht3wixgulsz7yk">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> 5<span class="hidden s:inline"> comments</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 2 min read </small> </div> </div> </div> </div> </div> <div class="placeholder-div"></div> </div> <div class="loading-articles" id="loading-articles"> loading... </div> </main> </div> </main> <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/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/profileDropdown-a171e1fd7174339f87bba9babc7a7d545bb24d5769c13609d763aaaeb74a5ba9.js" defer="defer"></script> <script src="https://assets.dev.to/assets/users/profilePage-1393cb4a2fea4e217cb2a2451f02d7a20ee01da60dc85f128f703631908dab09.js" defer="defer"></script> <script src="https://assets.dev.to/assets/localizeArticleDates-70147c5c6bfe350b42e020ebb2a3dd37419d83978982b5a67b6389119bf162ac.js" defer="defer"></script> <script src="https://assets.dev.to/assets/asyncUserStatusCheck-c38c3dcbc3fa64c8ff9e403434eabaf359c4957d3fb713784cc99144da5d5358.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"> <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/">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="DEV Community Home" href="/">DEV Community</a> — A constructive and inclusive social network for software developers. With you every step of your journey. </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="/++"> DEV++ </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/pod"> Podcasts </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/videos"> Videos </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="/help"> DEV Help </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="https://shop.forem.com/"> Forem Shop </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/advertise"> Advertise on DEV </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/challenges"> DEV Challenges </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/showcase"> DEV Showcase </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> <li class="footer__nav-link flex items-center"> <a href="/free-postgres-database-tier"> Free Postgres Database </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/guides"> Guides </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/software-comparisons"> Software comparisons </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>. DEV Community <span title="copyright">©</span> 2016 - 2024.</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="DEV Community" 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> </body> </html>

CINXE.COM

Chloe - DEV Community