<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>Home | Creator's Blog (Hugo Theme)</title><link>https://hewfw.github.io/blog_theme/</link><atom:link href="https://hewfw.github.io/blog_theme/index.xml" rel="self" type="application/rss+xml"/><description>Home</description><generator>Hugo Blox Builder (https://hugoblox.com)</generator><language>en-us</language><lastBuildDate>Sat, 29 Apr 2023 00:00:00 +0000</lastBuildDate><image><url>https://hewfw.github.io/blog_theme/media/icon_hu7729264130191091259.png</url><title>Home</title><link>https://hewfw.github.io/blog_theme/</link></image><item><title>Smart contracts</title><link>https://hewfw.github.io/blog_theme/blog/web3/posts/smart_contracts/</link><pubDate>Sun, 01 Jun 2025 00:00:00 +0000</pubDate><guid>https://hewfw.github.io/blog_theme/blog/web3/posts/smart_contracts/</guid><description>&lt;p>In this moment of great innovations across the web the most notable standing giant is the Web 3, many speak of it, few dare to question the challenge it solves and the opportunities it brings.&lt;/p>
&lt;p>Smart contracts arising from this giant are what you ca fathom as not only reading and writing how the data flows but now also own what is digital and much more.
The landscape seems too vast for an idea like owing above reading and writing to make such a difference until you realize that Web 3 in these terms has been predicated on writing and watching alone.&lt;/p>
&lt;p>Since the first era of the blockchain, the so called Bitcoin era, we moved from the paradigm of sparse networks of very audacious innovators coming together to theorize and theory craft as all mathematicians do about models of every possible thing to what they call the Ethereum era that carries this time a strong sense of programmability.&lt;/p>
&lt;p>So what arose from these differences that we now possess smart contracts? Now we are able as the new stage of the internet rises to program what has been left called by many &amp;ldquo;bitcoins&amp;rdquo; and how we do this is by possessing a new programming language and its virtual machine, the EVM.&lt;/p>
&lt;p>This language , for the Ethereum network called Solidity allows to validate an exchange of assets, coins or goods for you to create what you needed lawyers and bureaucrats for and that is &amp;ldquo;the agreement to exchange&amp;rdquo; and in computer terms &amp;ldquo;save&amp;rdquo; that transaction on the blockchain, now famously the Ethereum L1 chain.&lt;/p>
&lt;h2 id="so-how-do-these-contracts-work">So how do these contracts work?&lt;/h2>
&lt;p>Two parties have a need to exchange, one of them, let&amp;rsquo;s suppose the party wanting to sell a token amount creates tokens that are programmed to validate that an exchange has occurred.&lt;/p>
&lt;p>This contract now, being also a token now can possess an amount of tokens that holds in storage to send to the seller and a percentage of coins that can be withdrawn by the chain to lend a contract program execution its so called gas and some defined amounts withheld for both parties to respect the agreement.&lt;/p>
&lt;p>The technology sounds complicated at first but this second era of blockchain lets you have many traditional web 2 technology interfaces that you wouldn&amp;rsquo;t have otherwise on innovative technologies and these include interfaces to code smart contracts online, websites that let you use their code for the most notable forms of smart contracts, otherwise coded from scratch and requiring programming knowledge.&lt;/p>
&lt;h2 id="calculating-the-incognitas">Calculating the incognitas&lt;/h2>
&lt;p>Some of these websites already have indexes to value what are the most technology bound variables such as the retention for executing the smart contract, leaving you metaphorically hands free on exchanging your valuable assets and now also tokens.&lt;/p></description></item><item><title>Tokens</title><link>https://hewfw.github.io/blog_theme/blog/web3/posts/tokens/tokens/</link><pubDate>Sun, 01 Jun 2025 00:00:00 +0000</pubDate><guid>https://hewfw.github.io/blog_theme/blog/web3/posts/tokens/tokens/</guid><description>&lt;p>In this moment of great innovations across the web the most notable standing giant is the Web 3, many speak of it, few dare to question the challenge it solves and the opportunities it brings&lt;/p>
&lt;h2 id="what-are-tokens-">What are tokens ?&lt;/h2>
&lt;p>Tokens are the main known entity in the web 3 space for representing currency but they are in reality much more than that.
You can assume that the network&amp;rsquo;s so called economy circulates them as their main asset and considers them i the big picture as fungible currencies, gui and gwei, in laymen terms gas to compute the transactions, abstract assets built on top of fungible tokes as non fungible ones, certifications of various nature.&lt;/p>
&lt;p>Worry some as it sounds their encoding is a serious second if not third blockchain era application of token standards and this makes them differentiated for all intended purposes.&lt;/p>
&lt;h2 id="what-is-their-usage-">What is their usage ?&lt;/h2>
&lt;p>In practice how you mostly encounter tokes is as non fungible assets and contracts, fungible currencies and communications such as votes and certifications of fulfillment.&lt;/p>
&lt;h2 id="code-wise">Code wise&lt;/h2>
&lt;p>You can think of tokens as cryptographic code defined by standards, these standards are a set called ERC for the Ethereum based ones.&lt;/p>
&lt;p>Another way of seeing them is as mathematical problems of different nature assigned to mining nodes on participation.&lt;/p>
&lt;p>And in more simple terms numbers on a treasury or wallet balance.&lt;/p>
&lt;h2 id="three-ways-the-network-yields-tokens">Three ways the network yields tokens&lt;/h2>
&lt;p>These tokens are generated in may ways across the network and having community values shared together created value generation methods that go beyond what you could achieve by creating self sustaining transactions.&lt;/p>
&lt;p>In general terms of network effects you ca describe how the network generated through games pools of tokes with the purpose of putting into circulation liquidity that could attract more games and network participants.&lt;/p>
&lt;p>Another front to generate tokes is through the yielding of odes that each epoch generate more tokens in order to continue generating.&lt;/p>
&lt;p>On top of these network effects you can trade, buy ad sell different assets both fungible and non or compound with subnets through games and investment yielding.&lt;/p>
&lt;h2 id="how-could-you-get-them-without-owning-them">How could you get them without owning them?&lt;/h2>
&lt;p>Tokens can be bought through exchange platforms that possess services like indexes with current and future values of a given network&amp;rsquo;s currency, some of these listings might provide buying options for some of the indexed blockchain networks through fiat currency deposits.&lt;/p>
&lt;p>I cases of tokens of networks created on top of other networks as composite but self standing networks it can also provide an intermediary service for converting them.&lt;/p></description></item><item><title>Wallets</title><link>https://hewfw.github.io/blog_theme/blog/web3/posts/wallets/</link><pubDate>Sun, 01 Jun 2025 00:00:00 +0000</pubDate><guid>https://hewfw.github.io/blog_theme/blog/web3/posts/wallets/</guid><description>&lt;p>In this moment of great innovation across the web the most notable standing giant is the web3, many speak of it few dare to question the challenge that it solves and the opportunities it brings.&lt;/p>
&lt;h3 id="what-are-wallets">What are wallets?&lt;/h3>
&lt;p>In this context possessing a stake is also possessing a wallet, wallets are a way to possess what you have programmed and carried through the games you have played on the network with or without an organization or what you have yielded from investments in the epochs passed by, and in the most common way it is your personal operations node from which you transact and exchange your tokens.&lt;/p>
&lt;h3 id="what-can-you-do-with-them">What can you do with them?&lt;/h3>
&lt;p>From your wallet transactions can leave to other wallets, to treasuries on the common net, to organizations and services or yield generators making use of financial game theory concept named incubation (like you would see for startups raising funds) and locking without technically leaving your wallet an amount of tokens autogenerating fungible to non fungible assets from various missions.&lt;/p>
&lt;h3 id="technology-wise">Technology wise?&lt;/h3>
&lt;p>With this technology you clearly have a blockchain network address and can choose from extensions on your browser that you sign in from your wallet comprehending account or your own account on a service like a node provider or even choose a native L2 chain Node like wallet through for example Ethereum.&lt;/p>
&lt;p>This technology lets you deposit in your possession tokens of a specific chain and lets you interact according to your node provider, tokens in questions with the network that you choose to interact with be that a sub-chain in the L2 layer or a whole other chain if it has an interoperable protocol.&lt;/p></description></item><item><title>🎉 Easily create your own simple yet highly customizable blog</title><link>https://hewfw.github.io/blog_theme/blog/get-started/</link><pubDate>Fri, 27 Oct 2023 00:00:00 +0000</pubDate><guid>https://hewfw.github.io/blog_theme/blog/get-started/</guid><description>&lt;p>Welcome 👋&lt;/p>
&lt;details class="print:hidden xl:hidden" open>
&lt;summary>Table of Contents&lt;/summary>
&lt;div class="text-sm">
&lt;nav id="TableOfContents">
&lt;ul>
&lt;li>&lt;a href="#overview">Overview&lt;/a>
&lt;ul>
&lt;li>&lt;a href="#get-started">Get Started&lt;/a>&lt;/li>
&lt;/ul>
&lt;/li>
&lt;li>&lt;a href="#crowd-funded-open-source-software">Crowd-funded open-source software&lt;/a>
&lt;ul>
&lt;li>&lt;a href="#-click-here-to-become-a-sponsor-and-help-support-hugo-bloxs-future-httpshugobloxcomsponsor">&lt;a href="https://hugoblox.com/sponsor/">❤️ Click here to become a sponsor and help support Hugo Blox&amp;rsquo;s future ❤️&lt;/a>&lt;/a>&lt;/li>
&lt;/ul>
&lt;/li>
&lt;li>&lt;a href="#ecosystem">Ecosystem&lt;/a>&lt;/li>
&lt;li>&lt;a href="#inspiration">Inspiration&lt;/a>&lt;/li>
&lt;li>&lt;a href="#features">Features&lt;/a>&lt;/li>
&lt;li>&lt;a href="#themes">Themes&lt;/a>&lt;/li>
&lt;li>&lt;a href="#license">License&lt;/a>&lt;/li>
&lt;/ul>
&lt;/nav>
&lt;/div>
&lt;/details>
&lt;h2 id="overview">Overview&lt;/h2>
&lt;ol>
&lt;li>The Hugo Blox website builder for Hugo, along with its starter templates, is designed for professional creators, educators, and teams/organizations - although it can be used to create any kind of site&lt;/li>
&lt;li>The template can be modified and customised to suit your needs. It&amp;rsquo;s a good platform for anyone looking to take control of their data and online identity whilst having the convenience to start off with a &lt;strong>no-code solution (write in Markdown and customize with YAML parameters)&lt;/strong> and having &lt;strong>flexibility to later add even deeper personalization with HTML and CSS&lt;/strong>&lt;/li>
&lt;li>You can work with all your favourite tools and apps with hundreds of plugins and integrations to speed up your workflows, interact with your readers, and much more&lt;/li>
&lt;/ol>
&lt;h3 id="get-started">Get Started&lt;/h3>
&lt;ul>
&lt;li>👉 &lt;a href="https://hugoblox.com/templates/" target="_blank" rel="noopener">&lt;strong>Create a new site&lt;/strong>&lt;/a>&lt;/li>
&lt;li>📚 &lt;a href="https://docs.hugoblox.com/" target="_blank" rel="noopener">&lt;strong>Personalize your site&lt;/strong>&lt;/a>&lt;/li>
&lt;li>💬 &lt;a href="https://discord.gg/z8wNYzb" target="_blank" rel="noopener">Chat with the &lt;strong>Hugo Blox community&lt;/strong>&lt;/a> or &lt;a href="https://discourse.gohugo.io" target="_blank" rel="noopener">&lt;strong>Hugo community&lt;/strong>&lt;/a>&lt;/li>
&lt;li>🐦 Twitter: &lt;a href="https://twitter.com/GetResearchDev" target="_blank" rel="noopener">@GetResearchDev&lt;/a> &lt;a href="https://twitter.com/GeorgeCushen" target="_blank" rel="noopener">@GeorgeCushen&lt;/a> #MadeWithHugoBlox&lt;/li>
&lt;li>💡 &lt;a href="https://github.com/HugoBlox/hugo-blox-builder/issues" target="_blank" rel="noopener">Request a &lt;strong>feature&lt;/strong> or report a &lt;strong>bug&lt;/strong> for &lt;em>Hugo Blox&lt;/em>&lt;/a>&lt;/li>
&lt;li>⬆️ &lt;strong>Updating Hugo Blox?&lt;/strong> View the &lt;a href="https://docs.hugoblox.com/reference/update/" target="_blank" rel="noopener">Update Guide&lt;/a> and &lt;a href="https://github.com/HugoBlox/hugo-blox-builder/releases" target="_blank" rel="noopener">Release Notes&lt;/a>&lt;/li>
&lt;/ul>
&lt;h2 id="crowd-funded-open-source-software">Crowd-funded open-source software&lt;/h2>
&lt;p>To help us develop this template and software sustainably under the MIT license, we ask all individuals and businesses that use it to help support its ongoing maintenance and development via sponsorship.&lt;/p>
&lt;h3 id="-click-here-to-become-a-sponsor-and-help-support-hugo-bloxs-future-httpshugobloxcomsponsor">&lt;a href="https://hugoblox.com/sponsor/" target="_blank" rel="noopener">❤️ Click here to become a sponsor and help support Hugo Blox&amp;rsquo;s future ❤️&lt;/a>&lt;/h3>
&lt;p>As a token of appreciation for sponsoring, you can &lt;strong>unlock &lt;a href="https://hugoblox.com/sponsor/" target="_blank" rel="noopener">these&lt;/a> awesome rewards and extra features 🦄✨&lt;/strong>&lt;/p>
&lt;h2 id="ecosystem">Ecosystem&lt;/h2>
&lt;ul>
&lt;li>&lt;strong>&lt;a href="https://github.com/GetRD/academic-file-converter" target="_blank" rel="noopener">Bibtex To Markdown&lt;/a>:&lt;/strong> Automatically import publications from BibTeX&lt;/li>
&lt;/ul>
&lt;h2 id="inspiration">Inspiration&lt;/h2>
&lt;p>&lt;a href="https://hugoblox.com/creators/" target="_blank" rel="noopener">Learn what other &lt;strong>creators&lt;/strong>&lt;/a> are building with this template.&lt;/p>
&lt;h2 id="features">Features&lt;/h2>
&lt;ul>
&lt;li>&lt;strong>Page builder&lt;/strong> - Create &lt;em>anything&lt;/em> with no-code &lt;a href="https://hugoblox.com/blocks/" target="_blank" rel="noopener">&lt;strong>blocks&lt;/strong>&lt;/a> and &lt;a href="https://docs.hugoblox.com/reference/markdown/" target="_blank" rel="noopener">&lt;strong>elements&lt;/strong>&lt;/a>&lt;/li>
&lt;li>&lt;strong>Edit any type of content&lt;/strong> - Blog posts, publications, talks, slides, projects, and more!&lt;/li>
&lt;li>&lt;strong>Create content&lt;/strong> in &lt;a href="https://docs.hugoblox.com/reference/markdown/" target="_blank" rel="noopener">&lt;strong>Markdown&lt;/strong>&lt;/a>, &lt;a href="https://docs.hugoblox.com/getting-started/cms/" target="_blank" rel="noopener">&lt;strong>Jupyter&lt;/strong>&lt;/a>, or &lt;a href="https://docs.hugoblox.com/getting-started/cms/" target="_blank" rel="noopener">&lt;strong>RStudio&lt;/strong>&lt;/a>&lt;/li>
&lt;li>&lt;strong>Plugin System&lt;/strong> - Fully customizable &lt;a href="https://docs.hugoblox.com/getting-started/customize/" target="_blank" rel="noopener">&lt;strong>color&lt;/strong> and &lt;strong>font themes&lt;/strong>&lt;/a>&lt;/li>
&lt;li>&lt;strong>Display Code and Math&lt;/strong> - Code syntax highlighting and LaTeX math supported&lt;/li>
&lt;li>&lt;strong>Integrations&lt;/strong> - &lt;a href="https://analytics.google.com" target="_blank" rel="noopener">Google Analytics&lt;/a>, &lt;a href="https://disqus.com" target="_blank" rel="noopener">Disqus commenting&lt;/a>, Maps, Contact Forms, and more!&lt;/li>
&lt;li>&lt;strong>Beautiful Site&lt;/strong> - Simple and refreshing one-page design&lt;/li>
&lt;li>&lt;strong>Industry-Leading SEO&lt;/strong> - Help get your website found on search engines and social media&lt;/li>
&lt;li>&lt;strong>Media Galleries&lt;/strong> - Display your images and videos with captions in a customizable gallery&lt;/li>
&lt;li>&lt;strong>Mobile Friendly&lt;/strong> - Look amazing on every screen with a mobile friendly version of your site&lt;/li>
&lt;li>&lt;strong>Multi-language&lt;/strong> - 35+ language packs including English, 中文, and Português&lt;/li>
&lt;li>&lt;strong>Multi-user&lt;/strong> - Each author gets their own profile page&lt;/li>
&lt;li>&lt;strong>Privacy Pack&lt;/strong> - Assists with GDPR&lt;/li>
&lt;li>&lt;strong>Stand Out&lt;/strong> - Bring your site to life with animation, parallax backgrounds, and scroll effects&lt;/li>
&lt;li>&lt;strong>One-Click Deployment&lt;/strong> - No servers. No databases. Only files.&lt;/li>
&lt;/ul>
&lt;h2 id="themes">Themes&lt;/h2>
&lt;p>Hugo Blox and its templates come with &lt;strong>automatic day (light) and night (dark) mode&lt;/strong> built-in. Visitors can choose their preferred mode by clicking the sun/moon icon in the header.&lt;/p>
&lt;p>&lt;a href="https://docs.hugoblox.com/getting-started/customize/" target="_blank" rel="noopener">Choose a stunning &lt;strong>theme&lt;/strong> and &lt;strong>font&lt;/strong>&lt;/a> for your site. Themes are fully customizable.&lt;/p>
&lt;h2 id="license">License&lt;/h2>
&lt;p>Copyright 2016-present &lt;a href="https://georgecushen.com" target="_blank" rel="noopener">George Cushen&lt;/a>.&lt;/p>
&lt;p>Released under the &lt;a href="https://github.com/HugoBlox/hugo-blox-builder/blob/main/LICENSE.md" target="_blank" rel="noopener">MIT&lt;/a> license.&lt;/p></description></item><item><title>🧠 Sharpen your thinking with a second brain</title><link>https://hewfw.github.io/blog_theme/blog/second-brain/</link><pubDate>Thu, 26 Oct 2023 00:00:00 +0000</pubDate><guid>https://hewfw.github.io/blog_theme/blog/second-brain/</guid><description>&lt;p>Create a personal knowledge base and share your knowledge with your peers.&lt;/p>
&lt;p>Hugo Blox web framework empowers you with one of the most flexible note-taking capabilities out there.&lt;/p>
&lt;p>Create a powerful knowledge base that works on top of a local folder of plain text Markdown files.&lt;/p>
&lt;p>Use it as your second brain, either publicly sharing your knowledge with your peers via your website, or via a private GitHub repository and password-protected site just for yourself.&lt;/p>
&lt;h2 id="mindmaps">Mindmaps&lt;/h2>
&lt;p>Hugo Blox supports a Markdown extension for mindmaps.&lt;/p>
&lt;p>With this open format, can even edit your mindmaps in other popular tools such as Obsidian.&lt;/p>
&lt;p>Simply insert a Markdown code block labelled as &lt;code>markmap&lt;/code> and optionally set the height of the mindmap as shown in the example below.&lt;/p>
&lt;p>Mindmaps can be created by simply writing the items as a Markdown list within the &lt;code>markmap&lt;/code> code block, indenting each item to create as many sub-levels as you need:&lt;/p>
&lt;div class="highlight">
&lt;pre class="chroma">
&lt;code>
```markmap {height="200px"}
- Hugo Modules
- Hugo Blox
- blox-plugins-netlify
- blox-plugins-netlify-cms
- blox-plugins-reveal
```
&lt;/code>
&lt;/pre>
&lt;/div>
&lt;p>renders as&lt;/p>
&lt;div class="markmap" style="height: 200px;">
&lt;pre>- Hugo Modules
- Hugo Blox
- blox-plugins-netlify
- blox-plugins-netlify-cms
- blox-plugins-reveal&lt;/pre>
&lt;/div>
&lt;p>Anh here&amp;rsquo;s a more advanced mindmap with formatting, code blocks, and math:&lt;/p>
&lt;div class="highlight">
&lt;pre class="chroma">
&lt;code>
```markmap
- Mindmaps
- Links
- [Hugo Blox Docs](https://docs.hugoblox.com/)
- [Discord Community](https://discord.gg/z8wNYzb)
- [GitHub](https://github.com/HugoBlox/hugo-blox-builder)
- Features
- Markdown formatting
- **inline** ~~text~~ *styles*
- multiline
text
- `inline code`
-
```js
console.log('hello');
console.log('code block');
```
- Math: $x = {-b \pm \sqrt{b^2-4ac} \over 2a}$
```
&lt;/code>
&lt;/pre>
&lt;/div>
&lt;p>renders as&lt;/p>
&lt;div class="markmap" style="height: 500px;">
&lt;pre>- Mindmaps
- Links
- [Hugo Blox Docs](https://docs.hugoblox.com/)
- [Discord Community](https://discord.gg/z8wNYzb)
- [GitHub](https://github.com/HugoBlox/hugo-blox-builder)
- Features
- Markdown formatting
- **inline** ~~text~~ *styles*
- multiline
text
- `inline code`
-
```js
console.log('hello');
console.log('code block');
```
- Math: $x = {-b \pm \sqrt{b^2-4ac} \over 2a}$&lt;/pre>
&lt;/div>
&lt;h2 id="highlighting">Highlighting&lt;/h2>
&lt;p>&lt;mark>Highlight&lt;/mark> important text with &lt;code>mark&lt;/code>:&lt;/p>
&lt;div class="highlight">&lt;pre tabindex="0" class="chroma">&lt;code class="language-html" data-lang="html">&lt;span class="line">&lt;span class="cl">&lt;span class="p">&amp;lt;&lt;/span>&lt;span class="nt">mark&lt;/span>&lt;span class="p">&amp;gt;&lt;/span>Highlighted text&lt;span class="p">&amp;lt;/&lt;/span>&lt;span class="nt">mark&lt;/span>&lt;span class="p">&amp;gt;&lt;/span>
&lt;/span>&lt;/span>&lt;/code>&lt;/pre>&lt;/div>&lt;h2 id="callouts">Callouts&lt;/h2>
&lt;p>Use &lt;a href="https://docs.hugoblox.com/reference/markdown/#callouts" target="_blank" rel="noopener">callouts&lt;/a> (aka &lt;em>asides&lt;/em>, &lt;em>hints&lt;/em>, or &lt;em>alerts&lt;/em>) to draw attention to notes, tips, and warnings.&lt;/p>
&lt;p>By wrapping a paragraph in &lt;code>{{% callout note %}} ... {{% /callout %}}&lt;/code>, it will render as an aside.&lt;/p>
&lt;div class="highlight">&lt;pre tabindex="0" class="chroma">&lt;code class="language-markdown" data-lang="markdown">&lt;span class="line">&lt;span class="cl">{{% callout note %}}
&lt;/span>&lt;/span>&lt;span class="line">&lt;span class="cl">A Markdown aside is useful for displaying notices, hints, or definitions to your readers.
&lt;/span>&lt;/span>&lt;span class="line">&lt;span class="cl">{{% /callout %}}
&lt;/span>&lt;/span>&lt;/code>&lt;/pre>&lt;/div>&lt;p>renders as&lt;/p>
&lt;div class="flex px-4 py-3 mb-6 rounded-md bg-primary-100 dark:bg-primary-900">
&lt;span class="pr-3 pt-1 text-primary-600 dark:text-primary-300">
&lt;svg height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">&lt;path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m11.25 11.25l.041-.02a.75.75 0 0 1 1.063.852l-.708 2.836a.75.75 0 0 0 1.063.853l.041-.021M21 12a9 9 0 1 1-18 0a9 9 0 0 1 18 0m-9-3.75h.008v.008H12z"/>&lt;/svg>
&lt;/span>
&lt;span class="dark:text-neutral-300">A Markdown aside is useful for displaying notices, hints, or definitions to your readers.&lt;/span>
&lt;/div>
&lt;p>Or use the &lt;code>warning&lt;/code> callout type so your readers don&amp;rsquo;t miss critical details:&lt;/p>
&lt;div class="flex px-4 py-3 mb-6 rounded-md bg-yellow-100 dark:bg-yellow-900">
&lt;span class="pr-3 pt-1 text-red-400">
&lt;svg height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">&lt;path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0zM12 15.75h.007v.008H12z"/>&lt;/svg>
&lt;/span>
&lt;span class="dark:text-neutral-300">A Markdown aside is useful for displaying notices, hints, or definitions to your readers.&lt;/span>
&lt;/div>
&lt;h2 id="did-you-find-this-page-helpful-consider-sharing-it-">Did you find this page helpful? Consider sharing it 🙌&lt;/h2></description></item><item><title>👩🏼‍🏫 Teach academic courses</title><link>https://hewfw.github.io/blog_theme/blog/teach-courses/</link><pubDate>Tue, 24 Oct 2023 00:00:00 +0000</pubDate><guid>https://hewfw.github.io/blog_theme/blog/teach-courses/</guid><description>&lt;p>&lt;a href="https://hugoblox.com" target="_blank" rel="noopener">Hugo Blox Builder&lt;/a> is designed to give technical content creators a seamless experience. You can focus on the content and the Hugo Blox Builder which this template is built upon handles the rest.&lt;/p>
&lt;p>&lt;strong>Embed videos, podcasts, code, LaTeX math, and even test students!&lt;/strong>&lt;/p>
&lt;p>On this page, you&amp;rsquo;ll find some examples of the types of technical content that can be rendered with Hugo Blox.&lt;/p>
&lt;h2 id="video">Video&lt;/h2>
&lt;p>Teach your course by sharing videos with your students. Choose from one of the following approaches:&lt;/p>
&lt;p>&lt;strong>Youtube&lt;/strong>:&lt;/p>
&lt;pre>&lt;code>{{&amp;lt; youtube D2vj0WcvH5c &amp;gt;}}
&lt;/code>&lt;/pre>
&lt;div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;">
&lt;iframe allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen="allowfullscreen" loading="eager" referrerpolicy="strict-origin-when-cross-origin" src="https://www.youtube.com/embed/D2vj0WcvH5c?autoplay=0&amp;controls=1&amp;end=0&amp;loop=0&amp;mute=0&amp;start=0" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0;" title="YouTube video"
>&lt;/iframe>
&lt;/div>
&lt;p>&lt;strong>Bilibili&lt;/strong>:&lt;/p>
&lt;pre>&lt;code>{{&amp;lt; bilibili BV1WV4y1r7DF &amp;gt;}}
&lt;/code>&lt;/pre>
&lt;div class="w-full h-auto aspect-video relative">
&lt;iframe src="//player.bilibili.com/player.html?bvid=BV1WV4y1r7DF&amp;page=1"
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; fullscreen; picture-in-picture;"
class="w-full h-full"
>&lt;/iframe>
&lt;/div>
&lt;p>&lt;strong>Video file&lt;/strong>&lt;/p>
&lt;p>Videos may be added to a page by either placing them in your &lt;code>assets/media/&lt;/code> media library or in your &lt;a href="https://gohugo.io/content-management/page-bundles/" target="_blank" rel="noopener">page&amp;rsquo;s folder&lt;/a>, and then embedding them with the &lt;em>video&lt;/em> shortcode:&lt;/p>
&lt;pre>&lt;code>{{&amp;lt; video src=&amp;quot;my_video.mp4&amp;quot; controls=&amp;quot;yes&amp;quot; &amp;gt;}}
&lt;/code>&lt;/pre>
&lt;h2 id="podcast">Podcast&lt;/h2>
&lt;p>You can add a podcast or music to a page by placing the MP3 file in the page&amp;rsquo;s folder or the media library folder and then embedding the audio on your page with the &lt;em>audio&lt;/em> shortcode:&lt;/p>
&lt;pre>&lt;code>{{&amp;lt; audio src=&amp;quot;ambient-piano.mp3&amp;quot; &amp;gt;}}
&lt;/code>&lt;/pre>
&lt;p>Try it out:&lt;/p>
&lt;audio controls >
&lt;source src="https://hewfw.github.io/blog_theme/blog_theme/blog/teach-courses/ambient-piano.mp3" type="audio/mpeg">
&lt;/audio>
&lt;h2 id="test-students">Test students&lt;/h2>
&lt;p>Provide a simple yet fun self-assessment by revealing the solutions to challenges with the &lt;code>spoiler&lt;/code> shortcode:&lt;/p>
&lt;div class="highlight">&lt;pre tabindex="0" class="chroma">&lt;code class="language-markdown" data-lang="markdown">&lt;span class="line">&lt;span class="cl">{{&lt;span class="p">&amp;lt;&lt;/span> &lt;span class="nt">spoiler&lt;/span> &lt;span class="na">text&lt;/span>&lt;span class="o">=&lt;/span>&lt;span class="s">&amp;#34;👉 Click to view the solution&amp;#34;&lt;/span> &lt;span class="p">&amp;gt;&lt;/span>}}
&lt;/span>&lt;/span>&lt;span class="line">&lt;span class="cl">You found me!
&lt;/span>&lt;/span>&lt;span class="line">&lt;span class="cl">{{&lt;span class="p">&amp;lt;&lt;/span> &lt;span class="p">/&lt;/span>&lt;span class="nt">spoiler&lt;/span> &lt;span class="p">&amp;gt;&lt;/span>}}
&lt;/span>&lt;/span>&lt;/code>&lt;/pre>&lt;/div>&lt;p>renders as&lt;/p>
&lt;details class="spoiler " id="spoiler-3">
&lt;summary class="cursor-pointer">👉 Click to view the solution&lt;/summary>
&lt;div class="rounded-lg bg-neutral-50 dark:bg-neutral-800 p-2">
You found me 🎉
&lt;/div>
&lt;/details>
&lt;h2 id="math">Math&lt;/h2>
&lt;p>Hugo Blox Builder supports a Markdown extension for $\LaTeX$ math. Enable math by setting the &lt;code>math: true&lt;/code> option in your page&amp;rsquo;s front matter, or enable math for your entire site by toggling math in your &lt;code>config/_default/params.yaml&lt;/code> file:&lt;/p>
&lt;div class="highlight">&lt;pre tabindex="0" class="chroma">&lt;code class="language-yaml" data-lang="yaml">&lt;span class="line">&lt;span class="cl">&lt;span class="nt">features&lt;/span>&lt;span class="p">:&lt;/span>&lt;span class="w">
&lt;/span>&lt;/span>&lt;/span>&lt;span class="line">&lt;span class="cl">&lt;span class="w"> &lt;/span>&lt;span class="nt">math&lt;/span>&lt;span class="p">:&lt;/span>&lt;span class="w">
&lt;/span>&lt;/span>&lt;/span>&lt;span class="line">&lt;span class="cl">&lt;span class="w"> &lt;/span>&lt;span class="nt">enable&lt;/span>&lt;span class="p">:&lt;/span>&lt;span class="w"> &lt;/span>&lt;span class="kc">true&lt;/span>&lt;span class="w">
&lt;/span>&lt;/span>&lt;/span>&lt;/code>&lt;/pre>&lt;/div>&lt;p>To render &lt;em>inline&lt;/em> or &lt;em>block&lt;/em> math, wrap your LaTeX math with &lt;code>$...$&lt;/code> or &lt;code>$$...$$&lt;/code>, respectively.&lt;/p>
&lt;p>Example &lt;strong>math block&lt;/strong>:&lt;/p>
&lt;div class="highlight">&lt;pre tabindex="0" class="chroma">&lt;code class="language-latex" data-lang="latex">&lt;span class="line">&lt;span class="cl">&lt;span class="sb">$$&lt;/span>&lt;span class="nb">
&lt;/span>&lt;/span>&lt;/span>&lt;span class="line">&lt;span class="cl">&lt;span class="nb">&lt;/span>&lt;span class="nv">\gamma&lt;/span>&lt;span class="nb">_{n} &lt;/span>&lt;span class="o">=&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="nv">\frac&lt;/span>&lt;span class="nb">{ &lt;/span>&lt;span class="nv">\left&lt;/span>&lt;span class="nb"> | &lt;/span>&lt;span class="nv">\left&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="o">(&lt;/span>&lt;span class="nv">\mathbf&lt;/span>&lt;span class="nb"> x_{n} &lt;/span>&lt;span class="o">-&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="nv">\mathbf&lt;/span>&lt;span class="nb"> x_{n&lt;/span>&lt;span class="o">-&lt;/span>&lt;span class="m">1&lt;/span>&lt;span class="nb">} &lt;/span>&lt;span class="nv">\right&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="o">)&lt;/span>&lt;span class="nb">^T &lt;/span>&lt;span class="nv">\left&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="o">[&lt;/span>&lt;span class="nv">\nabla&lt;/span>&lt;span class="nb"> F &lt;/span>&lt;span class="o">(&lt;/span>&lt;span class="nv">\mathbf&lt;/span>&lt;span class="nb"> x_{n}&lt;/span>&lt;span class="o">)&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="o">-&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="nv">\nabla&lt;/span>&lt;span class="nb"> F &lt;/span>&lt;span class="o">(&lt;/span>&lt;span class="nv">\mathbf&lt;/span>&lt;span class="nb"> x_{n&lt;/span>&lt;span class="o">-&lt;/span>&lt;span class="m">1&lt;/span>&lt;span class="nb">}&lt;/span>&lt;span class="o">)&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="nv">\right&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="o">]&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="nv">\right&lt;/span>&lt;span class="nb"> |}{&lt;/span>&lt;span class="nv">\left&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="nv">\|\nabla&lt;/span>&lt;span class="nb"> F&lt;/span>&lt;span class="o">(&lt;/span>&lt;span class="nv">\mathbf&lt;/span>&lt;span class="nb">{x}_{n}&lt;/span>&lt;span class="o">)&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="o">-&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="nv">\nabla&lt;/span>&lt;span class="nb"> F&lt;/span>&lt;span class="o">(&lt;/span>&lt;span class="nv">\mathbf&lt;/span>&lt;span class="nb">{x}_{n&lt;/span>&lt;span class="o">-&lt;/span>&lt;span class="m">1&lt;/span>&lt;span class="nb">}&lt;/span>&lt;span class="o">)&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="nv">\right&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="nv">\|&lt;/span>&lt;span class="nb">^&lt;/span>&lt;span class="m">2&lt;/span>&lt;span class="nb">}
&lt;/span>&lt;/span>&lt;/span>&lt;span class="line">&lt;span class="cl">&lt;span class="nb">&lt;/span>&lt;span class="s">$$&lt;/span>
&lt;/span>&lt;/span>&lt;/code>&lt;/pre>&lt;/div>&lt;p>renders as&lt;/p>
$$\gamma_{n} = \frac{ \left | \left (\mathbf x_{n} - \mathbf x_{n-1} \right )^T \left [\nabla F (\mathbf x_{n}) - \nabla F (\mathbf x_{n-1}) \right ] \right |}{\left \|\nabla F(\mathbf{x}_{n}) - \nabla F(\mathbf{x}_{n-1}) \right \|^2}$$&lt;p>Example &lt;strong>inline math&lt;/strong> &lt;code>$\nabla F(\mathbf{x}_{n})$&lt;/code> renders as $\nabla F(\mathbf{x}_{n})$.&lt;/p>
&lt;p>Example &lt;strong>multi-line math&lt;/strong> using the math linebreak (&lt;code>\\&lt;/code>):&lt;/p>
&lt;div class="highlight">&lt;pre tabindex="0" class="chroma">&lt;code class="language-latex" data-lang="latex">&lt;span class="line">&lt;span class="cl">&lt;span class="sb">$$&lt;/span>&lt;span class="nb">f&lt;/span>&lt;span class="o">(&lt;/span>&lt;span class="nb">k;p_{&lt;/span>&lt;span class="m">0&lt;/span>&lt;span class="nb">}^{&lt;/span>&lt;span class="o">*&lt;/span>&lt;span class="nb">}&lt;/span>&lt;span class="o">)&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="o">=&lt;/span>&lt;span class="nb"> &lt;/span>&lt;span class="nv">\begin&lt;/span>&lt;span class="nb">{cases}p_{&lt;/span>&lt;span class="m">0&lt;/span>&lt;span class="nb">}^{&lt;/span>&lt;span class="o">*&lt;/span>&lt;span class="nb">} &amp;amp; &lt;/span>&lt;span class="nv">\text&lt;/span>&lt;span class="nb">{if }k&lt;/span>&lt;span class="o">=&lt;/span>&lt;span class="m">1&lt;/span>&lt;span class="nb">, &lt;/span>&lt;span class="nv">\\&lt;/span>&lt;span class="nb">
&lt;/span>&lt;/span>&lt;/span>&lt;span class="line">&lt;span class="cl">&lt;span class="nb">&lt;/span>&lt;span class="m">1&lt;/span>&lt;span class="o">-&lt;/span>&lt;span class="nb">p_{&lt;/span>&lt;span class="m">0&lt;/span>&lt;span class="nb">}^{&lt;/span>&lt;span class="o">*&lt;/span>&lt;span class="nb">} &amp;amp; &lt;/span>&lt;span class="nv">\text&lt;/span>&lt;span class="nb">{if }k&lt;/span>&lt;span class="o">=&lt;/span>&lt;span class="m">0&lt;/span>&lt;span class="nb">.&lt;/span>&lt;span class="nv">\end&lt;/span>&lt;span class="nb">{cases}&lt;/span>&lt;span class="s">$$&lt;/span>
&lt;/span>&lt;/span>&lt;/code>&lt;/pre>&lt;/div>&lt;p>renders as&lt;/p>
$$
f(k;p_{0}^{*}) = \begin{cases}p_{0}^{*} &amp; \text{if }k=1, \\
1-p_{0}^{*} &amp; \text{if }k=0.\end{cases}
$$&lt;h2 id="code">Code&lt;/h2>
&lt;p>Hugo Blox Builder utilises Hugo&amp;rsquo;s Markdown extension for highlighting code syntax. The code theme can be selected in the &lt;code>config/_default/params.yaml&lt;/code> file.&lt;/p>
&lt;pre>&lt;code>```python
import pandas as pd
data = pd.read_csv(&amp;quot;data.csv&amp;quot;)
data.head()
```
&lt;/code>&lt;/pre>
&lt;p>renders as&lt;/p>
&lt;div class="highlight">&lt;pre tabindex="0" class="chroma">&lt;code class="language-python" data-lang="python">&lt;span class="line">&lt;span class="cl">&lt;span class="kn">import&lt;/span> &lt;span class="nn">pandas&lt;/span> &lt;span class="k">as&lt;/span> &lt;span class="nn">pd&lt;/span>
&lt;/span>&lt;/span>&lt;span class="line">&lt;span class="cl">&lt;span class="n">data&lt;/span> &lt;span class="o">=&lt;/span> &lt;span class="n">pd&lt;/span>&lt;span class="o">.&lt;/span>&lt;span class="n">read_csv&lt;/span>&lt;span class="p">(&lt;/span>&lt;span class="s2">&amp;#34;data.csv&amp;#34;&lt;/span>&lt;span class="p">)&lt;/span>
&lt;/span>&lt;/span>&lt;span class="line">&lt;span class="cl">&lt;span class="n">data&lt;/span>&lt;span class="o">.&lt;/span>&lt;span class="n">head&lt;/span>&lt;span class="p">()&lt;/span>
&lt;/span>&lt;/span>&lt;/code>&lt;/pre>&lt;/div>&lt;h2 id="inline-images">Inline Images&lt;/h2>
&lt;div class="highlight">&lt;pre tabindex="0" class="chroma">&lt;code class="language-go" data-lang="go">&lt;span class="line">&lt;span class="cl">&lt;span class="p">{{&amp;lt;&lt;/span> &lt;span class="nx">icon&lt;/span> &lt;span class="nx">name&lt;/span>&lt;span class="p">=&lt;/span>&lt;span class="s">&amp;#34;python&amp;#34;&lt;/span> &lt;span class="p">&amp;gt;}}&lt;/span> &lt;span class="nx">Python&lt;/span>
&lt;/span>&lt;/span>&lt;/code>&lt;/pre>&lt;/div>&lt;p>renders as&lt;/p>
&lt;p>
&lt;span class="inline-block pr-1">
&lt;svg style="height: 1em; transform: translateY(0.1em);" xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 448 512" fill="currentColor">&lt;path d="M439.8 200.5c-7.7-30.9-22.3-54.2-53.4-54.2h-40.1v47.4c0 36.8-31.2 67.8-66.8 67.8H172.7c-29.2 0-53.4 25-53.4 54.3v101.8c0 29 25.2 46 53.4 54.3 33.8 9.9 66.3 11.7 106.8 0 26.9-7.8 53.4-23.5 53.4-54.3v-40.7H226.2v-13.6h160.2c31.1 0 42.6-21.7 53.4-54.2 11.2-33.5 10.7-65.7 0-108.6zM286.2 404c11.1 0 20.1 9.1 20.1 20.3 0 11.3-9 20.4-20.1 20.4-11 0-20.1-9.2-20.1-20.4.1-11.3 9.1-20.3 20.1-20.3zM167.8 248.1h106.8c29.7 0 53.4-24.5 53.4-54.3V91.9c0-29-24.4-50.7-53.4-55.6-35.8-5.9-74.7-5.6-106.8.1-45.2 8-53.4 24.7-53.4 55.6v40.7h106.9v13.6h-147c-31.1 0-58.3 18.7-66.8 54.2-9.8 40.7-10.2 66.1 0 108.6 7.6 31.6 25.7 54.2 56.8 54.2H101v-48.8c0-35.3 30.5-66.4 66.8-66.4zm-6.7-142.6c-11.1 0-20.1-9.1-20.1-20.3.1-11.3 9-20.4 20.1-20.4 11 0 20.1 9.2 20.1 20.4s-9 20.3-20.1 20.3z"/>&lt;/svg>
&lt;/span> Python&lt;/p>
&lt;h2 id="did-you-find-this-page-helpful-consider-sharing-it-">Did you find this page helpful? Consider sharing it 🙌&lt;/h2></description></item><item><title>Authors</title><link/><pubDate>Tue, 24 Oct 2023 00:00:00 +0000</pubDate><guid/><description>&lt;p>Author of this website&lt;/p></description></item><item><title>Uses</title><link>https://hewfw.github.io/blog_theme/uses/</link><pubDate>Tue, 24 Oct 2023 00:00:00 +0000</pubDate><guid>https://hewfw.github.io/blog_theme/uses/</guid><description>&lt;p>The idea of a Uses page is to tell you about the stuff I use.&lt;/p>
&lt;p>Make sure to check out &lt;a href="https://uses.tech/" target="_blank" rel="noopener">uses.tech&lt;/a> for a list of everyone&amp;rsquo;s Uses pages!&lt;/p>
&lt;p>I often get asked about what software or hardware I use, so this page will serve as a living document and a place to point curious readers to when I get asked.&lt;/p>
&lt;h2 id="website">Website&lt;/h2>
&lt;ul>
&lt;li>&lt;a href="https://hugoblox.com" target="_blank" rel="noopener">Hugo Blox&lt;/a> (see the tutorial on &lt;a href="https://hewfw.github.io/blog_theme/blog/get-started/">Getting Started&lt;/a>)&lt;/li>
&lt;/ul>
&lt;h2 id="editor--terminal">Editor + Terminal&lt;/h2>
&lt;ul>
&lt;li>&lt;a href="https://code.visualstudio.com/" target="_blank" rel="noopener">Visual Studio Code&lt;/a> is my current editor&lt;/li>
&lt;li>Chrome is my main browser&lt;/li>
&lt;li>iTerm2 is my terminal&lt;/li>
&lt;/ul>
&lt;h2 id="desktop-apps">Desktop Apps&lt;/h2>
&lt;ul>
&lt;li>Better Touch Tool for window management and custom keyboard shortcuts&lt;/li>
&lt;/ul></description></item><item><title>✅ Manage your projects</title><link>https://hewfw.github.io/blog_theme/blog/project-management/</link><pubDate>Mon, 23 Oct 2023 00:00:00 +0000</pubDate><guid>https://hewfw.github.io/blog_theme/blog/project-management/</guid><description>&lt;p>Easily manage your projects - create ideation mind maps, Gantt charts, todo lists, and more!&lt;/p>
&lt;h2 id="ideation">Ideation&lt;/h2>
&lt;p>Hugo Blox supports a Markdown extension for mindmaps.&lt;/p>
&lt;p>Simply insert a Markdown code block labelled as &lt;code>markmap&lt;/code> and optionally set the height of the mindmap as shown in the example below.&lt;/p>
&lt;p>Mindmaps can be created by simply writing the items as a Markdown list within the &lt;code>markmap&lt;/code> code block, indenting each item to create as many sub-levels as you need:&lt;/p>
&lt;div class="highlight">
&lt;pre class="chroma">
&lt;code>
```markmap {height="200px"}
- Hugo Modules
- Hugo Blox
- blox-plugins-netlify
- blox-plugins-netlify-cms
- blox-plugins-reveal
```
&lt;/code>
&lt;/pre>
&lt;/div>
&lt;p>renders as&lt;/p>
&lt;div class="markmap" style="height: 200px;">
&lt;pre>- Hugo Modules
- Hugo Blox
- blox-plugins-netlify
- blox-plugins-netlify-cms
- blox-plugins-reveal&lt;/pre>
&lt;/div>
&lt;h2 id="diagrams">Diagrams&lt;/h2>
&lt;p>Hugo Blox supports the &lt;em>Mermaid&lt;/em> Markdown extension for diagrams.&lt;/p>
&lt;p>An example &lt;strong>Gantt diagram&lt;/strong>:&lt;/p>
&lt;pre>&lt;code>```mermaid
gantt
section Section
Completed :done, des1, 2014-01-06,2014-01-08
Active :active, des2, 2014-01-07, 3d
Parallel 1 : des3, after des1, 1d
Parallel 2 : des4, after des1, 1d
Parallel 3 : des5, after des3, 1d
Parallel 4 : des6, after des4, 1d
```
&lt;/code>&lt;/pre>
&lt;p>renders as&lt;/p>
&lt;div class="mermaid">gantt
section Section
Completed :done, des1, 2014-01-06,2014-01-08
Active :active, des2, 2014-01-07, 3d
Parallel 1 : des3, after des1, 1d
Parallel 2 : des4, after des1, 1d
Parallel 3 : des5, after des3, 1d
Parallel 4 : des6, after des4, 1d
&lt;/div>
&lt;h2 id="todo-lists">Todo lists&lt;/h2>
&lt;p>You can even write your todo lists in Markdown too:&lt;/p>
&lt;div class="highlight">&lt;pre tabindex="0" class="chroma">&lt;code class="language-markdown" data-lang="markdown">&lt;span class="line">&lt;span class="cl">&lt;span class="k">- [x]&lt;/span> Write math example
&lt;/span>&lt;/span>&lt;span class="line">&lt;span class="cl"> &lt;span class="k">- [x]&lt;/span> Write diagram example
&lt;/span>&lt;/span>&lt;span class="line">&lt;span class="cl">&lt;span class="k">- [ ]&lt;/span> Do something else
&lt;/span>&lt;/span>&lt;/code>&lt;/pre>&lt;/div>&lt;p>renders as&lt;/p>
&lt;ul>
&lt;li>&lt;input checked="" disabled="" type="checkbox"> Write math example
&lt;ul>
&lt;li>&lt;input checked="" disabled="" type="checkbox"> Write diagram example&lt;/li>
&lt;/ul>
&lt;/li>
&lt;li>&lt;input disabled="" type="checkbox"> Do something else&lt;/li>
&lt;/ul>
&lt;h2 id="did-you-find-this-page-helpful-consider-sharing-it-">Did you find this page helpful? Consider sharing it 🙌&lt;/h2></description></item></channel></rss>