Compare commits
19 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 29b2b38490 | |||
| 49402cd23f | |||
| 4181addd02 | |||
| 94231a6dec | |||
| 642be3112c | |||
| cb60de783e | |||
| cafd02427e | |||
| deabcec91b | |||
| d4b95179b5 | |||
| cff1d6c39b | |||
| 30cad703bf | |||
| cb9544518a | |||
| 95a0cf51e3 | |||
| 80f65884c4 | |||
| 8187c80e3d | |||
| 32e38fdef6 | |||
| 81f757faae | |||
| eea7f2acdb | |||
| 66f8b722d9 |
@@ -6,7 +6,8 @@ import "./globals.css";
|
||||
const inter = Inter({ subsets: ["latin"] });
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Christian Friis - Web Designer", description: "Professional web designer creating stunning digital experiences"};
|
||||
title: "Peter Friis - Webdesigner", description: "Professioneller Webdesigner, der atemberaubende digitale Erlebnisse schafft. Stellen Sie Ihre Website mit Next.js, Vercel oder einer beliebigen Node.js-Hosting-Plattform bereit."
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
@@ -14,7 +15,75 @@ export default function RootLayout({
|
||||
children: React.ReactNode;
|
||||
}) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<html lang="de">
|
||||
<head>
|
||||
<script>
|
||||
{`
|
||||
window.deploymentGuide = {
|
||||
platforms: [
|
||||
{
|
||||
name: 'Vercel',
|
||||
steps: [
|
||||
'1. Schieben Sie Ihren Code zu GitHub',
|
||||
'2. Gehen Sie zu vercel.com und registrieren Sie sich',
|
||||
'3. Klicken Sie auf "Neues Projekt" und wählen Sie Ihr Repository',
|
||||
'4. Vercel erkennt Next.js automatisch und stellt bereit',
|
||||
'5. Ihre Website ist live auf der vercel.app-Domain'
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Netlify',
|
||||
steps: [
|
||||
'1. Schieben Sie Ihren Code zu GitHub',
|
||||
'2. Gehen Sie zu netlify.com und registrieren Sie sich',
|
||||
'3. Klicken Sie auf "Neue Website aus Git" und wählen Sie Ihr Repository',
|
||||
'4. Build-Befehl festlegen: npm run build',
|
||||
'5. Veröffentlichungsverzeichnis festlegen: .next/standalone',
|
||||
'6. Stellen Sie bereit und erhalten Sie Ihre Live-Domain'
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Self-Hosted (Node.js)',
|
||||
steps: [
|
||||
'1. Holen Sie sich einen Server (Digital Ocean, AWS, etc)',
|
||||
'2. Klonen Sie Ihr Repository auf dem Server',
|
||||
'3. Ausführen: npm install && npm run build',
|
||||
'4. NODE_ENV=production festlegen',
|
||||
'5. Starten Sie mit: npm start oder verwenden Sie PM2',
|
||||
'6. Richten Sie nginx/Apache als Reverse-Proxy ein',
|
||||
'7. Konfigurieren Sie Ihre Domain-DNS'
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Docker-Bereitstellung',
|
||||
steps: [
|
||||
'1. Erstellen Sie ein Dockerfile im Projektstammverzeichnis',
|
||||
'2. Image erstellen: docker build -t myapp .',
|
||||
'3. Container ausführen: docker run -p 3000:3000 myapp',
|
||||
'4. Zu Docker Hub oder Container-Registry pushen',
|
||||
'5. Auf Cloud-Plattformen bereitstellen (AWS ECS, GCP, etc)'
|
||||
]
|
||||
}
|
||||
],
|
||||
environmentVariables: [
|
||||
'NODE_ENV=production',
|
||||
'NEXT_PUBLIC_API_URL=your-api-url',
|
||||
'DATABASE_URL=your-database-url'
|
||||
],
|
||||
postDeploymentChecklist: [
|
||||
'Alle Navigationslinks testen',
|
||||
'Responsives Design auf Mobilgeräten überprüfen',
|
||||
'Überprüfen Sie, ob E-Mail-Formulare ordnungsgemäß funktionieren',
|
||||
'Bestätigen Sie, dass Bilder ordnungsgemäß geladen werden',
|
||||
'Kontaktformulare-Übermittlung testen',
|
||||
'SEO-Meta-Tags überprüfen',
|
||||
'Seitenladegeschwindigkeit überprüfen',
|
||||
'SSL-Zertifikat einrichten (HTTPS)'
|
||||
]
|
||||
};
|
||||
`}
|
||||
</script>
|
||||
</head>
|
||||
<body className={inter.className}>{children}
|
||||
<script
|
||||
dangerouslySetInnerHTML={{
|
||||
|
||||
141
src/app/page.tsx
141
src/app/page.tsx
@@ -5,11 +5,9 @@ import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/Nav
|
||||
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
|
||||
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||||
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
|
||||
import AboutMetric from '@/components/sections/about/AboutMetric';
|
||||
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import { Sparkles, Briefcase, Zap, Users, TrendingUp, Award, Mail } from 'lucide-react';
|
||||
import { Sparkles, Briefcase, Zap, Mail, Code, Rocket, CheckCircle } from 'lucide-react';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -27,49 +25,49 @@ export default function LandingPage() {
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
brandName="Christian Friis"
|
||||
brandName="Peter Friis"
|
||||
navItems={[
|
||||
{ name: "Work", id: "portfolio" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
{ name: "Arbeiten", id: "portfolio" },
|
||||
{ name: "Dienstleistungen", id: "services" },
|
||||
{ name: "Bereitstellung", id: "deployment" },
|
||||
{ name: "Kontakt", id: "contact" }
|
||||
]}
|
||||
bottomLeftText="Web Designer"
|
||||
bottomRightText="friischristian35@gmail.com"
|
||||
bottomLeftText="Webdesigner"
|
||||
bottomRightText="friisp@gmail.com"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
title="Web Design That Captivates"
|
||||
description="I create stunning, user-centric websites that blend beautiful design with seamless functionality. Let's transform your vision into a digital experience that converts."
|
||||
tag="Professional Designer"
|
||||
title="Webdesign, das fesselt"
|
||||
description="Ich erstelle atemberaubende, benutzerorientierte Websites, die schönes Design mit nahtloser Funktionalität verbinden. Lassen Sie uns Ihre Vision in ein digitales Erlebnis umwandeln, das konvertiert."
|
||||
tag="Professioneller Designer"
|
||||
tagIcon={Sparkles}
|
||||
tagAnimation="slide-up"
|
||||
background={{ variant: "animated-grid" }}
|
||||
buttons={[
|
||||
{ text: "View My Work", href: "#portfolio" },
|
||||
{ text: "Get Started", href: "#contact" }
|
||||
{ text: "Meine Arbeiten ansehen", href: "#portfolio" },
|
||||
{ text: "Erste Schritte", href: "#contact" }
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
carouselItems={[
|
||||
{
|
||||
id: "1", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-stunning-modern-e-commerce-website-des-1772566668134-fb1e4245.png?_wi=1", imageAlt: "E-commerce website design"
|
||||
id: "1", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-stunning-modern-e-commerce-website-des-1772566668134-fb1e4245.png?_wi=1", imageAlt: "E-Commerce-Website-Design"
|
||||
},
|
||||
{
|
||||
id: "2", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-sleek-corporate-website-design-for-a-t-1772566668876-f9cb2e3c.png?_wi=1", imageAlt: "Corporate website design"
|
||||
id: "2", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-sleek-corporate-website-design-for-a-t-1772566668876-f9cb2e3c.png?_wi=1", imageAlt: "Corporate-Website-Design"
|
||||
},
|
||||
{
|
||||
id: "3", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-creative-agency-website-design-with-bo-1772566669671-c480d904.png?_wi=1", imageAlt: "Creative agency website"
|
||||
id: "3", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-creative-agency-website-design-with-bo-1772566669671-c480d904.png?_wi=1", imageAlt: "Kreative Agentur-Website"
|
||||
},
|
||||
{
|
||||
id: "4", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-sophisticated-saas-platform-landing-pa-1772566668752-9737873c.png?_wi=1", imageAlt: "SaaS platform design"
|
||||
id: "4", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-sophisticated-saas-platform-landing-pa-1772566668752-9737873c.png?_wi=1", imageAlt: "SaaS-Plattform-Design"
|
||||
},
|
||||
{
|
||||
id: "5", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-vibrant-fashion-brand-website-design-w-1772566668475-3b90a44d.png?_wi=1", imageAlt: "Fashion brand website"
|
||||
id: "5", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-vibrant-fashion-brand-website-design-w-1772566668475-3b90a44d.png?_wi=1", imageAlt: "Modemarken-Website"
|
||||
},
|
||||
{
|
||||
id: "6", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-professional-consulting-firm-website-d-1772566668764-39fb77be.png?_wi=1", imageAlt: "Consulting website design"
|
||||
id: "6", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-professional-consulting-firm-website-d-1772566668764-39fb77be.png?_wi=1", imageAlt: "Beratungsfirmen-Website-Design"
|
||||
}
|
||||
]}
|
||||
autoPlay={true}
|
||||
@@ -79,8 +77,8 @@ export default function LandingPage() {
|
||||
|
||||
<div id="portfolio" data-section="portfolio">
|
||||
<ProductCardOne
|
||||
title="Featured Work"
|
||||
description="A selection of my recent web design projects showcasing diverse industries and design approaches."
|
||||
title="Ausgewählte Arbeiten"
|
||||
description="Eine Auswahl meiner jüngsten Webdesign-Projekte, die verschiedene Branchen und Designansätze zeigen."
|
||||
tag="Portfolio"
|
||||
tagIcon={Briefcase}
|
||||
tagAnimation="slide-up"
|
||||
@@ -90,22 +88,22 @@ export default function LandingPage() {
|
||||
animationType="slide-up"
|
||||
products={[
|
||||
{
|
||||
id: "1", name: "E-Commerce Platform", price: "2023", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-stunning-modern-e-commerce-website-des-1772566668134-fb1e4245.png?_wi=2", imageAlt: "E-commerce platform design"
|
||||
id: "1", name: "E-Commerce-Plattform", price: "2023", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-stunning-modern-e-commerce-website-des-1772566668134-fb1e4245.png?_wi=2", imageAlt: "E-Commerce-Plattform-Design"
|
||||
},
|
||||
{
|
||||
id: "2", name: "Corporate Website", price: "2023", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-sleek-corporate-website-design-for-a-t-1772566668876-f9cb2e3c.png?_wi=2", imageAlt: "Corporate website design"
|
||||
id: "2", name: "Corporate-Website", price: "2023", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-sleek-corporate-website-design-for-a-t-1772566668876-f9cb2e3c.png?_wi=2", imageAlt: "Corporate-Website-Design"
|
||||
},
|
||||
{
|
||||
id: "3", name: "Creative Agency Site", price: "2024", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-creative-agency-website-design-with-bo-1772566669671-c480d904.png?_wi=2", imageAlt: "Creative agency website"
|
||||
id: "3", name: "Kreative Agentur-Website", price: "2024", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-creative-agency-website-design-with-bo-1772566669671-c480d904.png?_wi=2", imageAlt: "Kreative Agentur-Website"
|
||||
},
|
||||
{
|
||||
id: "4", name: "SaaS Platform", price: "2024", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-sophisticated-saas-platform-landing-pa-1772566668752-9737873c.png?_wi=2", imageAlt: "SaaS platform design"
|
||||
id: "4", name: "SaaS-Plattform", price: "2024", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-sophisticated-saas-platform-landing-pa-1772566668752-9737873c.png?_wi=2", imageAlt: "SaaS-Plattform-Design"
|
||||
},
|
||||
{
|
||||
id: "5", name: "Fashion Brand", price: "2023", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-vibrant-fashion-brand-website-design-w-1772566668475-3b90a44d.png?_wi=2", imageAlt: "Fashion brand website"
|
||||
id: "5", name: "Modemarke", price: "2023", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-vibrant-fashion-brand-website-design-w-1772566668475-3b90a44d.png?_wi=2", imageAlt: "Modemarken-Website"
|
||||
},
|
||||
{
|
||||
id: "6", name: "Consulting Firm", price: "2024", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-professional-consulting-firm-website-d-1772566668764-39fb77be.png?_wi=2", imageAlt: "Consulting website design"
|
||||
id: "6", name: "Beratungsfirma", price: "2024", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-professional-consulting-firm-website-d-1772566668764-39fb77be.png?_wi=2", imageAlt: "Beratungsfirmen-Website-Design"
|
||||
}
|
||||
]}
|
||||
/>
|
||||
@@ -113,70 +111,65 @@ export default function LandingPage() {
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardNineteen
|
||||
title="My Services"
|
||||
description="End-to-end web design solutions tailored to your business goals and brand identity."
|
||||
tag="What I Offer"
|
||||
title="Meine Dienstleistungen"
|
||||
description="End-to-End-Webdesign-Lösungen, zugeschnitten auf Ihre Geschäftsziele und Markenidentität."
|
||||
tag="Was ich anbiete"
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: 1,
|
||||
tag: "Design", title: "Web Design", subtitle: "Beautiful, intuitive interfaces that engage users.", description: "I create custom web designs that reflect your brand identity and captivate your audience. From concept to execution, every pixel is carefully crafted for optimal user experience and visual impact.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-modern-designer-s-workspace-with-a-cle-1772566667699-d70c5a04.png", imageAlt: "Web design workspace"
|
||||
tag: "Design", title: "Webdesign", subtitle: "Schöne, intuitive Schnittstellen, die Benutzer ansprechen.", description: "Ich erstelle benutzerdefinierte Webdesigns, die Ihre Markenidentität widerspiegeln und Ihr Publikum fesseln. Von der Konzeption bis zur Ausführung ist jedes Pixel sorgfältig für optimale Benutzererfahrung und visuellen Effekt gestaltet.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-modern-designer-s-workspace-with-a-cle-1772566667699-d70c5a04.png?_wi=1", imageAlt: "Webdesign-Arbeitsbereich"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
tag: "Development", title: "Responsive Development", subtitle: "Websites that work seamlessly across all devices.", description: "Responsive design ensures your website looks and functions flawlessly on desktop, tablet, and mobile. I use modern technologies and best practices to deliver fast, secure, and SEO-optimized websites.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-sleek-corporate-website-design-for-a-t-1772566668876-f9cb2e3c.png?_wi=3", imageAlt: "Responsive development"
|
||||
tag: "Entwicklung", title: "Responsive-Entwicklung", subtitle: "Websites, die auf allen Geräten nahtlos funktionieren.", description: "Responsives Design stellt sicher, dass Ihre Website auf Desktop, Tablet und Mobilgeräten fehlerfrei aussieht und funktioniert. Ich verwende moderne Technologien und Best Practices, um schnelle, sichere und SEO-optimierte Websites bereitzustellen.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-sleek-corporate-website-design-for-a-t-1772566668876-f9cb2e3c.png?_wi=3", imageAlt: "Responsive-Entwicklung"
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
tag: "Optimization", title: "Performance & SEO", subtitle: "Optimized for search engines and user engagement.", description: "I optimize websites for speed, accessibility, and search engine visibility. Strategic SEO implementation ensures your site reaches the right audience and ranks well on search results."
|
||||
tag: "Optimierung", title: "Leistung & SEO", subtitle: "Optimiert für Suchmaschinen und Benutzereinbindung.", description: "Ich optimiere Websites auf Geschwindigkeit, Barrierefreiheit und Sichtbarkeit in Suchmaschinen. Die strategische SEO-Implementierung stellt sicher, dass Ihre Website die richtige Zielgruppe erreicht und bei Suchergebnissen gut rangiert."
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
title="I'm a passionate web designer dedicated to creating digital experiences that inspire and convert. With expertise in modern web design trends, user experience, and digital strategy, I help brands establish a powerful online presence."
|
||||
<div id="deployment" data-section="deployment">
|
||||
<FeatureCardNineteen
|
||||
title="So stellen Sie Ihre Website bereit"
|
||||
description="Mehrere Bereitstellungsoptionen, um Ihre Website schnell und zuverlässig online zu bringen."
|
||||
tag="Bereitstellungsanleitung"
|
||||
tagIcon={Rocket}
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metricsAnimation="slide-up"
|
||||
metrics={[
|
||||
{ icon: Zap, label: "Projects Completed", value: "50+" },
|
||||
{ icon: Users, label: "Happy Clients", value: "30+" },
|
||||
{ icon: TrendingUp, label: "Years Experience", value: "2" },
|
||||
{ icon: Award, label: "Design Awards", value: "8" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFifteen
|
||||
testimonial="Christian's web design expertise transformed our online presence. His attention to detail, creative vision, and collaborative approach made the entire process smooth and enjoyable. Our website has become a powerful business asset."
|
||||
rating={5}
|
||||
author="Sarah Mitchell, CEO - TechFlow"
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
avatars={[
|
||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/professional-headshot-portrait-of-a-busi-1772566666692-7dbdb570.png", alt: "Sarah Mitchell" },
|
||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/professional-headshot-portrait-of-a-crea-1772566668076-76e214eb.png", alt: "John Davis" },
|
||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/professional-headshot-portrait-of-a-fema-1772566667828-5111d03b.png", alt: "Emily Rodriguez" },
|
||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/professional-headshot-portrait-of-a-male-1772566668212-bf31db96.png", alt: "Michael Chen" }
|
||||
features={[
|
||||
{
|
||||
id: 1,
|
||||
tag: "Empfohlen", title: "Auf Vercel bereitstellen", subtitle: "Der schnellste Weg, Next.js-Projekte bereitzustellen.", description: "1. Schieben Sie Ihren Code zu GitHub\n2. Registrieren Sie sich auf vercel.com\n3. Verbinden Sie Ihr Repository\n4. Vercel erkennt Next.js automatisch und stellt bereit\n5. Ihre Website ist sofort online mit automatischem SSL und CDN", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-modern-designer-s-workspace-with-a-cle-1772566667699-d70c5a04.png?_wi=2", imageAlt: "Vercel-Bereitstellung"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
tag: "Alternative", title: "Auf Netlify bereitstellen", subtitle: "Großartige Alternative mit einfacher GitHub-Integration.", description: "1. Schieben Sie Code zu GitHub\n2. Registrieren Sie sich auf netlify.com\n3. Wählen Sie 'Neue Website aus Git'\n4. Build-Befehl: npm run build\n5. Veröffentlichungsverzeichnis: .next/standalone\n6. Stellen Sie bereit und erhalten Sie Ihre Domain", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARjvloGcZpCaedVgrm6Muh5Upq/a-sleek-corporate-website-design-for-a-t-1772566668876-f9cb2e3c.png?_wi=3", imageAlt: "Netlify-Bereitstellung"
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
tag: "Selbst gehostet", title: "Mit Docker bereitstellen", subtitle: "Überall mit Containerisierung bereitstellen.", description: "1. Erstellen Sie ein Dockerfile im Projektstammverzeichnis\n2. Image erstellen: docker build -t myapp .\n3. Ausführen: docker run -p 3000:3000 myapp\n4. Zu Docker Hub pushen\n5. Auf AWS ECS, Google Cloud oder DigitalOcean bereitstellen"
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
tag="Let's Work Together"
|
||||
tag="Lassen Sie uns zusammenarbeiten"
|
||||
tagIcon={Mail}
|
||||
tagAnimation="slide-up"
|
||||
title="Ready to Elevate Your Online Presence?"
|
||||
description="Let's collaborate to create a website that not only looks stunning but also drives results. I'm excited to bring your vision to life."
|
||||
title="Bereit, Ihre Online-Präsenz zu verbessern?"
|
||||
description="Lassen Sie uns zusammenarbeiten, um eine Website zu erstellen, die nicht nur atemberaubend aussieht, sondern auch Ergebnisse bringt. Ich freue mich, Ihre Vision zum Leben zu erwecken."
|
||||
buttons={[
|
||||
{ text: "Contact Me", href: "mailto:friischristian35@gmail.com" },
|
||||
{ text: "Call: +49 176 61169654", href: "tel:+49176611696541" }
|
||||
{ text: "Kontaktieren Sie mich", href: "mailto:friisp@gmail.com" },
|
||||
{ text: "Anrufen: +49 179 2355413", href: "tel:+49176611696541" }
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
background={{ variant: "animated-grid" }}
|
||||
@@ -186,26 +179,26 @@ export default function LandingPage() {
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
logoText="Christian Friis"
|
||||
logoText="Peter Friis"
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{ label: "Work", href: "#portfolio" },
|
||||
{ label: "Services", href: "#services" },
|
||||
{ label: "About", href: "#about" }
|
||||
{ label: "Arbeiten", href: "#portfolio" },
|
||||
{ label: "Dienstleistungen", href: "#services" },
|
||||
{ label: "Bereitstellung", href: "#deployment" }
|
||||
]
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Email", href: "mailto:friischristian35@gmail.com" },
|
||||
{ label: "Phone", href: "tel:+49176611696541" },
|
||||
{ label: "E-Mail", href: "mailto:friisp@gmail.com" },
|
||||
{ label: "Telefon", href: "tel:+49176611696541" },
|
||||
{ label: "LinkedIn", href: "#" }
|
||||
]
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
{ label: "Datenschutzerklärung", href: "#" },
|
||||
{ label: "Nutzungsbedingungen", href: "#" },
|
||||
{ label: "Impressum", href: "#" }
|
||||
]
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user