A web application that fetches and displays OpenGraph metadata from URLs, showing how they would appear when shared on social media platforms like X (Twitter), Facebook, Bluesky, and Mastodon.

• Fetch OpenGraph metadata from any URL
• Display preview cards similar to social media platforms
• Handle cases where no OpenGraph tags are present
• Responsive design with social media platform styling
• Error handling for invalid URLs or network issues

├── backend/
│   └── index.ts          # Main API server with URL fetching
├── frontend/
│   ├── index.html        # Main HTML template
│   ├── index.tsx         # React frontend
│   └── components/
│       ├── App.tsx       # Main app component
│       └── PreviewCard.tsx # OpenGraph preview card
└── shared/
    └── types.ts          # Shared TypeScript types

1. Enter a URL in the input field
2. Click "Preview" to fetch OpenGraph metadata
3. View the preview cards showing how the URL would appear on different platforms
4. If no OpenGraph tags are found, a message will indicate this

• GET / - Serves the frontend application
• POST /api/preview - Fetches OpenGraph metadata for a given URL