Developer tool
OG Scope
See exactly how a link will look before it is shared.
- Role
- Frontend and full-stack development
- Stack
- Next.js, Server-side rendering, Redis (optional cache), Vercel, Google Analytics
- Result
- Live checker with server-side fetching, private-address blocking and a short shared cache.
01 · Overview
Project overview
OG Scope is a free, account-free checker for the metadata behind social link previews. Paste a public URL and it shows estimated preview cards for Facebook, LinkedIn, X, WhatsApp, Slack, Discord and Telegram, along with every tag it found and a check of the preview image.
02 · Problem
Problem and objectives
When a link is shared, the preview card is often the first impression of a business. A missing image or wrong title makes a link look broken, every platform renders previews slightly differently, and many checking tools ask visitors to create an account first.
- Show realistic previews for the major platforms in one place.
- Keep the tool free to use without sign-up.
- Fetch other people's pages safely, without exposing the server or visitors to risk.
03 · Role
My role and responsibilities
Frontend and full-stack development
- Interface and preview-card design across desktop and mobile.
- Server-side page fetching, tag parsing and image checks.
- Caching, rate limiting and request safety rules.
- SEO, supporting guide content and deployment on Vercel.
04 · Approach
Technical approach
The page being checked is requested by the server, not by the visitor's browser. The server reads the Open Graph and Twitter card tags, builds estimated cards for each platform and returns only the extracted values, so the raw HTML of the target site never reaches the browser.
05 · Decisions
Design and implementation decisions
Fetch on the server
Server-side requests avoid browser cross-origin restrictions and keep raw third-party HTML out of the visitor's browser.
Block private network addresses
The server refuses localhost, private and link-local addresses, and re-checks every redirect before following it. A public URL tool cannot be used to reach internal systems.
A short cache instead of a database
A successful result is kept for about ten minutes so repeated checks are fast, and nothing is stored long term. With Redis configured, every server instance shares the same short-lived cache.
Fair-use rate limiting
Each client can run a limited number of previews per minute, which keeps a free tool available and predictable to operate.
06 · Features
Important features
- Estimated preview cards for seven platforms
- Metadata table listing every Open Graph and Twitter tag
- Open Graph image check
- Dedicated OG image checker page
- Open Graph preview guide
- No account and no search history
07 · Challenges
Challenges and solutions
- Platforms do not publish exactly how they render previews.
- Cards are presented honestly as estimates, and the product explains its limits rather than claiming pixel-perfect screenshots.
- Tags added only by JavaScript are invisible to a server-side fetch.
- The limitation is documented on the About page so users understand why a tag may be missing.
- A tool that requests arbitrary URLs can be abused.
- Address blocking, redirect re-checks and per-client limits are built into the request pipeline.
08 · Screens
Desktop and mobile
Screenshots captured from the live site.
09 · Results
Results
OG Scope is live at ogscope.pk. It ships server-side fetching, private-address blocking, redirect re-checks and a short shared cache. Usage figures are not published.
10 · Stack
Technology and links
- Next.js
- Server-side rendering
- Redis (optional cache)
- Vercel
- Google Analytics
Planning something similar?
Tell me what you are building, who it is for and what a good result looks like. I'll reply with questions, a suggested approach and the next steps.