From d80c0ec7de782237beb8ecf50239cc592d5b151c Mon Sep 17 00:00:00 2001 From: Vojtech Mares Date: Mon, 19 Dec 2022 10:16:19 +0100 Subject: [PATCH] style: run prettier --- components/Button.tsx | 56 ++++++------- components/CallToAction.tsx | 21 +++-- components/Container.tsx | 18 ++-- components/Environment.tsx | 129 ++++++++++++++--------------- components/Faqs.tsx | 46 +++++------ components/Footer.tsx | 47 +++++++---- components/Header.tsx | 21 ++--- components/Hero.tsx | 20 +++-- components/NavLink.tsx | 12 +-- components/Pricing.tsx | 56 +++++++------ components/PrimaryFeatures.tsx | 58 ++++++++----- components/TechStack.tsx | 141 ++++++++++++++++---------------- components/Testimonials.tsx | 56 ++++++------- components/Training.tsx | 93 ++++++++++++++------- components/TrainingListGrid.tsx | 121 +++++++++++++++------------ lib/cms/training.ts | 59 +++++++------ lib/markdownToHTML.ts | 12 +-- pages/_app.tsx | 6 +- pages/_document.tsx | 32 ++++++-- pages/index.tsx | 20 ++--- pages/skoleni/[slug].tsx | 93 +++++++++++---------- pages/skoleni/index.tsx | 42 +++++----- prettier.config.cjs | 4 + tests/Button.test.tsx | 26 +++--- tests/Home.test.tsx | 30 ++++--- types/training.ts | 30 +++---- vitest.config.ts | 18 ++-- 27 files changed, 698 insertions(+), 569 deletions(-) create mode 100644 prettier.config.cjs diff --git a/components/Button.tsx b/components/Button.tsx index 57a5551..a3f8a73 100644 --- a/components/Button.tsx +++ b/components/Button.tsx @@ -1,64 +1,60 @@ -import Link from 'next/link' -import clsx from 'clsx' -import { ReactNode } from 'react' +import Link from "next/link"; +import clsx from "clsx"; +import { ReactNode } from "react"; 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', + "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', -} + "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', + "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', + "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', + "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', - blue: // Supress TypeScript error - '', // TODO: fix properly + "ring-slate-700 text-white hover:ring-slate-500 active:ring-slate-700 active:text-slate-400 focus-visible:outline-white", + // Supress TypeScript error + blue: "", // TODO: fix properly }, -} +}; type Props = { - variant?: 'solid'|'outline', - color?: 'slate'|'white'|'blue', - className?: string, - href?: string, - children?: ReactNode, -} + variant?: "solid" | "outline"; + color?: "slate" | "white" | "blue"; + className?: string; + href?: string; + children?: ReactNode; +}; export function Button({ - variant = 'solid', - color = 'slate', + variant = "solid", + color = "slate", className, href, - children + children, }: Props) { className = clsx( baseStyles[variant], variantStyles[variant][color], className - ) + ); if (href !== undefined) { return ( {children} - ) + ); } else { - return ( - - ) + return ; } } diff --git a/components/CallToAction.tsx b/components/CallToAction.tsx index 5c0efb5..a8662e2 100644 --- a/components/CallToAction.tsx +++ b/components/CallToAction.tsx @@ -1,8 +1,8 @@ -import Image from 'next/image' +import Image from "next/image"; -import { Button } from '@/components/Button' -import { Container } from '@/components/Container' -import backgroundImage from '@/images/background-call-to-action.jpg' +import { Button } from "@/components/Button"; +import { Container } from "@/components/Container"; +import backgroundImage from "@/images/background-call-to-action.jpg"; export function CallToAction() { return ( @@ -24,14 +24,19 @@ export function CallToAction() { Posuňte svoji aplikaci už dnes

- Je na čase pozvednout vaši infrastrukturu na dnešní standardy. - Vaše infrastruktura by měla nabídnout Vaši aplikaci světu, ne ji držet zpátky. + Je na čase pozvednout vaši infrastrukturu na dnešní standardy. Vaše + infrastruktura by měla nabídnout Vaši aplikaci světu, ne ji držet + zpátky.

