From 8dbf28c693da3bdbf4aff7f80325bbe9d579f944 Mon Sep 17 00:00:00 2001 From: Mauricio Siu <47042324+Siumauricio@users.noreply.github.com> Date: Mon, 29 Apr 2024 23:13:00 -0600 Subject: [PATCH] Nuevo inicio del repositorio --- .gitignore | 37 + README.md | 2 + app/icon.svg | 5 + app/layout.tsx | 98 + app/not-found.tsx | 27 + app/page.tsx | 25 + app/robots.ts | 11 + app/sitemap.ts | 12 + biome.json | 15 + components.json | 17 + components/Button.tsx | 59 + components/CallToAction.tsx | 55 + components/Container.tsx | 13 + components/Faqs.tsx | 101 + components/Footer.tsx | 68 + components/Header.tsx | 178 ++ components/Hero.tsx | 196 ++ components/NavLink.tsx | 33 + components/Pricing.tsx | 201 ++ components/PrimaryFeatures.tsx | 193 ++ components/SecondaryFeatures.tsx | 393 +++ components/SlimLayout.tsx | 31 + components/Testimonials.tsx | 141 + components/analitycs/google.tsx | 17 + components/analitycs/index.ts | 30 + components/shared/Logo.tsx | 25 + components/ui/button.tsx | 58 + images/logos/laravel.svg | 18 + lib/utils.ts | 8 + next.config.js | 8 + package-lock.json | 4888 ++++++++++++++++++++++++++++++ package.json | 41 + pnpm-lock.yaml | 3168 +++++++++++++++++++ postcss.config.js | 6 + prettier.config.js | 6 + public/avatars/avatar-1.png | Bin 0 -> 12105 bytes public/avatars/avatar-10.png | Bin 0 -> 12710 bytes public/avatars/avatar-11.png | Bin 0 -> 11597 bytes public/avatars/avatar-12.png | Bin 0 -> 13171 bytes public/avatars/avatar-2.png | Bin 0 -> 13280 bytes public/avatars/avatar-3.png | Bin 0 -> 12238 bytes public/avatars/avatar-4.png | Bin 0 -> 12557 bytes public/avatars/avatar-5.png | Bin 0 -> 10838 bytes public/avatars/avatar-6.png | Bin 0 -> 11428 bytes public/avatars/avatar-7.png | Bin 0 -> 12478 bytes public/avatars/avatar-8.png | Bin 0 -> 12416 bytes public/avatars/avatar-9.png | Bin 0 -> 13038 bytes public/install.sh | 89 + public/og.png | Bin 0 -> 24940 bytes public/primary/applications.png | Bin 0 -> 81184 bytes public/primary/backups.png | Bin 0 -> 96090 bytes public/primary/monitoring.png | Bin 0 -> 141093 bytes public/primary/projects.png | Bin 0 -> 115931 bytes public/secondary/terminal.png | Bin 0 -> 122953 bytes public/secondary/traefik.png | Bin 0 -> 108849 bytes public/secondary/users.png | Bin 0 -> 118216 bytes styles/tailwind.css | 52 + tailwind.config.ts | 104 + tsconfig.json | 28 + yarn.lock | 2772 +++++++++++++++++ 60 files changed, 13229 insertions(+) create mode 100644 .gitignore create mode 100644 README.md create mode 100644 app/icon.svg create mode 100644 app/layout.tsx create mode 100644 app/not-found.tsx create mode 100644 app/page.tsx create mode 100644 app/robots.ts create mode 100644 app/sitemap.ts create mode 100644 biome.json create mode 100644 components.json create mode 100644 components/Button.tsx create mode 100644 components/CallToAction.tsx create mode 100644 components/Container.tsx create mode 100644 components/Faqs.tsx create mode 100644 components/Footer.tsx create mode 100644 components/Header.tsx create mode 100644 components/Hero.tsx create mode 100644 components/NavLink.tsx create mode 100644 components/Pricing.tsx create mode 100644 components/PrimaryFeatures.tsx create mode 100644 components/SecondaryFeatures.tsx create mode 100644 components/SlimLayout.tsx create mode 100644 components/Testimonials.tsx create mode 100644 components/analitycs/google.tsx create mode 100644 components/analitycs/index.ts create mode 100644 components/shared/Logo.tsx create mode 100644 components/ui/button.tsx create mode 100644 images/logos/laravel.svg create mode 100644 lib/utils.ts create mode 100644 next.config.js create mode 100644 package-lock.json create mode 100644 package.json create mode 100644 pnpm-lock.yaml create mode 100644 postcss.config.js create mode 100644 prettier.config.js create mode 100644 public/avatars/avatar-1.png create mode 100644 public/avatars/avatar-10.png create mode 100644 public/avatars/avatar-11.png create mode 100644 public/avatars/avatar-12.png create mode 100644 public/avatars/avatar-2.png create mode 100644 public/avatars/avatar-3.png create mode 100644 public/avatars/avatar-4.png create mode 100644 public/avatars/avatar-5.png create mode 100644 public/avatars/avatar-6.png create mode 100644 public/avatars/avatar-7.png create mode 100644 public/avatars/avatar-8.png create mode 100644 public/avatars/avatar-9.png create mode 100644 public/install.sh create mode 100644 public/og.png create mode 100644 public/primary/applications.png create mode 100644 public/primary/backups.png create mode 100644 public/primary/monitoring.png create mode 100644 public/primary/projects.png create mode 100644 public/secondary/terminal.png create mode 100644 public/secondary/traefik.png create mode 100644 public/secondary/users.png create mode 100644 styles/tailwind.css create mode 100644 tailwind.config.ts create mode 100644 tsconfig.json create mode 100644 yarn.lock diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..0b13095 --- /dev/null +++ b/.gitignore @@ -0,0 +1,37 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +.idea + +# dependencies +/node_modules +/.pnp +.pnp.js + +# testing +/coverage + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem + +# debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# local env files +.env*.local + +# vercel +.vercel + +# typescript +*.tsbuildinfo +next-env.d.ts diff --git a/README.md b/README.md new file mode 100644 index 0000000..ddcd17e --- /dev/null +++ b/README.md @@ -0,0 +1,2 @@ +# Dokploy Website + diff --git a/app/icon.svg b/app/icon.svg new file mode 100644 index 0000000..3a8930d --- /dev/null +++ b/app/icon.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/app/layout.tsx b/app/layout.tsx new file mode 100644 index 0000000..25e77b8 --- /dev/null +++ b/app/layout.tsx @@ -0,0 +1,98 @@ +import { Inter, Lexend } from "next/font/google"; +import clsx from "clsx"; +import "@/styles/tailwind.css"; +import type { Metadata } from "next"; +import GoogleAnalytics from "@/components/analitycs/google"; + +export const metadata: Metadata = { + title: { + default: "Dokploy - Effortless Deployment Solutions", + template: "%s | Simplify Your DevOps", + }, + alternates: { + canonical: "https://dokploy.com", + languages: { + en: "https://dokploy.com", + }, + }, + description: + "Streamline your deployment process with Dokploy. Effortlessly manage applications and databases on any VPS using Docker and Traefik for improved performance and security.", + applicationName: "Dokploy", + keywords: [ + "Dokploy", + "Docker", + "Traefik", + "deployment", + "VPS", + "application management", + "database management", + "DevOps", + "cloud infrastructure", + "UI Self hosted", + ], + referrer: "origin", + robots: "index, follow", + openGraph: { + type: "website", + url: "https://dokploy.com", + title: "Dokploy - Effortless Deployment Solutions", + description: + "Simplify your DevOps with Dokploy. Deploy applications and manage databases efficiently on any VPS.", + siteName: "Dokploy", + images: [ + { + url: "http://dokploy.com/og.png", + }, + ], + }, + twitter: { + card: "summary_large_image", + site: "@Dokploy", + creator: "@Dokploy", + title: "Dokploy - Simplify Your DevOps", + description: + "Deploy applications and manage databases with ease using Dokploy. Learn how our platform can elevate your infrastructure management.", + images: "https://dokploy.com/og.png", + }, +}; + +const inter = Inter({ + subsets: ["latin"], + display: "swap", + variable: "--font-inter", +}); + +const lexend = Lexend({ + subsets: ["latin"], + display: "swap", + variable: "--font-lexend", +}); + +export default function RootLayout({ + children, +}: { + children: React.ReactNode; +}) { + return ( + + + {children} + + Dokploy - Open-source alternative to Heroku, Vercel, and Netlify. | Product Hunt + + + ); +} diff --git a/app/not-found.tsx b/app/not-found.tsx new file mode 100644 index 0000000..dd7a785 --- /dev/null +++ b/app/not-found.tsx @@ -0,0 +1,27 @@ +import Link from "next/link"; + +// import { Button } from "../components/Button"; +import { Logo } from "../components/shared/Logo"; +import { SlimLayout } from "../components/SlimLayout"; + +export default function NotFound() { + return ( + +
+ + + +
+

