The latest articles on DEV Community by Ruhi Chaudhari (@ruhichaudhari6). https://dev.to/ruhichaudhari6 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4155657%2F06d6960e-bd8c-4cf9-9731-e96b13cb326e.png https://dev.to/ruhichaudhari6 en Ruhi Chaudhari Sat, 10 Oct 2026 17:11:06 +0000 https://dev.to/ruhichaudhari6/walkcast-screen-free-audio-digest-for-outdoor-walks-f23 https://dev.to/ruhichaudhari6/walkcast-screen-free-audio-digest-for-outdoor-walks-f23 <p><em>This is a submission for the <a href="https://dev.to/challenges/hacktoberfest-week1-2026-10-05">Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass</a></em></p> <h2> What I Built </h2> <p><strong>WalkCast</strong> is a 100% offline, screen-minimizing audio web app that ingests long-form articles, tech news, and newsletters, converting them into a warm, conversational podcast script.</p> <p>Instead of staring at a smartphone screen while walking outside, WalkCast turns reading lists into an audio digest. Users can hit generate, put their phone in their pocket, keep their eyes on the road, and catch up on content during a 20-minute daily walk.</p> <h2> Demo </h2> <p>Because WalkCast is designed as a privacy-first, offline tool powered by local Llama 3.2 inference, it runs locally on the user's browser without a hosted backend.</p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code> html &lt;!-- Simply open walkcast.html in any browser with local Ollama running --&gt; ## Code // Fetch conversational podcast script from local Llama 3.2 instance const response = await fetch('http://localhost:11434/api/generate', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ model: 'llama3.2', prompt: `Convert this article into a warm, conversational 1-minute podcast summary for a walk: ${articleText}`, stream: false, options: { num_predict: 150 } }) }); // Play back using native browser SpeechSynthesis at walking speed (0.95x) const utterance = new SpeechSynthesisUtterance(scriptText); utterance.rate = 0.95; window.speechSynthesis.speak(utterance); ## How I Built It Local Inference: Meta's Llama 3.2 (3B) model running locally via Ollama. Audio Synthesis: Browser-native SpeechSynthesis API tuned to 0.95x pacing to match a relaxing walking cadence. Neighborhood UI: Designed with a cozy, storybook street aesthetic matching the theme of stepping outside and touching grass. ## Why Does Open Innovation Matter? Screen Minimization &amp; Health: Shifts content consumption from visual screens to audio, reducing eye strain and increasing pedestrian awareness while walking outdoors. Complete Privacy: Personal reading lists and newsletters never leave your machine or get sent to third-party ad networks. Zero Cost &amp; Offline: Works without cloud API subscriptions or cellular data reliance while out on trails or neighborhood routes. </code></pre> </div> devchallenge opensource hf26challenge Ruhi Chaudhari Sat, 10 Oct 2026 16:56:33 +0000 https://dev.to/ruhichaudhari6/walkcast-25hh https://dev.to/ruhichaudhari6/walkcast-25hh <p><em>This is a submission for the <a href="https://dev.to/challenges/hacktoberfest-weekend-2026-10-01">Hacktoberfest Weekend Challenge: Build for a Friend</a></em></p> <h1> WalkCast — Screen-Free Open-Source Audio Digest for Daily Walks </h1> <h2> What I Built </h2> <p><strong>WalkCast</strong> is a 100% local, privacy-first audio conversion application designed to turn dense online articles, newsletters, and news updates into warm, conversational podcast episodes. </p> <p>Instead of forcing users to scroll through long web pages on their smartphones during their daily commute or walk, WalkCast uses local AI to transform screen-heavy text into an eyes-free audio companion. You generate your digest, put your phone in your pocket, and keep your eyes on the road.</p> <p>I built this for a friend who suffers from screen-induced eye strain and wanted a way to stay caught up on industry newsletters during their evening 20-minute neighborhood walk.</p> <h2> What My Friend Said </h2> <blockquote> <p><em>"Being able to catch up on my tech newsletters while walking outside without staring at a screen has completely changed my evening routine. My eyes finally get a break!"</em></p> </blockquote> <h2> Demo </h2> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/upload-your-screenshot-here.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/upload-your-screenshot-here.png" alt="WalkCast Interface" width="800" height="400"></a><br> <a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F5f0vbk8utzzzxb4qw5u3.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F5f0vbk8utzzzxb4qw5u3.png" alt=" " width="800" height="396"></a></p> <p><em>(Run <code>index.html</code> locally in any browser with Ollama running in the background).</em></p> <h2> Code </h2> <p>Here is the lightweight single-file implementation (<code>index.html</code>):</p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code> html &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;WalkCast — Screen-Free Audio Digest&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;!-- Local Llama 3.2 + Web SpeechSynthesis Pipeline --&gt; &lt;!-- See complete source code in repository --&gt; &lt;/body&gt; &lt;/html&gt;*This is a submission for the [Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass](https://dev.to/challenges/hacktoberfest-week1-2026-10-05)* ## What I Built &lt;!-- What does it do, and how does it get people off the screen and into the world? Who is it for? --&gt; ## Demo &lt;!-- Share a deployed link or a video demo. --&gt; ## Code &lt;!-- Show us the code! You can embed a GitHub repo directly into your post. --&gt; ## How I Built It &lt;!-- Which open-source AI did you use (open-weight models, agent harnesses, frameworks, local inference), and how is your project built around it? --&gt; ## Why Does Open Innovation Matter? &lt;!-- Why does open innovation matter for what you built? What did it make possible that a closed API wouldn't? --&gt; </code></pre> </div> devchallenge hf26challenge Ruhi Chaudhari Sun, 04 Oct 2026 19:49:40 +0000 https://dev.to/ruhichaudhari6/focusbuddy-offline-open-source-ai-task-chunker-for-executive-dysfunction-1p4b https://dev.to/ruhichaudhari6/focusbuddy-offline-open-source-ai-task-chunker-for-executive-dysfunction-1p4b <p><em>This is a submission for the <a href="https://dev.to/challenges/hacktoberfest-weekend-2026-10-01">Hacktoberfest Weekend Challenge: Build for a Friend</a></em></p> <h2> What I Built </h2> <p>FocusBuddy is a 100% offline, privacy-first task decomposer designed to help individuals dealing with ADHD or executive dysfunction. When facing overwhelming projects—such as "make notes on certain topics of DBMS"—FocusBuddy uses local open-source AI to break the goal into bite-sized, 5-minute micro-steps. It presents these steps strictly one at a time to eliminate overthinking and cognitive overload.</p> <p>I built this for a friend who frequently experiences task paralysis when starting large academic projects. What they said after testing it:</p> <blockquote> <p><em>"Seeing only one step at a time stopped me from overthinking and helped me actually start studying without feeling overwhelmed!"</em></p> </blockquote> <h2> Demo </h2> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/upload-your-screenshot-here.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/upload-your-screenshot-here.png" alt="FocusBuddy UI Interface" width="800" height="400"></a><br> <em>(Run <code>index.html</code> in any browser while Ollama is running locally).</em></p> <h2> Code </h2> <p>Here is the complete source code (<code>index.html</code>) used to build the local frontend:<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight html"><code><span class="cp">&lt;!DOCTYPE html&gt;</span> <span class="nt">&lt;html</span> <span class="na">lang=</span><span class="s">"en"</span><span class="nt">&gt;</span> <span class="nt">&lt;head&gt;</span> <span class="nt">&lt;meta</span> <span class="na">charset=</span><span class="s">"UTF-8"</span><span class="nt">&gt;</span> <span class="nt">&lt;title&gt;</span>FocusBuddy<span class="nt">&lt;/title&gt;</span> <span class="nt">&lt;style&gt;</span> <span class="nt">body</span> <span class="p">{</span> <span class="nl">font-family</span><span class="p">:</span> <span class="n">Arial</span><span class="p">,</span> <span class="nb">sans-serif</span><span class="p">;</span> <span class="nl">max-width</span><span class="p">:</span> <span class="m">600px</span><span class="p">;</span> <span class="nl">margin</span><span class="p">:</span> <span class="m">50px</span> <span class="nb">auto</span><span class="p">;</span> <span class="nl">padding</span><span class="p">:</span> <span class="m">20px</span><span class="p">;</span> <span class="nl">background</span><span class="p">:</span> <span class="m">#0f172a</span><span class="p">;</span> <span class="nl">color</span><span class="p">:</span> <span class="m">#f8fafc</span><span class="p">;</span> <span class="p">}</span> <span class="nt">input</span><span class="o">,</span> <span class="nt">button</span> <span class="p">{</span> <span class="nl">padding</span><span class="p">:</span> <span class="m">12px</span><span class="p">;</span> <span class="nl">font-size</span><span class="p">:</span> <span class="m">16px</span><span class="p">;</span> <span class="nl">margin-top</span><span class="p">:</span> <span class="m">10px</span><span class="p">;</span> <span class="nl">width</span><span class="p">:</span> <span class="m">100%</span><span class="p">;</span> <span class="nl">border-radius</span><span class="p">:</span> <span class="m">8px</span><span class="p">;</span> <span class="nl">box-sizing</span><span class="p">:</span> <span class="n">border-box</span><span class="p">;</span> <span class="nl">border</span><span class="p">:</span> <span class="nb">none</span><span class="p">;</span> <span class="p">}</span> <span class="nt">input</span> <span class="p">{</span> <span class="nl">background</span><span class="p">:</span> <span class="m">#1e293b</span><span class="p">;</span> <span class="nl">color</span><span class="p">:</span> <span class="m">#fff</span><span class="p">;</span> <span class="nl">border</span><span class="p">:</span> <span class="m">1px</span> <span class="nb">solid</span> <span class="m">#334155</span><span class="p">;</span> <span class="p">}</span> <span class="nt">button</span> <span class="p">{</span> <span class="nl">background</span><span class="p">:</span> <span class="m">#2563eb</span><span class="p">;</span> <span class="nl">color</span><span class="p">:</span> <span class="no">white</span><span class="p">;</span> <span class="nl">cursor</span><span class="p">:</span> <span class="nb">pointer</span><span class="p">;</span> <span class="nl">font-weight</span><span class="p">:</span> <span class="nb">bold</span><span class="p">;</span> <span class="p">}</span> <span class="nt">button</span><span class="nd">:hover</span> <span class="p">{</span> <span class="nl">background</span><span class="p">:</span> <span class="m">#1d4ed8</span><span class="p">;</span> <span class="p">}</span> <span class="nc">.step-box</span> <span class="p">{</span> <span class="nl">background</span><span class="p">:</span> <span class="m">#1e293b</span><span class="p">;</span> <span class="nl">padding</span><span class="p">:</span> <span class="m">20px</span><span class="p">;</span> <span class="nl">border-radius</span><span class="p">:</span> <span class="m">8px</span><span class="p">;</span> <span class="nl">margin-top</span><span class="p">:</span> <span class="m">20px</span><span class="p">;</span> <span class="nl">border-left</span><span class="p">:</span> <span class="m">5px</span> <span class="nb">solid</span> <span class="m">#3b82f6</span><span class="p">;</span> <span class="p">}</span> <span class="nc">.hidden</span> <span class="p">{</span> <span class="nl">display</span><span class="p">:</span> <span class="nb">none</span><span class="p">;</span> <span class="p">}</span> <span class="nc">.btn-group</span> <span class="p">{</span> <span class="nl">display</span><span class="p">:</span> <span class="n">flex</span><span class="p">;</span> <span class="py">gap</span><span class="p">:</span> <span class="m">10px</span><span class="p">;</span> <span class="nl">margin-top</span><span class="p">:</span> <span class="m">15px</span><span class="p">;</span> <span class="p">}</span> <span class="nt">&lt;/style&gt;</span> <span class="nt">&lt;/head&gt;</span> <span class="nt">&lt;body&gt;</span> <span class="nt">&lt;h1&gt;</span>⚡ FocusBuddy<span class="nt">&lt;/h1&gt;</span> <span class="nt">&lt;p&gt;</span>Your offline, low-pressure task chunker.<span class="nt">&lt;/p&gt;</span> <span class="nt">&lt;div</span> <span class="na">id=</span><span class="s">"input-section"</span><span class="nt">&gt;</span> <span class="nt">&lt;input</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">id=</span><span class="s">"taskInput"</span> <span class="na">placeholder=</span><span class="s">"What task feels overwhelming? (e.g., Clean my desk)"</span><span class="nt">&gt;</span> <span class="nt">&lt;button</span> <span class="na">onclick=</span><span class="s">"breakDownTask()"</span><span class="nt">&gt;</span>Break It Down 🚀<span class="nt">&lt;/button&gt;</span> <span class="nt">&lt;/div&gt;</span> <span class="nt">&lt;div</span> <span class="na">id=</span><span class="s">"loading"</span> <span class="na">class=</span><span class="s">"hidden"</span> <span class="na">style=</span><span class="s">"margin-top:20px;"</span><span class="nt">&gt;</span>⏳ Breaking task into micro-steps...<span class="nt">&lt;/div&gt;</span> <span class="nt">&lt;div</span> <span class="na">id=</span><span class="s">"step-section"</span> <span class="na">class=</span><span class="s">"hidden"</span><span class="nt">&gt;</span> <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"step-box"</span><span class="nt">&gt;</span> <span class="nt">&lt;h3</span> <span class="na">id=</span><span class="s">"stepHeader"</span><span class="nt">&gt;</span>Step 1<span class="nt">&lt;/h3&gt;</span> <span class="nt">&lt;p</span> <span class="na">id=</span><span class="s">"stepText"</span> <span class="na">style=</span><span class="s">"font-size: 18px; line-height: 1.5;"</span><span class="nt">&gt;&lt;/p&gt;</span> <span class="nt">&lt;/div&gt;</span> <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"btn-group"</span><span class="nt">&gt;</span> <span class="nt">&lt;button</span> <span class="na">onclick=</span><span class="s">"prevStep()"</span><span class="nt">&gt;</span>⬅️ Previous<span class="nt">&lt;/button&gt;</span> <span class="nt">&lt;button</span> <span class="na">onclick=</span><span class="s">"nextStep()"</span><span class="nt">&gt;</span>Next ➡️<span class="nt">&lt;/button&gt;</span> <span class="nt">&lt;/div&gt;</span> <span class="nt">&lt;/div&gt;</span> <span class="nt">&lt;script&gt;</span> <span class="kd">let</span> <span class="nx">steps</span> <span class="o">=</span> <span class="p">[];</span> <span class="kd">let</span> <span class="nx">currentStep</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="k">async</span> <span class="kd">function</span> <span class="nf">breakDownTask</span><span class="p">()</span> <span class="p">{</span> <span class="kd">const</span> <span class="nx">task</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nf">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">taskInput</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span><span class="p">;</span> <span class="k">if </span><span class="p">(</span><span class="o">!</span><span class="nx">task</span><span class="p">.</span><span class="nf">trim</span><span class="p">())</span> <span class="k">return</span><span class="p">;</span> <span class="nb">document</span><span class="p">.</span><span class="nf">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">loading</span><span class="dl">'</span><span class="p">).</span><span class="nx">classList</span><span class="p">.</span><span class="nf">remove</span><span class="p">(</span><span class="dl">'</span><span class="s1">hidden</span><span class="dl">'</span><span class="p">);</span> <span class="nb">document</span><span class="p">.</span><span class="nf">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">step-section</span><span class="dl">'</span><span class="p">).</span><span class="nx">classList</span><span class="p">.</span><span class="nf">add</span><span class="p">(</span><span class="dl">'</span><span class="s1">hidden</span><span class="dl">'</span><span class="p">);</span> <span class="kd">const</span> <span class="nx">prompt</span> <span class="o">=</span> <span class="s2">`Break down the task "</span><span class="p">${</span><span class="nx">task</span><span class="p">}</span><span class="s2">" into 4 to 6 bite-sized, 5-minute micro-steps. Return ONLY a valid JSON array of strings, like ["Step 1 text", "Step 2 text"]. Do not include markdown or commentary.`</span><span class="p">;</span> <span class="k">try</span> <span class="p">{</span> <span class="kd">const</span> <span class="nx">response</span> <span class="o">=</span> <span class="k">await</span> <span class="nf">fetch</span><span class="p">(</span><span class="dl">'</span><span class="s1">http://localhost:11434/api/generate</span><span class="dl">'</span><span class="p">,</span> <span class="p">{</span> <span class="na">method</span><span class="p">:</span> <span class="dl">'</span><span class="s1">POST</span><span class="dl">'</span><span class="p">,</span> <span class="na">headers</span><span class="p">:</span> <span class="p">{</span> <span class="dl">'</span><span class="s1">Content-Type</span><span class="dl">'</span><span class="p">:</span> <span class="dl">'</span><span class="s1">application/json</span><span class="dl">'</span> <span class="p">},</span> <span class="na">body</span><span class="p">:</span> <span class="nx">JSON</span><span class="p">.</span><span class="nf">stringify</span><span class="p">({</span> <span class="na">model</span><span class="p">:</span> <span class="dl">'</span><span class="s1">llama3.2</span><span class="dl">'</span><span class="p">,</span> <span class="na">prompt</span><span class="p">:</span> <span class="nx">prompt</span><span class="p">,</span> <span class="na">stream</span><span class="p">:</span> <span class="kc">false</span> <span class="p">})</span> <span class="p">});</span> <span class="kd">const</span> <span class="nx">data</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">response</span><span class="p">.</span><span class="nf">json</span><span class="p">();</span> <span class="kd">let</span> <span class="nx">text</span> <span class="o">=</span> <span class="nx">data</span><span class="p">.</span><span class="nx">response</span><span class="p">.</span><span class="nf">trim</span><span class="p">();</span> <span class="k">if </span><span class="p">(</span><span class="nx">text</span><span class="p">.</span><span class="nf">includes</span><span class="p">(</span><span class="dl">'</span><span class="s1">``` </span><span class="dl">'</span><span class="p">))</span> <span class="p">{</span> <span class="nx">text</span> <span class="o">=</span> <span class="nx">text</span><span class="p">.</span><span class="nf">replace</span><span class="p">(</span><span class="sr">/</span><span class="err"> </span><span class="p">{</span><span class="o">%</span> <span class="nx">raw</span> <span class="o">%</span><span class="p">}</span> <span class="s2">```json|```</span> <span class="p">{</span><span class="o">%</span> <span class="nx">endraw</span> <span class="o">%</span><span class="p">}</span> <span class="sr">/g, ''</span><span class="se">)</span><span class="sr">.trim</span><span class="se">()</span><span class="err">; </span> <span class="p">}</span> <span class="nx">steps</span> <span class="o">=</span> <span class="nx">JSON</span><span class="p">.</span><span class="nf">parse</span><span class="p">(</span><span class="nx">text</span><span class="p">);</span> <span class="nx">currentStep</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="nf">showStep</span><span class="p">();</span> <span class="p">}</span> <span class="k">catch </span><span class="p">(</span><span class="nx">err</span><span class="p">)</span> <span class="p">{</span> <span class="nf">alert</span><span class="p">(</span><span class="dl">'</span><span class="s1">Error connecting to Ollama. Make sure Ollama is running in the background!</span><span class="dl">'</span><span class="p">);</span> <span class="p">}</span> <span class="k">finally</span> <span class="p">{</span> <span class="nb">document</span><span class="p">.</span><span class="nf">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">loading</span><span class="dl">'</span><span class="p">).</span><span class="nx">classList</span><span class="p">.</span><span class="nf">add</span><span class="p">(</span><span class="dl">'</span><span class="s1">hidden</span><span class="dl">'</span><span class="p">);</span> <span class="p">}</span> <span class="p">}</span> <span class="kd">function</span> <span class="nf">showStep</span><span class="p">()</span> <span class="p">{</span> <span class="k">if </span><span class="p">(</span><span class="nx">steps</span><span class="p">.</span><span class="nx">length</span> <span class="o">===</span> <span class="mi">0</span><span class="p">)</span> <span class="k">return</span><span class="p">;</span> <span class="nb">document</span><span class="p">.</span><span class="nf">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">step-section</span><span class="dl">'</span><span class="p">).</span><span class="nx">classList</span><span class="p">.</span><span class="nf">remove</span><span class="p">(</span><span class="dl">'</span><span class="s1">hidden</span><span class="dl">'</span><span class="p">);</span> <span class="nb">document</span><span class="p">.</span><span class="nf">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">stepHeader</span><span class="dl">'</span><span class="p">).</span><span class="nx">innerText</span> <span class="o">=</span> <span class="p">{</span><span class="o">%</span> <span class="nx">raw</span> <span class="o">%</span><span class="p">}</span><span class="s2">`Step </span><span class="p">${</span><span class="nx">currentStep</span> <span class="o">+</span> <span class="mi">1</span><span class="p">}</span><span class="s2"> of </span><span class="p">${</span><span class="nx">steps</span><span class="p">.</span><span class="nx">length</span><span class="p">}</span><span class="s2">`</span><span class="p">{</span><span class="o">%</span> <span class="nx">endraw</span> <span class="o">%</span><span class="p">};</span> <span class="nb">document</span><span class="p">.</span><span class="nf">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">stepText</span><span class="dl">'</span><span class="p">).</span><span class="nx">innerText</span> <span class="o">=</span> <span class="nx">steps</span><span class="p">[</span><span class="nx">currentStep</span><span class="p">];</span> <span class="p">}</span> <span class="kd">function</span> <span class="nf">nextStep</span><span class="p">()</span> <span class="p">{</span> <span class="k">if</span> <span class="p">(</span><span class="nx">currentStep</span> <span class="o">&lt;</span> <span class="nx">steps</span><span class="p">.</span><span class="nx">length</span> <span class="o">-</span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span> <span class="nx">currentStep</span><span class="o">++</span><span class="p">;</span> <span class="nf">showStep</span><span class="p">();</span> <span class="p">}</span> <span class="k">else</span> <span class="p">{</span> <span class="nf">alert</span><span class="p">(</span><span class="dl">'</span><span class="s1">🎉 Amazing work! You completed all the steps.</span><span class="dl">'</span><span class="p">);</span> <span class="p">}</span> <span class="p">}</span> <span class="kd">function</span> <span class="nf">prevStep</span><span class="p">()</span> <span class="p">{</span> <span class="k">if </span><span class="p">(</span><span class="nx">currentStep</span> <span class="o">&gt;</span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span> <span class="nx">currentStep</span><span class="o">--</span><span class="p">;</span> <span class="nf">showStep</span><span class="p">();</span> <span class="p">}</span> <span class="p">}</span> <span class="nt">&lt;/script&gt;</span> <span class="nt">&lt;/body&gt;</span> <span class="nt">&lt;/html&gt;</span> </code></pre> </div> devchallenge weekendchallenge hf26challenge