feat: add State Management Examples to coding page

Author: ripixel

pages/coding.html

@@ -8,6 +8,27 @@
 
     <main class="coding">
       <p>Shall we take a look at some projects I&apos;ve done?</p>
+
+      <section class="area">
+        <h3>State Management Examples</h3>
+        <p>
+          As a lover of state management in React (I know, what a weird thing to admit) I often get asked about my
+          thoughts as to the best state management solutions out there.
+        </p>
+        <p>
+          Anyone who's delved into the mysteries and intricacies of managing state in React knows that that's a very
+          naive question, which misses the big point that there are pros and cons to almost every approach, with some
+          being suited to more complex codebases with multiple teams contributing, and others being far more manageable
+          for single teams or solo developers.
+        </p>
+        <p>
+          So, I put together a lil website to showcase how to get started with a number of state management libraries.
+          Take a look!
+        </p>
+        <a class="button" href="https://sme.ripixel.co.uk">Start that countdown</a>
+        <a class="button" href="https://github.com/ripixel/state-management-examples">GitHub Repo</a>
+      </section>
+
       <section class="area">
         <h3>Presentation Timer</h3>
         <p>
@@ -27,13 +48,10 @@ <h3>Presentation Timer</h3>
           Having the presentation countdown and the music playing in the same
           tab means most streaming tools can pick up the audio in a nice way.
         </p>
-        <a class="button" href="https://pt.ripixel.co.uk"
-          >Start that countdown</a
-        >
-        <a class="button" href="https://github.com/ripixel/presentation-timer"
-          >GitHub Repo</a
-        >
+        <a class="button" href="https://pt.ripixel.co.uk">Start that countdown</a>
+        <a class="button" href="https://github.com/ripixel/presentation-timer">GitHub Repo</a>
       </section>
+
       <section class="area">
         <h3>Janky Werewolf</h3>
         <p>A browser-based version of the Ultimate Werewolf card game</p>
@@ -51,19 +69,8 @@ <h3>Janky Werewolf</h3>
           <a href="https://www.mgoddard.net/">Michael Goddard</a>, the big
           ol&apos; Rust nerd.
         </p>
-        <a class="button" href="https://www.jankywerewolf.co.uk"
-          >Check it out</a
-        >
-        <a
-          class="button"
-          href="https://github.com/ripixel/janky-werewolf-client"
-          >GitHub Repo (FE)</a
-        >
-        <a
-          class="button"
-          href="https://github.com/mcgoddard/janky_werewolf_backend"
-          >GitHub Repo (BE)</a
-        >
+        <a class="button" href="https://github.com/ripixel/janky-werewolf-client">GitHub Repo (FE)</a>
+        <a class="button" href="https://github.com/mcgoddard/janky_werewolf_backend">GitHub Repo (BE)</a>
       </section>
       <section class="area">
         <h3>ripixel.co.uk</h3>
@@ -87,12 +94,12 @@ <h3>ripixel.co.uk</h3>
           write the nav/header/footer out everytime. Neat!
         </p>
         <a class="button" href="https://www.ripixel.co.uk">Take me there</a>
-        <a class="button" href="https://github.com/ripixel/ripixel-website"
-          >GitHub Repo</a
-        >
+        <a class="button" href="https://github.com/ripixel/ripixel-website">GitHub Repo</a>
       </section>
+
     </main>
 
     {footer.html}
   </body>
+
 </html>