404

+

+ Page not found +

+

+ Sorry, we couldn’t find the page you’re looking for. +

+ {/* */} + + ); +} diff --git a/app/page.tsx b/app/page.tsx new file mode 100644 index 0000000..2847ee1 --- /dev/null +++ b/app/page.tsx @@ -0,0 +1,25 @@ +import { CallToAction } from "../components/CallToAction"; +import { Faqs } from "../components/Faqs"; +import { Footer } from "../components/Footer"; +import { Header } from "../components/Header"; +import { Hero } from "../components/Hero"; +import { PrimaryFeatures } from "../components/PrimaryFeatures"; +import { SecondaryFeatures } from "../components/SecondaryFeatures"; +import { Testimonials } from "../components/Testimonials"; + +export default function Home() { + return ( +
+
+
+ + + + + {/* */} + +
+
+
+ ); +} diff --git a/app/robots.ts b/app/robots.ts new file mode 100644 index 0000000..ebf4d79 --- /dev/null +++ b/app/robots.ts @@ -0,0 +1,11 @@ +import type { MetadataRoute } from "next"; + +export default function robots(): MetadataRoute.Robots { + return { + rules: { + userAgent: "*", + allow: "/", + }, + sitemap: "https://dokploy.com/sitemap.xml", + }; +} diff --git a/app/sitemap.ts b/app/sitemap.ts new file mode 100644 index 0000000..52a2ad7 --- /dev/null +++ b/app/sitemap.ts @@ -0,0 +1,12 @@ +import type { MetadataRoute } from "next"; + +export default function sitemap(): MetadataRoute.Sitemap { + return [ + { + url: "https://dokploy.com", + lastModified: new Date(), + changeFrequency: "yearly", + priority: 1, + }, + ]; +} diff --git a/biome.json b/biome.json new file mode 100644 index 0000000..1e98f43 --- /dev/null +++ b/biome.json @@ -0,0 +1,15 @@ +{ + "$schema": "https://biomejs.dev/schemas/1.7.0/schema.json", + "organizeImports": { + "enabled": true + }, + "linter": { + "enabled": true, + "rules": { + "recommended": true, + "a11y":{ + "noSvgWithoutTitle":"off" + } + } + } +} diff --git a/components.json b/components.json new file mode 100644 index 0000000..e56b199 --- /dev/null +++ b/components.json @@ -0,0 +1,17 @@ +{ + "$schema": "https://ui.shadcn.com/schema.json", + "style": "default", + "rsc": true, + "tsx": true, + "tailwind": { + "config": "tailwind.config.ts", + "css": "src/styles/tailwind.css", + "baseColor": "zinc", + "cssVariables": true, + "prefix": "" + }, + "aliases": { + "components": "@/components", + "utils": "@/lib/utils" + } +} \ No newline at end of file diff --git a/components/Button.tsx b/components/Button.tsx new file mode 100644 index 0000000..900a39c --- /dev/null +++ b/components/Button.tsx @@ -0,0 +1,59 @@ +import Link from "next/link"; +import clsx from "clsx"; +import { cn } from "@/lib/utils"; + +const baseStyles = { + solid: + "group inline-flex items-center justify-center rounded-full py-2 px-4 text-sm font-semibold focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2", + outline: + "group inline-flex ring-1 items-center justify-center rounded-full py-2 px-4 text-sm focus:outline-none", +}; + +const variantStyles = { + solid: { + slate: + "bg-slate-900 text-white hover:bg-slate-700 hover:text-slate-100 active:bg-slate-800 active:text-slate-300 focus-visible:outline-slate-900", + blue: "bg-blue-600 text-white hover:text-slate-100 hover:bg-blue-500 active:bg-blue-800 active:text-blue-100 focus-visible:outline-blue-600", + white: + "bg-white text-slate-900 hover:bg-blue-50 active:bg-blue-200 active:text-slate-600 focus-visible:outline-white", + }, + outline: { + slate: + "ring-slate-200 text-slate-700 hover:text-slate-900 hover:ring-slate-300 active:bg-slate-100 active:text-slate-600 focus-visible:outline-blue-600 focus-visible:ring-slate-300", + white: + "ring-slate-700 text-white hover:ring-slate-500 active:ring-slate-700 active:text-slate-400 focus-visible:outline-white", + }, +}; + +type VariantKey = keyof typeof variantStyles; +type ColorKey = + keyof (typeof variantStyles)[Variant]; + +type ButtonProps< + Variant extends VariantKey, + Color extends ColorKey, +> = { + variant?: Variant; + color?: Color; +} & ( + | Omit, "color"> + | (Omit, "color"> & { + href?: undefined; + }) +); + +export function Button< + Color extends ColorKey, + Variant extends VariantKey = "solid", +>({ variant, color, className, ...props }: ButtonProps) { + variant = variant ?? ("solid" as Variant); + color = color ?? ("slate" as Color); + + className = cn(baseStyles[variant], variantStyles[variant][color], className); + + return typeof props.href === "undefined" ? ( + + + + + ); +} diff --git a/components/Container.tsx b/components/Container.tsx new file mode 100644 index 0000000..85eaa00 --- /dev/null +++ b/components/Container.tsx @@ -0,0 +1,13 @@ +import clsx from "clsx"; + +export function Container({ + className, + ...props +}: React.ComponentPropsWithoutRef<"div">) { + return ( +
+ ); +} diff --git a/components/Faqs.tsx b/components/Faqs.tsx new file mode 100644 index 0000000..117b4d0 --- /dev/null +++ b/components/Faqs.tsx @@ -0,0 +1,101 @@ +import { Container } from "./Container"; + +const faqs = [ + [ + { + question: "What is dokploy?", + answer: + "Dokploy is a stable, easy-to-use deployment solution designed to simplify the application management process. Think of Dokploy as a free alternative self-hostable solution to platforms like Heroku, Vercel, and Netlify.", + }, + { + question: "Why Choose Dokploy?", + answer: "Simplicity, Flexibility, and Fast", + }, + { + question: "Is free?", + answer: + "Yes, dokploy is totally free. You can use it for personal projects, small teams, or even for large-scale applications.", + }, + { + question: "Is it open source?", + answer: "Yes, dokploy is open source and free to use.", + }, + ], + [ + { + question: "What type of applications can i deploy with dokploy?", + answer: + "Dokploy is a great choice for any type of application. You can deploy your code to dokploy and manage it from the dashboard. We support a wide range of languages and frameworks, so you can choose the one that best fits your needs.", + }, + { + question: "How do I request a feature or report a bug?", + answer: + "Currently we are working on fixing bug fixes, but we will be releasing new features soon. You can also request features or report bugs.", + }, + { + question: "Do you track the usage of Dokploy?", + answer: "No, we don't track any usage data.", + }, + ], + [ + { + question: + "Are there any user forums or communities where I can interact with other users?", + answer: + "Yes, we have active github discussions where you can share ideas, ask for help, and connect with other users.", + }, + { + question: "What types of applications can I deploy with Dokploy?", + answer: + "Dokploy supports a variety of applications, including those built with Docker, as well as applications from any Git repository, offering custom builds with Nixpacks, Dockerfiles, or Buildpacks like Heroku and Paketo.", + }, + { + question: "How does Dokploy handle database management?", + answer: + "Dokploy supports multiple database systems including Postgres, MySQL, MariaDB, MongoDB, and Redis, providing tools for easy deployment and management directly from the dashboard.", + }, + ], +]; + +export function Faqs() { + return ( +
+ +
+

+ Frequently asked questions +

+

+ If you can’t find what you’re looking for, email our support team + and if you’re lucky someone will get back to you. +

+
+
    + {faqs.map((column, columnIndex) => ( +
  • +
      + {column.map((faq, faqIndex) => ( +
    • +

      + {faq.question} +

      +

      + {faq.answer} +

      +
      • + ))} +
    +
    • + ))} +
+ +
+ ); +} diff --git a/components/Footer.tsx b/components/Footer.tsx new file mode 100644 index 0000000..91fc9db --- /dev/null +++ b/components/Footer.tsx @@ -0,0 +1,68 @@ +import Link from "next/link"; + +import { Container } from "./Container"; +import { Logo } from "./shared/Logo"; +import { NavLink } from "./NavLink"; + +export function Footer() { + return ( +
+ +
+
+ + + Dokploy + +
+ + +
+
+
+ + + + + + +
+

+ Copyright © {new Date().getFullYear()} Dokploy. All rights + reserved. +

+
+ +
+ ); +} diff --git a/components/Header.tsx b/components/Header.tsx new file mode 100644 index 0000000..7700d62 --- /dev/null +++ b/components/Header.tsx @@ -0,0 +1,178 @@ +"use client"; + +import { Fragment } from "react"; +import Link from "next/link"; +import { Popover, Transition } from "@headlessui/react"; +import { Container } from "./Container"; +import { Logo } from "./shared/Logo"; +import { NavLink } from "./NavLink"; +import { Button } from "./ui/button"; +import { cn } from "@/lib/utils"; +import { trackGAEvent } from "./analitycs"; + +function MobileNavLink({ + href, + children, + target, +}: { + href: string; + children: React.ReactNode; + target?: string; +}) { + return ( + { + trackGAEvent({ + action: "Nav Link Clicked", + category: "Navigation", + label: href, + }); + }} + as={Link} + href={href} + target={target} + className="block w-full p-2" + > + {children} + + ); +} + +function MobileNavIcon({ open }: { open: boolean }) { + return ( + + ); +} + +function MobileNavigation() { + return ( + + + {({ open }) => } + + + + + + + + Features + Testimonials + Faqs + + Docs + + + + + + ); +} + +export function Header() { + return ( +
+ + + +
+ ); +} diff --git a/components/Hero.tsx b/components/Hero.tsx new file mode 100644 index 0000000..c5bfebd --- /dev/null +++ b/components/Hero.tsx @@ -0,0 +1,196 @@ +"use client"; +import Link from "next/link"; +import { Container } from "./Container"; +import { Button, buttonVariants } from "./ui/button"; +import { Check, Copy, Github } from "lucide-react"; +import { useEffect, useState } from "react"; + +const ProductHunt = () => { + return ( + + + + + + + + + + ); +}; + +export function Hero() { + const [isCopied, setIsCopied] = useState(false); + + useEffect(() => { + const timer = setTimeout(() => { + setIsCopied(false); + }, 2000); + return () => clearTimeout(timer); + }, [isCopied]); + return ( + +
+ {/* + + + + + + + + + + + + + + */} + + + + + + + + + + + + + + + + +
+ +
+

+ Deploy{" "} + + + Anywhere + {" "} + with Total Freedom and Ease. +

+

+ Streamline your operations with our all-in-one platform—perfect for + managing projects, data, and system health with simplicity and + efficiency. +

+
+
+ + curl -sSL https://dokploy.com/install.sh | sh + + + {/* */} + +
+
+
+