- - ) + ); } diff --git a/components/Container.tsx b/components/Container.tsx index b47feb4..ecaef6f 100644 --- a/components/Container.tsx +++ b/components/Container.tsx @@ -1,17 +1,15 @@ -import clsx from 'clsx' -import { ReactNode } from 'react' +import clsx from "clsx"; +import { ReactNode } from "react"; type Props = { - className?: string, - children?: ReactNode -} + className?: string; + children?: ReactNode; +}; -export function Container({ className, children }: Props ) { +export function Container({ className, children }: Props) { return ( -
+
{children}
- ) + ); } diff --git a/components/Environment.tsx b/components/Environment.tsx index 633100c..5b3fcc3 100644 --- a/components/Environment.tsx +++ b/components/Environment.tsx @@ -1,49 +1,48 @@ -import Image from 'next/image' +import Image from "next/image"; -import { Container } from './Container' +import { Container } from "./Container"; -import logoKubernetes from '@/images/logos/tools/kubernetes.svg' -import logok3s from '@/images/logos/tools/k3s.svg' -import logoRancher from '@/images/logos/tools/rancher.svg' -import logoAWS from '@/images/logos/tools/amazonaws.svg' -import logoDigitalOcean from '@/images/logos/tools/digitalocean.svg' -import logovmware from '@/images/logos/tools/vmware.svg' +import logoKubernetes from "@/images/logos/tools/kubernetes.svg"; +import logok3s from "@/images/logos/tools/k3s.svg"; +import logoRancher from "@/images/logos/tools/rancher.svg"; +import logoAWS from "@/images/logos/tools/amazonaws.svg"; +import logoDigitalOcean from "@/images/logos/tools/digitalocean.svg"; +import logovmware from "@/images/logos/tools/vmware.svg"; const features = [ { - name: 'Kubernetes', - summary: 'Open Source systém pro automatizaci deploymentů, škálování a správu kontejnerizovaných aplikací.', + name: "Kubernetes", + summary: + "Open Source systém pro automatizaci deploymentů, škálování a správu kontejnerizovaných aplikací.", description: - 'Kubernetes je na platformě nezávislý systém, díky kterému může běžet vaše aplikace u vás v datacentru, v public cloudu nebo třeba v okrajových lokalitách, a nebo třeba na všech najednou, bez problému.', + "Kubernetes je na platformě nezávislý systém, díky kterému může běžet vaše aplikace u vás v datacentru, v public cloudu nebo třeba v okrajových lokalitách, a nebo třeba na všech najednou, bez problému.", icon: logoKubernetes, - iconColor: '#326CE5', + iconColor: "#326CE5", }, { - name: 'k3s & rke2', + name: "k3s & rke2", summary: - 'k3s: lehká distrubuce Kubernetes; rke2: Kubernetes do vašeho datacentra.', + "k3s: lehká distrubuce Kubernetes; rke2: Kubernetes do vašeho datacentra.", description: - 'k3s i rke2 jsou velice snadno instalovatelné distribuce Kubernetes, které můžete nainstalovat úplně všude a přitom mít stále k dispozici celý Kubernetes ekosystém, bez kompromisů.', + "k3s i rke2 jsou velice snadno instalovatelné distribuce Kubernetes, které můžete nainstalovat úplně všude a přitom mít stále k dispozici celý Kubernetes ekosystém, bez kompromisů.", icon: logok3s, - iconColor: '#FFC61C', + iconColor: "#FFC61C", }, { - name: 'Rancher', - summary: - 'Kubernetes jako služba, ve vašem datacentru.', + name: "Rancher", + summary: "Kubernetes jako služba, ve vašem datacentru.", description: - 'Platforma, pro vaše Kubernetes clustery. Komplexní řešení celého životního cyklu clusteru. Neřešte každodení problémy, nechte je řešit Rancher řešit za vás.', + "Platforma, pro vaše Kubernetes clustery. Komplexní řešení celého životního cyklu clusteru. Neřešte každodení problémy, nechte je řešit Rancher řešit za vás.", icon: logoRancher, - iconColor: '#0075A8', + iconColor: "#0075A8", }, { - name: 'AWS', - summary: - 'Největší veřejný cloud. Máte problém? AWS má na to službu.', + name: "AWS", + summary: "Největší veřejný cloud. Máte problém? AWS má na to službu.", description: - 'Amazon Web Services (AWS) je cloudový poskytovatel služeb, včetně ukládání obrovských objemů dat, výpočetního výkonu a sítí. To vše aby pomohli firmám i jednotlivcům růst. AWS je nejrozšířenější poskytovatel, který je cenově dostupný, flexibilní cesta, jak stavět a provozovat aplikace a služby.', + "Amazon Web Services (AWS) je cloudový poskytovatel služeb, včetně ukládání obrovských objemů dat, výpočetního výkonu a sítí. To vše aby pomohli firmám i jednotlivcům růst. AWS je nejrozšířenější poskytovatel, který je cenově dostupný, flexibilní cesta, jak stavět a provozovat aplikace a služby.", icon: logoAWS, - iconColor: '#232F3E', + iconColor: "#232F3E", }, // { // name: 'Google Cloud Platform', @@ -55,13 +54,12 @@ const features = [ // iconColor: '#4285F4', // }, { - name: 'DigitalOcean', - summary: - 'Jednoduchý cloudový poskytovatel, ve kterém se neztratíte.', + name: "DigitalOcean", + summary: "Jednoduchý cloudový poskytovatel, ve kterém se neztratíte.", description: - 'DigitalOcean patří k menším cloudovým poskytovatelům, avšak jejich portfolio vám pro vaši aplikaci bohatě stačí a nebudete se ztrácet v komplexitě velkých poskytovatelů se spoustou služeb.', + "DigitalOcean patří k menším cloudovým poskytovatelům, avšak jejich portfolio vám pro vaši aplikaci bohatě stačí a nebudete se ztrácet v komplexitě velkých poskytovatelů se spoustou služeb.", icon: logoDigitalOcean, - iconColor: '#0080FF', + iconColor: "#0080FF", }, // { // name: 'OpenStack', @@ -73,50 +71,48 @@ const features = [ // iconColor: '#ED1944', // }, { - name: 'VMware', + name: "VMware", summary: - 'Populární řešení pro správu vaše datacentra, od virtuálních serverů až po úložiště.', + "Populární řešení pro správu vaše datacentra, od virtuálních serverů až po úložiště.", description: - 'VMware je virtualizační platforma, která umožňuje vytvářet a spravovat virtuální servery a jejich fyzickém hardwaru. Zároveň umožňuje vytvářet oddělená prostředí například pro vývoj a ostrý provoz, tak i pro zcela různé aplikace.', + "VMware je virtualizační platforma, která umožňuje vytvářet a spravovat virtuální servery a jejich fyzickém hardwaru. Zároveň umožňuje vytvářet oddělená prostředí například pro vývoj a ostrý provoz, tak i pro zcela různé aplikace.", icon: logovmware, - iconColor: '#607078', + iconColor: "#607078", }, -] +]; type FeatureType = { - name: string, - summary: string, - description: string, - icon: any, - iconColor: string, -} + name: string; + summary: string; + description: string; + icon: any; + iconColor: string; +}; type FeatureProps = { - feature: FeatureType - className?: string, - props?: any[], -} + feature: FeatureType; + className?: string; + props?: any[]; +}; function Feature({ feature, className, ...props }: FeatureProps) { return ( -
- -

- {feature.name} -

-

+

+ +

{feature.name}

+

{feature.summary}

-

- {feature.description} -

+

{feature.description}

- ) + ); } function FeaturesMobile() { @@ -128,7 +124,7 @@ function FeaturesMobile() {
))}
- ) + ); } function FeaturesDesktop() { @@ -142,7 +138,7 @@ function FeaturesDesktop() { ))} - ) + ); } export function Environment() { @@ -155,15 +151,16 @@ export function Environment() {

- Jakákoliv platforma, kdekoliv + Jakákoliv platforma, kdekoliv

- Od veřejného cloudu přes on-premise až po serverless, se vším vám poradím. + Od veřejného cloudu přes on-premise až po serverless, se vším vám + poradím.

- ) + ); } diff --git a/components/Faqs.tsx b/components/Faqs.tsx index 21d5f45..6d7faf7 100644 --- a/components/Faqs.tsx +++ b/components/Faqs.tsx @@ -1,61 +1,61 @@ -import Image from 'next/image' +import Image from "next/image"; -import { Container } from '@/components/Container' -import backgroundImage from '@/images/background-faqs.jpg' +import { Container } from "@/components/Container"; +import backgroundImage from "@/images/background-faqs.jpg"; const faqs = [ [ { - question: 'Does TaxPal handle VAT?', + question: "Does TaxPal handle VAT?", answer: - 'Well no, but if you move your company offshore you can probably ignore it.', + "Well no, but if you move your company offshore you can probably ignore it.", }, { - question: 'Can I pay for my subscription via purchase order?', - answer: 'Absolutely, we are happy to take your money in all forms.', + question: "Can I pay for my subscription via purchase order?", + answer: "Absolutely, we are happy to take your money in all forms.", }, { - question: 'How do I apply for a job at TaxPal?', + question: "How do I apply for a job at TaxPal?", answer: - 'We only hire our customers, so subscribe for a minimum of 6 months and then let’s talk.', + "We only hire our customers, so subscribe for a minimum of 6 months and then let’s talk.", }, ], [ { - question: 'What was that testimonial about tax fraud all about?', + question: "What was that testimonial about tax fraud all about?", answer: - 'TaxPal is just a software application, ultimately your books are your responsibility.', + "TaxPal is just a software application, ultimately your books are your responsibility.", }, { question: - 'TaxPal sounds horrible but why do I still feel compelled to purchase?', + "TaxPal sounds horrible but why do I still feel compelled to purchase?", answer: - 'This is the power of excellent visual design. You just can’t resist it, no matter how poorly it actually functions.', + "This is the power of excellent visual design. You just can’t resist it, no matter how poorly it actually functions.", }, { question: - 'I found other companies called TaxPal, are you sure you can use this name?', + "I found other companies called TaxPal, are you sure you can use this name?", answer: - 'Honestly not sure at all. We haven’t actually incorporated or anything, we just thought it sounded cool and made this website.', + "Honestly not sure at all. We haven’t actually incorporated or anything, we just thought it sounded cool and made this website.", }, ], [ { - question: 'How do you generate reports?', + question: "How do you generate reports?", answer: - 'You just tell us what data you need a report for, and we get our kids to create beautiful charts for you using only the finest crayons.', + "You just tell us what data you need a report for, and we get our kids to create beautiful charts for you using only the finest crayons.", }, { - question: 'Can we expect more inventory features?', - answer: 'In life it’s really better to never expect anything at all.', + question: "Can we expect more inventory features?", + answer: "In life it’s really better to never expect anything at all.", }, { - question: 'I lost my password, how do I get into my account?', + question: "I lost my password, how do I get into my account?", answer: - 'Send us an email and we will send you a copy of our latest password spreadsheet so you can find your information.', + "Send us an email and we will send you a copy of our latest password spreadsheet so you can find your information.", }, ], -] +]; export function Faqs() { return ( @@ -106,5 +106,5 @@ export function Faqs() { - ) + ); } diff --git a/components/Footer.tsx b/components/Footer.tsx index f059517..7ca1702 100644 --- a/components/Footer.tsx +++ b/components/Footer.tsx @@ -1,9 +1,9 @@ -import Link from 'next/link' +import Link from "next/link"; -import { Container } from '@/components/Container' +import { Container } from "@/components/Container"; // import { Logo } from '@/components/Logo' // import { NavLink } from '@/components/NavLink' -import { Button } from '@/components/Button' +import { Button } from "@/components/Button"; export function Footer() { return ( @@ -12,20 +12,29 @@ export function Footer() {
-

