🔥 Learn how to prevent infinite loading by verifying file existence on the server before using PDF.js.

In partnership with

Daily Issue #119 | Subscribe to DS | Daily Sandbox Pro

Hello Developers!

Discover how GitHub built the Skyline CLI extension using its own platform and learn to document legacy code with GitHub Copilot through real-world examples. Raymond Camden’s Next CodeBreak: Let’s AI! promises exciting updates and better scheduling. Explore the evolution of design systems in 2025, a new way to smoothly stop infinite rotations, and 10 Figma shortcuts to boost your efficiency. Think your site’s speed is an issue? Web performance scores might not always matter. Plus, passkeys on Google Password Manager for iOS 17+ offer secure, password-free logins with seamless cross-platform syncing.

Streamline header bidding with Prebid.js, build custom video experiences with lib-jitsi-meet, manage cookies easily using cookieconsent, and style efficiently with twind, the fastest Tailwind-in-JS solution.

Dive in and keep coding!

• How GitHub Built the Skyline CLI Extension - Discover how GitHub uses its own platform to develop tools like the Skyline CLI extension, showcasing the power and versatility of GitHub for building GitHub itself.

• Documenting Legacy Code with GitHub Copilot - Learn how to use GitHub Copilot to document and explain legacy code effectively, complete with real-world examples to make the process seamless.

• Next CodeBreak - Let's AI! - Raymond Camden shared an update on the Code Break show, acknowledging his goal of improving scheduling. He announced the next event and revealed that four more are already on the calendar.

• Level Up Your Design System in 2025 - Design systems are evolving, making 2025 the perfect time to experiment with new processes. Beyond the technical aspects, it's all about driving cultural change, building community, and encouraging widespread adoption.

• Smoothly Stop an Infinite Rotation - Learn a new way to pause an infinite rotation on hover. The element gracefully returns to its initial position, resuming the rotation once you unhover, adding a polished touch to your animations.

• 10 Figma Shortcuts to Design Faster - Boost your workflow and efficiency with these must-know Figma shortcuts. Whether you're a beginner or a seasoned pro, these tips will streamline your design process and take your skills to the next level.

• You Might Not Have a Web Performance Problem - A fast website keeps users happy and boosts rankings, but a low PageSpeed Insights score isn’t always a dealbreaker.

• Passkeys Now Available on Google Password Manager for iOS 17+ - Say goodbye to passwords! With passkeys, you can securely sign in using biometrics, PINs, or patterns, eliminating the hassle of managing passwords and protecting against phishing. Now available on iOS 17 and iPadOS 17, Chrome users can create passkeys in Google Password Manager and sync them seamlessly across all platforms.

More news here →

Check if file exists

Problem: I needed a way to verify if a PDF file exists on the server before attempting to load it for viewing with PDF.js. Unfortunately, PDF.js lacks a built-in method to terminate the request if the file isn't found, causing the loader to spin indefinitely when the file doesn't exist.

const currentPDFPath = ref('');

<VPdfViewer :src="currentPDFPath" />

AI Suggestion: DID NOT WORK!!! 😱😱😱

//ChatGPT told me to use this method to check if the file exists
async function checkFileExists(path) {
	try {
		const response = await fetch(path, { method: 'HEAD' });

		return response.ok;
	} catch (error) {
		console.error('Error checking file existence:', error);

		return false;
	}
}

Theoretically, the ChatGPT solution was clean and logical and should have worked. However, it overlooked the fact that using method: 'HEAD' could trigger CORS errors.

Solution: This is what I came up with to resolve the issue.

Instead of fetching the file from the frontend, I created a checkFileExists function on the server (Node.js) that used file system methods to verify the file's existence directly.

const fs = require('fs');
const path = require('path');

const checkFileExists = (filePath) => {
  try {
    return fs.existsSync(path.resolve(filePath));
  } catch (error) {
    console.error('Error checking file:', error);
    return false;
  }
};

Now the solution is complete. The frontend checkFileExists function calls the backend method with the same name, which uses Node.js file system methods to verify the file's existence. This ensures reliable validation and prevents unnecessary frontend handling of missing files.

More code snippets here →

Ready to level up your work with AI?

HubSpot’s free guide to using ChatGPT at work is your new cheat code to go from working hard to hardly working

HubSpot’s guide will teach you:

• How to prompt like a pro

• How to integrate AI in your personal workflow

• Over 100+ useful prompt ideas

All in order to help you unleash the power of AI for a more efficient, impactful professional life.

Get the free guide and level up your AI game today!

• Prebid.js - Setup and manage header bidding advertising partners without writing code or confusing line items. Prebid.js is open source and free and it by far beats other products in the same space, such as Amazon APS, and the Index Exchange Library

• lib-jitsi-meet - A low-level JS video API that allows adding a completely custom video experience to web apps.

• cookieconsent - 🍪 Simple cross-browser cookie-consent plugin written in vanillaJS

• twind - The smallest, fastest, most feature complete Tailwind-in-JS solution in existence.

More code libs here →

Remote (USA) - Solution Developer - $90,000 - $135,000 USD.

Remote (USA) - Senior Software Engineer, Full Stack - $123,046—$186,120 USD

📣 HELP SPREAD THE WORD 

🚀 Spread the Code! Love what you read? Share the newsletter with your fellow devs - every recommendation helps power up the community.

💻 Sponsor the Dev Journey! Keep the bytes flowing and the newsletter growing by becoming a sponsor. Your support helps maintain this valuable resource.

💬 Tweet the Deets! Share the latest with your code crew - let’s make this viral, not just a bug!

If you have built anything that you’d like to share with the community, get with me on X @dailysandbox_ 😀