https://ivanvg.dev • This is a web feed, also known as an Atom feed. Subscribe by copying the URL from the address bar into your newsreader. Visit About Feeds to learn more and get started. It's free. Visit website Recent posts Updated on $DATE date example Ivan Goncharov's notes on software engineering, systems, developer tools, and things learned along the way. Zola2017-09-24T00:00:00+00:00https://ivanvg.dev/tags/example/atom.xml 2017-09-24T00:00:00+00:00 2017-09-24T00:00:00+00:00 Ivan Goncharov https://ivanvg.dev/blog/code-example/ <p>Have code snippets complete with <strong>clipboard functionality</strong> and <strong>fancy language tags</strong>. No more boring code snippets in your pages. Oh yeah baby! Click on this article to see some code in action.</p> <span id="continue-reading"></span><pre class="giallo z-code"><code data-lang="rust"><span class="giallo-l"></span> <span class="giallo-l"><span class="z-keyword">fn</span><span class="z-entity z-name z-function"> main</span><span class="z-punctuation">() {</span></span> <span class="giallo-l"><span class="z-entity z-name z-function z-macro z-rust"> println!</span><span class="z-punctuation">(</span><span class="z-punctuation z-definition z-string z-string">&quot;Hello World&quot;</span><span class="z-punctuation">);</span></span> <span class="giallo-l"><span class="z-punctuation">}</span></span></code></pre> <p>Same snippet with line numbers:</p> <pre class="giallo z-code"><code data-lang="rust"><span class="giallo-l"><span aria-hidden="true" class="giallo-ln">1</span><span class="z-keyword">fn</span><span class="z-entity z-name z-function"> main</span><span class="z-punctuation">() {</span></span> <span class="giallo-l"><span aria-hidden="true" class="giallo-ln">2</span><span class="z-entity z-name z-function z-macro z-rust"> println!</span><span class="z-punctuation">(</span><span class="z-punctuation z-definition z-string z-string">&quot;Hello World&quot;</span><span class="z-punctuation">);</span></span> <span class="giallo-l"><span aria-hidden="true" class="giallo-ln">3</span><span class="z-punctuation">}</span></span></code></pre> <p>Same snippet with line numbers and line highlighting:</p> <pre class="giallo z-code"><code data-lang="rust"><span class="giallo-l"><span aria-hidden="true" class="giallo-ln">1</span><span class="z-keyword">fn</span><span class="z-entity z-name z-function"> main</span><span class="z-punctuation">() {</span></span> <span class="giallo-l z-hl"><span aria-hidden="true" class="giallo-ln">2</span><span class="z-entity z-name z-function z-macro z-rust"> println!</span><span class="z-punctuation">(</span><span class="z-punctuation z-definition z-string z-string">&quot;Hello World&quot;</span><span class="z-punctuation">);</span></span> <span class="giallo-l"><span aria-hidden="true" class="giallo-ln">3</span><span class="z-punctuation">}</span></span></code></pre> <p>Python example:</p> <pre class="giallo z-code"><code data-lang="python"><span class="giallo-l"></span> <span class="giallo-l"><span class="z-storage z-type z-function z-python">def</span><span class="z-entity z-name z-function"> main</span><span class="z-punctuation">():</span></span> <span class="giallo-l"><span class="z-support z-function z-builtin z-python"> print</span><span class="z-punctuation">(</span><span class="z-punctuation z-definition z-string z-string">&quot;Hello, world!&quot;</span><span class="z-punctuation">)</span></span></code></pre> <p>This is another code block with syntax highlighting. It’s pretty cool, right? You can also have inline code like this: <code>var example = true</code>.</p> <!-- prettier-ignore--> <pre class="giallo z-code"><code data-lang="javascript"><span class="giallo-l"></span> <span class="giallo-l"><span class="z-storage z-type">function</span><span class="z-entity z-name z-function"> debounce</span><span class="z-punctuation">(</span><span class="z-variable z-parameter">func</span><span class="z-punctuation">,</span><span class="z-variable z-parameter"> wait</span><span class="z-punctuation">) {</span></span> <span class="giallo-l"><span class="z-storage z-type"> var</span><span class="z-variable z-other z-readwrite"> timeout</span><span class="z-punctuation">;</span></span> <span class="giallo-l"></span> <span class="giallo-l"><span class="z-keyword z-storage z-type"> return function</span><span class="z-punctuation"> () {</span></span> <span class="giallo-l"><span class="z-storage z-type"> var</span><span class="z-variable z-other z-readwrite"> context</span><span class="z-keyword z-operator"> =</span><span class="z-variable z-language z-this"> this</span><span class="z-punctuation">;</span></span> <span class="giallo-l"><span class="z-storage z-type"> var</span><span class="z-variable z-other z-readwrite"> args</span><span class="z-keyword z-operator"> =</span><span class="z-source"> arguments</span><span class="z-punctuation">;</span></span> <span class="giallo-l"><span class="z-entity z-name z-function"> clearTimeout</span><span class="z-source z-variable z-other z-readwrite">(timeout)</span><span class="z-punctuation">;</span></span> <span class="giallo-l"></span> <span class="giallo-l"><span class="z-variable z-other z-readwrite"> timeout</span><span class="z-keyword z-operator"> =</span><span class="z-entity z-name z-function"> setTimeout</span><span class="z-source">(</span><span class="z-storage z-type">function</span><span class="z-punctuation"> () {</span></span> <span class="giallo-l"><span class="z-variable z-other z-readwrite"> timeout</span><span class="z-keyword z-operator"> =</span><span class="z-constant z-language z-null z-js"> null</span><span class="z-punctuation">;</span></span> <span class="giallo-l"><span class="z-source"> func</span><span class="z-punctuation z-accessor">.</span><span class="z-entity z-name z-function">apply</span><span class="z-source z-variable z-other z-readwrite">(context</span><span class="z-punctuation">,</span><span class="z-variable z-other z-readwrite z-source"> args)</span><span class="z-punctuation">;</span></span> <span class="giallo-l"><span class="z-punctuation"> },</span><span class="z-variable z-other z-readwrite z-source"> wait)</span><span class="z-punctuation">;</span></span> <span class="giallo-l"><span class="z-punctuation"> };</span></span> <span class="giallo-l"><span class="z-punctuation">}</span></span></code></pre>

Syntax highlighting and code block examples.