daniel/developerbedoya.net
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Migrar de novo para gitea 🙏

Browse Source
This commit is contained in:
Daniel Bedoya Alzate
2025-12-25 04:35:39 -03:00
parent 9d45b0adde
commit 6eab2ae945
237 changed files with 18444 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

285
public/posts/more-on-marp/index.html Normal file
View File

@@ -0,0 +1,285 @@
<!doctype html>
<html
class="not-ready lg:text-base"
style="--bg:#faf8f1"
lang="pt-br"
dir="ltr"
><head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no"
/>
<title>More on Marp - Developer Bedoya</title>
<meta name="theme-color" />
<meta name="description" content="Introduction I wrote a post about Marp that doesn&rsquo;t include info on how to create the html output from the original markdown file.
The following guide describes how to create a html file from marp.
Steps Install Marp. Follow the guide here.
Create your markdown file. Suppose the file is named slides.md. Convert the markdown file to html We can use marp slides.md -o slides.html. Result The markdown file is converted into a beautiful html slide." />
<meta name="author" content="Daniel Bedoya Alzate" /><link rel="preload stylesheet" as="style" href="https://developerbedoya.net/main.min.css" />
<link rel="preload" as="image" href="https://developerbedoya.net/theme.svg" />
<link rel="preload" as="image" href="https://www.gravatar.com/avatar/a59eeed83af0fccd921266a8f3e30019?s=160&amp;d=identicon" />
<link rel="preload" as="image" href="https://developerbedoya.net/twitter.svg" /><link rel="preload" as="image" href="https://developerbedoya.net/github.svg" /><link rel="preload" as="image" href="https://developerbedoya.net/instagram.svg" /><link rel="preload" as="image" href="https://developerbedoya.net/rss.svg" />
<script
defer
src="https://developerbedoya.net/highlight.min.js"
onload="hljs.initHighlightingOnLoad();"
></script>
<link
rel="icon"
href="https://developerbedoya.net/favicon.ico"
/>
<link
rel="apple-touch-icon"
href="https://developerbedoya.net/apple-touch-icon.png"
/>
<meta name="generator" content="Hugo 0.131.0">
<meta itemprop="name" content="More on Marp">
<meta itemprop="description" content="Introduction I wrote a post about Marp that doesn’t include info on how to create the html output from the original markdown file.
The following guide describes how to create a html file from marp.
Steps Install Marp. Follow the guide here.
Create your markdown file. Suppose the file is named slides.md. Convert the markdown file to html We can use marp slides.md -o slides.html. Result The markdown file is converted into a beautiful html slide.">
<meta itemprop="datePublished" content="2024-05-05T07:54:33-03:00">
<meta itemprop="dateModified" content="2024-05-05T07:54:33-03:00">
<meta itemprop="wordCount" content="76">
<meta itemprop="keywords" content="Markdown,Marp"><meta property="og:url" content="https://developerbedoya.net/posts/more-on-marp/">
<meta property="og:site_name" content="Developer Bedoya">
<meta property="og:title" content="More on Marp">
<meta property="og:description" content="Introduction I wrote a post about Marp that doesn’t include info on how to create the html output from the original markdown file.
The following guide describes how to create a html file from marp.
Steps Install Marp. Follow the guide here.
Create your markdown file. Suppose the file is named slides.md. Convert the markdown file to html We can use marp slides.md -o slides.html. Result The markdown file is converted into a beautiful html slide.">
<meta property="og:locale" content="pt_br">
<meta property="og:type" content="article">
<meta property="article:section" content="posts">
<meta property="article:published_time" content="2024-05-05T07:54:33-03:00">
<meta property="article:modified_time" content="2024-05-05T07:54:33-03:00">
<meta property="article:tag" content="Markdown">
<meta property="article:tag" content="Marp">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="More on Marp">
<meta name="twitter:description" content="Introduction I wrote a post about Marp that doesn’t include info on how to create the html output from the original markdown file.
The following guide describes how to create a html file from marp.
Steps Install Marp. Follow the guide here.
Create your markdown file. Suppose the file is named slides.md. Convert the markdown file to html We can use marp slides.md -o slides.html. Result The markdown file is converted into a beautiful html slide.">
<link rel="canonical" href="https://developerbedoya.net/posts/more-on-marp/" />
</head>
<body
class="bg-(--bg) text-black antialiased duration-200 ease-out [-webkit-tap-highlight-color:transparent] dark:text-white"
><header
class="mx-auto flex h-[4.5rem] max-w-(--w) px-8 whitespace-nowrap lg:justify-center"
>
<div class="relative z-50 flex items-center ltr:mr-auto rtl:ml-auto">
<a
class="-translate-y-[1px] text-2xl font-medium"
href="https://developerbedoya.net/"
>Developer Bedoya</a
>
<div
class="btn-dark text-[0px] ltr:ml-4 rtl:mr-4 h-6 w-6 shrink-0 cursor-pointer [background:url(./theme.svg)_left_center/cover_no-repeat] dark:invert dark:[background-position:right]"
role="button"
aria-label="Dark"
></div>
</div>
<div
class="btn-menu relative z-50 flex h-[4.5rem] w-[5rem] shrink-0 cursor-pointer flex-col items-center justify-center gap-2.5 lg:hidden ltr:-mr-8 rtl:-ml-8"
role="button"
aria-label="Menu"
></div>
<script>
const htmlClass = document.documentElement.classList;
setTimeout(() => {
htmlClass.remove('not-ready');
}, 10);
const btnMenu = document.querySelector('.btn-menu');
btnMenu.addEventListener('click', () => {
htmlClass.toggle('open');
});
const metaTheme = document.querySelector('meta[name="theme-color"]');
const lightBg = '#faf8f1'.replace(/"/g, '');
const setDark = (isDark) => {
metaTheme.setAttribute('content', isDark ? '#000' : lightBg);
htmlClass[isDark ? 'add' : 'remove']('dark');
localStorage.setItem('dark', isDark);
};
const darkScheme = window.matchMedia('(prefers-color-scheme: dark)');
if (htmlClass.contains('dark')) {
setDark(true);
} else {
const darkVal = localStorage.getItem('dark');
setDark(darkVal ? darkVal === 'true' : darkScheme.matches);
}
darkScheme.addEventListener('change', (event) => {
setDark(event.matches);
});
const btnDark = document.querySelector('.btn-dark');
btnDark.addEventListener('click', () => {
setDark(localStorage.getItem('dark') !== 'true');
});
</script>
<div
class="nav-wrapper fixed inset-x-0 top-full z-40 flex h-full flex-col justify-center bg-(--bg) pb-16 duration-200 select-none lg:static lg:h-auto lg:flex-row lg:bg-transparent! lg:pb-0 lg:transition-none"
><nav
class="lg:ml-12 lg:flex lg:flex-row lg:items-center lg:space-x-10 rtl:space-x-reverse"
><a
class="block text-center text-xl leading-[5rem] lg:text-base lg:font-normal"
href="/cv/"
>Cvs</a
><a
class="block text-center text-xl leading-[5rem] lg:text-base lg:font-normal"
href="/links/"
>Links</a
><a
class="block text-center text-xl leading-[5rem] lg:text-base lg:font-normal"
href="/posts/"
>Posts</a
><a
class="block text-center text-xl leading-[5rem] lg:text-base lg:font-normal"
href="/slides/"
>Slides</a
></nav><nav
class="mt-12 flex justify-center space-x-10 lg:mt-0 lg:items-center ltr:lg:ml-14 rtl:space-x-reverse rtl:lg:mr-14 dark:invert"
>
<a
class="h-7 w-7 text-[0px] [background:var(--url)_center_center/cover_no-repeat] lg:h-6 lg:w-6"
style="--url: url(./twitter.svg)"
href="https://twitter.com/developerbedoya"
target="_blank"
rel="me"
>twitter</a>
<a
class="h-7 w-7 text-[0px] [background:var(--url)_center_center/cover_no-repeat] lg:h-6 lg:w-6"
style="--url: url(./github.svg)"
href="https://github.com/developerbedoya"
target="_blank"
rel="me"
>github</a>
<a
class="h-7 w-7 text-[0px] [background:var(--url)_center_center/cover_no-repeat] lg:h-6 lg:w-6"
style="--url: url(./instagram.svg)"
href="https://instagram.com/developerbedoya"
target="_blank"
rel="me"
>instagram</a>
<a
class="h-7 w-7 text-[0px] [background:var(--url)_center_center/cover_no-repeat] lg:h-6 lg:w-6"
style="--url: url(./rss.svg)"
href="https://developerbedoya.net/index.xml"
target="_blank"
rel="alternate"
>rss</a>
</nav>
</div>
</header>
<main
class="prose prose-neutral dark:prose-invert relative mx-auto min-h-[calc(100vh-9rem)] max-w-(--w) px-8 pt-14 pb-16"
><article>
<header class="mb-14">
<h1 class="my-0! pb-2.5">More on Marp</h1><div class="text-xs antialiased opacity-60"><time>May 5, 2024</time></div></header>
<section><h2 id="introduction">Introduction</h2>
<p>I wrote a post about Marp that doesn&rsquo;t include info on how to create the html output from the original markdown file.</p>
<p>The following guide describes how to create a html file from marp.</p>
<h2 id="steps">Steps</h2>
<ol>
<li>
<p>Install Marp.
Follow the guide <a href="https://github.com/marp-team/marp-cli/">here</a>.</p>
</li>
<li>
<p>Create your markdown file.
Suppose the file is named <code>slides.md</code>.
<img src="/images/marp-emacs.png" alt="Creating a markdown file"></p>
</li>
<li>
<p>Convert the markdown file to html
We can use <code>marp slides.md -o slides.html</code>.
<img src="/images/marp-convert.png" alt="Converting a markdown file into html"></p>
</li>
</ol>
<h2 id="result">Result</h2>
<p>The markdown file is converted into a beautiful html slide.
<img src="/images/marp-result.png" alt="HTML Result"></p>
</section>
<footer class="mt-12 flex flex-wrap"><a
class="mb-1.5 rounded-lg bg-black/[3%] px-5 py-1 no-underline hover:bg-black/[6%] ltr:mr-1.5 rtl:ml-1.5 dark:bg-white/[8%] dark:hover:bg-white/[12%]"
href="https://developerbedoya.net/tags/markdown"
>markdown</a
><a
class="mb-1.5 rounded-lg bg-black/[3%] px-5 py-1 no-underline hover:bg-black/[6%] ltr:mr-1.5 rtl:ml-1.5 dark:bg-white/[8%] dark:hover:bg-white/[12%]"
href="https://developerbedoya.net/tags/marp"
>marp</a
></footer><nav
class="mt-24 flex overflow-hidden rounded-xl bg-black/[3%] text-lg leading-[1.2]! *:flex *:w-1/2 *:items-center *:p-5 *:font-medium *:no-underline dark:bg-white/[8%] [&>*:hover]:bg-black/[2%] dark:[&>*:hover]:bg-white/[3%]"
><a class="ltr:pr-3 rtl:pl-3" href="https://developerbedoya.net/posts/eclipse-de-lua-marco-2025/"
><span class="ltr:mr-1.5 rtl:ml-1.5">←</span><span>Eclipse de Lua março 2025</span></a
><a
class="justify-end pl-3 ltr:ml-auto rtl:mr-auto"
href="https://developerbedoya.net/posts/open-your-windows-files-from-linux-using-explorer/"
><span>Open your Windows Files with WSL using Windows Explorer</span><span class="ltr:ml-1.5 rtl:mr-1.5">→</span></a
></nav><div class="mt-24" id="disqus_thread"></div>
<script>
const disqusShortname = 'developerbedoya';
const script = document.createElement('script');
script.src = 'https://' + disqusShortname + '.disqus.com/embed.js';
script.setAttribute('data-timestamp', +new Date());
document.head.appendChild(script);
</script></article></main><footer
class="mx-auto flex h-[4.5rem] max-w-(--w) items-center px-8 text-xs tracking-wider uppercase opacity-60"
>
<div class="mr-auto">&copy;2025
<a class="link" href="https://developerbedoya.net/">Developer Bedoya</a></div>
<a class="link mx-6" href="https://gohugo.io/" rel="noopener" target="_blank"
>powered by hugo️️</a
>️
<a
class="link"
href="https://github.com/nanxiaobei/hugo-paper"
rel="noopener"
target="_blank"
>hugo-paper</a
>
</footer>
</body>
</html>