CINXE.COM
DEV Online Hackathons and Writing Challenges - DEV Community
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>DEV Online Hackathons and Writing Challenges - DEV Community</title> <meta name="last-updated" content="2025-04-08 13:43:12 UTC"> <meta name="user-signed-in" content="false"> <meta name="head-cached-at" content="1744119792"> <meta name="environment" content="production"> <link rel="stylesheet" href="https://assets.dev.to/assets/minimal-6f5c5ed9c571b36ab9c316526d7032b5a4c789f3a4c35503492eb03376615fca.css" media="all" id="main-minimal-stylesheet" /> <link rel="stylesheet" href="https://assets.dev.to/assets/views-1c703342dce6eac414f19ca7fd07bcf83cbe44088659758144e52e7fa1e92dd3.css" media="all" id="main-views-stylesheet" /> <link rel="stylesheet" href="https://assets.dev.to/assets/crayons-0f2fc85bc159498f8ae6fba58c460e6deba863d02d59dfa994c1954976ddb6cc.css" media="all" id="main-crayons-stylesheet" /> <script src="https://assets.dev.to/assets/base-b8bdff515245fe895f3035d77697afb35d5d7e114bdf68291667479d4b289751.js" defer="defer"></script> <script src="https://assets.dev.to/assets/application-7258612fccf5d56314a6e4ad1898b4f818f474c4bb3485e302428d489a769a17.js" defer="defer"></script> <script src="https://assets.dev.to/assets/baseInitializers-b74902d56433062a87f5f1ce74769baf2a1a698772f46952b0ac72bc95c4abfd.js" defer="defer"></script> <script src="https://assets.dev.to/assets/baseTracking-b6bf73e5ee66633e151e7d5b7c6bbccedfa4c59e3615be97b98c4c0f543ddae7.js" defer="defer"></script> <meta name="search-script" content="https://assets.dev.to/assets/Search-7dcdad3172ab4501a4598fe8b716c7a88146e79fd42256d36fb1b83e27bf77cf.js"> <link rel="canonical" href="https://dev.to/challenges" /> <meta name="description" content="DEV Online Hackathons and Writing Challenges — DEV Community"> <meta name="keywords" content="software development, engineering, rails, javascript, ruby"> <meta property="og:type" content="article" /> <meta property="og:url" content="https://dev.to/challenges" /> <meta property="og:title" content="DEV Online Hackathons and Writing Challenges — DEV Community" /> <meta property="og:image" content="https://dev-to-uploads.s3.amazonaws.com/uploads/page/social_image/586/c313f76f-c2d2-40a8-901b-d8cd249ba800.png"> <meta property="og:description" content="Complete coding hackathons and writing challenges, earn DEV badges and special rewards, and share your expertise with the DEV Community!" /> <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:title" content="DEV Online Hackathons and Writing Challenges — DEV Community"> <meta name="twitter:description" content="Complete coding hackathons and writing challenges, earn DEV badges and special rewards, and share your expertise with the DEV Community!"> <meta name="twitter:image:src" content="https://dev-to-uploads.s3.amazonaws.com/uploads/page/social_image/586/c313f76f-c2d2-40a8-901b-d8cd249ba800.png"> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover"> <link rel="icon" type="image/x-icon" href="https://media2.dev.to/dynamic/image/width=32,height=,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%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="2025-04-07T20:36:49Z" data-latest-commit-id="64b51b416494e2398dbb49482c2354f1ebbbd896" data-ga-tracking="UA-71991109-1" data-cookie-banner-user-context="logged_out_only" data-cookie-banner-platform-context="off" data-algolia-id="PRSOBFP46H" data-algolia-search-key="9aa7d31610cba78851c9b1f63776a9dd" data-algolia-display="true" data-dynamic-url-component="bmar11" data-ga4-tracking-id="G-TYEM8Y3JN3"> <script> if (navigator.userAgent === 'ForemWebView/1' || window.frameElement) { document.body.classList.add("hidden-shell"); } </script> <link rel="stylesheet" href="https://assets.dev.to/assets/minimal-6f5c5ed9c571b36ab9c316526d7032b5a4c789f3a4c35503492eb03376615fca.css" media="all" id="secondary-minimal-stylesheet" /> <link rel="stylesheet" href="https://assets.dev.to/assets/views-1c703342dce6eac414f19ca7fd07bcf83cbe44088659758144e52e7fa1e92dd3.css" media="all" id="secondary-views-stylesheet" /> <link rel="stylesheet" href="https://assets.dev.to/assets/crayons-0f2fc85bc159498f8ae6fba58c460e6deba863d02d59dfa994c1954976ddb6cc.css" media="all" id="secondary-crayons-stylesheet" /> <div id="body-styles"> <style> :root { --accent-brand-lighter-rgb: 80, 99, 301; --accent-brand-rgb: 59, 73, 223; --accent-brand-darker-rgb: 47, 58, 178; } </style> </div> <div id="audiocontent" data-podcast=""> </div> <div class="navigation-progress" id="navigation-progress"></div> <header id="topbar" class="crayons-header topbar print-hidden"> <span id="route-change-target" tabindex="-1"></span> <a href="#main-content" class="skip-content-link">Skip to content</a> <div class="crayons-header__container"> <span class="inline-block m:hidden "> <button class="c-btn c-btn--icon-alone js-hamburger-trigger mx-2"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="arfenfol6e21jv732164lau6n8uv20j8" class="crayons-icon"><title id="arfenfol6e21jv732164lau6n8uv20j8">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="aj6qojpb3kzkibsvn3nji982vot19xyz" aria-hidden="true" class="crayons-icon"><title id="aj6qojpb3kzkibsvn3nji982vot19xyz">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="ad1781675svj6zqmki7omxfq5xl2mycx" aria-hidden="true" class="crayons-icon"><title id="ad1781675svj6zqmki7omxfq5xl2mycx">Search</title> <defs></defs><path class="cls-1" d="M250,0C113.38,0,2,110.16,.03,246.32c-2,138.29,110.19,252.87,248.49,253.67,42.71,.25,83.85-10.2,120.38-30.05,3.56-1.93,4.11-6.83,1.08-9.52l-23.39-20.74c-4.75-4.22-11.52-5.41-17.37-2.92-25.5,10.85-53.21,16.39-81.76,16.04-111.75-1.37-202.04-94.35-200.26-206.1,1.76-110.33,92.06-199.55,202.8-199.55h202.83V407.68l-115.08-102.25c-3.72-3.31-9.43-2.66-12.43,1.31-18.47,24.46-48.56,39.67-81.98,37.36-46.36-3.2-83.92-40.52-87.4-86.86-4.15-55.28,39.65-101.58,94.07-101.58,49.21,0,89.74,37.88,93.97,86.01,.38,4.28,2.31,8.28,5.53,11.13l29.97,26.57c3.4,3.01,8.8,1.17,9.63-3.3,2.16-11.55,2.92-23.6,2.07-35.95-4.83-70.39-61.84-127.01-132.26-131.35-80.73-4.98-148.23,58.18-150.37,137.35-2.09,77.15,61.12,143.66,138.28,145.36,32.21,.71,62.07-9.42,86.2-26.97l150.36,133.29c6.45,5.71,16.62,1.14,16.62-7.48V9.49C500,4.25,495.75,0,490.51,0H250Z"></path> </svg> Algolia </a> </div> </div> </form> </div> <div class="flex items-center h-100 ml-auto"> <div class="flex" id="authentication-top-nav-actions"> <span class="hidden m:block"> <a href="https://dev.to/enter" class="c-link c-link--block mr-2 whitespace-nowrap ml-auto" data-no-instant> Log in </a> </span> <a href="https://dev.to/enter?state=new-user" data-tracking-id="ca_top_nav" data-tracking-source="top_navbar" class="c-cta c-cta--branded whitespace-nowrap mr-2" data-no-instant> Create account </a> </div> </div> </div> </header> <div class="hamburger"> <div class="hamburger__content"> <header class="hamburger__content__header"> <h2 class="fs-l fw-bold flex-1 break-word lh-tight">DEV Community</h2> <button class="c-btn c-btn--icon-alone js-hamburger-trigger shrink-0" aria-label="Close"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" role="img" aria-labelledby="a174vrh3m3p4ep019tkn63bc4gl9299z" aria-hidden="true" class="crayons-icon c-btn__icon"><title id="a174vrh3m3p4ep019tkn63bc4gl9299z">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-show pageslug-challenges" 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> <script src="https://assets.dev.to/assets/homePage-11cb3cd42b25bc0cebb3d5fe6dee09d50f349acd6838a659d86686c1245669e2.js" defer="defer"></script> <main id="main-content"> <link data-no-instant id="pages-css" href="https://dev.to/page/assets_stylesheets_pages" rel="stylesheet"> <script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script> <style id="transition-reset"> .notransition *, .notransition *:before, .notransition *:after { transition: none !important; animation: none !important; } </style> <div id="custom" class="twp notransition tw-text-base tw-leading-normal tw-text-black dark:tw-text-zinc-50" data-no-instant> <script> // set tw dark theme when DEV dark theme detected if (document.body.classList.contains('dark-theme')) { document.getElementById('custom').classList.add('tw-dark') } function loadCss() { const cssLink = document.getElementById('pages-css'); const customElement = document.getElementById('custom'); // Hide the element initially customElement.style.visibility = 'hidden'; // Check if the stylesheet is already loaded if (cssLink.sheet) { customElement.style.visibility = 'visible'; customElement.classList.remove('notransition'); } else { // Add the load event listener cssLink.addEventListener('load', function () { customElement.style.visibility = 'visible'; customElement.classList.remove('notransition'); }); // Fallback to timeout setTimeout(() => { customElement.style.visibility = 'visible'; customElement.classList.remove('notransition'); }, 1000); } } if (typeof InstantClick !== "undefined") { InstantClick.on('change', () => { loadCss(); }); } else { loadCss(); } </script> <header class="tw-bg-white dark:tw-bg-black tw-flex tw-justify-center"> <img class="tw-w-full tw-max-w-screen-2xl tw-object-cover tw-max-h-[32rem] 2xl:tw-h-[32rem] dark:tw-hidden" src="https://media2.dev.to/dynamic/image/width=1500/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/oasodnteb2urktpbsnq2.png" alt="DEV Challenges" style="height: calc(100vw * 1323 / 4096);"> <img class="tw-w-full tw-max-w-screen-2xl tw-object-cover tw-max-h-[32rem] 2xl:tw-h-[32rem] tw-hidden dark:tw-block" src="https://media2.dev.to/dynamic/image/width=1500/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1dzir9u2ctefi0llet99.png" alt="DEV Challenges" style="height: calc(100vw * 1323 / 4096);"> </header> <div class="tw-bg-white dark:tw-bg-black"> <div class="tw-container xl:tw-max-w-6xl tw-m-auto tw-space-y-6 tw-p-2 md:tw-p-5"> <section class="tw-bg-white dark:tw-bg-black tw-w-full tw-space-y-8"> <h1 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold tw-text-4xl tw-leading-normal xl:tw-leading-normal"> Join a DEV Online Hackathon or Writing Challenge</h1> </section> <section class="tw-bg-white dark:tw-bg-black tw-w-full tw-space-y-8"> <div class="tw-flex tw-flex-col md:tw-flex-row tw-gap-4"> <div class="tw-bg-white dark:tw-bg-zinc-900 tw-border tw-border-zinc-300 tw-shadow-lg tw-rounded-md tw-p-4 tw-order-2 tw-space-y-4 tw-flex-grow" x-data> <h2 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold tw-text-3xl tw-leading-normal tw-mb-6"> Challenges Happening Now 👾</h2> <div class="tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4 "> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/pulumi"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Pulumi Deploy and Document Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">Automate, Secure, and Manage Everything You Run in the Cloud!</p> <div class="tw-space-y-4"> <p class="tw-text-black dark:tw-text-zinc-50 tw-font-medium tw-italic" x-text="challengeDays('Wed Mar 26 2025 16:00:00 GMT+0000 (Coordinated Universal Time)', 'Mon Apr 07 2025 06:59:59 GMT+0000 (Coordinated Universal Time)')"> Ends in -1 days </p> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> <div class="tw-rounded-full tw-px-4 tw-border tw-border-solid tw-border-dolphind tw-bg-dolphin tw-text-white tw-text-sm"> Live </div> <div class="tw-rounded-full tw-px-4 tw-border tw-border-solid tw-border-zinc-300 tw-text-sm"> Cash Prizes 🤑 </div> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/alibaba"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Alibaba Cloud Web Game Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">The possibilities are endless!</p> <div class="tw-space-y-4"> <p class="tw-text-black dark:tw-text-zinc-50 tw-font-medium tw-italic" x-text="challengeDays('Wed Apr 02 2025 16:00:00 GMT+0000 (Coordinated Universal Time)', 'Mon Apr 14 2025 06:59:59 GMT+0000 (Coordinated Universal Time)')"> Ends in 6 days </p> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> <div class="tw-rounded-full tw-px-4 tw-border tw-border-solid tw-border-dolphind tw-bg-dolphin tw-text-white tw-text-sm"> Live </div> <div class="tw-rounded-full tw-px-4 tw-border tw-border-solid tw-border-zinc-300 tw-text-sm"> Cash Prizes 🤑 </div> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> </div> </div> </div> </section> <section class="tw-bg-white dark:tw-bg-black tw-w-full tw-space-y-"> <div class="tw-flex tw-flex-col md:tw-flex-row tw-gap-4"> <div class="tw-bg-white dark:tw-bg-zinc-900 tw-space-y-4 tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-order-3"> <p class="tw-font-bold tw-text-black dark:tw-text-zinc-50">What are DEV Challenges? 🧠</p> <div class="content tw-max-w-3xl"><p>DEV Challenges are mini Hackathons that provide a fun opportunity for you to build up experience using new tools or to publicly show off your best skills to the community, potential employers and more.</p> </div> </div> <div class="tw-bg-white dark:tw-bg-zinc-900 tw-space-y-4 tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-order-3"> <p class="tw-font-bold tw-text-black dark:tw-text-zinc-50">Diamond Sponsor 💎</p> <div class="content tw-max-w-3xl">Thank you to our diamond sponsor <a href="https://neon.tech">Neon</a> for supporting our community challenges.</div> <a href="https://neon.tech"> <img class="tw-w-32 tw-rounded-md tw-mx-auto " src="https://billboards.forem.tools/rails/active_storage/blobs/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBbGNDIiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--81f4f05c27808f68c1e91590ff950026157d3fd0/Screenshot%202024-07-19%20at%2012.04.24%E2%80%AFPM.png" alt="neon logo"> </a> <div class="content tw-max-w-3xl">Neon is the official database partner of DEV and we hope you consider their service for any of your projects that need a database.</div> </div> </div> </section> <section class="tw-bg-white dark:tw-bg-black tw-w-full tw-space-y-4"> <div class="tw-flex tw-flex-col md:tw-flex-row tw-gap-4"> <div class="tw-bg-white dark:tw-bg-zinc-900 tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-space-y-4 md:tw-min-w-96 tw-flex-grow "> <h2 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold tw-text-3xl tw-leading-normal xl:tw-leading-normal tw-mb-6"> Challenges Launching Soon <em>- mark your calendars!</em> </h2> <p class="tw-italic"> More challenges coming soon!</p> </div> </div> </section> <section class="tw-bg-white dark:tw-bg-black tw-w-full tw-space-y-4"> <div class="tw-flex tw-flex-col md:tw-flex-row tw-gap-4 tw-basis-auto tw-w-full"> <div class="tw-bg-white dark:tw-bg-zinc-900 tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-space-y-4 tw-w-full"> <h2 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold tw-text-2xl tw-leading-normal xl:tw-leading-normal"> Previous Challenges </h2> <div class="tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4"> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/frontend-2024-03-20"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Frontend Challenge v24.03.20</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the CSS Art Challenge, Glam Up My Markup and One Byte Explainer prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/cloudflare"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Cloudflare AI Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Build a Workers AI Application prompt</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/frontend-2024-04-17"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Frontend Challenge v24.04.17</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the CSS Art: Earth Day and Glam Up My Markup: Earth Day Celebration Landing Page prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/coze"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Coze AI Bot Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Bot Innovator and Coze Trailblazer prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/netlify"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Netlify Dynamic Site Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Visual Feast, Build with Blobs and Clever Caching prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/aws"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">The AWS Amplify Fullstack Typescript Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Build and Deploy a Fullstack Application with AWS Amplify Gen 2 prompt</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/frontend-2024-05-29"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Frontend Challenge v24.05.29</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the CSS Art: June and Glam Up My Markup: Beaches prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/cs"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Computer Science Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the One Byte Explainer prompt</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/twilio"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Twilio Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Build an AI-driven Experience that Leverages Twilio prompt</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/wix-2024-06-26"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Wix Studio Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Build an Innovative eCommerce Experience with Wix Studio prompt</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/stellar"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Build Better on Stellar: Smart Contract Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Build a dApp and Create a Tutorial prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/frontend-2024-07-24"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Frontend Challenge v24.07.24</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the CSS Art: Favorite Recreation and Glam Up My Markup: Cricket League! prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/nylas"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Nylas AI and Communications Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the AI Expedition 🚀 and Galaxy Brain 💫 prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/neon"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Neon OSS Starter Kit Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Ultimate Open Source Starter Kit prompt</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/frontend-2024-09-04"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Frontend Challenge v24.09.04</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the CSS Art: Space and Glam Up My Markup: Solar System prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/webgame"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Web Game Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Build a Web Game: Aliens and One Byte Explainer prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/hacktoberfest"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Hacktoberfest Writing Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Maintainer Experience and Contributor Experience prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/pinata"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Pinata Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Fun with Files prompt</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/wix-2024-10-16"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Wix Studio Challenge: Community Edition</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Build Your Dream Community Platform prompt</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/pgai"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">The Open Source AI Challenge with pgai and Ollama</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Build an AI application prompt</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/assemblyai"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">AssemblyAI Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Sophisticated Speech-to-text , Really Rad Real-Time and No More Monkey Business prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/devcycle"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">DevCycle Feature Flag Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Feature Flag Funhouse 🎉 prompt</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/frontend-2024-12-04"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Frontend Challenge: December Edition</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the CSS Art: December and Glam Up My Markup: Winter Solstice prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/brightdata"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Bright Data Web Scraping Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Scrape Data from Complex, Interactive Websites, Build a Web Scraper API to Solve Business Problems and Most Creative Use of Web Data for AI Models prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/newyear"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">2025 New Year Writing challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Retro’ing and Debugging 2024 , Compiling 2025 and Predicting 2025 prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/github"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">GitHub Copilot 1-Day Build Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the New Beginnings, Fresh Starts and Transitions and Transformations prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/agentai"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Agent.ai Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the Full-Stack Agent, Productivity-Pro Agent and Assembly of Agents prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/frontend-2025-02-12"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Frontend Challenge: February Edition</h4> <p class="tw-text-black dark:tw-text-zinc-50">See the winners from the CSS Art: February and Glam Up My Markup: Love Language Discovery prompts</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/writing-2025-02-26"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">Future Writing Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">Winners announced soon!</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/wecoded"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">2025 WeCoded Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">Winners announced soon!</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> <a class="tw-flex tw-flex-col tw-justify-between tw-border tw-border-zinc-300 tw-rounded-md tw-p-4 tw-gap-4 hover:tw-border-dolphin tw-group tw-duration-300 tw-w-full tw-flex-grow" href="https://dev.to/challenges/kendoreact"> <h4 class="tw-text-black dark:tw-text-zinc-50 tw-font-bold group-hover:tw-text-dolphin tw-duration-300">KendoReact Free Components Challenge</h4> <p class="tw-text-black dark:tw-text-zinc-50">Winners announced soon!</p> <div class="tw-space-y-4"> <div class="tw-flex tw-w-full tw-justify-between tw-place-self-end tw-text-zinc-700 tw-duration-300"> <div class="tw-flex tw-gap-2"> </div> <svg class="tw-w-6 group-hover:tw-text-dolphin" viewBox="0 0 19 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M15.171 9.49897L0.498914 9.49891L0.500003 7.5L9.08455 7.49892L15.1703 7.49857L9.80686 2.13517L11.2211 0.720952L18.9992 8.49913L11.2211 16.2773L9.80686 14.8631L15.171 9.49897Z" fill="currentColor" ></path> </svg> </div> </div> </a> </div> </div> </div> </section> <script> // how many days in the future is b to a function daysInFuture(a, b) { const ONE_DAY_IN_MILLISECONDS = 24 * 60 * 60 * 1000; // Number of milliseconds in a day const dateA = new Date(a).setHours(0, 0, 0, 0); // Date A at midnight const dateB = new Date(b).setHours(0, 0, 0, 0); // Date B at midnight const diffInMillis = dateB - dateA; const diffInDays = Math.round(diffInMillis / ONE_DAY_IN_MILLISECONDS); return diffInDays; } if (typeof module !== 'undefined' && module.exports) { module.exports = { daysInFuture }; } function challengeDays(date_start, date_submissions_due) { const now = new Date(); const days_till_start = daysInFuture(now, date_start); const days_till_end = daysInFuture(now, date_submissions_due); let days = ""; if (days_till_start <= 0) { console.log("less") console.log(date_start >= now) if (new Date(date_start) > now) { console.log("today") days = "Starts today" } else if (days_till_end === 0) { days = "Ends today at 11:59 PM PT" } else if (days_till_end === 1) { days = "Ends tomorrow" } else { days = `Ends in ${days_till_end} days` } } else if (days_till_start === 1) { days = "Starts tomorrow" } else { days = `Starts in ${days_till_start} days` } return days; } </script> </div> </div> </div> </main> <div class="js-billboard-container pb-4 crayons-layout__comments-billboard" data-async-url="/bmar11/page_fixed_bottom?page_id=586"></div> <script src="https://assets.dev.to/assets/billboard-818c196f17931002334ea0a9f5a2abea9e2afb2d59259a9b9102ffb07206df72.js" defer="defer"></script> <div id="runtime-banner-container"></div> </div> </div> <footer id="footer" class="crayons-footer print-hidden"> <div id="footer-container" class="crayons-footer__container"> <style> .long-bb-body { max-height: calc(100vh - 200px); overflow: hidden; } .long-bb-bottom { height: 180px; background: linear-gradient(to top, var(--card-bg), transparent); margin-top: -180px; position:relative; z-index: 5; } </style> <div style="" data-display-unit data-id="146443" data-category-click="click" data-category-impression="impression" data-context-type="home" data-special="nothing" data-article-id="" data-type-of="in_house"> <p style="font-weight: bold;margin-bottom: 10px"> Thank you to our Diamond Sponsor <a href="https://neon.tech/?bb=146443">Neon</a> for supporting our community. </p> </div> <p class="fs-s crayons-footer__description"> <a class="c-link c-link--branded fw-medium" aria-label="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="/tags"> Tags </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/about"> About </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/contact"> Contact </a> <span class="dot ml-2"></span> </li> </ul> <ul class="footer__nav-links flex gap-2 justify-center flex-wrap fs-s p-0" style="" /> <li class="footer__nav-link flex items-center"> <a href="/code-of-conduct"> Code of Conduct </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/privacy"> Privacy Policy </a> <span class="dot ml-2"></span> </li> <li class="footer__nav-link flex items-center"> <a href="/terms"> Terms of use </a> <span class="dot ml-2"></span> </li> </ul> <div class="fs-s"> <p>Built on <a class="c-link c-link--branded" target="_blank" rel="noopener" href="https://www.forem.com">Forem</a> — the <a target="_blank" rel="noopener" class="c-link c-link--branded" href="https://dev.to/t/opensource">open source</a> software that powers <a target="_blank" rel="noopener" class="c-link c-link--branded" href="https://dev.to">DEV</a> and other inclusive communities.</p> <p>Made with love and <a target="_blank" rel="noopener" class="c-link c-link--branded" href="https://dev.to/t/rails">Ruby on Rails</a>. DEV Community <span title="copyright">©</span> 2016 - 2025.</p> </div> </div> </footer> <div id="snack-zone"></div> <div id="global-signup-modal" class="authentication-modal hidden"> <div class="authentication-modal__container"> <figure class="authentication-modal__image-container"> <img class="authentication-modal__image" src="https://media2.dev.to/dynamic/image/width=190,height=,fit=scale-down,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8j7kvp660rqzt99zui8e.png" alt="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> <script> var userSignedIn = false; if (document.readyState === 'complete' || document.readyState === 'interactive') { initAuth(); } else { document.addEventListener('DOMContentLoaded', initAuth); } function initAuth() { var paramToken = new URLSearchParams(window.location.search).get('jwt'); if (paramToken && !userSignedIn) { authenticateUser(paramToken); } else { var iframe = document.createElement('iframe'); iframe.style.display = 'none'; iframe.src = 'https://forem.com/auth_pass/iframe'; document.body.appendChild(iframe); window.addEventListener('message', function(event) { if (event.origin !== 'https://forem.com' && event.origin !== window.location.origin) { return; } var data = event.data; if (data.authenticated && !userSignedIn) { authenticateUser(data.token); } else if(data.authenticated && window.ReactNativeWebView && window.ReactNativeWebView.postMessage) { window.ReactNativeWebView.postMessage(JSON.stringify({ action: 'login', token: data.token, })); } }); } function authenticateUser(token) { fetch('/auth_pass/token_login', { method: 'POST', credentials: 'include', headers: { 'Content-Type': 'application/json', 'X-CSRF-Token': getMetaContent('csrf-token'), }, body: JSON.stringify({ token: token }), }) .then(function(response) { return response.json(); }) .then(function(data) { if (data.success) { if (document.head.querySelector('meta[name="user-signed-in"][content="false"]')) { // Reload the page to update the user's state location.reload(); } } }) .catch(function(error) { console.error('Error during authentication:', error); }); } function getMetaContent(name) { var element = document.querySelector('meta[name="' + name + '"]'); return element ? element.getAttribute('content') : ''; } } </script> </body> </html>