<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: EthanDotLog</title>
    <description>The latest articles on DEV Community by EthanDotLog (@ethandotlog).</description>
    <link>https://dev.to/ethandotlog</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1288806%2Fdf80d648-f918-4322-94c2-fecb8eedd58b.jpg</url>
      <title>DEV Community: EthanDotLog</title>
      <link>https://dev.to/ethandotlog</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/ethandotlog"/>
    <language>en</language>
    <item>
      <title>Level Up Your Code with Quokka: Instant Feedback for JavaScript Ninjas!</title>
      <dc:creator>EthanDotLog</dc:creator>
      <pubDate>Sat, 13 Apr 2024 03:08:53 +0000</pubDate>
      <link>https://dev.to/ethandotlog/level-up-your-code-with-quokka-instant-feedback-for-javascript-ninjas-38p</link>
      <guid>https://dev.to/ethandotlog/level-up-your-code-with-quokka-instant-feedback-for-javascript-ninjas-38p</guid>
      <description>&lt;p&gt;Calling all JavaScript warriors! Ever coded like a boss only to be blindsided by a sneaky syntax error? Or maybe you spend ages staring at console.logs, trying to decipher your code's cryptic messages? Fear not, for there's a new weapon in your arsenal: &lt;strong&gt;Quokka&lt;/strong&gt;!&lt;/p&gt;

&lt;p&gt;getting it is as easy as searching for it within vs code!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1712968169800%2F83125bf9-f784-4a06-a205-6839f19892a9.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1712968169800%2F83125bf9-f784-4a06-a205-6839f19892a9.gif" alt="finding the extension"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This bad boy isn't your average VS Code extension. It's like &lt;strong&gt;a linter, a debugger, and a psychic code whisperer all rolled into one&lt;/strong&gt;. Quokka gives you &lt;strong&gt;instant feedback&lt;/strong&gt; as you write, highlighting errors, showing function return values, and even displaying the output of your console.logs – line by line! Think of it as having a tiny coding gremlin perched on your shoulder, constantly giving you thumbs up (or, more likely, pointing out your mistakes).&lt;/p&gt;

&lt;p&gt;Now, some of you seasoned veterans might be thinking, "Hey, Node.js has that --watch flag. Isn't that enough?" Sure, Node's --watch can re-run your code when you make changes. But Quokka takes things &lt;strong&gt;way beyond basic reruns&lt;/strong&gt;. It shows you the results &lt;strong&gt;in real time&lt;/strong&gt;, letting you identify and fix errors on the fly, especially in those &lt;strong&gt;monster-sized, complex projects&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1712968267519%2F2c1b11a1-72d4-445a-a43f-0b030c04e0c4.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1712968267519%2F2c1b11a1-72d4-445a-a43f-0b030c04e0c4.gif" alt="using quokka"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;So, is Quokka the ultimate coding sidekick? For &lt;strong&gt;large-scale JavaScript&lt;/strong&gt;, it's a definite &lt;strong&gt;game-changer&lt;/strong&gt;. The instant feedback and wealth of information it provides can slash your debugging time and make your code sharper than a katana. However, for &lt;strong&gt;smaller coding skirmishes&lt;/strong&gt;, Quokka might be a bit like bringing a bazooka to a nerf fight. The trusty --watch flag might be all you need in those cases. (and its good practice)&lt;/p&gt;

&lt;p&gt;The bottom line? Quokka is a &lt;strong&gt;powerful tool&lt;/strong&gt; that can &lt;strong&gt;supercharge your coding experience&lt;/strong&gt;, especially when tackling complex projects. Just remember, like any good weapon, it's all about knowing when and where to wield it for maximum impact. So, grab your keyboard, unleash your inner JavaScript master, and let Quokka be your guide!  &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Unleash Quokka's Full Power!&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;To experience Quokka's real-time magic with DOM manipulation, you'll need to install an additional plugin (sometimes)&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Open your terminal and navigate to your Quokka configuration folder using the command:
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;cd ~/.quokka
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ol&gt;
&lt;li&gt;Once there, install the &lt;code&gt;jsdom-quokka-plugin&lt;/code&gt; and &lt;code&gt;jsdom&lt;/code&gt; package with npm:
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm i jsdom-quokka-plugin jsdom
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;That's it! Now, when you use Quokka for projects involving DOM elements, you'll get the full range of its feedback awesomeness.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>vscode</category>
      <category>extensions</category>
      <category>beginners</category>
    </item>
    <item>
      <title>First post - let me tell you about my dice roller</title>
      <dc:creator>EthanDotLog</dc:creator>
      <pubDate>Wed, 21 Feb 2024 07:16:17 +0000</pubDate>
      <link>https://dev.to/ethandotlog/first-post-let-me-tell-you-about-my-dice-roller-2e7</link>
      <guid>https://dev.to/ethandotlog/first-post-let-me-tell-you-about-my-dice-roller-2e7</guid>
      <description>&lt;p&gt;I'm known as &lt;a href="https://github.com/ethandotlog"&gt;EthanDotLog&lt;/a&gt; in the digital realm and just like (some of) you... I'm an aspiring developer on a thrilling journey into the world of code. Everyday feels like a new quest, packed with challenges, discoveries, and the occasional brain teaser that leaves me scratching my head &lt;em&gt;(don't worry, we've all been there &lt;del&gt;i think&lt;/del&gt;!)&lt;/em&gt;. But hey, that's the beauty of this adventure, right? It's the constant learning, the problem-solving, Eureka moments, and the satisfaction of building something cool that keeps me hooked.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;em&gt;"The only difference between a good programmer and a bad programmer is the amount of caffeine." - Unknown&lt;/em&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Speaking of building cool things, I once created a dice roller using html/css/js!  It's not your average dice roller, though. This one can handle various dice types, thanks to the magic of random number generators and some nifty functions I slapped together. Plus, it keeps track of your rolls, so you can see if you're on a hot streak, going through a cold spell, or simply need to blame your misfortunes on some unlucky virtual dice.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fuj2fzlzom5lhmbz9vfys.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fuj2fzlzom5lhmbz9vfys.jpg" alt="Image description" width="800" height="533"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This dice roller project was a fantastic learning experience, and I'm excited to share my journey and creations with you all. So, buckle up, and let's explore the wonders of code &lt;strong&gt;together&lt;/strong&gt;!&lt;/p&gt;




&lt;p&gt;So, I humbly appeal to your collective wisdom. What are the top 3 skills or technologies you think I should learn next? Consider my current skillset, my passion for creating interactive experiences, and the ever-evolving landscape of web development. Share your insights, recommendations, and battle cries in the comments below! I'm eager to hear your thoughts and chart my next course in this epic coding odyssey. My next 3 languages i will look at are as follows...&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;?TBD&lt;/li&gt;
&lt;li&gt;?TBD&lt;/li&gt;
&lt;li&gt;?TBD&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;P.S.&lt;/strong&gt; &lt;em&gt;Feel free to leave a comment below and say hi! I'm always up for chatting about code, dice-rolling strategies, project ideas, learning resources, or anything else that sparks your curiosity.&lt;/em&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;console.log('Thanks for reading, EthanDotLog')
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>beginners</category>
      <category>learning</category>
    </item>
  </channel>
</rss>
