next-schema-buddy
Version:
A simple and lightweight Schema.org implementation for Next.js applications. Easily add structured data to your Next.js pages with type-safe components.
1,887 lines (1,812 loc) • 49.4 kB
Markdown
# next-schema-buddy
A simple and lightweight Schema.org implementation for Next.js applications. Easily add structured data to your Next.js pages with type-safe components.
## Features
- 🚀 Built for Next.js
- 💪 TypeScript support
- 🔄 Automatic schema aggregation
- 🎯 Server-side rendering ready
- 📦 Lightweight with zero dependencies
## Supported Schema Types
### Available Now ✨
- 📍 LocalBusiness Schema
- 📝 Article Schema
- ⭐ Review Schema
- 📑 BreadcrumbList Schema
- ❓ FAQ Schema
- 🌐 WebSite Schema
- 🏢 Organization Schema
- 📦 Product Schema
- 🔍 SearchAction Schema (as part of WebSite)
- 📽️ Video Schema
- 🖼️ ImageObject Schema
- 📅 Event Schema
- 🍽️ Restaurant Schema
- 👤 Person Schema
- 💼 JobPosting Schema
- 📱 SoftwareApplication Schema
- 🎬 Movie Schema
- 📚 Book Schema
- 🏪 Store Schema
- 🛍️ Offer Schema (standalone)
- 📊 AggregateRating Schema (standalone)
## Installation
```bash
npm install next-schema-buddy
# or
yarn add next-schema-buddy
# or
pnpm add next-schema-buddy
```
## Usage
1. First, add the `SchemaMarkup` component to your root layout:
```tsx
// app/layout.tsx
import { SchemaMarkup } from "next-schema-buddy";
export default function RootLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<html lang="en">
<body>
{children}
<SchemaMarkup />
</body>
</html>
);
}
```
2. Then use schema components in your pages:
```tsx
// app/page.tsx
import {
WebsiteSchema,
OrganizationSchema,
ProductSchema,
} from "next-schema-buddy";
export default function Page() {
return (
<>
<WebsiteSchema
data={{
name: "My Website",
url: "https://example.com",
description: "Website description",
}}
/>
<OrganizationSchema
data={{
name: "Company Name",
url: "https://example.com",
logo: {
"@type": "ImageObject",
url: "https://example.com/logo.png",
width: 180,
height: 60,
},
sameAs: [
"https://facebook.com/company",
"https://twitter.com/company",
],
}}
/>
{/* Your page content */}
</>
);
}
```
## Available Schemas
### WebsiteSchema
For marking up your website information:
```tsx
<WebsiteSchema
data={{
name: "Website Name",
url: "https://example.com",
description: "Optional description",
potentialAction: {
"@type": "SearchAction",
target: "https://example.com/search?q={search_term_string}",
"query-input": "required name=search_term_string",
},
}}
/>
```
### OrganizationSchema
For company/organization information:
```tsx
<OrganizationSchema
data={{
name: "Organization Name",
url: "https://example.com",
logo: {
"@type": "ImageObject",
url: "https://example.com/logo.png",
width: 180,
height: 60,
},
sameAs: ["https://facebook.com/org", "https://twitter.com/org"],
}}
/>
```
### ProductSchema
For product pages:
```tsx
<ProductSchema
data={{
name: "Product Name",
description: "Product description",
image: ["https://example.com/image1.jpg", "https://example.com/image2.jpg"],
brand: {
"@type": "Organization",
name: "Brand Name",
},
offers: {
"@type": "Offer",
price: 199.99,
priceCurrency: "USD",
availability: "InStock",
},
}}
/>
```
### LocalBusinessSchema
```tsx
<LocalBusinessSchema
data={{
name: "My Local Store",
description: "The best local store in town",
address: {
"@type": "PostalAddress",
streetAddress: "123 Main St",
addressLocality: "City",
postalCode: "12345",
addressCountry: "US",
},
telephone: "+1-234-567-8900",
priceRange: "$$",
}}
/>
```
### ArticleSchema
```tsx
<ArticleSchema
data={{
"@type": "NewsArticle",
headline: "Breaking News: Major Scientific Discovery",
description: "Scientists have made a groundbreaking discovery...",
articleBody: "Full article content goes here...",
image: [
"https://example.com/article-hero.jpg",
"https://example.com/article-thumbnail.jpg",
],
author: {
"@type": "Person",
name: "John Doe",
url: "https://example.com/authors/johndoe",
},
publisher: {
"@type": "Organization",
name: "Example News",
logo: {
"@type": "ImageObject",
url: "https://example.com/logo.png",
},
},
datePublished: "2024-02-02T09:00:00+00:00",
dateModified: "2024-02-02T12:30:00+00:00",
url: "https://example.com/article/breaking-news",
mainEntityOfPage: "https://example.com/article/breaking-news",
keywords: ["science", "discovery", "research"],
articleSection: "Science",
isAccessibleForFree: true,
speakable: {
"@type": "SpeakableSpecification",
cssSelector: [".article-headline", ".article-description"],
},
video: [
{
"@type": "VideoObject",
name: "Interview with Scientists",
description: "Watch our exclusive interview...",
thumbnailUrl: "https://example.com/video-thumbnail.jpg",
uploadDate: "2024-02-02T10:00:00+00:00",
duration: "PT5M",
embedUrl: "https://example.com/embed/video123",
},
],
}}
/>
```
### ReviewSchema
```tsx
<ReviewSchema
data={{
name: "Crazy phone - my review",
reviewBody: "Detailed review...",
author: {
"@type": "Person",
name: "John Smith",
url: "https://example.com/authors/john-smith",
},
datePublished: "2024-02-02T10:00:00+00:00",
dateModified: "2024-02-02T12:00:00+00:00",
reviewRating: {
"@type": "Rating",
ratingValue: 4.5,
bestRating: 5,
worstRating: 1,
},
itemReviewed: {
"@type": "Product",
name: "SuperPhone 15 Pro",
image: "https://example.com/phone-image.jpg",
description: "Newest Iphone ",
brand: {
"@type": "Brand",
name: "SuperPhone",
},
offers: {
"@type": "Offer",
price: 999.99,
priceCurrency: "USD",
availability: "InStock",
},
},
publisher: {
"@type": "Organization",
name: "Tech Reviews",
logo: {
"@type": "ImageObject",
url: "https://example.com/logo.png",
},
},
pros: ["Long time work on battery", "Great camera"],
cons: ["High price", "No headphone plug"],
}}
/>
```
### BreadcrumbsList Schema
```tsx
<BreadcrumbListSchema
data={{
items: [
{
name: "Home",
item: "https://example.com/",
position: 1,
},
{
name: "Blog",
item: "https://example.com/blog/",
position: 2,
},
{
name: "Web Development",
item: "https://example.com/blog/web-development/",
position: 3,
},
{
name: "How to Use Schema Markup",
item: "https://example.com/blog/web-development/schema-markup/",
position: 4,
},
],
}}
/>
```
### FAQSchema
```tsx
<FAQPageSchema
data={{
questions: [
{
question: "How to use Schema Markup?",
answer:
"Schema Markup is a semantic code that helps search engines better understand the content of a website",
dateCreated: "2023-10-15T14:00:00+00:00",
questionAuthor: {
name: "John Smith",
type: "Person",
},
},
{
question: "How to install next-schema-buddy?",
answer:
"You can install next-schema-buddy using npm, yarn or pnpm: <code>npm install nex</code>",
url: "https://example.com/faq/installation",
},
{
question: "Does Schema Markup affect SEO?",
answer:
"Yes, well implemented Schema Markup can improve a site's visibility in search results through rich snippets.",
suggestedAnswers: [
{
text: "Schema Markup can also help with voice search and voice assistants.",
url: "https://example.com/faq/voice-search",
},
],
},
],
name: "Frequently asked questions about Schema Markup",
description:
"Answers to popular questions about Schema Markup and structured data.",
lastReviewed: "2024-01-30T10:00:00+00:00",
publisher: {
name: "Example Company",
logo: "https://example.com/logo.png",
},
}}
/>
```
### VideoSchema
```tsx
<VideoSchema
data={{
name: "How to use next-schema-buddy",
description: "A quick tutorial showing how to use the next-schema-buddy library in a Next.js project",
thumbnailUrl: "https://example.com/thumbnails/schema-buddy-tutorial.jpg",
uploadDate: "2024-02-15T12:00:00+00:00",
contentUrl: "https://example.com/videos/schema-buddy-tutorial.mp4",
embedUrl: "https://example.com/embed/schema-buddy-tutorial",
duration: "PT8M15S", // 8 minut 15 sekund
inLanguage: "pl"
}}
/>
<VideoSchema
data={{
name: "Complete guide po Schema.org",
description: "Full course explaining structured data and its implementation using Schema.org",
thumbnailUrl: [
"https://example.com/thumbnails/schema-guide-1.jpg",
"https://example.com/thumbnails/schema-guide-2.jpg"
],
uploadDate: "2024-01-10T09:00:00+00:00",
contentUrl: "https://example.com/videos/schema-guide.mp4",
embedUrl: "https://example.com/embed/schema-guide",
duration: "PT1H25M", // 1 godzina 25 minut
contentRating: "G",
genre: ["Educational", "Technology", "Web Development"],
keywords: ["schema.org", "structured data", "SEO", "JSON-LD", "markup"],
inLanguage: "en",
interactionStatistic: [
{
"@type": "InteractionCounter",
interactionType: {
"@type": "WatchAction"
},
userInteractionCount: 12500
},
{
"@type": "InteractionCounter",
interactionType: {
"@type": "LikeAction"
},
userInteractionCount: 750
}
],
transcript: "In this video, we'll cover the basics of Schema.org, starting with...",
accessibilityFeature: ["captions", "transcript"],
creator: {
"@type": "Person",
name: "Jane Smith",
url: "https://example.com/authors/jane-smith"
},
publisher: {
"@type": "Organization",
name: "Web Development Academy",
logo: {
"@type": "ImageObject",
url: "https://example.com/logo.png"
}
},
hasPart: [
{
"@type": "Clip",
name: "Introcution JSON-LD",
startOffset: 120,
endOffset: 360,
url: "https://example.com/videos/schema-guide.mp4?t=120"
},
{
"@type": "Clip",
name: "Testing Structuring Data",
startOffset: 1800,
endOffset: 2100,
url: "https://example.com/videos/schema-guide.mp4?t=1800"
}
],
requiresSubscription: false
}}
/>
```
### Organization Schema
```tsx
<OrganizationSchema
data={{
"@type": "Corporation",
name: "Tech Innovations Inc.",
alternateName: "TechInn",
description:
"Leading technology solutions provider specializing in AI and blockchain.",
url: "https://techinnovations.example.com",
logo: {
"@type": "ImageObject",
url: "https://techinnovations.example.com/logo.png",
width: 200,
height: 60,
},
image: "https://techinnovations.example.com/headquarters.jpg",
address: {
"@type": "PostalAddress",
streetAddress: "123 Innovation Drive",
addressLocality: "Tech City",
addressRegion: "TC",
postalCode: "12345",
addressCountry: "US",
},
contactPoint: [
{
"@type": "ContactPoint",
telephone: "+1-555-123-4567",
contactType: "customer service",
email: "support@techinnovations.example.com",
availableLanguage: ["English", "Spanish"],
},
{
"@type": "ContactPoint",
telephone: "+1-555-987-6543",
contactType: "sales",
email: "sales@techinnovations.example.com",
},
],
sameAs: [
"https://facebook.com/techinnovations",
"https://twitter.com/techinnovations",
"https://linkedin.com/company/tech-innovations",
"https://github.com/techinnovations",
],
foundingDate: "2010-01-15",
foundingLocation: {
"@type": "Place",
name: "Tech City",
address: {
"@type": "PostalAddress",
addressLocality: "Tech City",
addressRegion: "TC",
addressCountry: "US",
},
},
founder: {
"@type": "Person",
name: "Jane Smith",
url: "https://techinnovations.example.com/about/jane-smith",
},
numberOfEmployees: 250,
award: [
"Best Technology Startup 2015",
"Innovation Award 2018",
"Sustainability Excellence 2022",
],
legalName: "Technology Innovations Incorporated",
taxID: "12-3456789",
department: [
{
"@type": "Organization",
name: "Research & Development",
url: "https://techinnovations.example.com/departments/research",
},
{
"@type": "Organization",
name: "Product Development",
url: "https://techinnovations.example.com/departments/product",
},
],
aggregateRating: {
"@type": "AggregateRating",
ratingValue: 4.7,
reviewCount: 128,
bestRating: 5,
},
}}
/>
```
### Product Schema
```tsx
<ProductSchema
data={{
name: "Professional DSLR Camera XYZ-1000",
description:
"Professional-grade DSLR camera with 45MP sensor, 4K video recording, and advanced autofocus system.",
image: [
"https://example.com/camera-front.jpg",
"https://example.com/camera-back.jpg",
"https://example.com/camera-top.jpg",
{
"@type": "ImageObject",
url: "https://example.com/camera-with-lens.jpg",
caption: "Camera with 24-70mm f/2.8 lens",
},
],
url: "https://example.com/cameras/xyz-1000",
brand: {
"@type": "Brand",
name: "PhotoPro",
logo: {
"@type": "ImageObject",
url: "https://example.com/brands/photopro-logo.png",
},
url: "https://photopro.example.com",
},
sku: "CAM-XYZ1000",
mpn: "XYZ1000",
gtin13: "0123456789012",
category: "Electronics > Cameras > DSLR Cameras",
color: "Black",
material: "Magnesium Alloy",
weight: {
"@type": "QuantitativeValue",
value: 850,
unitCode: "GRM", // grams
},
height: {
"@type": "QuantitativeValue",
value: 11.5,
unitCode: "CMT", // centimeters
},
width: {
"@type": "QuantitativeValue",
value: 15.7,
unitCode: "CMT",
},
depth: {
"@type": "QuantitativeValue",
value: 7.4,
unitCode: "CMT",
},
offers: {
"@type": "Offer",
price: 2499.99,
priceCurrency: "USD",
priceValidUntil: "2024-12-31",
availability: "InStock",
itemCondition: "NewCondition",
url: "https://example.com/cameras/xyz-1000",
seller: {
"@type": "Organization",
name: "CameraWorld",
url: "https://cameraworld.example.com",
},
shippingDetails: {
"@type": "OfferShippingDetails",
shippingRate: {
"@type": "MonetaryAmount",
value: 12.99,
currency: "USD",
},
deliveryTime: {
"@type": "ShippingDeliveryTime",
transitTime: {
"@type": "QuantitativeValue",
minValue: 1,
maxValue: 3,
unitCode: "DAY",
},
},
},
hasMerchantReturnPolicy: {
"@type": "MerchantReturnPolicy",
returnPolicyCategory: "MerchantReturnFiniteReturnWindow",
returnWindow: {
"@type": "QuantitativeValue",
value: 30,
unitCode: "DAY",
},
},
},
review: [
{
"@type": "Review",
author: {
"@type": "Person",
name: "John Smith",
},
reviewRating: {
"@type": "Rating",
ratingValue: 5,
bestRating: 5,
},
name: "Outstanding professional camera",
reviewBody:
"This is the best camera I've ever used. Image quality is excellent and the ergonomics are perfect.",
datePublished: "2024-01-15",
},
{
"@type": "Review",
author: {
"@type": "Person",
name: "Jane Doe",
},
reviewRating: {
"@type": "Rating",
ratingValue: 4,
bestRating: 5,
},
name: "Great camera, slightly heavy",
reviewBody:
"Amazing image quality but a bit on the heavy side for all-day shooting.",
datePublished: "2024-02-10",
},
],
aggregateRating: {
"@type": "AggregateRating",
ratingValue: 4.8,
reviewCount: 89,
bestRating: 5,
},
manufacturer: {
"@type": "Organization",
name: "PhotoPro Inc.",
url: "https://photoproinc.example.com",
},
model: "XYZ-1000",
releaseDate: "2023-09-15",
award: [
"Best Professional Camera 2023 - Photography Magazine",
"Editor's Choice Award - Camera Review Quarterly",
],
isRelatedTo: [
{
"@type": "Product",
name: "PhotoPro 24-70mm f/2.8 Lens",
url: "https://example.com/lenses/24-70mm",
},
{
"@type": "Product",
name: "PhotoPro Battery Grip BG-X10",
url: "https://example.com/accessories/bg-x10",
},
],
isSimilarTo: [
{
"@type": "Product",
name: "PhotoPro XYZ-800",
url: "https://example.com/cameras/xyz-800",
},
],
countryOfOrigin: "Japan",
}}
/>
```
### Search action Schema
```tsx
<SearchActionSchema
data={{
target: "https://example.com/search?q={search_term_string}",
"query-input": "required name=search_term_string"
}}
/>
<SearchActionSchema
data={{
target: "https://example.com/search?q={search_term_string}",
"query-input": "required name=search_term_string",
actionStatus: "PotentialActionStatus",
provider: {
"@type": "Organization",
name: "Example Company",
url: "https://example.com"
}
}}
/>
<WebsiteSchema
data={{
name: "Example Website",
url: "https://example.com",
potentialAction: {
"@type": "SearchAction",
target: "https://example.com/search?q={search_term_string}",
"query-input": "required name=search_term_string"
}
}}
/>
```
### Image Object Schema
```tsx
<ImageObjectSchema
data={{
name: "Cracow Old TYown",
description: "Cracow at fly",
url: "https://example.com/images/krakow-aerial.jpg",
contentUrl: "https://example.com/images/high-res/krakow-aerial.jpg",
width: 3000,
height: 2000,
caption: "Cracow",
creditText: "Foto: Jan Kowalski",
encodingFormat: "image/jpeg",
contentSize: "4.2 MB",
uploadDate: "2023-06-15T10:30:00+02:00",
copyrightNotice: "© 2023 Jan Kowalski Photography",
license: "https://creativecommons.org/licenses/by/4.0/",
author: {
"@type": "Person",
name: "Jan Kowalski",
url: "https://jankowalski-photography.example.com",
},
creator: {
"@type": "Person",
name: "Jan Kowalski",
},
contentLocation: {
"@type": "Place",
name: "Old Town Cracow",
address: {
"@type": "PostalAddress",
addressLocality: "Kraków",
addressRegion: "małopolskie",
addressCountry: "Polska",
},
},
thumbnailUrl: [
"https://example.com/images/thumbnails/krakow-aerial-small.jpg",
"https://example.com/images/thumbnails/krakow-aerial-medium.jpg",
],
datePublished: "2023-06-16T09:00:00+02:00",
keywords: [
"Kraków",
"Stare Miasto",
"fotografia lotnicza",
"dron",
"Polska",
],
inLanguage: "pl",
exifData: [
{
"@type": "PropertyValue",
name: "camera",
value: "DJI Mavic 3",
},
{
"@type": "PropertyValue",
name: "aperture",
value: "f/2.8",
},
{
"@type": "PropertyValue",
name: "exposureTime",
value: "1/500",
},
{
"@type": "PropertyValue",
name: "ISO",
value: "100",
},
],
}}
/>
```
### Event Schema
```tsx
<EventSchema
data={{
"@type": "EducationEvent",
name: "Webinar: Intro Next.js",
description: "Intro Webinar",
startDate: "2024-07-10T18:00:00+02:00",
endDate: "2024-07-10T19:30:00+02:00",
location: {
"@type": "VirtualLocation",
url: "https://webinar.example.com/nextjs-intro",
},
eventAttendanceMode: "OnlineEventAttendanceMode",
eventStatus: "EventScheduled",
organizer: {
"@type": "Organization",
name: "Web Dev School",
url: "https://webdevschool.example.com",
},
offers: {
"@type": "Offer",
price: 0,
priceCurrency: "PLN",
availability: "InStock",
validFrom: "2024-06-01T00:00:00+02:00",
url: "https://webdevschool.example.com/webinars/nextjs-intro/register",
},
image: "https://webdevschool.example.com/images/nextjs-webinar.jpg",
performer: {
"@type": "Person",
name: "Jan Kowalski",
url: "https://webdevschool.example.com/team/jan-kowalski",
},
inLanguage: "pl",
isAccessibleForFree: true,
maximumAttendeeCapacity: 500,
}}
/>
```
### Restaurant Schema
```tsx
<RestaurantSchema
data={{
"@type": "Restaurant",
name: "Seaside Grill & Bar",
description: "Premium seafood restaurant with ocean views and craft cocktails.",
url: "https://seasidegrillbar.example.com",
telephone: "+1-305-555-8765",
email: "info@seasidegrillbar.example.com",
address: {
"@type": "PostalAddress",
streetAddress: "789 Ocean Drive",
addressLocality: "Miami",
addressRegion: "FL",
postalCode: "33139",
addressCountry": "US"
},
geo: {
"@type": "GeoCoordinates",
latitude: 25.781126,
longitude: -80.132023
},
image: [
"https://seasidegrillbar.example.com/images/restaurant-exterior.jpg",
"https://seasidegrillbar.example.com/images/dining-area.jpg",
"https://seasidegrillbar.example.com/images/bar.jpg"
],
priceRange: "$$$",
servesCuisine: ["Seafood", "American", "Cocktail Bar"],
acceptsReservations: "https://seasidegrillbar.example.com/reservations",
openingHoursSpecification: [
{
"@type": "OpeningHoursSpecification",
dayOfWeek: ["Monday", "Tuesday", "Wednesday", "Thursday"],
opens: "17:00",
closes: "23:00"
},
{
"@type": "OpeningHoursSpecification",
dayOfWeek: ["Friday", "Saturday"],
opens: "17:00",
closes: "00:00"
},
{
"@type": "OpeningHoursSpecification",
dayOfWeek: "Sunday",
opens: "16:00",
closes: "22:00"
}
],
menu: {
"@type": "Menu",
hasMenuSection: [
{
"@type": "MenuSection",
name: "Appetizers",
hasMenuItem: [
{
"@type": "MenuItem",
name: "Calamari Fritti",
description: "Lightly battered calamari served with lemon aioli",
price: 14.95,
priceCurrency: "USD"
},
{
"@type": "MenuItem",
name: "Shrimp Cocktail",
description: "Jumbo shrimp with house-made cocktail sauce",
price: 16.95,
priceCurrency: "USD"
}
]
},
{
"@type": "MenuSection",
name: "Main Courses",
hasMenuItem: [
{
"@type": "MenuItem",
name: "Grilled Sea Bass",
description: "Locally sourced sea bass with seasonal vegetables",
price: 32.95,
priceCurrency: "USD",
suitableForDiet: "GlutenFreeDiet"
},
{
"@type": "MenuItem",
name: "Lobster Linguine",
description: "Maine lobster with homemade linguine pasta",
price: 38.95,
priceCurrency: "USD"
}
]
}
]
},
paymentAccepted: ["Cash", "Credit Card", "Debit Card"],
availableLanguage: ["English", "Spanish"],
wheelchairAccessible: true,
hasTakeoutOption: true,
hasDeliveryMethod: "DeliveryModeThirdParty",
aggregateRating: {
"@type": "AggregateRating",
ratingValue: 4.7,
reviewCount: 483,
bestRating: 5
},
review: [
{
"@type": "Review",
author: {
"@type": "Person",
name: "John Smith"
},
reviewRating: {
"@type": "Rating",
ratingValue: 5,
bestRating: 5
},
reviewBody: "The seafood here is outstanding. Great ocean views!",
datePublished: "2023-08-15"
},
{
"@type": "Review",
author: {
"@type": "Person",
name: "Emily Johnson"
},
reviewRating: {
"@type": "Rating",
ratingValue: 4,
bestRating: 5
},
reviewBody: "Excellent cocktails, good food but a bit pricey.",
datePublished: "2023-09-22"
}
],
sameAs: [
"https://www.facebook.com/seasidegrillbar",
"https://www.instagram.com/seasidegrillbar",
"https://twitter.com/seasidegrillbar"
],
offers: [
{
"@type": "Offer",
description": "Happy Hour - 50% off select appetizers and drinks",
price: 0,
validFrom: "17:00",
validThrough: "19:00"
}
],
specialities: ["Fresh seafood", "Craft cocktails", "Ocean views"],
founder: {
"@type": "Person",
name: "Robert Fisher",
url: "https://seasidegrillbar.example.com/about/robert-fisher"
},
foundingDate: "2015-05-15"
}}
/>
```
### Person Schema
```tsx
<PersonSchema
data={{
name: "Dr. Jane Wilson",
givenName: "Jane",
familyName: "Wilson",
honorificPrefix: "Dr.",
honorificSuffix: "Ph.D.",
jobTitle: "Chief Data Scientist",
description:
"Award-winning data scientist with over 15 years of experience in machine learning and AI research.",
url: "https://janewilson.example.com",
email: "jane.wilson@example.com",
telephone: "+1-555-987-6543",
address: {
"@type": "PostalAddress",
streetAddress: "123 Innovation Drive",
addressLocality: "San Francisco",
addressRegion: "CA",
postalCode: "94105",
addressCountry: "US",
},
image: {
"@type": "ImageObject",
url: "https://janewilson.example.com/profile.jpg",
width: 800,
height: 800,
},
worksFor: {
"@type": "Organization",
name: "TechInnovate Inc.",
url: "https://techinnovate.example.com",
logo: {
"@type": "ImageObject",
url: "https://techinnovate.example.com/logo.png",
},
},
alumniOf: [
{
"@type": "University",
name: "Stanford University",
url: "https://www.stanford.edu",
},
{
"@type": "University",
name: "Massachusetts Institute of Technology",
url: "https://www.mit.edu",
},
],
hasCredential: [
{
"@type": "EducationalOccupationalCredential",
name: "Ph.D. in Computer Science",
educationalLevel: "Doctoral Degree",
recognizedBy: {
"@type": "University",
name: "Stanford University",
},
},
{
"@type": "EducationalOccupationalCredential",
name: "Certified Data Professional",
credentialCategory: "Professional Certificate",
recognizedBy: {
"@type": "Organization",
name: "Data Science Association",
},
},
],
knowsLanguage: ["English", "Python", "R", "SQL", "TensorFlow"],
knowsAbout: [
"Machine Learning",
"Artificial Intelligence",
"Data Mining",
"Neural Networks",
"Statistics",
],
skills: [
{
"@type": "DefinedTerm",
name: "Deep Learning",
},
{
"@type": "DefinedTerm",
name: "Natural Language Processing",
},
{
"@type": "DefinedTerm",
name: "Computer Vision",
},
],
sameAs: [
"https://www.linkedin.com/in/janewilson",
"https://twitter.com/janewilson",
"https://github.com/janewilson",
"https://scholar.google.com/citations?user=janewilson",
],
award: [
"Best Paper Award, International Conference on Machine Learning 2020",
"Innovation in AI Award, Tech Association 2022",
],
hasOccupationalExperience: [
{
"@type": "EmployeeRole",
roleName: "Chief Data Scientist",
memberOf: {
"@type": "Organization",
name: "TechInnovate Inc.",
},
startDate: "2018-01-01",
},
{
"@type": "EmployeeRole",
roleName: "Senior Data Scientist",
memberOf: {
"@type": "Organization",
name: "DataCorp",
},
startDate: "2014-03-15",
endDate: "2017-12-31",
},
],
affiliation: [
{
"@type": "Organization",
name: "Association for Computing Machinery",
url: "https://www.acm.org",
},
{
"@type": "Organization",
name: "IEEE Computer Society",
url: "https://www.computer.org",
},
],
}}
/>
```
### JobPosting Schema
```tsx
<JobPostingSchema
data={{
title: "Senior Full Stack Developer",
description: "<p>We're seeking an experienced Full Stack Developer to lead development on our core product. The ideal candidate will have expertise in React, Node.js, and cloud services.</p><h3>Responsibilities:</h3><ul><li>Design and implement new features</li><li>Optimize application performance</li><li>Collaborate with cross-functional teams</li></ul>",
datePosted: "2024-03-10",
validThrough: "2024-05-10",
employmentType: "FULL_TIME",
hiringOrganization: {
"@type": "Organization",
name: "Cloud Innovate",
logo: {
"@type": "ImageObject",
url: "https://cloudinnovate.example.com/logo.png"
},
url: "https://cloudinnovate.example.com",
sameAs: "https://www.linkedin.com/company/cloudinnovate"
},
jobLocation: {
"@type": "Place",
address: {
"@type": "PostalAddress",
streetAddress: "555 Technology Plaza",
addressLocality: "Austin",
addressRegion: "TX",
postalCode": "78701",
addressCountry": "US"
}
},
jobLocationType: "HYBRID",
workHours: "40 hours per week, flexible schedule",
baseSalary: {
"@type": "MonetaryAmount",
currency: "USD",
value: {
"@type": "QuantitativeValue",
minValue: 120000,
maxValue: 160000,
unitText: "YEAR"
}
},
experienceRequirements: {
"@type": "OccupationalExperienceRequirements",
monthsOfExperience: 60,
description: "At least 5 years of experience in full-stack development"
},
educationRequirements: {
"@type": "EducationalOccupationalCredential",
credentialCategory: "bachelor's degree",
educationalLevel: "Bachelor's Degree",
name: "Computer Science or related field"
},
skills: [
{
"@type": "DefinedTerm",
name: "React",
inDefinedTermSet: "programming languages"
},
{
"@type": "DefinedTerm",
name: "Node.js",
inDefinedTermSet: "programming languages"
},
{
"@type": "DefinedTerm",
name: "AWS",
inDefinedTermSet: "cloud services"
},
{
"@type": "DefinedTerm",
name: "CI/CD",
inDefinedTermSet: "development practices"
}
],
jobBenefits: "Health insurance, 401(k) matching, flexible work schedule, professional development budget, remote work options",
responsibilities: "Lead development on core product features, architect scalable solutions, mentor junior developers, participate in code reviews, and collaborate with product management on roadmap planning.",
qualifications: [
{
"@type": "DefinedTerm",
name: "5+ years of full-stack development experience"
},
{
"@type": "DefinedTerm",
name: "Strong expertise in JavaScript/TypeScript"
},
{
"@type": "DefinedTerm",
name: "Experience with cloud architecture"
}
],
industy: "Software Development",
occupationalCategory: "15-1252 Software Developers",
applicationDeadline: "2024-05-10",
directApply: true,
applicationContact: {
"@type": "ContactPoint",
email: "careers@cloudinnovate.example.com",
contactType: "Human Resources"
},
incentiveCompensation: "Annual performance bonus, stock options",
identifier: {
"@type": "PropertyValue",
name: "Job Requisition Number",
value: "DEV-2024-03"
}
}}
/>
```
### Software Application Schema
```tsx
<SoftwareApplicationSchema
data={{
"@type": "MobileApplication",
name: "FitTracker",
description: "A fitness tracking application that helps you monitor your workouts, nutrition, and health metrics.",
applicationCategory: "HealthApplication",
operatingSystem: ["Android", "iOS"],
softwareVersion: "2.5.0",
offers: {
"@type": "Offer",
price: 0,
priceCurrency: "USD"
},
downloadUrl: "https://apps.example.com/fittracker",
fileSize: "45MB",
author: {
"@type": "Organization",
name: "HealthTech Solutions",
url: "https://healthtechsolutions.example.com"
},
aggregateRating: {
"@type": "AggregateRating",
ratingValue: 4.5,
ratingCount: 12500,
bestRating: 5
},
screenshot: [
"https://apps.example.com/fittracker/screenshots/dashboard.jpg",
"https://apps.example.com/fittracker/screenshots/workout.jpg",
"https://apps.example.com/fittracker/screenshots/nutrition.jpg"
],
featureList: [
"Workout tracking",
"Nutrition logging",
"Health metrics monitoring",
"Personalized coaching",
"Goal setting"
],
contentRating: "Everyone",
datePublished: "2022-05-15",
dateModified: "2024-02-10",
availableOnDevice: ["Android Phone", "iPhone", "iPad"],
permissions: [
"Camera Access",
"Health Data Access",
"Location Access",
"Notifications"
],
review: [
{
"@type": "Review",
author: {
"@type": "Person",
name: "John D."
},
reviewRating: {
"@type": "Rating",
ratingValue: 5,
bestRating: 5
},
reviewBody: "This app has transformed my fitness routine. The workout tracking is intuitive and the nutrition logging has helped me stay on track with my goals.",
datePublished: "2023-11-15"
},
{
"@type": "Review",
author: {
"@type": "Person",
name: "Sarah M."
},
reviewRating: {
"@type": "Rating",
ratingValue: 4,
bestRating: 5
},
reviewBody: "Great app overall! The only thing I'd improve is adding more workout varieties.",
datePublished: "2024-01-22"
}
]
}}
/>
<SoftwareApplicationSchema
data={{
"@type": "WebApplication",
name: "CloudDocs",
description: "A collaborative document editing and management platform for teams and businesses.",
applicationCategory: "BusinessApplication",
applicationSubCategory: "ProductivityApplication",
operatingSystem: "All",
softwareVersion: "3.8.2",
offers: [
{
"@type": "Offer",
price: 0,
priceCurrency: "USD",
name: "Free Plan"
},
{
"@type": "Offer",
price: 9.99,
priceCurrency: "USD",
name: "Pro Plan"
},
{
"@type": "Offer",
price: 29.99,
priceCurrency: "USD",
name: "Business Plan"
}
],
url: "https://clouddocs.example.com",
aggregateRating: {
"@type": "AggregateRating",
ratingValue: 4.8,
ratingCount: 5280,
bestRating: 5
},
featureList: [
"Real-time collaboration",
"Document versioning",
"Advanced formatting",
"Templates library",
"Team management",
"Integrations with other platforms"
],
screenshot: [
{
"@type": "ImageObject",
url: "https://clouddocs.example.com/screenshots/editor.jpg",
caption: "Document editor interface"
},
{
"@type": "ImageObject",
url: "https://clouddocs.example.com/screenshots/dashboard.jpg",
caption: "User dashboard with recent documents"
}
],
provider: {
"@type": "Organization",
name: "CloudTech Solutions",
url: "https://cloudtech.example.com",
logo: {
"@type": "ImageObject",
url: "https://cloudtech.example.com/logo.png"
}
}
}}
/>
```
### Movie Schema
```tsx
<MovieSchema
data={{
name: "Inception",
alternativeHeadline: "Your mind is the scene of the crime",
description: "A thief who steals corporate secrets through the use of dream-sharing technology is given the inverse task of planting an idea into the mind of a C.E.O.",
image: {
"@type": "ImageObject",
url: "https://example.com/inception-poster.jpg",
caption: "Official movie poster for Inception"
},
trailer: {
"@type": "VideoObject",
name: "Inception - Official Trailer",
description: "Watch the official trailer for Inception",
thumbnailUrl: "https://example.com/inception-trailer-thumbnail.jpg",
uploadDate: "2010-05-10",
embedUrl: "https://example.com/embed/inception-trailer"
},
datePublished: "2010-07-16",
dateCreated: "2010-07-08",
director: {
"@type": "Person",
name: "Christopher Nolan",
url: "https://example.com/christopher-nolan"
},
actor: [
{
"@type": "Person",
name: "Leonardo DiCaprio",
url: "https://example.com/leonardo-dicaprio"
},
{
"@type": "Person",
name: "Joseph Gordon-Levitt",
url: "https://example.com/joseph-gordon-levitt"
},
{
"@type": "Person",
name: "Ellen Page",
url: "https://example.com/ellen-page"
},
{
"@type": "Person",
name: "Tom Hardy",
url: "https://example.com/tom-hardy"
}
],
productionCompany: {
"@type": "Organization",
name: "Warner Bros. Pictures",
url: "https://example.com/warner-bros"
},
musicBy: {
"@type": "Person",
name: "Hans Zimmer",
url: "https://example.com/hans-zimmer"
},
duration: "PT2H28M",
contentRating: "PG-13",
genre: ["Science Fiction", "Action", "Thriller"],
keywords: "dreams, subconscious, heist, reality, memory",
inLanguage: "English",
countryOfOrigin: {
"@type": "Country",
name: "United States"
},
aggregateRating: {
"@type": "AggregateRating",
ratingValue: 8.8,
bestRating: 10,
ratingCount: 2100000,
reviewCount: 12500
},
review: [
{
"@type": "Review",
author: {
"@type": "Person",
name: "Roger Ebert"
},
reviewRating: {
"@type": "Rating",
ratingValue: 4,
bestRating: 4
},
name: "A mind-bending masterpiece",
reviewBody: "It's a breathtaking juggling act, and Nolan juggles and the audience gasps.",
datePublished: "2010-07-15",
publisher: {
"@type": "Organization",
name: "Chicago Sun-Times"
}
},
{
"@type": "Review",
author: {
"@type": "Organization",
name: "The New York Times"
},
reviewRating: {
"@type": "Rating",
ratingValue: 5,
bestRating": 5
},
reviewBody: "A masterpiece of modern cinema that challenges the mind while entertaining thoroughly.",
datePublished: "2010-07-16"
}
],
award: [
"Academy Award for Best Cinematography 2011",
"Academy Award for Best Sound Editing 2011",
"Academy Award for Best Sound Mixing 2011",
"Academy Award for Best Visual Effects 2011"
],
url: "https://example.com/inception",
sameAs: [
"https://www.imdb.com/title/tt1375666/",
"https://www.rottentomatoes.com/m/inception",
"https://en.wikipedia.org/wiki/Inception"
],
offers: {
"@type": "Offer",
price": 14.99,
priceCurrency": "USD",
availability": "InStock",
url": "https://example.com/watch/inception"
},
budget: {
"@type": "MonetaryAmount",
currency: "USD",
value: 160000000
}
}}
/>
```
### Book Schema
```tsx
<BookSchema
data={{
name: "1984",
alternateName: "Nineteen Eighty-Four",
author: {
"@type": "Person",
name: "George Orwell",
url: "https://example.com/george-orwell"
},
isbn: "9780451524935",
bookFormat: "Paperback",
numberOfPages: 328,
publisher: {
"@type": "Organization",
name: "Penguin Books",
url: "https://www.penguin.com"
},
datePublished: "1949-06-08",
copyrightYear: 1949,
inLanguage: "English",
genre: ["Dystopian", "Political fiction", "Social science fiction"],
description: "A dystopian novel set in Airstrip One, a province of the superstate Oceania in a world of perpetual war, omnipresent government surveillance, and public manipulation.",
image: {
"@type": "ImageObject",
url: "https://example.com/1984-cover.jpg",
caption: "Cover of the Penguin Books edition"
},
aggregateRating: {
"@type": "AggregateRating",
ratingValue: 4.6,
reviewCount: 12750,
bestRating: 5
},
review: [
{
"@type": "Review",
author: {
"@type": "Organization",
name: "The Guardian"
},
reviewRating: {
"@type": "Rating",
ratingValue: 5,
bestRating: 5
},
reviewBody": "A masterpiece that continues to resonate in our political landscape.",
datePublished: "1999-06-08"
},
{
"@type": "Review",
author: {
"@type": "Person",
name: "John Smith"
},
reviewRating: {
"@type": "Rating",
ratingValue: 5,
bestRating: 5
},
name: "Timeless and Terrifying",
reviewBody: "Orwell's vision seems more prescient every year. A must-read classic that feels increasingly relevant.",
datePublished: "2021-03-15"
}
],
offers: {
"@type": "Offer",
price: 9.99,
priceCurrency: "USD",
availability: "InStock",
url: "https://example.com/books/1984"
},
workExample: [
{
"@type": "Book",
isbn: "9780451524935",
bookFormat: "Paperback"
},
{
"@type": "Book",
isbn: "9780547249643",
bookFormat: "Hardcover"
},
{
"@type": "Book",
isbn: "9780451518651",
bookFormat: "EBook"
}
],
sameAs: [
"https://en.wikipedia.org/wiki/Nineteen_Eighty-Four",
"https://www.goodreads.com/book/show/5470.1984"
],
audience: {
"@type": "Audience",
name: "Adult readers",
audienceType: "Adults"
}
}}
/>
```
### Store Schema
```tsx
<StoreSchema
data={{
"@type": "ElectronicsStore",
name: "TechWorld Megastore",
description: "A premier electronics retailer offering the latest gadgets, computers, home entertainment systems, and smart home devices with expert installation services.",
url: "https://techworldstore.example.com",
telephone: "+1-555-123-4567",
email: "info@techworldstore.example.com",
address: {
"@type": "PostalAddress",
streetAddress: "500 Technology Plaza, Suite 200",
addressLocality: "Austin",
addressRegion: "TX",
postalCode: "78701",
addressCountry": "US"
},
geo: {
"@type": "GeoCoordinates",
latitude: 30.267153,
longitude: -97.743057
},
openingHoursSpecification: [
{
"@type": "OpeningHoursSpecification",
dayOfWeek: ["Monday", "Tuesday", "Wednesday", "Thursday"],
opens: "09:00",
closes: "21:00"
},
{
"@type": "OpeningHoursSpecification",
dayOfWeek": ["Friday", "Saturday"],
opens": "09:00",
closes": "22:00"
},
{
"@type": "OpeningHoursSpecification",
dayOfWeek": "Sunday",
opens": "11:00",
closes": "18:00"
}
],
image: [
{
"@type": "ImageObject",
url: "https://techworldstore.example.com/images/storefront.jpg",
caption: "TechWorld Megastore Austin Flagship Location"
},
{
"@type": "ImageObject",
url: "https://techworldstore.example.com/images/interior.jpg",
caption: "Our spacious showroom features the latest technology"
}
],
logo: {
"@type": "ImageObject",
url: "https://techworldstore.example.com/logo.png"
},
priceRange: "$$$",
paymentAccepted: ["Cash", "Credit Card", "Debit Card", "Apple Pay", "Google Pay", "Financing"],
currenciesAccepted: "USD",
amenityFeature: [
{
"@type": "LocationFeatureSpecification",
name: "Free Wi-Fi",
value: true
},
{
"@type": "LocationFeatureSpecification",
name: "Customer Lounge",
value: true
},
{
"@type": "LocationFeatureSpecification",
name: "Tech Support Bar",
value: true
}
],
aggregateRating: {
"@type": "AggregateRating",
ratingValue: 4.8,
reviewCount: 1250,
bestRating: 5
},
review: [
{
"@type": "Review",
author: {
"@type": "Person",
name: "John Smith"
},
reviewRating: {
"@type": "Rating",
ratingValue: 5,
bestRating: 5
},
reviewBody: "Excellent selection of products and knowledgeable staff. The tech support team solved my laptop issues in minutes!",
datePublished: "2023-09-15"
}
],
hasMap: "https://www.google.com/maps?cid=123456789",
department: [
{
"@type": "Organization",
name: "Computers & Laptops",
description: "Desktop computers, laptops, and accessories"
},
{
"@type": "Organization",
name: "Home Entertainment",
description: "TVs, sound systems, and streaming devices"
},
{
"@type": "Organization",
name: "Smart Home",
description: "Smart speakers, security systems, and home automation"
}
],
makesOffer: [
{
"@type": "Offer",
itemOffered: {
"@type": "Service",
name: "Tech Setup & Installation",
description: "Professional setup and installation of your new technology"
}
},
{
"@type": "Offer",
itemOffered: {
"@type": "Service",
name: "Extended Warranty",
description: "Comprehensive protection plans for your electronics"
}
}
],
branchOf: {
"@type": "Organization",
name: "TechWorld Inc.",
url: "https://techworld.example.com"
},
potentialAction: {
"@type": "ReserveAction",
target: {
"@type": "EntryPoint",
urlTemplate: "https://techworldstore.example.com/appointments"
}
},
sameAs: [
"https://facebook.com/techworldstore",
"https://twitter.com/techworldstore",
"https://instagram.com/techworldstore"
],
hasDriveThroughService: false,
hasDeliveryMethod: true,
hasTakeoutOption: true,
availableLanguage: ["English", "Spanish"],
acceptsReservations: "https://techworldstore.example.com/appointments"
}}
/>
```
## Output
The schema markup will be rendered as a single `<script>` tag with type `application/ld+json`:
```html
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@graph": [
{
"@type": "WebSite",
"name": "My Website",
"url": "https://example.com"
},
{
"@type": "Organization",
"name": "Company Name",
"url": "https://example.com"
}
]
}
</script>
```
## License
MIT
## Contributing
Contributions are welcome! Please feel free to submit a Pull Request.