Vojtěch Mareš

-
    +

    Vojtěch Mareš

    +
    • - +420 732 490 651 + + +420 732 490 651 +
    • - iam@vojtechmares.com + + iam@vojtechmares.com +
    • - Company ID
      + Company ID +
      06999280
    • - VAT ID
      + VAT ID +
      CZ9709180063
    @@ -34,13 +43,17 @@ export function Footer() {

    Nejblíbenější školení

    • - Kubernetes + + Kubernetes +
      • {/*
    • GitLab CI
      • */}
    • - Terraform + + Terraform +
      • {/*
    • Rancher @@ -85,7 +98,10 @@ export function Footer() { Zaujal jsem vás avšak nevíte, jak přesně bych vám mohl pomoci? Nebojte se zeptat a společně vymyslíme, jak vám mohu pomoci.

      -
@@ -106,7 +122,7 @@ export function Footer() { aria-hidden="true" className="h-6 w-6 fill-slate-500 group-hover:fill-slate-700" > - +

- Copyright © {new Date().getFullYear()} Vojtěch Mareš. Všechna práva vyhrazena. + Copyright © {new Date().getFullYear()} Vojtěch Mareš. Všechna + práva vyhrazena.

- ) + ); } diff --git a/components/Header.tsx b/components/Header.tsx index f6a0f7e..ab5df79 100644 --- a/components/Header.tsx +++ b/components/Header.tsx @@ -1,8 +1,8 @@ -import Link from "next/link" +import Link from "next/link"; import { NavLink } from "@/components/NavLink"; -import { Container } from "@/components/Container" -import { Button } from "@/components/Button" +import { Container } from "@/components/Container"; +import { Button } from "@/components/Button"; export function Header() { return ( @@ -19,15 +19,16 @@ export function Header() { Školení {/* Případové studie */} Blog - +
- -
+ + diff --git a/components/Hero.tsx b/components/Hero.tsx index 6060fdd..4c75fb9 100644 --- a/components/Hero.tsx +++ b/components/Hero.tsx @@ -1,11 +1,11 @@ -import { Button } from '@/components/Button' -import { Container } from '@/components/Container' +import { Button } from "@/components/Button"; +import { Container } from "@/components/Container"; export function Hero() { return ( -

- DevOps{' '} +

+ DevOps{" "} jednoduše - {' '} + {" "} pro všechny.

- Společně snížíme vaše náklady na infrasturkuturu, - zbavíme se technického dluhu a připravíme vaší IT infrastrukturu na rapidní růst. + Společně snížíme vaše náklady na infrasturkuturu, zbavíme se technického + dluhu a připravíme vaší IT infrastrukturu na rapidní růst.

- + {/*
*/} - ) + ); } diff --git a/components/NavLink.tsx b/components/NavLink.tsx index 0efee27..bb5d093 100644 --- a/components/NavLink.tsx +++ b/components/NavLink.tsx @@ -1,12 +1,12 @@ -import { ReactNode } from 'react'; -import Link from 'next/link'; +import { ReactNode } from "react"; +import Link from "next/link"; type Props = { - href: string, - children: ReactNode, -} + href: string; + children: ReactNode; +}; -export function NavLink({href, children}: Props) { +export function NavLink({ href, children }: Props) { return ( - ) + ); } type PlanProps = { - name: string, - price: string, - description: string, - href: string, - featured?: boolean, - buttonText?: string -} + name: string; + price: string; + description: string; + href: string; + featured?: boolean; + buttonText?: string; +}; -function Plan({ name, price, description, href, featured = false, buttonText = 'Napište mi' }: PlanProps) { +function Plan({ + name, + price, + description, + href, + featured = false, + buttonText = "Napište mi", +}: PlanProps) { return (
-

{name}

-

+

{name}

+

{price}

{description}

- ) + ); } diff --git a/components/PrimaryFeatures.tsx b/components/PrimaryFeatures.tsx index 8e73111..848ff01 100644 --- a/components/PrimaryFeatures.tsx +++ b/components/PrimaryFeatures.tsx @@ -1,27 +1,31 @@ -import Image from 'next/image' -import clsx from 'clsx' +import Image from "next/image"; +import clsx from "clsx"; -import { Container } from '@/components/Container' -import backgroundImage from '@/images/background-features.jpg' +import { Container } from "@/components/Container"; +import backgroundImage from "@/images/background-features.jpg"; const steps = [ { - name: 'Analýza současného stavu', - description: 'Zjistíme kde jsou slabá místa vaší infrastruktury nebo aplikace, a nebo obojího.', + name: "Analýza současného stavu", + description: + "Zjistíme kde jsou slabá místa vaší infrastruktury nebo aplikace, a nebo obojího.", }, { - name: 'Návrh řešení', - description: 'Navrhnu, jak tato slabá místa odstranit, na co si dát pozor a naplánujeme případné další kroky. ', + name: "Návrh řešení", + description: + "Navrhnu, jak tato slabá místa odstranit, na co si dát pozor a naplánujeme případné další kroky. ", }, { - name: 'Implementace', - description: 'Přesunu vaši aplikaci do Kubernetes, ať na vašem vlastním hardware nebo v public cloudu. Celá infrastruktura bude jasně deklarovaná jako kód pomocí Terraformu.', + name: "Implementace", + description: + "Přesunu vaši aplikaci do Kubernetes, ať na vašem vlastním hardware nebo v public cloudu. Celá infrastruktura bude jasně deklarovaná jako kód pomocí Terraformu.", }, { - name: 'Proškolení vašeho týmu', - description: 'Naučím váš tým používat moderní technologie, tak abyste mohli rozvíjet vaší aplikaci a byznys a technologie byly nástrojem k rozvoji, ne břemenem, které s sebou táhnete.', + name: "Proškolení vašeho týmu", + description: + "Naučím váš tým používat moderní technologie, tak abyste mohli rozvíjet vaší aplikaci a byznys a technologie byly nástrojem k rozvoji, ne břemenem, které s sebou táhnete.", }, -] +]; export function PrimaryFeatures() { return ( @@ -48,11 +52,23 @@ export function PrimaryFeatures() {

- ) + ); } diff --git a/components/TechStack.tsx b/components/TechStack.tsx index 2ac4c64..ba32b83 100644 --- a/components/TechStack.tsx +++ b/components/TechStack.tsx @@ -1,122 +1,125 @@ -import { ReactNode } from 'react' -import Image, { StaticImageData } from 'next/image' -import { Tab } from '@headlessui/react' -import clsx from 'clsx' +import { ReactNode } from "react"; +import Image, { StaticImageData } from "next/image"; +import { Tab } from "@headlessui/react"; +import clsx from "clsx"; -import { Container } from '@/components/Container' +import { Container } from "@/components/Container"; +import screenshotArgoCD from "@/images/screenshots/argocd.png"; +import screenshotGitLab from "@/images/screenshots/gitlab.png"; +import screenshotTerraform from "@/images/screenshots/terraform.png"; +import screenshotKubernetes from "@/images/screenshots/kubernetes.png"; +import screenshotGrafana from "@/images/screenshots/grafana.png"; +import screenshotPrometheus from "@/images/screenshots/prometheus.png"; -import screenshotArgoCD from '@/images/screenshots/argocd.png' -import screenshotGitLab from '@/images/screenshots/gitlab.png' -import screenshotTerraform from '@/images/screenshots/terraform.png' -import screenshotKubernetes from '@/images/screenshots/kubernetes.png' -import screenshotGrafana from '@/images/screenshots/grafana.png' -import screenshotPrometheus from '@/images/screenshots/prometheus.png' - -import logoTerraform from '@/images/logos/tools/terraform.svg' -import logoGit from '@/images/logos/tools/git.svg' -import logoKubernetes from '@/images/logos/tools/kubernetes.svg' -import logoPrometheus from '@/images/logos/tools/prometheus.svg' -import logoArgo from '@/images/logos/tools/argo.svg' -import logoGrafana from '@/images/logos/tools/grafana.svg' - +import logoTerraform from "@/images/logos/tools/terraform.svg"; +import logoGit from "@/images/logos/tools/git.svg"; +import logoKubernetes from "@/images/logos/tools/kubernetes.svg"; +import logoPrometheus from "@/images/logos/tools/prometheus.svg"; +import logoArgo from "@/images/logos/tools/argo.svg"; +import logoGrafana from "@/images/logos/tools/grafana.svg"; const features = [ { - name: 'Verzování', - summary: - 'Spravujte svůj kód pomocí verzovacího nástroje Git.', + name: "Verzování", + summary: "Spravujte svůj kód pomocí verzovacího nástroje Git.", description: - 'Mějte historii změn v aplikaci od začátku až do dnes, můžete se kdykoliv vrátit do bodu v čase. Řešte konflikty včas, předtím než je nasadíte do produkce a umožněte vaším programátorům spolupracovat na jednou, aniž by si překáželi.', + "Mějte historii změn v aplikaci od začátku až do dnes, můžete se kdykoliv vrátit do bodu v čase. Řešte konflikty včas, předtím než je nasadíte do produkce a umožněte vaším programátorům spolupracovat na jednou, aniž by si překáželi.", image: screenshotGitLab, icon: logoGit, }, { - name: 'Infastruktura jako kód', - summary: 'Mějte vaši infrastrukturu deklarativně definovanou a verzovanou, díky Terraformu.', + name: "Infastruktura jako kód", + summary: + "Mějte vaši infrastrukturu deklarativně definovanou a verzovanou, díky Terraformu.", description: - 'Vaši infrastrukturu můžete snadno přesunout k jinému poskytovateli, a nebo jen vytvořit nové prostředí pro zákazníka, aby si váš produkt vyzkoušel a to během minut.', + "Vaši infrastrukturu můžete snadno přesunout k jinému poskytovateli, a nebo jen vytvořit nové prostředí pro zákazníka, aby si váš produkt vyzkoušel a to během minut.", image: screenshotTerraform, icon: logoTerraform, }, { - name: 'Orchestrace', + name: "Orchestrace", summary: - 'Nechte vaši aplikaci běžet napříč mnoha servery a škálovat dle potřeb.', + "Nechte vaši aplikaci běžet napříč mnoha servery a škálovat dle potřeb.", description: - 'Kubernetes se stalo nejen standardem, ale i hlavní platformou pro vývoj aplikací ať SaaS nebo dodávaných třetím stranám. Jde o skvělou platformu pro provoz vaší aplikace ať ve veřejném cloudu nebo na vlastním hardwaru popř. on edge blízko koncových uživatelů.', + "Kubernetes se stalo nejen standardem, ale i hlavní platformou pro vývoj aplikací ať SaaS nebo dodávaných třetím stranám. Jde o skvělou platformu pro provoz vaší aplikace ať ve veřejném cloudu nebo na vlastním hardwaru popř. on edge blízko koncových uživatelů.", image: screenshotKubernetes, icon: logoKubernetes, }, { - name: 'Monitoring', - summary: - 'Sledujte Vaši aplikaci, jak se chová v čase.', + name: "Monitoring", + summary: "Sledujte Vaši aplikaci, jak se chová v čase.", description: - 'Prometheus je standard pro monitoring aplikací, ať v Kubernetes ale i mimo. Sbírejte telemetrická data v čase o vaši aplikaci. Vyhodnoťte, kde má vaše aplikace slabá místa. Zároveň můžete tvořit pravidla, dle kterých vás AlertManager upozorní, když se něco pokazí.', + "Prometheus je standard pro monitoring aplikací, ať v Kubernetes ale i mimo. Sbírejte telemetrická data v čase o vaši aplikaci. Vyhodnoťte, kde má vaše aplikace slabá místa. Zároveň můžete tvořit pravidla, dle kterých vás AlertManager upozorní, když se něco pokazí.", image: screenshotPrometheus, icon: logoPrometheus, }, { - name: 'Vizualizace', + name: "Vizualizace", summary: - 'Od grafů zatížení procesoru po počet otevřených TCP spojení, vše jasně a přehledně.', + "Od grafů zatížení procesoru po počet otevřených TCP spojení, vše jasně a přehledně.", description: - 'Grafana je skvělý nástroj pro vizualizaci dat z monitoringu, vytvořte si dashboardy pro jednotlivé části vaší aplikace, mějte pohromadě infrastrukturu, provoz na síti, dostupnost a třeba počet neúspěšných pokusů o přihlášení, zda vůči vaší aplikaci neprobíhá hackerský útok.', + "Grafana je skvělý nástroj pro vizualizaci dat z monitoringu, vytvořte si dashboardy pro jednotlivé části vaší aplikace, mějte pohromadě infrastrukturu, provoz na síti, dostupnost a třeba počet neúspěšných pokusů o přihlášení, zda vůči vaší aplikaci neprobíhá hackerský útok.", image: screenshotGrafana, icon: logoGrafana, }, { - name: 'GitOps', + name: "GitOps", summary: - 'Spravujte stav Vašich prostředí deklarativně, ať vždy víte, jaký je aktuální stav.', + "Spravujte stav Vašich prostředí deklarativně, ať vždy víte, jaký je aktuální stav.", description: - 'ArgoCD je spolehlivý nástroj pro práci s Kubernetes a nasazováním změn a přitom si udržovat přehled o právě nasazených aplikacích, verzím a konfiguraci, snadno, soplehlivě, verzovaně.', + "ArgoCD je spolehlivý nástroj pro práci s Kubernetes a nasazováním změn a přitom si udržovat přehled o právě nasazených aplikacích, verzím a konfiguraci, snadno, soplehlivě, verzovaně.", image: screenshotArgoCD, icon: logoArgo, }, -] +]; type FeatureType = { - name: string|ReactNode, - summary: string, - description: string, - image: StaticImageData, - icon: any, -} + name: string | ReactNode; + summary: string; + description: string; + image: StaticImageData; + icon: any; +}; type FeatureProps = { - feature: FeatureType, - isActive: boolean, - className?: string, - props?: any, -} + feature: FeatureType; + isActive: boolean; + className?: string; + props?: any; +}; -function Feature({ feature, isActive, className, ...props }: FeatureProps ) { +function Feature({ feature, isActive, className, ...props }: FeatureProps) { return (
- + )} + alt="" + />

{feature.name}

-

+

{feature.summary}

{feature.description}

- ) + ); } function FeaturesMobile() { @@ -141,7 +144,7 @@ function FeaturesMobile() { ))} - ) + ); } function FeaturesDesktop() { @@ -167,15 +170,15 @@ function FeaturesDesktop() { /> ))} - +
{features.map((feature, featureIndex) => ( ))}
-
+
)} - ) + ); } export function TechStack() { @@ -214,13 +217,13 @@ export function TechStack() { Open Source DevOps stack

- Věřím v Open Source technologie, prakticky všichni je denně využíváme - a jsou naší budoucností. + Věřím v Open Source technologie, prakticky všichni je denně + využíváme a jsou naší budoucností.

- ) + ); } diff --git a/components/Testimonials.tsx b/components/Testimonials.tsx index 690e3ac..4d63df0 100644 --- a/components/Testimonials.tsx +++ b/components/Testimonials.tsx @@ -1,29 +1,29 @@ -import Image from 'next/image' +import Image from "next/image"; -import { Container } from '@/components/Container' -import avatarImage1 from '@/images/avatars/avatar-1.png' -import avatarImage2 from '@/images/avatars/avatar-2.png' -import avatarImage3 from '@/images/avatars/avatar-3.png' -import avatarImage4 from '@/images/avatars/avatar-4.png' -import avatarImage5 from '@/images/avatars/avatar-5.png' +import { Container } from "@/components/Container"; +import avatarImage1 from "@/images/avatars/avatar-1.png"; +import avatarImage2 from "@/images/avatars/avatar-2.png"; +import avatarImage3 from "@/images/avatars/avatar-3.png"; +import avatarImage4 from "@/images/avatars/avatar-4.png"; +import avatarImage5 from "@/images/avatars/avatar-5.png"; const testimonials = [ [ { content: - 'TaxPal is so easy to use I can’t help but wonder if it’s really doing the things the government expects me to do.', + "TaxPal is so easy to use I can’t help but wonder if it’s really doing the things the government expects me to do.", author: { - name: 'Sheryl Berge', - role: 'CEO at Lynch LLC', + name: "Sheryl Berge", + role: "CEO at Lynch LLC", image: avatarImage1, }, }, { content: - 'I’m trying to get a hold of someone in support, I’m in a lot of trouble right now and they are saying it has something to do with my books. Please get back to me right away.', + "I’m trying to get a hold of someone in support, I’m in a lot of trouble right now and they are saying it has something to do with my books. Please get back to me right away.", author: { - name: 'Amy Hahn', - role: 'Director at Velocity Industries', + name: "Amy Hahn", + role: "Director at Velocity Industries", image: avatarImage4, }, }, @@ -31,19 +31,19 @@ const testimonials = [ [ { content: - 'The best part about TaxPal is every time I pay my employees, my bank balance doesn’t go down like it used to. Looking forward to spending this extra cash when I figure out why my card is being declined.', + "The best part about TaxPal is every time I pay my employees, my bank balance doesn’t go down like it used to. Looking forward to spending this extra cash when I figure out why my card is being declined.", author: { - name: 'Leland Kiehn', - role: 'Founder of Kiehn and Sons', + name: "Leland Kiehn", + role: "Founder of Kiehn and Sons", image: avatarImage5, }, }, { content: - 'There are so many things I had to do with my old software that I just don’t do at all with TaxPal. Suspicious but I can’t say I don’t love it.', + "There are so many things I had to do with my old software that I just don’t do at all with TaxPal. Suspicious but I can’t say I don’t love it.", author: { - name: 'Erin Powlowski', - role: 'COO at Armstrong Inc', + name: "Erin Powlowski", + role: "COO at Armstrong Inc", image: avatarImage2, }, }, @@ -51,31 +51,31 @@ const testimonials = [ [ { content: - 'I used to have to remit tax to the EU and with TaxPal I somehow don’t have to do that anymore. Nervous to travel there now though.', + "I used to have to remit tax to the EU and with TaxPal I somehow don’t have to do that anymore. Nervous to travel there now though.", author: { - name: 'Peter Renolds', - role: 'Founder of West Inc', + name: "Peter Renolds", + role: "Founder of West Inc", image: avatarImage3, }, }, { content: - 'This is the fourth email I’ve sent to your support team. I am literally being held in jail for tax fraud. Please answer your damn emails, this is important.', + "This is the fourth email I’ve sent to your support team. I am literally being held in jail for tax fraud. Please answer your damn emails, this is important.", author: { - name: 'Amy Hahn', - role: 'Director at Velocity Industries', + name: "Amy Hahn", + role: "Director at Velocity Industries", image: avatarImage4, }, }, ], -] +]; function QuoteIcon(props: any) { return ( - ) + ); } export function Testimonials() { @@ -140,5 +140,5 @@ export function Testimonials() { - ) + ); } diff --git a/components/Training.tsx b/components/Training.tsx index a820d68..69055f0 100644 --- a/components/Training.tsx +++ b/components/Training.tsx @@ -1,45 +1,66 @@ -import Image from "next/image" +import Image from "next/image"; -import TrainingType from "@/types/training" -import { Container } from "./Container" -import { Button } from "./Button" +import TrainingType from "@/types/training"; +import { Container } from "./Container"; +import { Button } from "./Button"; type Props = { - training: TrainingType -} + training: TrainingType; +}; export const Training = ({ training }: Props) => { - const formatter = new Intl.NumberFormat('cs', { style: 'currency', currency: 'CZK', maximumFractionDigits: 0}) + const formatter = new Intl.NumberFormat("cs", { + style: "currency", + currency: "CZK", + maximumFractionDigits: 0, + }); return ( <>
-
+
- -

+ +

Školení {training.name}

- -
+ +
-
+
-
+
-
- { training.days === 2 ? ( -
+
+ {training.days === 2 ? ( +
{/*

- Toto školení je{' '} + Toto školení je{" "} dvoudenní. @@ -47,20 +68,32 @@ export const Training = ({ training }: Props) => {

- ) : <>} -
+ ) : ( + <> + )} +
-

Cena za školení

+

+ Cena za školení +

-
Veřejný termín
-
{formatter.format(training.priceOpen)} bez DPH
+
+ Veřejný termín +
+
+ {formatter.format(training.priceOpen)} bez DPH +
-
Firemní školení
-
{formatter.format(training.priceCompany)} bez DPH
+
+ Firemní školení +
+
+ {formatter.format(training.priceCompany)} bez DPH +
@@ -80,5 +113,5 @@ export const Training = ({ training }: Props) => {
- ) -} + ); +}; diff --git a/components/TrainingListGrid.tsx b/components/TrainingListGrid.tsx index d2c0983..1defcc1 100644 --- a/components/TrainingListGrid.tsx +++ b/components/TrainingListGrid.tsx @@ -1,117 +1,136 @@ -import Image from "next/image" -import clsx from "clsx" +import Image from "next/image"; +import clsx from "clsx"; -import TrainingType from "@/types/training" -import { Container } from "./Container" -import { Button } from "./Button" +import TrainingType from "@/types/training"; +import { Container } from "./Container"; +import { Button } from "./Button"; type TrainingDetailProps = { - training: TrainingType, - className?: string, - props?: any[], -} + training: TrainingType; + className?: string; + props?: any[]; +}; -const TrainingDetail = ({ training, className, ...props }: TrainingDetailProps) => { +const TrainingDetail = ({ + training, + className, + ...props +}: TrainingDetailProps) => { return (
- -
+ +
-

+

{training.name}

- { training.new ? ( + {training.new ? ( <> - + new! - ) : <> } + ) : ( + <> + )}
-

{training.days}{' '}{training.days === 1 ? 'den' : 'dny'}

+

+ {training.days} {training.days === 1 ? "den" : "dny"} +

-

- {training.description.split(" ").splice(0,40).join(" ") + "..."} + {training.description.split(" ").splice(0, 40).join(" ") + "..."}

- ) -} + ); +}; type TrainingListProps = { - trainingList: TrainingType[] -} + trainingList: TrainingType[]; +}; const TrainingListMobile = ({ trainingList }: TrainingListProps) => { return (
{trainingList.map((training) => ( -
+
))}
- ) -} + ); +}; const TrainingListDesktop = ({ trainingList }: TrainingListProps) => { return (
-
+
{trainingList.map((training) => ( -
+
))}
- ) -} + ); +}; export const TrainingListGrid = ({ trainingList }: TrainingListProps) => { return ( <>

- Moje školení + Moje školení

- Od veřejného cloudu přes on-premise až po serverless, se vším vám poradím. + Od veřejného cloudu přes on-premise až po serverless, se vším vám + poradím.

- +
- ) -} + ); +}; diff --git a/lib/cms/training.ts b/lib/cms/training.ts index 6968087..1cef6db 100644 --- a/lib/cms/training.ts +++ b/lib/cms/training.ts @@ -1,52 +1,51 @@ -import fs from 'fs' -import { join } from 'path' -import matter from 'gray-matter' +import fs from "fs"; +import { join } from "path"; +import matter from "gray-matter"; -const trainingDir = join(process.cwd(), 'content/training') +const trainingDir = join(process.cwd(), "content/training"); export const getTrainingSlugs = () => { - return fs.readdirSync(trainingDir) -} + return fs.readdirSync(trainingDir); +}; export const getTrainingBySlug = (slug: string, fields: string[] = []) => { - const realSlug = slug.replace(/\.md$/, '') - const fullPath = join(trainingDir, `${realSlug}.md`) - const fileContents = fs.readFileSync(fullPath, 'utf8') - const { data, content } = matter(fileContents) + const realSlug = slug.replace(/\.md$/, ""); + const fullPath = join(trainingDir, `${realSlug}.md`); + const fileContents = fs.readFileSync(fullPath, "utf8"); + const { data, content } = matter(fileContents); type Items = { - [key: string]: string - } + [key: string]: string; + }; - const items: Items = {} + const items: Items = {}; // Ensure only the minimal needed data is exposed fields.forEach((field) => { - if (field === 'slug') { - items[field] = realSlug + if (field === "slug") { + items[field] = realSlug; } - if (field === 'content') { - items[field] = content + if (field === "content") { + items[field] = content; } - if (typeof data[field] !== 'undefined') { - items[field] = data[field] + if (typeof data[field] !== "undefined") { + items[field] = data[field]; } - }) + }); - return items - -} + return items; +}; export const getAllTraining = (fields: string[] = []) => { - const slugs = getTrainingSlugs() + const slugs = getTrainingSlugs(); const trainingList = slugs .map((slug) => getTrainingBySlug(slug, fields)) .sort((tr1, tr2) => { - const tr1w = parseInt(tr1.weight) - const tr2w = parseInt(tr2.weight) - return tr1w > tr2w ? -1 : 1 - }) + const tr1w = parseInt(tr1.weight); + const tr2w = parseInt(tr2.weight); + return tr1w > tr2w ? -1 : 1; + }); - return trainingList -} + return trainingList; +}; diff --git a/lib/markdownToHTML.ts b/lib/markdownToHTML.ts index 48f1bbb..6e57016 100644 --- a/lib/markdownToHTML.ts +++ b/lib/markdownToHTML.ts @@ -1,9 +1,9 @@ -import { remark } from 'remark' -import html from 'remark-html' +import { remark } from "remark"; +import html from "remark-html"; const markdownToHTML = async (markdown: string) => { - const result = await remark().use(html).process(markdown) - return result.toString() -} + const result = await remark().use(html).process(markdown); + return result.toString(); +}; -export default markdownToHTML +export default markdownToHTML; diff --git a/pages/_app.tsx b/pages/_app.tsx index d245742..b79728e 100644 --- a/pages/_app.tsx +++ b/pages/_app.tsx @@ -1,9 +1,9 @@ -import { AppProps } from 'next/app'; +import { AppProps } from "next/app"; -import '@/css/tailwind.css'; +import "@/css/tailwind.css"; function App({ Component, pageProps }: AppProps) { - return (); + return ; } export default App; diff --git a/pages/_document.tsx b/pages/_document.tsx index 8da3c22..ae7007d 100644 --- a/pages/_document.tsx +++ b/pages/_document.tsx @@ -1,7 +1,7 @@ -import { Head, Html, Main, NextScript } from 'next/document' +import { Head, Html, Main, NextScript } from "next/document"; export default function Document(props: any) { - let pageProps = props.__NEXT_DATA__?.props?.pageProps + let pageProps = props.__NEXT_DATA__?.props?.pageProps; return ( */} - - - + + + - +
- ) + ); } diff --git a/pages/index.tsx b/pages/index.tsx index fcb87af..5c13d94 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -1,15 +1,15 @@ import Head from "next/head"; -import { Header } from "@/components/Header" -import { Hero } from "@/components/Hero" -import { CallToAction } from '@/components/CallToAction' -import { Faqs } from '@/components/Faqs' -import { Footer } from '@/components/Footer' -import { Pricing } from '@/components/Pricing' -import { PrimaryFeatures } from '@/components/PrimaryFeatures' -import { TechStack } from '@/components/TechStack' -import { Testimonials } from '@/components/Testimonials' -import { Environment } from '@/components/Environment' +import { Header } from "@/components/Header"; +import { Hero } from "@/components/Hero"; +import { CallToAction } from "@/components/CallToAction"; +import { Faqs } from "@/components/Faqs"; +import { Footer } from "@/components/Footer"; +import { Pricing } from "@/components/Pricing"; +import { PrimaryFeatures } from "@/components/PrimaryFeatures"; +import { TechStack } from "@/components/TechStack"; +import { Testimonials } from "@/components/Testimonials"; +import { Environment } from "@/components/Environment"; export default function Home() { return ( diff --git a/pages/skoleni/[slug].tsx b/pages/skoleni/[slug].tsx index ae8468c..fd5676d 100644 --- a/pages/skoleni/[slug].tsx +++ b/pages/skoleni/[slug].tsx @@ -1,24 +1,24 @@ -import Head from "next/head" -import { useRouter } from "next/router" -import ErrorPage from "next/error" +import Head from "next/head"; +import { useRouter } from "next/router"; +import ErrorPage from "next/error"; -import TrainingType from "@/types/training" -import { getAllTraining, getTrainingBySlug } from "@/lib/cms/training" -import markdownToHTML from "@/lib/markdownToHTML" -import { Header } from "@/components/Header" -import { Footer } from "@/components/Footer" -import { Training } from "@/components/Training" +import TrainingType from "@/types/training"; +import { getAllTraining, getTrainingBySlug } from "@/lib/cms/training"; +import markdownToHTML from "@/lib/markdownToHTML"; +import { Header } from "@/components/Header"; +import { Footer } from "@/components/Footer"; +import { Training } from "@/components/Training"; type Props = { - training: TrainingType - featuredTrainingList: TrainingType[] -} + training: TrainingType; + featuredTrainingList: TrainingType[]; +}; -const TrainingPage = ({ training, featuredTrainingList}: Props) => { - const router = useRouter() - console.log(!router.isFallback) - console.log(!training?.slug) - console.log(typeof training.draft === 'undefined') +const TrainingPage = ({ training, featuredTrainingList }: Props) => { + const router = useRouter(); + console.log(!router.isFallback); + console.log(!training?.slug); + console.log(typeof training.draft === "undefined"); // if ((!router.isFallback && !training?.slug) || typeof training.draft === 'undefined') { // return // } @@ -26,7 +26,10 @@ const TrainingPage = ({ training, featuredTrainingList}: Props) => { return ( <> - Školení {training.name} | Vojtěch Mareš - DevOps konzultant, lektor, engineer + + Školení {training.name} | Vojtěch Mareš - DevOps konzultant, lektor, + engineer + {