{content}
} + {links && links.length > 0 && ( +{beforeDescription}
} -{afterDescription}
} -++ ) +} diff --git a/website/components/case-study-carousel/img/active-control-dot.svg b/website/components/case-study-carousel/img/active-control-dot.svg new file mode 100644 index 0000000000..ee15572f4f --- /dev/null +++ b/website/components/case-study-carousel/img/active-control-dot.svg @@ -0,0 +1 @@ + diff --git a/website/components/case-study-carousel/img/inactive-control-dot.svg b/website/components/case-study-carousel/img/inactive-control-dot.svg new file mode 100644 index 0000000000..c28dc96807 --- /dev/null +++ b/website/components/case-study-carousel/img/inactive-control-dot.svg @@ -0,0 +1 @@ + diff --git a/website/components/case-study-carousel/img/left-arrow-control.svg b/website/components/case-study-carousel/img/left-arrow-control.svg new file mode 100644 index 0000000000..67809357d4 --- /dev/null +++ b/website/components/case-study-carousel/img/left-arrow-control.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/website/components/case-study-carousel/img/quote.svg b/website/components/case-study-carousel/img/quote.svg new file mode 100644 index 0000000000..9f5014b045 --- /dev/null +++ b/website/components/case-study-carousel/img/quote.svg @@ -0,0 +1,3 @@ + \ No newline at end of file diff --git a/website/components/case-study-carousel/img/right-arrow-control.svg b/website/components/case-study-carousel/img/right-arrow-control.svg new file mode 100644 index 0000000000..717c981260 --- /dev/null +++ b/website/components/case-study-carousel/img/right-arrow-control.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/website/components/case-study-carousel/index.jsx b/website/components/case-study-carousel/index.jsx new file mode 100644 index 0000000000..0d2a9358ae --- /dev/null +++ b/website/components/case-study-carousel/index.jsx @@ -0,0 +1,99 @@ +import { useState } from 'react' +import { isIE } from 'react-device-detect' + +import Carousel from 'nuka-carousel' +import CaseSlide from './case-study-slide' +import Image from '@hashicorp/react-image' +import InlineSvg from '@hashicorp/react-inline-svg' +import ActiveControlDot from './img/active-control-dot.svg?include' +import InactiveControlDot from './img/inactive-control-dot.svg?include' +import LeftArrow from './img/left-arrow-control.svg?include' +import RightArrow from './img/right-arrow-control.svg?include' + +export default function CaseStudyCarousel({ + caseStudies, + title, + logoSection = { grayBackground: false, featuredLogos: [] }, +}) { + const [slideIndex, setSlideIndex] = useState(0) + const { grayBackground, featuredLogos } = logoSection + + const caseStudySlides = caseStudies.map((caseStudy) => ( ++ {quote}
+++ ++++ +++ {person.firstName} {person.lastName} +
++ {person.title}, {company.name} +
++
{itemOne.description}
+ +{itemTwo.description}
+ +- Consul provides a registry of all the running nodes and - services, along with their current health status. This - allows operators to understand the environment, and - applications and automation tools to interact with dynamic - infrastructure using an HTTP API. -
-- - Learn more - - -
-
- - Consul enables service discovery using a built-in DNS - server. This allows existing applications to easily - integrate, as almost all applications support using DNS to - resolve IP addresses. Using DNS instead of a static IP - address allows services to scale up/down and route around - failures easily. -
-- - Learn more - - -
-- Consul provides an HTTP API to query the service registry - for nodes, services, and health check information. The API - also supports blocking queries, or long-polling for any - changes. This allows automation tools to react to services - being registered or health status changes to change - configurations or traffic routing in real time. -
-- - Learn more - - -
-- Consul supports multiple datacenters out of the box with no - complicated configuration. Look up services in other - datacenters or keep the request local. Advanced features - like Prepared Queries enable automatic failover to other - datacenters. -
-- - Learn more - - -
-- Pairing service discovery with health checking prevents - routing requests to unhealthy hosts and enables services to - easily provide circuit breakers. -
-- - Learn more - - -
-
- 
- - Use Consul service discovery and service mesh features with - Kubernetes.{' '} -
-
- - Secure and observe communication between your services - without modifying their code. -
-
- - Automate load balancer configuration with Consul and - HAProxy, Nginx, or F5. -
-- Provision clusters on any infrastructure, connect to - services over TLS via proxy integrations, and Serve TLS - certificates with pluggable Certificate Authorities. -
-
- 
- 
- 
- 
- 
- 
- - Consul Open Source addresses the technical complexity of - connecting services across distributed infrastructure. -
-- Consul Enterprise addresses the organizational complexity of - large user bases and compliance requirements with collaboration - and governance features. -
-- Service-to-service communication policy at Layer 7 can be - managed centrally, enabling advanced traffic management - patterns such as service failover, path-based routing, and - traffic shifting that can be applied across public and - private clouds, platforms, and networks. -
-- - Learn more - - -
-- Centrally managed service observability at Layer 7 including - detailed metrics on all service-to-service communication - such as connections, bytes transferred, retries, timeouts, - open circuits, and request rates, response codes. -
-- - Learn more - - -
-
- - Secure communication between legacy and modern workloads. - Sidecar proxies allow applications to be integrated without - code changes and Layer 4 support provides nearly universal - protocol compatibility. -
-- - Learn more - - -
-
- - TLS certificates are used to identify services and secure - communications. Certificates use the SPIFFE format for - interoperability with other platforms. Consul can be a - certificate authority to simplify deployment, or integrate - with external signing authorities like Vault. -
-- - Learn more - - -
-
- 
- - All traffic between services is encrypted and authenticated - with mutual TLS. Using TLS provides a strong guarantee of - the identity of services communicating, and ensures all data - in transit is encrypted. -
-- - Learn more - - -
-- Connect between different cloud regions, VPCs and between - overlay and underlay networks without complex network - tunnels and NAT. Mesh Gateways solve routing at TLS layer - while preserving end-to-end encryption and limiting attack - surface area at the edge of each network. -
-- - Learn more - - -
-
-