https://heyjude.blog/ Recent content on Heyjude's Blog Hugo en Wed, 24 Dec 2025 00:00:00 +0000 https://heyjude.blog/posts/introducing-freeconvert-free-online-file-converter/ Wed, 24 Dec 2025 00:00:00 +0000 https://heyjude.blog/posts/introducing-freeconvert-free-online-file-converter/ <h2 id="introduction">Introduction</h2> <p>How many times have you faced this scenario: You need to share a photo from your iPhone, but the recipient can&rsquo;t open HEIC files. Or you receive a PDF that needs to be edited, but you don&rsquo;t have the right software. Maybe you just want to extract audio from a video without installing bulky desktop applications.</p> <p>File format conversion is one of those everyday frustrations in our digital lives. Traditional solutions often come with drawbacks:</p> <ul> <li>Desktop software requires installation and updates</li> <li>Online converters upload your files to unknown servers (privacy concerns)</li> <li>Premium tools charge subscription fees for basic features</li> <li>Many platforms impose file size limits or watermarks</li> </ul> <p>What if there was a better way? Enter <strong>FreeConvert.cc</strong> - a free online file conversion platform that solves all these problems while keeping your data completely private.</p> https://heyjude.blog/posts/how-to-translate-hugo-blog-with-ai/ Sun, 22 Jun 2025 10:00:00 +0800 https://heyjude.blog/posts/how-to-translate-hugo-blog-with-ai/ <h2 id="introduction">Introduction</h2> <p>Once we have created our own blog, we would like it to support multiple languages. This not only expands our audience but also enhances the SEO performance of the blog. However, manually translating blog posts is a time-consuming and labor-intensive task, requiring professional translators. But with the development of AI, things are different now; using AI, you can easily translate your blog into any desired language. To facilitate this, I created a tool that utilizes AI to automate the translation of your blog posts, allowing you to effortlessly support multiple languages.</p> https://heyjude.blog/posts/hugo_clarity_integration/ Sat, 21 Jun 2025 22:00:00 +0800 https://heyjude.blog/posts/hugo_clarity_integration/ <hr> <h2 id="introduction">Introduction</h2> <p>Microsoft Clarity is a free website analytics tool that provides user behavior heatmaps, session recordings, and detailed analysis data to help webmasters better understand user behavior, optimize website content, and improve user experience. After setting up your own blog website, you might want to track user behavior, and this tool can help you analyze user actions. For static blog websites built with Hugo, integrating Clarity is straightforward and can be done in just a few steps.</p> https://heyjude.blog/posts/sync-hugo-blog-to-github-profile/ Sat, 21 Jun 2025 22:00:00 +0800 https://heyjude.blog/posts/sync-hugo-blog-to-github-profile/ <h2 id="how-to-sync-hugo-blog-to-github-profile">How to Sync Hugo Blog to GitHub Profile</h2> <p>After we have deployed our blog, we want our GitHub profile to automatically update whenever there is a new blog post, so our profile can showcase our latest articles. We can achieve this with <code>GitHub Actions</code>.</p> <h2 id="prerequisites">Prerequisites</h2> <p>Before you start, please ensure you have completed the following preparations:</p> <ul> <li><strong>Hugo Blog</strong>: A Hugo blog set up and hosted in a GitHub repository (such as <code>username/username.github.io</code> or a custom repository).</li> <li><strong>GitHub Repository</strong>: A repository for storing your blog source files (e.g., <code>username/blog</code>) and a repository for GitHub Pages (e.g., <code>username/username.github.io</code>).</li> <li><strong>GitHub Profile README</strong>: The Profile README is enabled on GitHub (create a repository with the same name as your username, such as <code>username/username</code>, e.g., <a href="https://github.com/lxb1226/lxb1226">My GitHub Profile</a>).</li> <li><strong>Basic Git Knowledge</strong>: Understanding how to commit code, configure <code>.gitignore</code>, and use GitHub Actions.</li> </ul> <h2 id="what-is-blog-post-workflow">What is blog-post-workflow?</h2> <p><code>blog-post-workflow</code> is a GitHub Action developed by Gautam Krishnar, designed to synchronize the latest blog posts to the GitHub Profile README or other specified locations. It supports multiple blogging frameworks (including Hugo) and retrieves the latest posts by parsing the RSS feed, automatically updating the target file.</p> https://heyjude.blog/posts/deploy-hugo-to-cloudflare/ Mon, 16 Jun 2025 20:29:00 +0800 https://heyjude.blog/posts/deploy-hugo-to-cloudflare/ <h1 id="build-a-blog-with-hugo-and-deploy-it-to-cloudflare-pages">Build a Blog with Hugo and Deploy it to Cloudflare Pages</h1> <p>In this article, I will guide you step by step through the complete process of building a personal blog using <a href="https://gohugo.io/">Hugo</a> and deploying it to <a href="https://pages.cloudflare.com/">Cloudflare Pages</a>. Hugo is a fast and flexible static site generator, while Cloudflare Pages offers free static site hosting services with global CDN acceleration, allowing your blog to go live quickly and provide a good user experience. Whether you&rsquo;re a technical novice or an experienced developer, this tutorial will help you quickly set up your own blog.</p> https://heyjude.blog/posts/how-to-depoly-umami-with-vercel/ Sun, 15 Jun 2025 00:00:00 +0000 https://heyjude.blog/posts/how-to-depoly-umami-with-vercel/ <p>Umami is a simple, fast, and privacy-focused open-source website statistics tool, making it an ideal alternative to Google Analytics. This article will guide you on how to deploy Umami on Vercel and create a Neon PostgreSQL database via Vercel Storage, to build a zero-cost, lightweight website traffic statistics system. This tutorial is specifically optimized for Hugo static site users, ensuring that the generated Markdown files are compatible with Hugo&rsquo;s static site generation.</p> https://heyjude.blog/posts/giscus-comments-hugo/ Sun, 15 Jun 2025 00:00:00 +0000 https://heyjude.blog/posts/giscus-comments-hugo/ <p>This is the third tutorial on building your own blog system, focusing on adding a comment system.</p> <p>During the blog setup process, a good comment system can greatly enhance interactivity. Today, I will introduce how to integrate <a href="https://giscus.app/">Giscus</a>, an open-source comment system based on GitHub Discussions, into a Hugo blog.</p> <h2 id="why-choose-giscus">Why Choose Giscus?</h2> <ul> <li>🚀 No server required, based on GitHub Discussions</li> <li>🔒 Secure and reliable, comment data is stored on GitHub</li> <li>🧩 Supports dark mode and adaptive themes</li> <li>💬 Supports anonymous comments (optional)</li> <li>🌍 Multi-language interface support</li> </ul> <h2 id="preparation">Preparation</h2> <p>Before you start, you need:</p> https://heyjude.blog/posts/how-to-depoly-blog-to-github/ Sun, 18 May 2025 17:01:07 +0800 https://heyjude.blog/posts/how-to-depoly-blog-to-github/ <p>Once we have built our blog website locally, the next step is to distribute the blog content online so that others can see it.</p> <p>I researched the current hosting websites and found the following options:</p> <ul> <li><strong>GitHub Pages</strong>: A free static site hosting service provided by GitHub, suitable for integration with code repositories.</li> <li><strong>Netlify</strong>: Supports automatic building and deployment, rich features in free tier, with very good Hugo support.</li> <li><strong>Vercel</strong>: Developed by the Next.js team, fast deployment, suitable for frontend projects.</li> <li><strong>Cloudflare Pages</strong>: Static site hosting service provided by Cloudflare, comes with CDN and security acceleration.</li> <li><strong>Firebase Hosting</strong>: A frontend hosting platform launched by Google, suitable for use with frontend applications.</li> <li><strong>Amazon S3 + CloudFront</strong>: A high-performance hosting and distribution solution, suitable for professional deployments.</li> <li><strong>GitLab Pages</strong>: Static site hosting service provided by GitLab, automatically builds through CI configuration.</li> <li><strong>Render</strong>: A streamlined full-stack hosting platform, supports automatic deployment of Hugo sites.</li> <li><strong>Surge.sh</strong>: A minimalist static site hosting tool, simple and quick command line deployment.</li> <li><strong>DigitalOcean App Platform</strong>: Cloud service platform that supports automatic deployment of static websites and backend services.</li> </ul> <p>These platforms each have their own characteristics, and I will introduce how to deploy on each one in upcoming articles. In this article, I will introduce how to deploy a blog website to GitHub Pages.</p> https://heyjude.blog/posts/how-to-use-mess-auto/ Wed, 07 May 2025 22:36:09 +0800 https://heyjude.blog/posts/how-to-use-mess-auto/ <h1 id="reason">Reason</h1> <p>We know that iOS supports auto-filling SMS verification codes, and Safari on Mac also supports it. However, non-Safari browsers do not support this feature. Yet in domestic platforms, verification codes are something we cannot escape from, so I conducted some research and found some current solutions.</p> <ul> <li><a href="https://apps.apple.com/cn/app/id6472872202">AutoCode</a>: This is a free app available on the App Store, supporting forwarding on iOS and Android.</li> <li><a href="https://github.com/LeeeSe/MessAuto">MessAuto</a>: MessAuto is an application for macOS that automatically extracts SMS and email verification codes, developed in Rust and suitable for any app.</li> </ul> <p>Since MessAuto is open-source, I chose this software.</p> https://heyjude.blog/posts/how-to-create-blog-with-hugo/ Mon, 05 May 2025 20:28:24 +0800 https://heyjude.blog/posts/how-to-create-blog-with-hugo/ <h2 id="what-is-hugo">What is Hugo</h2> <p>Hugo is one of the most popular open-source static site generators. Users can quickly build their own websites using Hugo.</p> <h2 id="setup-steps">Setup Steps</h2> <h3 id="install-hugo">Install Hugo</h3> <p>On a Mac, you can use the following command to install Hugo:</p> <div class="code-block-container border-border bg-card my-6 overflow-hidden rounded-xl border shadow-sm transition-all duration-200 ease-out hover:-translate-y-0.5 hover:shadow-md"> <div class="code-block-header bg-muted/30 border-border flex items-center justify-between border-b px-4 py-3"> <div class="flex items-center gap-2"> <div class="text-muted-foreground flex-shrink-0"> <svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4" /> </svg> </div> <span class="text-muted-foreground text-sm font-medium"> BASH </span> </div> <div class="flex items-center gap-2"> <button class="collapse-code-btn text-muted-foreground hover:text-primary hover:bg-primary/10 focus:ring-primary/20 flex items-center gap-1.5 rounded-md px-2 py-1 text-xs font-medium transition-all duration-200 ease-out focus:ring-2 focus:outline-none" data-code-id="code-0" data-default-state="expanded" data-collapsed="false" data-auto-collapse-lines="30" data-auto-collapse-height="400" data-collapsed-height="120" title="Collapse" aria-label="Collapse"> <span class="collapse-icon"> <svg class="h-3 w-3" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path fill="currentColor" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6l-6 6z"/></svg> </span> <span class="collapse-text hidden sm:inline" >Collapse</span > </button> <button class="copy-code-btn text-muted-foreground hover:text-primary hover:bg-primary/10 focus:ring-primary/20 flex items-center gap-1.5 rounded-md px-2 py-1 text-xs font-medium transition-all duration-200 ease-out focus:ring-2 focus:outline-none" data-code-id="code-0" title="Copy" aria-label="Copy"> <span class="copy-icon"> <svg class="h-3 w-3" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" /> </svg> </span> <span class="copy-text hidden sm:inline" >Copy</span > </button> </div> </div> <div class="code-block-content relative" id="code-0"> <div class="highlight"><pre tabindex="0" class="chroma"><code class="language-bash" data-lang="bash"><span class="line"><span class="cl">brew install hugo</span></span></code></pre></div> <div class="collapse-overlay to-card/90 pointer-events-none absolute inset-0 bg-gradient-to-b from-transparent via-transparent opacity-0 transition-opacity duration-300"> <div class="text-muted-foreground bg-card/80 border-border/50 hover:bg-primary/10 hover:text-primary hover:border-primary/30 absolute bottom-4 left-1/2 -translate-x-1/2 cursor-pointer rounded-full border px-3 py-1.5 text-xs backdrop-blur-sm transition-all duration-200"> Click to expand and view more </div> </div> </div> </div> <script> (function() { const codeId = 'code-0'; const copyBtn = document.querySelector('.copy-code-btn[data-code-id="' + codeId + '"]'); const collapseBtn = document.querySelector('.collapse-code-btn[data-code-id="' + codeId + '"]'); const codeContainer = document.getElementById(codeId); if (!codeContainer) return; if (copyBtn) { const copyIcon = copyBtn.querySelector('.copy-icon'); const copyText = copyBtn.querySelector('.copy-text'); copyBtn.addEventListener('click', async function() { try { let codeText = ''; const codeTableCell = codeContainer.querySelector('.lntd:last-child code'); if (codeTableCell) { codeText = codeTableCell.textContent || codeTableCell.innerText; } else { const codeElement = codeContainer.querySelector('code'); if (codeElement) { const hasInlineLineNumbers = codeElement.querySelector('.ln'); if (hasInlineLineNumbers) { const codeLines = codeElement.querySelectorAll('.cl'); if (codeLines.length > 0) { codeText = Array.from(codeLines) .map(line => { const text = line.textContent || line.innerText; return text.replace(/\n+$/, ''); }) .join('\n') .replace(/\n+$/, ''); } else { const allText = codeElement.textContent || codeElement.innerText; codeText = allText.replace(/^\d+/gm, '').replace(/^\s+/gm, ''); } } else { codeText = codeElement.textContent || codeElement.innerText; } } else { codeText = codeContainer.textContent || codeContainer.innerText; } } codeText = codeText.trim(); await navigator.clipboard.writeText(codeText); copyIcon.innerHTML = `\n \u003csvg class=\u0022h-3 w-3\u0022\n fill=\u0022none\u0022\n stroke=\u0022currentColor\u0022\n viewBox=\u00220 0 24 24\u0022\u003e\u003cpath stroke-linecap=\u0022round\u0022 stroke-linejoin=\u0022round\u0022 stroke-width=\u00222\u0022 d=\u0022M5 13l4 4L19 7\u0022 \/\u003e\n\u003c\/svg\u003e`; if (copyText) { copyText.textContent = 'Copied'; } copyBtn.classList.add('text-green-600'); setTimeout(() => { copyIcon.innerHTML = `\n \u003csvg class=\u0022h-3 w-3\u0022\n fill=\u0022none\u0022\n stroke=\u0022currentColor\u0022\n viewBox=\u00220 0 24 24\u0022\u003e\u003cpath stroke-linecap=\u0022round\u0022 stroke-linejoin=\u0022round\u0022 stroke-width=\u00222\u0022 d=\u0022M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\u0022 \/\u003e\n\u003c\/svg\u003e`; if (copyText) { copyText.textContent = 'Copy'; } copyBtn.classList.remove('text-green-600'); }, 2000); } catch (err) { console.error('复制失败:', err); const range = document.createRange(); const codeElement = codeContainer.querySelector('code') || codeContainer; range.selectNodeContents(codeElement); const selection = window.getSelection(); selection.removeAllRanges(); selection.addRange(range); if (copyText) { copyText.textContent = 'Selected'; } setTimeout(() => { if (copyText) { copyText.textContent = 'Copy'; } selection.removeAllRanges(); }, 2000); } }); } if (collapseBtn) { const collapseIcon = collapseBtn.querySelector('.collapse-icon'); const collapseText = collapseBtn.querySelector('.collapse-text'); const collapseOverlay = codeContainer.querySelector('.collapse-overlay'); let codeElement = codeContainer.querySelector('pre.chroma'); if (!codeElement) { codeElement = codeContainer.querySelector('pre'); } const defaultState = collapseBtn.dataset.defaultState || 'expanded'; const isCollapsedAttr = collapseBtn.dataset.collapsed === 'true'; const autoCollapseLines = parseInt(collapseBtn.dataset.autoCollapseLines) || 30; const autoCollapseHeight = parseInt(collapseBtn.dataset.autoCollapseHeight) || 400; const collapsedHeight = parseInt(collapseBtn.dataset.collapsedHeight) || 120; let isCollapsed = false; function initCollapse() { const shouldCollapse = isCollapsedAttr || defaultState === 'collapsed' || shouldAutoCollapse(); if (shouldCollapse) { setCollapsed(true, false); } } function shouldAutoCollapse() { if (codeElement) { const lines = codeElement.querySelectorAll('.line, .cl'); const height = codeElement.offsetHeight; return lines.length > autoCollapseLines || height > autoCollapseHeight; } const containerHeight = codeContainer.offsetHeight; if (containerHeight > autoCollapseHeight) { return true; } const textContent = codeContainer.textContent || codeContainer.innerText || ''; const estimatedLines = textContent.split('\n').length; return estimatedLines > autoCollapseLines; } function setCollapsed(collapsed, animate = true) { if (!collapseOverlay) return; isCollapsed = collapsed; if (collapsed) { codeContainer.style.maxHeight = collapsedHeight + 'px'; codeContainer.style.overflow = 'hidden'; collapseOverlay.style.opacity = '1'; collapseOverlay.style.pointerEvents = 'auto'; collapseIcon.innerHTML = `\n \u003csvg class=\u0022h-3 w-3\u0022\n fill=\u0022none\u0022\n stroke=\u0022currentColor\u0022\n viewBox=\u00220 0 24 24\u0022\u003e\u003cpath stroke-linecap=\u0022round\u0022 stroke-linejoin=\u0022round\u0022 stroke-width=\u00222\u0022 d=\u0022M19 9l-7 7-7-7\u0022 \/\u003e\n\u003c\/svg\u003e`; if (collapseText) { collapseText.textContent = 'Expand'; } collapseBtn.title = 'Expand'; } else { codeContainer.style.maxHeight = ''; codeContainer.style.overflow = ''; collapseOverlay.style.opacity = '0'; collapseOverlay.style.pointerEvents = 'none'; collapseIcon.innerHTML = `\n \u003csvg class=\u0022h-3 w-3\u0022\n fill=\u0022none\u0022\n stroke=\u0022currentColor\u0022\n viewBox=\u00220 0 24 24\u0022\u003e\u003cpath fill=\u0022currentColor\u0022 d=\u0022M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6l-6 6z\u0022\/\u003e\u003c\/svg\u003e`; if (collapseText) { collapseText.textContent = 'Collapse'; } collapseBtn.title = 'Collapse'; } if (animate) { codeContainer.style.transition = 'max-height 0.3s ease-out'; setTimeout(() => { codeContainer.style.transition = ''; }, 300); } } function toggleCollapse() { setCollapsed(!isCollapsed, true); } collapseBtn.addEventListener('click', toggleCollapse); if (collapseOverlay) { collapseOverlay.addEventListener('click', () => { if (isCollapsed) { setCollapsed(false, true); } }); } initCollapse(); } })(); </script> <p> <figure class="image-figure not-prose my-8" data-lightbox-enabled="false" data-gallery-type="auto"> <div class="image-container"> <img src="https://img.music-poster.art/2025/05/c9d27037a7d215ff8eaa14383cba62b6.png" alt="install" loading="lazy" decoding="async" data-gallery-src="https://img.music-poster.art/2025/05/c9d27037a7d215ff8eaa14383cba62b6.png" data-gallery-alt="install" data-gallery-title="" /></div> </figure></p> https://heyjude.blog/about/ Mon, 01 Jan 2024 00:00:00 +0000 https://heyjude.blog/about/ <h2 id="about-me">About Me</h2> <p>Hello! I&rsquo;m Heyjude, a software engineer passionate about technology and innovation.</p> <h3 id="blog-purpose">Blog Purpose</h3> <p>I created this blog to:</p> <ul> <li>Share technical insights and experiences</li> <li>Document my learning journey</li> <li>Connect with like-minded individuals</li> <li>Discuss technology trends</li> </ul> <h3 id="interests">Interests</h3> <p>Besides programming, I enjoy:</p> <ul> <li>Reading technical books</li> <li>Contributing to open-source projects</li> <li>Exploring new technologies</li> <li>Sharing technical experiences</li> </ul> <h3 id="contact-information">Contact Information</h3> <p>Feel free to reach me through:</p> <ul> <li>GitHub: <a href="https://github.com/lxb1226">lxb1226</a></li> <li>Twitter: <a href="https://twitter.com/heyjude55555">@heyjude55555</a></li> <li>Email: <a href="mailto:heyjude1587@gmail.com">heyjude1587@gmail.com</a></li> </ul> <h3 id="my-projects">My Projects</h3> <ul> <li>TmpMail: <a href="https://tmpmail.online">TmpMail</a></li> </ul> <h3 id="blog-subscription">Blog Subscription</h3> <p>If you&rsquo;re interested in my blog content, you can:</p> https://heyjude.blog/contact/ Mon, 01 Jan 2024 00:00:00 +0000 https://heyjude.blog/contact/ <h2 id="contact-information">Contact Information</h2> <p>I&rsquo;m glad you want to get in touch! Here are several ways to reach me:</p> <h3 id="social-media">Social Media</h3> <ul> <li> <p>GitHub: <a href="https://github.com/lxb1226">lxb1226</a></p> <ul> <li>You can find my open-source projects and contributions here</li> <li>Feel free to follow and interact</li> </ul> </li> <li> <p>Twitter: <a href="https://twitter.com/heyjude55555">@heyjude55555</a></p> <ul> <li>I share technical insights and daily thoughts</li> <li>Welcome to follow each other</li> </ul> </li> </ul> <h3 id="email">Email</h3> <ul> <li>Email: <a href="mailto:heyjude1587@gmail.com">heyjude1587@gmail.com</a> <ul> <li>This is the most direct way to contact me</li> <li>I check and reply to emails regularly</li> </ul> </li> </ul> <h3 id="blog-interaction">Blog Interaction</h3> <ul> <li>Feel free to leave comments on blog posts</li> <li>Subscribe to RSS for latest updates</li> </ul> <h3 id="collaboration">Collaboration</h3> <p>I welcome contact for:</p> https://heyjude.blog/privacy/ Mon, 01 Jan 2024 00:00:00 +0000 https://heyjude.blog/privacy/ <h2 id="privacy-policy">Privacy Policy</h2> <p>We value your privacy. This privacy policy explains how we collect, use, and protect your personal information.</p> <h3 id="information-collection">Information Collection</h3> <p>When you visit our blog, we may collect the following information:</p> <ul> <li>Access logs (IP address, browser type, access time, etc.)</li> <li>Name and email address if you choose to comment</li> </ul> <h3 id="information-usage">Information Usage</h3> <p>The information we collect is used for:</p> <ul> <li>Improving website experience</li> <li>Analyzing visitor statistics</li> <li>Responding to your comments and inquiries</li> </ul> <h3 id="cookie-usage">Cookie Usage</h3> <p>This website uses cookies to enhance user experience. You can choose to accept or decline cookies.</p>