On updating code snippets and failing images for one article.

public/articles/addressing-the-stablecoin-trilemma.md

@@ -32,31 +32,43 @@ It’s important to note that the attributes in stablecoins aren’t binary. Ins
 The real question isn’t if a stablecoin fully achieves these attributes, but whether it does so to a sufficient degree.
 
 ## Exploring the Types of Stablecoins
-![stablecoins as the backbone of our digital economy](/images/stablecoins-as-the-backbone-of-digital-economy.webp)
+<figure>
+  <img src="/images/stablecoins-as-the-backbone-of-digital-economy.webp" alt="Stablecoins as the backbone of our digital economy" />
+  <figcaption>Stablecoins as the backbone of the digital economy</figcaption>
+</figure>
 
 Stablecoins are the backbone of our digital economy — according to CoinGecko, the current total market cap of stablecoins is valued at $151 billion with daily trading volume amounting close to $80 billion.
 
 Most of these stablecoins can fall under one of 4 categories below:
 
 ## Fiat-Backed Stablecoins
 
-![Fiat-Backed Stablecoins](/images/fiat-backed-stablecoins.webp)
+<figure>
+  <img src="/images/fiat-backed-stablecoins.webp" alt="Fiat-Backed Stablecoins" />
+  <figcaption>Fiat-Backed Stablecoins</figcaption>
+</figure>
 
 Fiat-backed stablecoins mirror the value of fiat currencies, like USDC and USDT, which are the most used stablecoins. Pegged to traditional currencies, they are both stable and capital efficient but fall short on decentralization as they generally rely on a centralized structure with regulated entities. Given the centralized nature, these institutions can be susceptible to censorship, can engage in censorship, and notably, their actions raise concerns regarding transparency. Furthermore, their existence depends on the financial health of their operators.
 
 USDT, by Tether, is a [notable example](https://blockworks.co/news/us-judge-orders-tether-to-prove-what-backs-usdt) as it has been speculated to have large parts of its stablecoin unbacked or partially backed.
 
 ## Crypto-Collateralized Stablecoins
 
-![Crypto-Collateralized Stablecoins](/images//Crypto-Collateralized%20Stablecoins.webp)
+<figure>
+  <img src="/images/crypto-collateralized-Stablecoins.webp" alt="Crypto-Collateralized Stablecoins" />
+  <figcaption>Crypto-Collateralized Stablecoins</figcaption>
+</figure>
 
 Crypto-collateralized stablecoins achieve decentralization often at the cost of stability and capital efficiency. These stablecoins are created and issued as loans collateralized by top-performing digital assets (e.g.,ETH), locked in smart contracts. Because the collateral-to-loan ratio needs to be high to absorb price shocks, the excess collateral remains unused until the borrower repays the loan or faces liquidation. This leads to capital inefficiency. Moreover, stablecoin holders can only convert their stablecoins back into collateral during liquidation or when repaying loans, which further compromises their price stability.
 
 The most popular example of this type is undoubtedly DAI by MakerDAO.
 
 ## Unbacked Stablecoins
 
-![Unbacked Stablecoins](/images//Unbacked%20Stablecoins.webp)
+<figure>
+  <img src="/images/Unbacked-Stablecoins.webp" alt="Unbacked Stablecoins" />
+  <figcaption>Unbacked Stablecoins</figcaption>
+</figure>
 
 Unbacked stablecoins attempt to eliminate the need for collateral or reserves through mechanisms that adjust supply based on price fluctuation. If the stablecoin’s price exceeds its target, the algorithm triggers to expand the supply, for instance, by minting new coins. If the price drops below the target, the algorithm encourages supply contraction — either by incentivizing users to burn or lock up their stablecoins — to push the price back up.
 
@@ -66,7 +78,10 @@ UST (and LUNA) on the Terra blockchain exemplifies this type of stablecoin. It c
 
 ## Crypto-Backed (Decentralized Reserve Protocols)
 
-![Crypto-Backed (Decentralized Reserve Protocols)](/images//Crypto-Backed%20(Decentralized%20Reserve%20Protocols).webp)
+<figure>
+  <img src="/images/crypto-backed-decentralized-reserve-protocols.webp" alt="Crypto-Backed (Decentralized Reserve Protocols)" />
+  <figcaption>Crypto-Backed (Decentralized Reserve Protocols)</figcaption>
+</figure>
 
 This newer model, which is often confused with the _crypto-collateralized_ stablecoins, offers a unique blend of decentralization and stability through backing, and mechanisms such as reserve tokenization which ensure capital efficiency.
 

public/articles/deploy-next-app-to-github-pages-guide.md

@@ -39,16 +39,22 @@ Here’s how to configure your `next.config.mjs`:
 
 ```
 const nextConfig = {
-output: 'export', // Tells Next.js to export the app statically
-distDir: 'out', // Output directory for the static files
-images: {
-unoptimized: true, // Disables Next.js image optimization (required for static export)
-loader: "custom", // Custom image loader for specific handling
-loaderFile: "./src/loaders/cloudinary-loader.ts", // Path to the custom image loader
-},
-reactStrictMode: true, // Optional: Enables React Strict Mode
-basePath: "/your-repository-name", // GitHub Pages requires the basePath for deployment under a repository. In case of custom domain name the basePath is not required
+  output: "export", // Tells Next.js to export the app statically
+  distDir: "out", // Output directory for the static files
+
+  images: {
+    unoptimized: true, // Disables Next.js image optimization (required for static export)
+    loader: "custom", // Custom image loader for specific handling
+    loaderFile: "./src/loaders/cloudinary-loader.ts", // Path to the custom image loader
+  },
+
+  reactStrictMode: true, // Optional: Enables React Strict Mode
+
+  basePath: "/your-repository-name", 
+  // GitHub Pages requires the basePath for deployment under a repository.
+  // In case of custom domain name the basePath is not required
 };
+
 export default nextConfig;
 ```
 
@@ -75,17 +81,24 @@ For a dynamic route like https://example.com/id/[param], where param can be any
 
 ```
 export async function generateStaticParams() {
-const params = Array.from({ length: 100 }, (_, i) => i.toString()); // IDs 0 to 99
-return params.map((param) => ({ param }));
+  const params = Array.from({ length: 100 }, (_, i) => i.toString()); // IDs 0 to 99
+
+  return params.map((param) => ({
+    param,
+  }));
 }
 ```
 
 For dynamic IDs fetched from an API:
 
 ```
 export async function generateStaticParams() {
-const data = await fetch('https://example.com/api/ids').then((res) => res.json());
-return data.map((id: string) => ({ param: id }));
+  const data = await fetch("https://example.com/api/ids")
+    .then((res) => res.json());
+
+  return data.map((id: string) => ({
+    param: id,
+  }));
 }
 ```
 
@@ -136,13 +149,16 @@ Example: yaml
 jobs:
   build:
     runs-on: ubuntu-latest
+
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
+
       - name: Set up Node.js
         uses: actions/setup-node@v4
         with:
           node-version: "20"
+
       - name: Build the Next.js app
         env:
           ETHERSCAN_API_KEY: ${{ secrets.ETHERSCAN_API_KEY }}
@@ -161,15 +177,19 @@ Example: yaml
 jobs:
   build:
     runs-on: ubuntu-latest
+
     env:
       NEXT_PUBLIC_API_URL: https://api.example.com
+
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
+
       - name: Set up Node.js
         uses: actions/setup-node@v4
         with:
           node-version: "20"
+
       - name: Build the Next.js app
         run: npm run build
 ```
@@ -209,10 +229,12 @@ If the exposed key is too risky, route requests through your backend to keep the
 
 ```
 export default async function handler(req, res) {
-const API_KEY = process.env.PRIVATE_API_KEY; // Kept private
-const response = await fetch(`https://api.example.com?apikey=${API_KEY}`);
-const data = await response.json();
-res.status(200).json(data);
+  const API_KEY = process.env.PRIVATE_API_KEY; // Kept private
+
+  const response = await fetch(`https://api.example.com?apikey=${API_KEY}`);
+  const data = await response.json();
+
+  res.status(200).json(data);
 }
 ```
 
@@ -233,8 +255,8 @@ name: Deploy Next.js site to Pages
 ```
 on:
   push:
-    branches: ["main"]  # Trigger deployment on push to the 'main' branch
-  workflow_dispatch:  # Manually trigger the deployment from GitHub Actions tab
+    branches: ["main"] # Trigger deployment on push to the 'main' branch
+  workflow_dispatch: # Manually trigger the deployment from GitHub Actions tab
 
 permissions:
   contents: read
@@ -248,9 +270,11 @@ concurrency:
 jobs:
   build:
     runs-on: ubuntu-latest
+
     defaults:
       run:
-        working-directory: ./web  # Specify the directory of your Next.js app
+        working-directory: ./web # Specify the directory of your Next.js app
+
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
@@ -302,14 +326,16 @@ jobs:
       - name: Upload static files
         uses: actions/upload-pages-artifact@v3
         with:
-          path: ./web/out  # Specify the output directory for static files
+          path: ./web/out # Specify the output directory for static files
 
   deploy:
+    needs: build
+    runs-on: ubuntu-latest
+
     environment:
       name: github-pages
       url: ${{ steps.deployment.outputs.page_url }}
-    runs-on: ubuntu-latest
-    needs: build
+
     steps:
       - name: Deploy to GitHub Pages
         id: deployment

public/articles/deploy-react-app-to-github-pages-guide.md

@@ -34,10 +34,11 @@ Here’s how to configure your vite.config.ts:
 ```
 import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react";
+
 // https://vite.dev/config/
 export default defineConfig({
-plugins: [react()],
-base: '/your-base-path/',
+  plugins: [react()],
+  base: "/your-base-path/",
 });
 ```
 
@@ -86,10 +87,11 @@ Add the following scripts in your package.json:
 
 ```
 "scripts": {
-+ "predeploy": "npm run build",
-+ "deploy": "gh-pages -d build",
-"start": "react-scripts start",
-"build": "react-scripts build",
+  "predeploy": "npm run build",
+  "deploy": "gh-pages -d build",
+  "start": "react-scripts start",
+  "build": "react-scripts build"
+}
 ```
 
 The predeploy script will run automatically before deploy is run.
@@ -107,50 +109,61 @@ Here is the sample workflow for deploying a React.js app to GitHub Pages:
 ```
 # Simple workflow for deploying static content to GitHub Pages
 name: Deploy static content to Pages
+
 on:
-# Runs on pushes targeting the default branch
-push:
-branches: ["main"]
-# Allows you to run this workflow manually from the Actions tab
-workflow_dispatch:
+  # Runs on pushes targeting the default branch
+  push:
+    branches: ["main"]
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
+
 # Sets the GITHUB_TOKEN permissions to allow deployment to GitHub Pages
 permissions:
-contents: read
-pages: write
-id-token: write
+  contents: read
+  pages: write
+  id-token: write
+
 # Allow one concurrent deployment
 concurrency:
-group: "pages"
-cancel-in-progress: true
+  group: "pages"
+  cancel-in-progress: true
+
 jobs:
-# Single deploy job since we're just deploying
-deploy:
-environment:
-name: github-pages
-url: ${{ steps.deployment.outputs.page_url }}
-runs-on: ubuntu-latest
-steps:
-- name: Checkout
-uses: actions/checkout@v4
-- name: Set up Node
-uses: actions/setup-node@v4
-with:
-node-version: 20
-cache: "npm"
-- name: Install dependencies
-run: npm ci
-- name: Build
-run: npm run build
-- name: Setup Pages
-uses: actions/configure-pages@v4
-- name: Upload artifact
-uses: actions/upload-pages-artifact@v3
-with:
-# Upload dist folder
-path: "./dist"
-- name: Deploy to GitHub Pages
-id: deployment
-uses: actions/deploy-pages@v4
+  # Single deploy job since we're just deploying
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Set up Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: "npm"
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build
+        run: npm run build
+
+      - name: Setup Pages
+        uses: actions/configure-pages@v4
+
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          # Upload dist folder
+          path: "./dist"
+
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4
 ```
 
 #### Key Steps in the Workflow