it/web/app/minecraft/page.tsx
2025-10-26 17:52:17 +01:00

329 lines
14 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import type { Metadata } from "next";
import Link from "next/link";
import JsonLd from "@/components/JsonLd";
import { site } from "@/lib/site";
import DeployWizard from "./DeployWizard";
export const metadata: Metadata = {
title: "Managed Minecraft Server Hosting & Plugins | Van Hunen IT",
description:
"Lag-free, stable Minecraft hosting on a hardened VPS—backups, tuning, and monitoring included. Deploy a server in minutes or request custom plugin development.",
};
// Shared data (passed to the client wizard & used for SEO JSON-LD)
const plans = [
{
id: "starter",
name: "Starter",
price: "€19/mo",
specs: "2 vCPU • 4 GB RAM • 40 GB SSD",
typical: "Up to ~20 players (optimized)",
features: [
"Paper/Spigot or Bedrock",
"Daily backups + restore test",
"Basic tuning & monitoring",
],
},
{
id: "pro",
name: "Pro",
price: "€39/mo",
specs: "3 vCPU • 8 GB RAM • 80 GB SSD",
typical: "Up to ~60 players (optimized)",
features: [
"Paper/Velocity or Bedrock + Geyser",
"Backups (2x/day) + restore test",
"Advanced tuning & monitoring",
],
},
{
id: "network",
name: "Network",
price: "Custom",
specs: "Dedicated VPS spec",
typical: "Networks & modpacks",
features: [
"Velocity/Bungee multi-server",
"Backups (hourly) + restore test",
"Custom tuning & SLA",
],
},
] as const;
const regions = [
{ id: "eu-nl", label: "EU — Netherlands" },
{ id: "eu-de", label: "EU — Germany" },
{ id: "us-east", label: "US — East" },
{ id: "us-west", label: "US — West" },
] as const;
const faqItems = [
{
q: "Do you support both Java and Bedrock?",
a: "Yes. Java with Paper/Spigot or Velocity, and Bedrock with Geyser support. Modpacks (Forge/Fabric) are supported on resource-appropriate plans.",
},
{
q: "How do backups work?",
a: "Automated backups are included with scheduled restore tests. We keep notes and timing so you know recovery is proven.",
},
{
q: "Can I migrate from another host?",
a: "Yes. We can migrate files, plugins, and worlds. Well review your current setup and tune performance on the new server.",
},
{
q: "Do you offer DDoS protection?",
a: "We apply baseline hardening and provider-level network protections. For advanced scenarios, well discuss options during setup.",
},
{
q: "What about uptime and incidents?",
a: "We monitor resources and uptime, document incidents with notes, and offer SLAs depending on your plan.",
},
];
const serviceLd = {
"@context": "https://schema.org",
"@type": "Service",
serviceType: "Managed Minecraft Server Hosting & Plugin Development",
provider: {
"@type": "Organization",
name: site.name,
url: site.url,
logo: site.org.logo,
},
areaServed: ["EU", "US"],
hasOfferCatalog: {
"@type": "OfferCatalog",
name: "Minecraft Hosting Plans",
itemListElement: plans.map((p) => ({
"@type": "Offer",
name: p.name,
price: p.price,
description: `${p.specs}${p.typical}`,
url: `${site.url}/minecraft#deploy`,
category: "Minecraft Hosting",
})),
},
};
const faqLd = {
"@context": "https://schema.org",
"@type": "FAQPage",
mainEntity: faqItems.map((i) => ({
"@type": "Question",
name: i.q,
acceptedAnswer: { "@type": "Answer", text: i.a },
})),
};
export default function MinecraftPage() {
const hostname = new URL(site.url).hostname;
return (
<main className="relative isolate min-h-screen bg-gradient-to-b from-neutral-50 via-white to-neutral-100 dark:from-neutral-950 dark:via-neutral-900 dark:to-neutral-950">
{/* HERO */}
<section className="relative overflow-hidden">
<div className="absolute inset-0 pointer-events-none opacity-60 bg-[radial-gradient(50%_50%_at_50%_0%,rgba(99,102,241,0.20),rgba(168,85,247,0.15)_40%,transparent_70%)]" />
<div className="container mx-auto max-w-6xl px-4 py-24 text-center">
<h1 className="text-4xl sm:text-6xl font-extrabold tracking-tight">
<span className="bg-gradient-to-r from-blue-600 via-purple-600 to-blue-600 bg-clip-text text-transparent">
Managed Minecraft Server Hosting Lag-Free & Done-for-You
</span>
</h1>
<p className="mx-auto mt-6 max-w-3xl text-lg sm:text-xl text-neutral-700 dark:text-neutral-300">
Hardened VPS, tuned performance, backups with restore tests, and monitoring. Deploy your server in minutes or let us set it up for you. Need features? We build custom <strong>Paper/Spigot</strong> plugins with tests and docs.
</p>
<div className="mt-8 flex flex-col sm:flex-row gap-3 justify-center">
<a
href="#deploy"
className="inline-flex items-center justify-center rounded-lg bg-gradient-to-r from-blue-600 via-purple-600 to-blue-600 px-6 py-3 text-white font-semibold hover:opacity-90 transition"
>
Deploy a Server
</a>
<Link
href="/contact?type=minecraft-hosting"
className="inline-flex items-center justify-center rounded-lg border border-neutral-300 dark:border-neutral-700 px-6 py-3 text-neutral-900 dark:text-white font-semibold hover:bg-neutral-50 dark:hover:bg-neutral-800 transition"
>
Talk to an Engineer
</Link>
</div>
{/* Proof badges */}
<div className="mt-10 grid grid-cols-1 sm:grid-cols-3 gap-4 max-w-4xl mx-auto">
<div className="rounded-xl border border-neutral-200 dark:border-neutral-800 bg-white/70 dark:bg-neutral-900/70 p-4">
<p className="text-2xl font-bold">Stable TPS</p>
<p className="text-sm text-neutral-600 dark:text-neutral-400">tuned Paper/Velocity stacks</p>
</div>
<div className="rounded-xl border border-neutral-200 dark:border-neutral-800 bg-white/70 dark:bg-neutral-900/70 p-4">
<p className="text-2xl font-bold">Restore-Proven</p>
<p className="text-sm text-neutral-600 dark:text-neutral-400">backups with timed drills</p>
</div>
<div className="rounded-xl border border-neutral-200 dark:border-neutral-800 bg-white/70 dark:bg-neutral-900/70 p-4">
<p className="text-2xl font-bold">SLA-backed</p>
<p className="text-sm text-neutral-600 dark:text-neutral-400">monitoring & incident notes</p>
</div>
</div>
</div>
</section>
{/* BENEFITS */}
<section className="relative border-y border-neutral-200 dark:border-neutral-800">
<div className="container mx-auto max-w-6xl px-4 py-16">
<h2 className="text-3xl sm:text-5xl font-bold tracking-tight text-center">
Everything you need for smooth gameplay
</h2>
<div className="mt-10 grid gap-6 sm:grid-cols-2 lg:grid-cols-4">
{[
{ t: "Performance Tuning", d: "Paper, Timings, async I/O, and caching where it counts." },
{ t: "Backups + Restore Tests", d: "Automated backups and scheduled restore drills with notes." },
{ t: "Monitoring & Incidents", d: "Uptime, resource alerts, clear incident notes & follow-up." },
{ t: "Security Basics", d: "Hardened OS, firewall rules, and safe update process." },
].map((b) => (
<article
key={b.t}
className="rounded-2xl border border-neutral-200 dark:border-neutral-800 bg-white/60 dark:bg-neutral-900/60 p-6"
>
<h3 className="text-lg font-semibold">{b.t}</h3>
<p className="mt-2 text-sm text-neutral-700 dark:text-neutral-300">{b.d}</p>
</article>
))}
</div>
</div>
</section>
{/* PLANS */}
<section className="relative py-16">
<div className="container mx-auto max-w-6xl px-4">
<h2 className="text-3xl sm:text-5xl font-bold tracking-tight text-center">Hosting Plans</h2>
<p className="mt-4 text-neutral-700 dark:text-neutral-300 text-center max-w-3xl mx-auto">
Choose a plan that fits your community. Player counts are typical, not hard limitstuning and plugins affect performance.
</p>
<div className="mt-10 grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
{plans.map((p) => (
<div
key={p.id}
className="rounded-2xl border border-neutral-200 dark:border-neutral-800 bg-white/60 dark:bg-neutral-900/60 p-6 flex flex-col"
>
<div className="flex items-baseline justify-between">
<h3 className="text-xl font-semibold">{p.name}</h3>
<div className="text-lg font-bold">{p.price}</div>
</div>
<div className="mt-2 text-sm text-neutral-700 dark:text-neutral-300">{p.specs}</div>
<div className="mt-1 text-xs text-neutral-500 dark:text-neutral-400">{p.typical}</div>
<ul className="mt-4 space-y-2 text-sm">
{p.features.map((f) => (
<li key={f} className="flex items-start gap-2">
<span className="mt-0.5"></span>
<span>{f}</span>
</li>
))}
</ul>
<a
href={`#deploy?plan=${p.id}`}
className="mt-6 inline-flex items-center justify-center rounded-lg bg-gradient-to-r from-blue-600 via-purple-600 to-blue-600 px-4 py-2 text-white font-semibold hover:opacity-90 transition"
>
{p.id === "network" ? "Request Custom Plan" : `Deploy ${p.name}`}
</a>
</div>
))}
</div>
</div>
</section>
{/* PLUGIN DEVELOPMENT */}
<section className="relative py-16 border-y border-neutral-200 dark:border-neutral-800">
<div className="container mx-auto max-w-6xl px-4">
<div className="grid gap-8 lg:grid-cols-2">
<div>
<h2 className="text-3xl sm:text-5xl font-bold tracking-tight">Minecraft Plugin Development</h2>
<p className="mt-4 text-neutral-700 dark:text-neutral-300">
Custom Paper/Spigot plugins built to spectests, config, permissions, and docs included.
Ownership transferred to you after payment.
</p>
<ul className="mt-6 space-y-2 text-sm">
{[
"Feature scoping and milestones",
"Automated test suite & changelog",
"Config, permissions, and admin docs",
"Private repo transfer and handover",
].map((li) => (
<li key={li} className="flex items-start gap-2">
<span className="mt-0.5">🔧</span>
<span>{li}</span>
</li>
))}
</ul>
<div className="mt-6 flex gap-3">
<Link
href="/contact?type=plugin"
className="inline-flex items-center rounded-lg bg-neutral-900 dark:bg-white text-white dark:text-neutral-900 px-5 py-2 font-semibold hover:opacity-90 transition"
>
Request Plugin Quote
</Link>
<Link
href="/contact?type=minecraft-hosting"
className="inline-flex items-center rounded-lg border border-neutral-300 dark:border-neutral-700 px-5 py-2 font-semibold text-neutral-900 dark:text-white hover:bg-neutral-50 dark:hover:bg-neutral-800 transition"
>
Talk About Your Server
</Link>
</div>
</div>
<div className="rounded-2xl border border-neutral-200 dark:border-neutral-800 bg-white/60 dark:bg-neutral-900/60 p-6">
<div className="text-sm font-semibold">Example plugin ideas</div>
<ul className="mt-3 space-y-2 text-sm text-neutral-700 dark:text-neutral-300">
<li> Economy & shops with anti-dupe checks</li>
<li> Claims / protection with region flags</li>
<li> Cross-server chat via Velocity</li>
<li> Mini-games scaffolding & leaderboards</li>
</ul>
<p className="mt-4 text-xs text-neutral-500 dark:text-neutral-400">
(Well confirm feasibility and scope before building.)
</p>
</div>
</div>
</div>
</section>
{/* SELF-SERVICE DEPLOYMENT */}
<section id="deploy" className="relative py-16">
<div className="container mx-auto max-w-3xl px-4">
<h2 className="text-3xl sm:text-4xl font-bold tracking-tight text-center">
Deploy a Minecraft Server (Self-Service)
</h2>
<p className="mt-3 text-center text-neutral-700 dark:text-neutral-300">
Pick a plan, choose edition & version, set a region, and well provision your server and email access details.
</p>
<DeployWizard plans={plans} regions={regions} siteHostname={hostname} />
</div>
</section>
{/* FAQ */}
<section className="relative py-16 bg-gradient-to-b from-neutral-50 via-white to-neutral-100 dark:from-neutral-950 dark:via-neutral-900 dark:to-neutral-950">
<div className="container mx-auto max-w-4xl px-4">
<h2 className="text-3xl sm:text-4xl font-bold tracking-tight text-center">FAQ</h2>
<div className="mt-8 grid gap-6">
{faqItems.map((i) => (
<article
key={i.q}
className="rounded-2xl border border-neutral-200 dark:border-neutral-800 bg-white/60 dark:bg-neutral-900/60 p-6"
>
<h3 className="text-lg font-semibold">{i.q}</h3>
<p className="mt-2 text-sm text-neutral-700 dark:text-neutral-300">{i.a}</p>
</article>
))}
</div>
</div>
</section>
<JsonLd data={serviceLd} />
<JsonLd data={faqLd} />
</main>
);
}