Why LinkedIn shows blank cards for React apps and how to fix it

·1 views

Social media crawlers like LinkedInBot and Twitterbot do not execute JavaScript, meaning they only read the raw HTML returned by the server. React or Vite apps without server-side rendering inject OpenGraph meta tags after client hydration, which happens too late for bots to capture. To display proper link previews, meta tags must be present in the initial HTML, achievable through frameworks like Next.js, Remix, or Astro. A developer encountered this issue and built ogcraft.dev, a tool that scrapes raw initial HTML to preview what crawlers see and generates dynamic OG images via a single embed tag without requiring headless browsers. The tool uses CDN caching and reads existing page tags to render optimized social preview cards on the fly.

Read the full story at DEV Community

This is an AI-generated summary. ShortSingh links to the original source for the complete article.

Discussion (0)

Developer finds checker tool was wrong in all 67 mismatches due to parser bugs

A software developer discovered 67 disagreements between a data verifier and the system it checks, initially suspecting the underlying data was at fault. Investigation revealed both bugs were in the checker's private parser: a nested ID variable overwrote its parent 47 times, causing the tool to look up the wrong row entirely. In 20 other cases, the parser silently collapsed 'not found' results into false, making missing data indistinguishable from a genuine mismatch. The checker also omitted both computed values from its mismatch reports, hiding the wrong-row lookups that would have been obvious if shown. The fix replaced the checker's independent parser with the same shared config reader used by all other components, after which all 131 test rows matched correctly.

0 comments Read more at DEV Community

ProgrammingDEV Community ·

Simpler FPS Camera Math: Skip the Look-At Matrix, Use Basis Vectors

A developer tutorial on DEV Community argues that using look-at matrices for first-person shooter cameras is unnecessarily redundant. The post explains that an FPS camera is already defined by its position and orientation, making it simpler to compute basis vectors directly from yaw and pitch angles. The recommended approach calculates a forward vector using trigonometry, then derives right and up vectors via cross products. These vectors can then drive both camera movement and view matrix construction without needing an intermediate target point. The author notes that look-at matrices are better suited for cases where a true target exists, such as orbiting or object tracking.

0 comments Read more at DEV Community

ProgrammingDEV Community ·

Retail Manager With No Degree Breaks Into Tech Through Free Coding Boot Camp

A 26-year-old grocery store manager with over five years in retail began searching for a career change in late 2022, feeling overworked and underpaid at $23 an hour. Despite being a high school dropout who later earned a GED, he had taught himself basic programming as a teenager but avoided pursuing tech due to a longstanding fear of mathematics. His father recommended a free coding boot camp — featured on 60 Minutes — that required passing entrance tests and signing a placement contract with partner companies. The program's entrance exams focused on critical thinking and problem-solving rather than arithmetic, which shifted his perspective on his own abilities. He began to recognise that skills built through years of retail work — communication, adaptability, and analytical thinking — could be directly applicable to a career in technology.

0 comments Read more at DEV Community

ProgrammingDEV Community ·

Dev Recovers Lost Gitea Data from Proxmox Backup After Docker Cleanup Mishap

A home lab user accidentally wiped their Gitea instance's repositories and user data while running a routine Docker cleanup on a Lenovo M920q mini PC. The data loss stemmed from a misconfigured bind mount that pointed directly into Docker's internal volume storage, causing the cleanup process to delete the volume as if it were unused. Rather than restoring an entire VM from backup, the user surgically extracted the needed directory by decompressing a Proxmox VMA backup, mounting the raw disk image via loop device, and navigating the LVM structure to retrieve the intact files. A corrupted SQLite database — likely caused by the backup running mid-write — was repaired using SQLite's built-in recovery mode. The setup was subsequently rebuilt with volume paths stored on a Synology NAS instead of inside Docker's internal storage to prevent a recurrence.

0 comments Read more at DEV Community