https://ikram-md.github.io/prime-comet/Ikram MESSADIHugo Blox Builder (https://hugoblox.com)en-usMon, 24 Oct 2022 00:00:00 +0000https://ikram-md.github.io/prime-comet/media/icon_hu_421407e82ff53b6b.pnghttps://ikram-md.github.io/prime-comet/https://ikram-md.github.io/prime-comet/event/example/Sat, 01 Jun 2030 13:00:00 +0000https://ikram-md.github.io/prime-comet/event/example/<div class="flex px-4 py-3 mb-6 rounded-md bg-primary-100 dark:bg-primary-900"> <span class="pr-3 pt-1 text-primary-600 dark:text-primary-300"> <svg height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><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"/></svg> </span> <span class="dark:text-neutral-300">Click on the <strong>Slides</strong> button above to view the built-in slides feature.</span> </div> <p>Slides can be added in a few ways:</p> <ul> <li><strong>Create</strong> slides using Hugo Blox Builder&rsquo;s feature and link using the <code>slides</code> parameter in the front matter of the talk file</li> <li><strong>Upload</strong> an existing slide deck to this page bundle and link it using <code>links: [{ type: slides, url: path/to/file } ]</code> in front matter</li> <li><strong>Embed</strong> your slides (e.g. Google Slides) or presentation video on this page using .</li> </ul> <p>Further event details, including such as image galleries, can be added to the body of this page.</p>https://ikram-md.github.io/prime-comet/publication/conference-paper/Mon, 04 Aug 2025 00:00:00 +0000https://ikram-md.github.io/prime-comet/publication/conference-paper/<!-- <div class="flex px-4 py-3 mb-6 rounded-md bg-primary-100 dark:bg-primary-900"> <span class="pr-3 pt-1 text-primary-600 dark:text-primary-300"> <svg height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><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"/></svg> </span> <span class="dark:text-neutral-300">Click the <em>Cite</em> button above to demo the feature to enable visitors to import publication metadata into their reference management software.</span> </div> --> <!-- <div class="flex px-4 py-3 mb-6 rounded-md bg-primary-100 dark:bg-primary-900"> <span class="pr-3 pt-1 text-primary-600 dark:text-primary-300"> <svg height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><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"/></svg> </span> <span class="dark:text-neutral-300">Create your slides in Markdown - click the <em>Slides</em> button to check out the example.</span> </div> --> <!-- Add the publication's **full text** or **supplementary notes** here. You can use rich formatting such as including [code, math, and images](https://docs.hugoblox.com/content/writing-markdown-latex/).https://ikram-md.github.io/prime-comet/post/where-is-my-script/Fri, 25 Jul 2025 00:00:00 +0000https://ikram-md.github.io/prime-comet/post/where-is-my-script/<p>We have all been there, when you realize that the results you have obtained are quiet wierd and you start to doubt that maybe I did a mistake somwhere in the data processing code. But geuss what, the codebase is large, there are many datasets and different scripts for every dataset and you were in such a rush that you fogot documentation. If this feels familiar, then I got you.</p> <p>One of the lessons I learned in my previous job as a software developer is that : “strcuture matters” and this doesn’t only apply on software engineering projects consiting of front-end, back-end and devops part. But also in machine learning project, since after all, all the math on the board is translated into code written and reviewed by humans. Before starting any data science or machine learning project one should always think about the structure. Today, one the first things I ask myself before stepping into the model-engineering step (in which you translate the theory you discussed with your colleagues to code) is : <em>“How can I build this so that it’s dynamic to any dataset or model additions that I could do later” And turns out the time spent attempting to answer is never gone to a waste.</em></p> <p>Whether it’s in a data science job within a company, or a project to be published one day. A good structure is the reason why we can <em>easily stand on the shoulder of giants</em> these days; Therefore, In this blogpost, I will be sharing some of my tips on what I think helps towards building a structure that scales with augmentation and project complexities along with modern tools that help tidy up the code and the process of building the blocks.</p> <h2 id="techniques-and-steps">Techniques and steps</h2> <h3 id="know-your-enemy">Know your enemy</h3>https://ikram-md.github.io/prime-comet/projects/Sun, 19 May 2024 00:00:00 +0000https://ikram-md.github.io/prime-comet/projects/https://ikram-md.github.io/prime-comet/project/pandas/Thu, 26 Oct 2023 00:00:00 +0000https://ikram-md.github.io/prime-comet/project/pandas/<p>Flexible and powerful data analysis / manipulation library for Python, providing labeled data structures.</p>https://ikram-md.github.io/prime-comet/project/pytorch/Thu, 26 Oct 2023 00:00:00 +0000https://ikram-md.github.io/prime-comet/project/pytorch/<p>PyTorch is a Python package that provides tensor computation (like NumPy) with strong GPU acceleration.</p>https://ikram-md.github.io/prime-comet/project/scikit/Thu, 26 Oct 2023 00:00:00 +0000https://ikram-md.github.io/prime-comet/project/scikit/<p>scikit-learn is a Python module for machine learning built on top of SciPy and is distributed under the 3-Clause BSD license.</p>https://ikram-md.github.io/prime-comet/experience/Tue, 24 Oct 2023 00:00:00 +0000https://ikram-md.github.io/prime-comet/experience/https://ikram-md.github.io/prime-comet/teaching/js/Tue, 24 Oct 2023 00:00:00 +0000https://ikram-md.github.io/prime-comet/teaching/js/<p> 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.</p> <p><strong>Embed videos, podcasts, code, LaTeX math, and even test students!</strong></p> <p>On this page, you&rsquo;ll find some examples of the types of technical content that can be rendered with Hugo Blox.</p> <h2 id="video">Video</h2> <p>Teach your course by sharing videos with your students. Choose from one of the following approaches:</p> <div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;"> <iframe allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share; fullscreen" 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"></iframe> </div> <p><strong>Youtube</strong>:</p> <pre><code>{{&lt; youtube w7Ft2ymGmfc &gt;}} </code></pre> <p><strong>Bilibili</strong>:</p> <pre><code>{{&lt; bilibili id=&quot;BV1WV4y1r7DF&quot; &gt;}} </code></pre> <p><strong>Video file</strong></p> <p>Videos may be added to a page by either placing them in your <code>assets/media/</code> media library or in your , and then embedding them with the <em>video</em> shortcode:</p> <pre><code>{{&lt; video src=&quot;my_video.mp4&quot; controls=&quot;yes&quot; &gt;}} </code></pre> <h2 id="podcast">Podcast</h2> <p>You can add a podcast or music to a page by placing the MP3 file in the page&rsquo;s folder or the media library folder and then embedding the audio on your page with the <em>audio</em> shortcode:</p> <pre><code>{{&lt; audio src=&quot;ambient-piano.mp3&quot; &gt;}} </code></pre> <p>Try it out:</p> <audio controls > <source src="https://ikram-md.github.io/prime-comet/teaching/js/ambient-piano.mp3" type="audio/mpeg"> </audio> <h2 id="test-students">Test students</h2> <p>Provide a simple yet fun self-assessment by revealing the solutions to challenges with the <code>spoiler</code> shortcode:</p> <div class="highlight"><pre tabindex="0" class="chroma"><code class="language-markdown" data-lang="markdown"><span class="line"><span class="cl">{{<span class="p">&lt;</span> <span class="nt">spoiler</span> <span class="na">text</span><span class="o">=</span><span class="s">&#34;👉 Click to view the solution&#34;</span> <span class="p">&gt;</span>}} </span></span><span class="line"><span class="cl">You found me! </span></span><span class="line"><span class="cl">{{<span class="p">&lt;</span> <span class="p">/</span><span class="nt">spoiler</span> <span class="p">&gt;</span>}} </span></span></code></pre></div><p>renders as</p> <details class="spoiler " id="spoiler-2"> <summary class="cursor-pointer">👉 Click to view the solution</summary> <div class="rounded-lg bg-neutral-50 dark:bg-neutral-800 p-2"> You found me 🎉 </div> </details> <h2 id="math">Math</h2> <p>Hugo Blox Builder supports a Markdown extension for $\LaTeX$ math. You can enable this feature by toggling the <code>math</code> option in your <code>config/_default/params.yaml</code> file.</p> <p>To render <em>inline</em> or <em>block</em> math, wrap your LaTeX math with <code>{{&lt; math &gt;}}$...${{&lt; /math &gt;}}</code> or <code>{{&lt; math &gt;}}$$...$${{&lt; /math &gt;}}</code>, respectively.</p> <div class="flex px-4 py-3 mb-6 rounded-md bg-primary-100 dark:bg-primary-900"> <span class="pr-3 pt-1 text-primary-600 dark:text-primary-300"> <svg height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><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"/></svg> </span> <span class="dark:text-neutral-300">We wrap the LaTeX math in the Hugo Blox <em>math</em> shortcode to prevent Hugo rendering our math as Markdown.</span> </div> <p>Example <strong>math block</strong>:</p> <div class="highlight"><pre tabindex="0" class="chroma"><code class="language-latex" data-lang="latex"><span class="line"><span class="cl"><span class="nb">{{</span>&lt; math &gt;<span class="nb">}}</span> </span></span><span class="line"><span class="cl"><span class="sb">$$</span><span class="nb"> </span></span></span><span class="line"><span class="cl"><span class="nb"></span><span class="nv">\gamma</span><span class="nb">_{n} </span><span class="o">=</span><span class="nb"> </span><span class="nv">\frac</span><span class="nb">{ </span><span class="nv">\left</span><span class="nb"> | </span><span class="nv">\left</span><span class="nb"> </span><span class="o">(</span><span class="nv">\mathbf</span><span class="nb"> x_{n} </span><span class="o">-</span><span class="nb"> </span><span class="nv">\mathbf</span><span class="nb"> x_{n</span><span class="o">-</span><span class="m">1</span><span class="nb">} </span><span class="nv">\right</span><span class="nb"> </span><span class="o">)</span><span class="nb">^T </span><span class="nv">\left</span><span class="nb"> </span><span class="o">[</span><span class="nv">\nabla</span><span class="nb"> F </span><span class="o">(</span><span class="nv">\mathbf</span><span class="nb"> x_{n}</span><span class="o">)</span><span class="nb"> </span><span class="o">-</span><span class="nb"> </span><span class="nv">\nabla</span><span class="nb"> F </span><span class="o">(</span><span class="nv">\mathbf</span><span class="nb"> x_{n</span><span class="o">-</span><span class="m">1</span><span class="nb">}</span><span class="o">)</span><span class="nb"> </span><span class="nv">\right</span><span class="nb"> </span><span class="o">]</span><span class="nb"> </span><span class="nv">\right</span><span class="nb"> |}{</span><span class="nv">\left</span><span class="nb"> </span><span class="nv">\|\nabla</span><span class="nb"> F</span><span class="o">(</span><span class="nv">\mathbf</span><span class="nb">{x}_{n}</span><span class="o">)</span><span class="nb"> </span><span class="o">-</span><span class="nb"> </span><span class="nv">\nabla</span><span class="nb"> F</span><span class="o">(</span><span class="nv">\mathbf</span><span class="nb">{x}_{n</span><span class="o">-</span><span class="m">1</span><span class="nb">}</span><span class="o">)</span><span class="nb"> </span><span class="nv">\right</span><span class="nb"> </span><span class="nv">\|</span><span class="nb">^</span><span class="m">2</span><span class="nb">} </span></span></span><span class="line"><span class="cl"><span class="nb"></span><span class="s">$$</span> </span></span><span class="line"><span class="cl"><span class="nb">{{</span>&lt; /math &gt;<span class="nb">}}</span> </span></span></code></pre></div><p>renders as</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}$$ <p>Example <strong>inline math</strong> <code>{{&lt; math &gt;}}$\nabla F(\mathbf{x}_{n})${{&lt; /math &gt;}}</code> renders as $\nabla F(\mathbf{x}_{n})$ .</p> <p>Example <strong>multi-line math</strong> using the math linebreak (<code>\\</code>):</p> <div class="highlight"><pre tabindex="0" class="chroma"><code class="language-latex" data-lang="latex"><span class="line"><span class="cl"><span class="nb">{{</span>&lt; math &gt;<span class="nb">}}</span> </span></span><span class="line"><span class="cl"><span class="sb">$$</span><span class="nb">f</span><span class="o">(</span><span class="nb">k;p_{</span><span class="m">0</span><span class="nb">}^{</span><span class="o">*</span><span class="nb">}</span><span class="o">)</span><span class="nb"> </span><span class="o">=</span><span class="nb"> </span><span class="nv">\begin</span><span class="nb">{cases}p_{</span><span class="m">0</span><span class="nb">}^{</span><span class="o">*</span><span class="nb">} &amp; </span><span class="nv">\text</span><span class="nb">{if }k</span><span class="o">=</span><span class="m">1</span><span class="nb">, </span><span class="nv">\\</span><span class="nb"> </span></span></span><span class="line"><span class="cl"><span class="nb"></span><span class="m">1</span><span class="o">-</span><span class="nb">p_{</span><span class="m">0</span><span class="nb">}^{</span><span class="o">*</span><span class="nb">} &amp; </span><span class="nv">\text</span><span class="nb">{if }k</span><span class="o">=</span><span class="m">0</span><span class="nb">.</span><span class="nv">\end</span><span class="nb">{cases}</span><span class="s">$$</span> </span></span><span class="line"><span class="cl"><span class="nb">{{</span>&lt; /math &gt;<span class="nb">}}</span> </span></span></code></pre></div><p>renders as</p> $$ f(k;p_{0}^{*}) = \begin{cases}p_{0}^{*} & \text{if }k=1, \\ 1-p_{0}^{*} & \text{if }k=0.\end{cases} $$ <h2 id="code">Code</h2> <p>Hugo Blox Builder utilises Hugo&rsquo;s Markdown extension for highlighting code syntax. The code theme can be selected in the <code>config/_default/params.yaml</code> file.</p> <pre><code>```python import pandas as pd data = pd.read_csv(&quot;data.csv&quot;) data.head() ``` </code></pre> <p>renders as</p> <div class="highlight"><pre tabindex="0" class="chroma"><code class="language-python" data-lang="python"><span class="line"><span class="cl"><span class="kn">import</span> <span class="nn">pandas</span> <span class="k">as</span> <span class="nn">pd</span> </span></span><span class="line"><span class="cl"><span class="n">data</span> <span class="o">=</span> <span class="n">pd</span><span class="o">.</span><span class="n">read_csv</span><span class="p">(</span><span class="s2">&#34;data.csv&#34;</span><span class="p">)</span> </span></span><span class="line"><span class="cl"><span class="n">data</span><span class="o">.</span><span class="n">head</span><span class="p">()</span> </span></span></code></pre></div><h2 id="inline-images">Inline Images</h2> <div class="highlight"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="p">{{&lt;</span> <span class="nx">icon</span> <span class="nx">name</span><span class="p">=</span><span class="s">&#34;python&#34;</span> <span class="p">&gt;}}</span> <span class="nx">Python</span> </span></span></code></pre></div><p>renders as</p> <p> <span class="inline-block pr-1"> <svg style="height: 1em; transform: translateY(0.1em);" xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 448 512" fill="currentColor"><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"/></svg> </span> Python</p> <h2 id="did-you-find-this-page-helpful-consider-sharing-it-">Did you find this page helpful? Consider sharing it 🙌</h2>https://ikram-md.github.io/prime-comet/teaching/python/Tue, 24 Oct 2023 00:00:00 +0000https://ikram-md.github.io/prime-comet/teaching/python/<p> 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.</p> <p><strong>Embed videos, podcasts, code, LaTeX math, and even test students!</strong></p> <p>On this page, you&rsquo;ll find some examples of the types of technical content that can be rendered with Hugo Blox.</p> <h2 id="video">Video</h2> <p>Teach your course by sharing videos with your students. Choose from one of the following approaches:</p> <div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;"> <iframe allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share; fullscreen" 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"></iframe> </div> <p><strong>Youtube</strong>:</p> <pre><code>{{&lt; youtube w7Ft2ymGmfc &gt;}} </code></pre> <p><strong>Bilibili</strong>:</p> <pre><code>{{&lt; bilibili id=&quot;BV1WV4y1r7DF&quot; &gt;}} </code></pre> <p><strong>Video file</strong></p> <p>Videos may be added to a page by either placing them in your <code>assets/media/</code> media library or in your , and then embedding them with the <em>video</em> shortcode:</p> <pre><code>{{&lt; video src=&quot;my_video.mp4&quot; controls=&quot;yes&quot; &gt;}} </code></pre> <h2 id="podcast">Podcast</h2> <p>You can add a podcast or music to a page by placing the MP3 file in the page&rsquo;s folder or the media library folder and then embedding the audio on your page with the <em>audio</em> shortcode:</p> <pre><code>{{&lt; audio src=&quot;ambient-piano.mp3&quot; &gt;}} </code></pre> <p>Try it out:</p> <audio controls > <source src="https://ikram-md.github.io/prime-comet/teaching/python/ambient-piano.mp3" type="audio/mpeg"> </audio> <h2 id="test-students">Test students</h2> <p>Provide a simple yet fun self-assessment by revealing the solutions to challenges with the <code>spoiler</code> shortcode:</p> <div class="highlight"><pre tabindex="0" class="chroma"><code class="language-markdown" data-lang="markdown"><span class="line"><span class="cl">{{<span class="p">&lt;</span> <span class="nt">spoiler</span> <span class="na">text</span><span class="o">=</span><span class="s">&#34;👉 Click to view the solution&#34;</span> <span class="p">&gt;</span>}} </span></span><span class="line"><span class="cl">You found me! </span></span><span class="line"><span class="cl">{{<span class="p">&lt;</span> <span class="p">/</span><span class="nt">spoiler</span> <span class="p">&gt;</span>}} </span></span></code></pre></div><p>renders as</p> <details class="spoiler " id="spoiler-2"> <summary class="cursor-pointer">👉 Click to view the solution</summary> <div class="rounded-lg bg-neutral-50 dark:bg-neutral-800 p-2"> You found me 🎉 </div> </details> <h2 id="math">Math</h2> <p>Hugo Blox Builder supports a Markdown extension for $\LaTeX$ math. You can enable this feature by toggling the <code>math</code> option in your <code>config/_default/params.yaml</code> file.</p> <p>To render <em>inline</em> or <em>block</em> math, wrap your LaTeX math with <code>{{&lt; math &gt;}}$...${{&lt; /math &gt;}}</code> or <code>{{&lt; math &gt;}}$$...$${{&lt; /math &gt;}}</code>, respectively.</p> <div class="flex px-4 py-3 mb-6 rounded-md bg-primary-100 dark:bg-primary-900"> <span class="pr-3 pt-1 text-primary-600 dark:text-primary-300"> <svg height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><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"/></svg> </span> <span class="dark:text-neutral-300">We wrap the LaTeX math in the Hugo Blox <em>math</em> shortcode to prevent Hugo rendering our math as Markdown.</span> </div> <p>Example <strong>math block</strong>:</p> <div class="highlight"><pre tabindex="0" class="chroma"><code class="language-latex" data-lang="latex"><span class="line"><span class="cl"><span class="nb">{{</span>&lt; math &gt;<span class="nb">}}</span> </span></span><span class="line"><span class="cl"><span class="sb">$$</span><span class="nb"> </span></span></span><span class="line"><span class="cl"><span class="nb"></span><span class="nv">\gamma</span><span class="nb">_{n} </span><span class="o">=</span><span class="nb"> </span><span class="nv">\frac</span><span class="nb">{ </span><span class="nv">\left</span><span class="nb"> | </span><span class="nv">\left</span><span class="nb"> </span><span class="o">(</span><span class="nv">\mathbf</span><span class="nb"> x_{n} </span><span class="o">-</span><span class="nb"> </span><span class="nv">\mathbf</span><span class="nb"> x_{n</span><span class="o">-</span><span class="m">1</span><span class="nb">} </span><span class="nv">\right</span><span class="nb"> </span><span class="o">)</span><span class="nb">^T </span><span class="nv">\left</span><span class="nb"> </span><span class="o">[</span><span class="nv">\nabla</span><span class="nb"> F </span><span class="o">(</span><span class="nv">\mathbf</span><span class="nb"> x_{n}</span><span class="o">)</span><span class="nb"> </span><span class="o">-</span><span class="nb"> </span><span class="nv">\nabla</span><span class="nb"> F </span><span class="o">(</span><span class="nv">\mathbf</span><span class="nb"> x_{n</span><span class="o">-</span><span class="m">1</span><span class="nb">}</span><span class="o">)</span><span class="nb"> </span><span class="nv">\right</span><span class="nb"> </span><span class="o">]</span><span class="nb"> </span><span class="nv">\right</span><span class="nb"> |}{</span><span class="nv">\left</span><span class="nb"> </span><span class="nv">\|\nabla</span><span class="nb"> F</span><span class="o">(</span><span class="nv">\mathbf</span><span class="nb">{x}_{n}</span><span class="o">)</span><span class="nb"> </span><span class="o">-</span><span class="nb"> </span><span class="nv">\nabla</span><span class="nb"> F</span><span class="o">(</span><span class="nv">\mathbf</span><span class="nb">{x}_{n</span><span class="o">-</span><span class="m">1</span><span class="nb">}</span><span class="o">)</span><span class="nb"> </span><span class="nv">\right</span><span class="nb"> </span><span class="nv">\|</span><span class="nb">^</span><span class="m">2</span><span class="nb">} </span></span></span><span class="line"><span class="cl"><span class="nb"></span><span class="s">$$</span> </span></span><span class="line"><span class="cl"><span class="nb">{{</span>&lt; /math &gt;<span class="nb">}}</span> </span></span></code></pre></div><p>renders as</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}$$ <p>Example <strong>inline math</strong> <code>{{&lt; math &gt;}}$\nabla F(\mathbf{x}_{n})${{&lt; /math &gt;}}</code> renders as $\nabla F(\mathbf{x}_{n})$ .</p> <p>Example <strong>multi-line math</strong> using the math linebreak (<code>\\</code>):</p> <div class="highlight"><pre tabindex="0" class="chroma"><code class="language-latex" data-lang="latex"><span class="line"><span class="cl"><span class="nb">{{</span>&lt; math &gt;<span class="nb">}}</span> </span></span><span class="line"><span class="cl"><span class="sb">$$</span><span class="nb">f</span><span class="o">(</span><span class="nb">k;p_{</span><span class="m">0</span><span class="nb">}^{</span><span class="o">*</span><span class="nb">}</span><span class="o">)</span><span class="nb"> </span><span class="o">=</span><span class="nb"> </span><span class="nv">\begin</span><span class="nb">{cases}p_{</span><span class="m">0</span><span class="nb">}^{</span><span class="o">*</span><span class="nb">} &amp; </span><span class="nv">\text</span><span class="nb">{if }k</span><span class="o">=</span><span class="m">1</span><span class="nb">, </span><span class="nv">\\</span><span class="nb"> </span></span></span><span class="line"><span class="cl"><span class="nb"></span><span class="m">1</span><span class="o">-</span><span class="nb">p_{</span><span class="m">0</span><span class="nb">}^{</span><span class="o">*</span><span class="nb">} &amp; </span><span class="nv">\text</span><span class="nb">{if }k</span><span class="o">=</span><span class="m">0</span><span class="nb">.</span><span class="nv">\end</span><span class="nb">{cases}</span><span class="s">$$</span> </span></span><span class="line"><span class="cl"><span class="nb">{{</span>&lt; /math &gt;<span class="nb">}}</span> </span></span></code></pre></div><p>renders as</p> $$ f(k;p_{0}^{*}) = \begin{cases}p_{0}^{*} & \text{if }k=1, \\ 1-p_{0}^{*} & \text{if }k=0.\end{cases} $$ <h2 id="code">Code</h2> <p>Hugo Blox Builder utilises Hugo&rsquo;s Markdown extension for highlighting code syntax. The code theme can be selected in the <code>config/_default/params.yaml</code> file.</p> <pre><code>```python import pandas as pd data = pd.read_csv(&quot;data.csv&quot;) data.head() ``` </code></pre> <p>renders as</p> <div class="highlight"><pre tabindex="0" class="chroma"><code class="language-python" data-lang="python"><span class="line"><span class="cl"><span class="kn">import</span> <span class="nn">pandas</span> <span class="k">as</span> <span class="nn">pd</span> </span></span><span class="line"><span class="cl"><span class="n">data</span> <span class="o">=</span> <span class="n">pd</span><span class="o">.</span><span class="n">read_csv</span><span class="p">(</span><span class="s2">&#34;data.csv&#34;</span><span class="p">)</span> </span></span><span class="line"><span class="cl"><span class="n">data</span><span class="o">.</span><span class="n">head</span><span class="p">()</span> </span></span></code></pre></div><h2 id="inline-images">Inline Images</h2> <div class="highlight"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="p">{{&lt;</span> <span class="nx">icon</span> <span class="nx">name</span><span class="p">=</span><span class="s">&#34;python&#34;</span> <span class="p">&gt;}}</span> <span class="nx">Python</span> </span></span></code></pre></div><p>renders as</p> <p> <span class="inline-block pr-1"> <svg style="height: 1em; transform: translateY(0.1em);" xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 448 512" fill="currentColor"><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"/></svg> </span> Python</p> <h2 id="did-you-find-this-page-helpful-consider-sharing-it-">Did you find this page helpful? Consider sharing it 🙌</h2>