Add Drupal headless stack with Next.js frontend
- Add Next.js frontend service (nextjs) with Dockerfile and source - Update docker-compose.yml: image names, Drupal 11.3.3, nextjs service - Add docker-compose.override.yml.disabled for dev hot-reload - Add install-headless-modules.sh for OAuth/JSON:API module setup - Add README.md with full setup and configuration guide - Update nginx/Dockerfile and nginx.conf.template for cms. subdomain - Update drupal/Dockerfile PHP-FPM build args - Gitignore **/.vscode/ to prevent IDE workspace files from being tracked
This commit is contained in:
parent
71a8dac389
commit
f8b8f53d54
85 changed files with 7802 additions and 17 deletions
49
drupal/nextjs/components/obfuscated-address.tsx
Normal file
49
drupal/nextjs/components/obfuscated-address.tsx
Normal file
|
|
@ -0,0 +1,49 @@
|
|||
"use client"
|
||||
|
||||
import { useEffect, useState } from "react"
|
||||
|
||||
/**
|
||||
* Renders a mailto link only after client mount so the email is not in the
|
||||
* server-rendered HTML, reducing harvestability by bots that scan static HTML.
|
||||
* Parts are hardcoded so they live in the JS bundle, not in page HTML.
|
||||
*/
|
||||
type AddressData = {
|
||||
fullname: string
|
||||
street: string
|
||||
city: string
|
||||
country: string
|
||||
}
|
||||
|
||||
export function ObfuscatedAddress({ className }: { className?: string }) {
|
||||
const [address, setAddress] = useState<AddressData | null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
setAddress({
|
||||
fullname: "Robert Nasarek",
|
||||
street: "Kleine Ulrichstraße 1",
|
||||
city: "Halle (Saale)",
|
||||
country: "Germany",
|
||||
})
|
||||
}, [])
|
||||
|
||||
if (!address) {
|
||||
return (
|
||||
<span className={className}>
|
||||
<noscript>Robert Nasarek, Kleine Ulrichstraße 1, Halle (Saale), Germany</noscript>
|
||||
<span aria-hidden>…</span>
|
||||
</span>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<p className={className}>
|
||||
{address.fullname}
|
||||
<br />
|
||||
{address.street}
|
||||
<br />
|
||||
{address.city}
|
||||
<br />
|
||||
{address.country}
|
||||
</p>
|
||||
)
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue