status-im/consul
2
0
Fork 0
mirror of https://github.com/status-im/consul.git synced 2025-01-13 23:36:00 +00:00
Code Issues Projects Releases Wiki Activity

initial commit for website upgrade

Browse Source
This commit is contained in:
RJ Spiker 2018-06-11 16:59:00 -06:00 committed by Jack Pearkes
parent 315cc04536
commit 64218ec7af
34 changed files with 960 additions and 144 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
website/source/assets/images/consul-connect/code-sample-1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 23 KiB

BIN
website/source/assets/images/consul-connect/code-sample-2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 62 KiB

BIN
website/source/assets/images/consul-connect/code-sample-3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 35 KiB

BIN
website/source/assets/images/consul-connect/health-checks.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 78 KiB

BIN
website/source/assets/images/consul-connect/hero-bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 522 KiB

25
website/source/assets/images/consul-connect/hero-bg.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 1.7 MiB

BIN
website/source/assets/images/consul-connect/logos/barclays.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.6 KiB

BIN
website/source/assets/images/consul-connect/logos/citadel.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.5 KiB

BIN
website/source/assets/images/consul-connect/logos/itv.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.1 KiB

BIN
website/source/assets/images/consul-connect/logos/lotto.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.4 KiB

BIN
website/source/assets/images/consul-connect/logos/sap-ariba.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.7 KiB

BIN
website/source/assets/images/consul-connect/logos/spaceflight.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.3 KiB

BIN
website/source/assets/images/consul-connect/open-and-extensible.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 34 KiB

BIN
website/source/assets/images/consul-connect/service-access-graph.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 124 KiB

BIN
website/source/assets/images/consul-connect/service-registry.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 124 KiB

BIN
website/source/assets/images/consul-connect/workflows-not-technologies.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 24 KiB

5
website/source/assets/stylesheets/application.scss
View File

@ -33,4 +33,7 @@
@import "_community";
@import "_docs";
@import "_downloads";
@import "_home";
@import "_home";
// Consul Connect
@import 'consul-connect/_index';

3
website/source/assets/stylesheets/consul-connect/_global.scss Normal file
View File

@ -0,0 +1,3 @@
.consul-connect {
color: #252937;
}

14
website/source/assets/stylesheets/consul-connect/_index.scss Normal file
View File

@ -0,0 +1,14 @@
@import '_variables';
@import '_global';
@import '_typography';
@import 'components/_button';
@import 'components/_container';
@import 'components/_hero';
@import 'components/_logo-grid';
@import 'components/_section';
@import 'components/_text-image';
@import 'components/_timeline';
@import 'components/_use-cases';
@import 'pages/_home';

83
website/source/assets/stylesheets/consul-connect/_typography.scss Normal file
View File

@ -0,0 +1,83 @@
.consul-connect {
font-size: 16px; // root is set to 10px
ul,
p {
font-size: 1.125em;
line-height: 1.75;
margin: 16px 0;
}
p {
margin: 1em 0;
}
a:hover {
text-decoration: none;
}
h3,
h2,
h1 {
font-family: $font-family-klavika;
font-kerning: normal;
font-weight: 500;
}
h1,
.h1 {
font-size: 3.5em;
font-weight: 600;
line-height: 1.2em;
}
h2,
.h2 {
font-size: 2.5em;
font-weight: 600;
margin: 1em 0;
line-height: 1.3em;
@media (max-width: 700px) {
font-size: 2.2em;
}
}
h3,
.h3 {
font-family: $font-family-open-sans;
font-weight: 600;
font-size: 1.5em;
line-height: 1.5em;
margin: 1em 0;
@media (max-width: 700px) {
font-size: 1.2em;
}
&.lighter {
font-weight: 100;
}
}
h6,
.h6 h5,
.h5 h4,
.h4 {
font-family: $font-family-open-sans;
font-weight: 600;
}
h4,
.h4 {
font-size: 1.5em;
}
h5,
.h5 {
font-size: 1.25em;
}
h6,
.h6 {
font-size: 1.125em;
margin: 1em 0;
}
}

3
website/source/assets/stylesheets/consul-connect/_variables.scss Normal file
View File

@ -0,0 +1,3 @@
/* Grid/Layout Settings */
$site-gutter-padding: 15px;
$site-max-width: 1170px;

52
website/source/assets/stylesheets/consul-connect/components/_button.scss Normal file
View File

@ -0,0 +1,52 @@
.g-btn {
align-self: center;
background-color: $consul-red;
border-radius: 3px;
box-sizing: border-box;
color: $white;
display: inline-block;
font-size: 1em;
font-weight: 600;
letter-spacing: 0;
line-height: 24px;
outline: 0;
padding: 12px 30px;
position: relative;
text-align: center;
transition: all 0.25s ease;
&:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(255, 255, 255, 0.15);
opacity: 0;
transition: all 0.25s ease;
}
&:focus,
&:hover {
color: $white;
text-decoration: none;
transform: translateY(-1px);
&:after {
opacity: 1;
}
}
&.dark-outline {
background: none;
border: 2px solid $black;
padding: 10px 28px; /* subtracting the border, so sizes are even */
color: $black;
&:hover {
background-color: $black;
color: $white;
}
}
}

11
website/source/assets/stylesheets/consul-connect/components/_container.scss Normal file
View File

@ -0,0 +1,11 @@
.g-container {
margin: 0 auto;
max-width: $site-max-width;
padding-left: 15px;
padding-right: 15px;
@media (max-width: 768px) {
padding-left: 24px;
padding-right: 24px;
}
}

30
website/source/assets/stylesheets/consul-connect/components/_hero.scss Normal file
View File

@ -0,0 +1,30 @@
.g-hero {
background: url("/assets/images/consul-connect/hero-bg.svg") no-repeat center
center;
background-size: cover;
padding: 121px 0;
text-align: center;
h1 {
margin: 0 0 16px;
}
p {
font-size: 1.5em;
max-width: 848px;
margin: 0 auto 40px;
}
span {
border: 1px solid #ca2171;
border-radius: 2px;
display: inline-block;
font-size: 12px;
font-weight: 700;
letter-spacing: 0.5px;
line-height: 20px;
margin-bottom: 16px;
padding: 2px 9px;
text-transform: uppercase;
}
}

13
website/source/assets/stylesheets/consul-connect/components/_logo-grid.scss Normal file
View File

@ -0,0 +1,13 @@
.g-logo-grid {
align-items: center;
display: flex;
flex-wrap: wrap;
max-width: $site-max-width - 180;
margin: 0 auto;
text-align: center;
& > div {
padding: 25px $site-gutter-padding;
width: 33%;
}
}

23
website/source/assets/stylesheets/consul-connect/components/_section.scss Normal file
View File

@ -0,0 +1,23 @@
.g-section {
overflow: hidden;
padding: 96px 0;
& .intro {
margin: 0 auto 64px;
max-width: 784px;
text-align: center;
& h2,
& h3 {
margin: 0 0 24px;
}
}
&.bg-light {
background: #f7f8fa !important; //TODO - !important is to override the `#page-home section` #fff background;
}
&.border-top {
border-top: 1px solid #e5e6eb;
}
}

56
website/source/assets/stylesheets/consul-connect/components/_text-image.scss Normal file
View File

@ -0,0 +1,56 @@
.g-text-image {
align-content: space-between;
display: flex;
justify-content: center;
margin: 0 (-$site-gutter-padding);
&.reverse {
flex-direction: row-reverse;
& > div > div:last-child {
margin-left: 0;
padding: 0 0 0 32px;
}
}
&.large {
margin-bottom: -96px;
img {
width: auto;
}
}
img {
width: 100%;
&.shadow {
box-shadow: 0 40px 48px -20px rgba(63, 68, 85, 0.4);
}
}
h3 {
margin: 16px 0;
}
& > div {
align-items: center;
display: flex;
padding: 0 $site-gutter-padding;
width: 50%;
& > div:last-child {
margin-left: auto;
padding: 0 32px 0 0;
max-width: 454px;
& a {
color: #1563ff;
}
& svg {
margin-left: 10px;
}
}
}
}

76
website/source/assets/stylesheets/consul-connect/components/_timeline.scss Normal file
View File

@ -0,0 +1,76 @@
// TODO - handle situations where title or sub-heading are breaking to next line
.g-timeline {
align-content: space-between;
display: flex;
justify-content: center;
margin: 0 (-$site-gutter-padding);
text-align: center;
&.no-intro {
margin-top: -90px;
}
& > div {
padding: 40px $site-gutter-padding 0;
position: relative;
width: 50%;
&:last-child .dot {
border-color: #ca2171;
}
.line {
background-image: linear-gradient(
90deg,
rgba(229, 230, 235, 0) 5%,
#dadce3 26%,
#d2d4dc 43%,
#c82070 100%
);
height: 2px;
position: absolute;
right: calc(50% + 34px);
top: 8px;
width: 1038px;
svg {
position: absolute;
right: -10px;
top: -6px;
}
}
h3 {
margin: 0 0 8px;
}
.sub-heading {
display: block;
margin-bottom: 40px;
}
.dot {
background: #f7f8fa;
border: 2px solid #d2d4dc;
border-radius: 50%;
display: inline-block;
height: 18px;
left: 50%;
margin: 0 0 0 -9px;
position: absolute;
top: 0;
width: 18px;
z-index: 1;
}
img {
max-width: 100%;
}
p {
font-size: 1.6rem;
margin-top: 40px;
}
}
}

30
website/source/assets/stylesheets/consul-connect/components/_use-cases.scss Normal file
View File

@ -0,0 +1,30 @@
.g-use-cases {
display: flex;
justify-content: center;
margin: 0 (-$site-gutter-padding);
h3 {
margin: 40px 0 16px;
span {
display: block;
font-weight: 300; //TODO: font weight doesn't exist currently
}
}
& > div {
display: flex;
flex-direction: column;
justify-content: space-between;
padding: 0 $site-gutter-padding;
position: relative;
text-align: center;
width: 33.33333%;
}
.g-btn {
font-size: 1.4rem;
margin-top: 22px;
padding: 8px 24px;
}
}

3
website/source/assets/stylesheets/consul-connect/pages/_home.scss Normal file
View File

@ -0,0 +1,3 @@
#page-home {
}

142
website/source/configuration.html.erb Normal file
View File

@ -0,0 +1,142 @@
---
description: |-
Consul is a highly available and distributed service discovery and KV
store designed with support for the modern data center to make distributed
systems and configuration easy.
---
<div class='consul-connect'>
<section class='g-hero'>
<div class='g-container'>
<h1>Service configuration made easy.</h1>
<p>Feature rich key/value store lets you easily configure services.</p>
<a href="#" class="g-btn">Get Started</a>
</div>
</section>
<section class='g-section'>
<div class='g-container'>
<div class='g-timeline no-intro'>
<div>
<span class='dot'></span>
<h3>The Challenge</h3>
<span class='sub-heading'>Runtime configuration management loses performace at scale.</span>
<img src='//placehold.it/516x314'>
<p>Services have many runtime configurations, such as feature flags or maintenance modes, that need to be propagated in real time. Distributing these updates using configuration management or by re-deploying services can take minutes to hours. During these rollout periods, infrastructure can be out of sync and service configurations could be incorrect.</p>
</div>
<div>
<span class='line'>
<svg xmlns="http://www.w3.org/2000/svg" width="11" height="15" viewBox="0 0 11 15">
<path fill="#CA2171" d="M0 0v15l5.499-3.751L11 7.5 5.499 3.749.002 0z"/>
</svg>
</span>
<span class='dot'></span>
<h3>The Solution</h3>
<span class='sub-heading'>Real-time runtime configuration for distributed applications.</span>
<img src='//placehold.it/516x314'>
<p>Consul can update service configurations across thousands of services in a globally distributed fleet in real time. Configuration can be stored in a hierarchical key/value store, and efficient edge triggers allow changes to be pushed to applications quickly.</p>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='intro'>
<h2>Features</h2>
</div>
<div class='g-text-image reverse'>
<div>
<img class="shadow" src='/assets/images/consul-connect/code-sample-2.png' alt='Automation through Codification'>
</div>
<div>
<div>
<h3>Key/Value Store</h3>
<p>Feature rich key/value store for dynamic service configuration data. Use it for feature flagging, maintenance modes, and more.</p>
<p>
<a class="learn-more" href='#'>Learn More <svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='g-text-image'>
<div>
<img src='/assets/images/consul-connect/code-sample-2.png' alt='Workflows, not Technologies'>
</div>
<div>
<div>
<h3>Transaction Support</h3>
<p>The key/value store supports both read and write transactions. This allows multiple keys to be updated or read as an atomic transaction. Changes to service configuration can be done atomically to minimize churn and avoid inconsistencies.</p>
<p>
<a class="learn-more" href='#'>Learn More <svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='g-text-image reverse'>
<div>
<img src='/assets/images/consul-connect/code-sample-2.png' alt='Open and Extensible'>
</div>
<div>
<div>
<h3>Blocking Queries / Edge-Triggered Requests</h3>
<p>The Consul API supports blocking queries, allowing edge triggered updates. Clients use this to get notified immediately of any changes. Tools like consul-template allow configuration files to be rendered in real-time to third-party sources when any configuration changes are made.</p>
<p>
<a class="learn-more" href='#'>Learn More <svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='g-text-image'>
<div>
<img src='/assets/images/consul-connect/code-sample-2.png' alt='Workflows, not Technologies'>
</div>
<div>
<div>
<h3>Watches</h3>
<p>Watches use blocking queries monitor for any configuration or health status updates and invoke user specified scripts to handle changes. This makes it easy to build reactive infrastructure.</p>
<p>
<a class="learn-more" href='#'>Learn More <svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='g-text-image large reverse'>
<div>
<img src='/assets/images/consul-connect/health-checks.png' alt='Service Registry'>
</div>
<div>
<div>
<h3>Distributed Locks and Semaphores</h3>
<p>The key/value store supports distributed locks and semaphores. This makes it easier for applications to perform leader election or manage access to shared resources.</p>
<p>
<a class="learn-more" href='#'>Learn more<svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
</div>

142
website/source/discovery.html.erb Normal file
View File

@ -0,0 +1,142 @@
---
description: |-
Consul is a highly available and distributed service discovery and KV
store designed with support for the modern data center to make distributed
systems and configuration easy.
---
<div class='consul-connect'>
<section class='g-hero'>
<div class='g-container'>
<h1>Service discovery made easy.</h1>
<p>Service Registry enables services to register and discover each other in dymanic infrastructure.</p>
<a href="#" class="g-btn">Get Started</a>
</div>
</section>
<section class='g-section'>
<div class='g-container'>
<div class='g-timeline no-intro'>
<div>
<span class='dot'></span>
<h3>The Challenge</h3>
<span class='sub-heading'>Service load balancers aren't efficient in a dynamic world.</span>
<img src='//placehold.it/516x314'>
<p>Load balancers are often used to front a service tier and provide a static IP. These load balancers add cost, increase latency, introduce single points of failure, and must be updated as services scale up/down.</p>
</div>
<div>
<span class='line'>
<svg xmlns="http://www.w3.org/2000/svg" width="11" height="15" viewBox="0 0 11 15">
<path fill="#CA2171" d="M0 0v15l5.499-3.751L11 7.5 5.499 3.749.002 0z"/>
</svg>
</span>
<span class='dot'></span>
<h3>The Solution</h3>
<span class='sub-heading'>Service discovery for dynamic infrastructure.</span>
<img src='//placehold.it/516x314'>
<p>Instead of load balancers, connectivity in dynamic infrastructure is best solved with service discovery. Service discovery uses a registry to keep a real-time list of services, their location, and their health. Services query the registry to discover the location of upstream services and then connect directly. This allows services to scale up/down and gracefully handle failure without a load balancer intermediary.</p>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='intro'>
<h2>Features</h2>
</div>
<div class='g-text-image large reverse'>
<div>
<img src='/assets/images/consul-connect/service-registry.png' alt='Service Registry'>
</div>
<div>
<div>
<h3>Service Registry</h3>
<p>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.</p>
<p>
<a class="learn-more" href='#'>Learn more<svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='g-text-image'>
<div>
<img class="shadow" src='/assets/images/consul-connect/code-sample-2.png' alt='DNS Query Interface'>
</div>
<div>
<div>
<h3>DNS Query Interface</h3>
<p>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.</p>
<p>
<a class="learn-more" href='#'>Learn more<svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='g-text-image reverse'>
<div>
<img class="shadow" src='/assets/images/consul-connect/code-sample-2.png' alt='HTTP API with Edge Triggers'>
</div>
<div>
<div>
<h3>HTTP API with Edge Triggers</h3>
<p>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.</p>
<p>
<a class="learn-more" href='#'>Learn more<svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='g-text-image'>
<div>
<img class='shadow' src='/assets/images/consul-connect/code-sample-3.png' alt='Multi Datacenter'>
</div>
<div>
<div>
<h3>Multi Datacenter</h3>
<p>Consul supports to 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.</p>
<p>
<a class="learn-more" href='#'>Learn more<svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='g-text-image large reverse'>
<div>
<img src='/assets/images/consul-connect/health-checks.png' alt='Service Registry'>
</div>
<div>
<div>
<h3>Health Checks</h3>
<p>Pairing service discovery with health checking prevents routing requests to unhealthy hosts and enables services to easily provide circuit breakers.</p>
<p>
<a class="learn-more" href='#'>Learn more<svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
</div>

269
website/source/index.html.erb
View File

@ -5,168 +5,151 @@ description: |-
systems and configuration easy.
---
<header>
<div class="container hero">
<div class="row">
<div class="col-md-offset-2 col-md-8">
<%= inline_svg "logo-hashicorp.svg", height: 120, class: "logo" %>
<div class='consul-connect'>
<h1>Service Discovery and Configuration Made Easy</h1>
<a class="button primary" href="/intro/index.html">Get Started</a>
<a class="button" href="/downloads.html">Download <%= latest_version %></a>
<section class='g-section bg-light'>
<div class='g-container'>
<div class='intro'>
<h2>A paradigm shift</h2>
<p>The shift from static to dynamic infrastructure creates a challenge for connectivity and security. Consul is the service-based networking solution to connect, configure, and secure services in dynamic infrastructure.</p>
</div>
</div>
</div>
</header>
<section id="features" class="marketing pink">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-sm-3 feature-icon">
<%= inline_svg "feature-discovery.svg", width: 100 %>
</div>
<div class="col-sm-9">
<h2>Service Discovery</h2>
<p>
HashiCorp Consul makes it simple for services to register themselves and to
discover other services via a DNS or HTTP interface. Register external
services such as SaaS providers as well.
</p>
</div>
<div class='g-timeline'>
<div>
<span class='dot'></span>
<h3>Static</h3>
<span class='sub-heading'>Host-based networking.</span>
<img src='//placehold.it/516x314'>
</div>
<div>
<span class='line'>
<svg xmlns="http://www.w3.org/2000/svg" width="11" height="15" viewBox="0 0 11 15">
<path fill="#CA2171" d="M0 0v15l5.499-3.751L11 7.5 5.499 3.749.002 0z"/>
</svg>
</span>
<span class='dot'></span>
<h3>Dynamic</h3>
<span class='sub-heading'>Service-based networking.</span>
<img src='//placehold.it/516x314'>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-sm-3 feature-icon">
<%= inline_svg "feature-health.svg", width: 100 %>
</div>
</section>
<section class='g-section'>
<div class='g-container'>
<div class='intro'>
<h2>Use Cases</h2>
</div>
<div class='g-use-cases'>
<div>
<div>
<img src='//placehold.it/180x130'>
<h3>Service Discovery <span>for connectivity</h3>
<p>Service Registry enables services to register and discover each other.</p>
</div>
<div class="col-sm-9">
<h2>Failure Detection</h2>
<p>
Pairing service discovery with health checking prevents routing
requests to unhealthy hosts and enables services to easily provide
circuit breakers.
</p>
<a href='#' class='g-btn dark-outline'>Learn more</a>
</div>
<div>
<div>
<img src='//placehold.it/180x130'>
<h3>Service Segmentation <span>for security</h3>
<p>Secure service-to-service communication with automatic TLS encryption and identity-based authorization.</p>
</div>
<a href='#' class='g-btn dark-outline'>Learn more</a>
</div>
<div>
<div>
<img src='//placehold.it/180x130'>
<h3>Service Configuration <span>for runtime configuration</h3>
<p>Feature rich Key/Value store lets you easily configure services.</p>
</div>
<a href='#' class='g-btn dark-outline'>Learn more</a>
</div>
</div>
</div>
</section>
<section class='g-section bg-light border-top'>
<div class='g-container'>
<div class='intro'>
<h2>Principles of Consul</h2>
</div>
<div class='g-text-image reverse'>
<div>
<img class='shadow' src='/assets/images/consul-connect/code-sample-1.png' alt='Automation through Codification'>
</div>
<div>
<div>
<h3>Automation through Codification</h3>
<p>Codify and automate service authorization policy.</p>
</div>
</div>
</div>
</div>
</section>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-sm-3 feature-icon">
<%= inline_svg "feature-multi.svg", width: 100 %>
</div>
<div class="col-sm-9">
<h2>Multi Datacenter</h2>
<p>
Consul scales to multiple datacenters out of the box with no
complicated configuration. Look up services in other datacenters, or
keep the request local.
</p>
</div>
<section class='g-section bg-light border-top'>
<div class='g-container'>
<div class='g-text-image'>
<div>
<img src='/assets/images/consul-connect/workflows-not-technologies.png' alt='Workflows, not Technologies'>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-sm-3 feature-icon">
<%= inline_svg "feature-config.svg", width: 85 %>
</div>
<div class="col-sm-9">
<h2>KV Storage</h2>
<p>
Flexible key/value store for dynamic configuration, feature flagging,
coordination, leader election and more. Long poll for near-instant
notification of configuration changes.
</p>
<div>
<div>
<h3>Workflows, not Technologies</h3>
<p>Connect services across any runtime platform and public or private cloud. Connect services from Kubernetes to VMs, Containers to Serverless functions.</p>
</div>
</div>
</div>
</div>
</div>
</section>
</section>
<section id="simple" class="marketing">
<div class="container">
<div class="row">
<div class="col-md-12">
<h2>DNS Query Interface</h2>
<p>
Look up services using Consul's built-in DNS server. Support
existing infrastructure without any code change.
</p>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="terminal">
<span class="circle"></span>
<span class="circle"></span>
<span class="circle"></span>
<div class="terminal-content">
<span><span class="text-pink">admin@hashicorp.com:</span> dig web-frontend.service.consul. ANY</span>
<span>; &lt;&lt;&gt;&gt; DiG 9.8.3-P1 &lt;&lt;&gt;&gt; web-frontend.service.consul. ANY</span>
<span>;; global options: +cmd</span>
<span>&nbsp;</span>
<span>;; Got answer:</span>
<span>;; -&gt;&gt;HEADER&lt;&lt;- opcode: QUERY, status: NOERROR, id: 29981</span>
<span>;; flags: qr aa rd ra; QUERY: 1, ANSWER: 2, AUTHORITY: 0, ADDITIONAL: 0</span>
<span> </span>
<span>;; QUESTION SECTION:</span>
<span>;web-frontend.service.consul. IN ANY</span>
<span>&nbsp;</span>
<span>;; ANSWER SECTION:</span>
<span>web-frontend.service.consul. 0 IN A <span class="text-pink">10.0.3.83</span></span>
<span>web-frontend.service.consul. 0 IN A <span class="text-pink">10.0.1.109</span></span>
<section class='g-section bg-light border-top'>
<div class='g-container'>
<div class='g-text-image reverse'>
<div>
<img src='/assets/images/consul-connect/open-and-extensible.png' alt='Open and Extensible'>
</div>
<div>
<div>
<h3>Open and Extensible</h3>
<ul>
<li>Provision clusters on any infrastructure.</li>
<li>Connect to services over TLS via proxy integrations.</li>
<li>Serve TLS certificates pluggable Certificate Authorities.</li>
</ul>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<h2>Key Value Storage</h2>
<p>
Consul provides a hierarchical key/value store with a simple HTTP API.
Managing configuration has never been simpler.
</p>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="terminal">
<span class="circle"></span>
<span class="circle"></span>
<span class="circle"></span>
<div class="terminal-content">
<span><span class="text-pink">admin@hashicorp:</span> consul kv put foo bar</span>
<span>Success! Data written to: foo</span>
<span><span class="text-pink">admin@hashicorp:</span> consul kv get foo</span>
<span>bar</span>
<span><span class="text-pink">admin@hashicorp:</span> consul kv get -detailed foo</span>
<span>CreateIndex 5</span>
<span>Flags 0</span>
<span>Key foo</span>
<span>LockIndex 0</span>
<span>ModifyIndex 5</span>
<span>Session -</span>
<span>Value bar</span>
<span><span class="text-pink">admin@hashicorp:</span> consul kv delete foo</span>
<span>Success! Deleted key: foo</span>
</div>
</div>
</div>
</div>
</div>
</section>
</section>
<section id="cta" class="marketing">
<div class="container">
<div class="row">
<a class="button primary" href="/intro/index.html">Read the Introduction</a>
<section class='g-section'>
<div class='g-container'>
<div class='intro'>
<h3>Join millions of companies that trust Consul.</h3>
</div>
<div class='g-logo-grid'>
<div>
<img src='/assets/images/consul-connect/logos/sap-ariba.png' alt='SAP Ariba'>
</div>
<div>
<img src='/assets/images/consul-connect/logos/citadel.png' alt='Citadel'>
</div>
<div>
<img src='/assets/images/consul-connect/logos/barclays.png' alt='Barclays'>
</div>
<div>
<img src='/assets/images/consul-connect/logos/itv.png' alt='itv'>
</div>
<div>
<img src='/assets/images/consul-connect/logos/spaceflight.png' alt='Spaceflight'>
</div>
<div>
<img src='/assets/images/consul-connect/logos/lotto.png' alt='MyLotto'>
</div>
</div>
</div>
</div>
</section>
</section>
</div>

124
website/source/segmentation.html.erb Normal file
View File

@ -0,0 +1,124 @@
---
description: |-
Consul is a highly available and distributed service discovery and KV
store designed with support for the modern data center to make distributed
systems and configuration easy.
---
<div class='consul-connect'>
<section class='g-hero'>
<div class='g-container'>
<span>New Feature</span>
<h1>Service segmentation made easy.</h1>
<p>Secure service-to-service communication with automatic TLS encryption and identity-based authorization.</p>
<a href="#" class="g-btn">Get Started</a>
</div>
</section>
<section class='g-section'>
<div class='g-container'>
<div class='g-timeline no-intro'>
<div>
<span class='dot'></span>
<h3>The Challenge</h3>
<span class='sub-heading'>Securing service-to-service communication with firewalls doesn’t scale in dynamic settings.</span>
<img src='//placehold.it/516x314'>
<p>East-west firewalls are the main tool for networking security in a static world. They depend on constraining traffic flow and use IP based rules to control ingress and egress traffic. But in a dynamic world where services move across machines and machines are frequently created and destroyed, this perimeter-based approach is difficult to scale as it requires complex network topologies and a large number of short lived firewall rules.</p>
</div>
<div>
<span class='line'>
<svg xmlns="http://www.w3.org/2000/svg" width="11" height="15" viewBox="0 0 11 15">
<path fill="#CA2171" d="M0 0v15l5.499-3.751L11 7.5 5.499 3.749.002 0z"/>
</svg>
</span>
<span class='dot'></span>
<h3>The Solution</h3>
<span class='sub-heading'>Service segmentation for dynamic service authorization.</span>
<img src='//placehold.it/516x314'>
<p>Service segmentation is a new approach to secure the service itself rather than relying on the network. Consul Connect enables high level rules to codify which services are allowed to communicate directly, without IP based rules or networking middleware.</p>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='intro'>
<h2>Features</h2>
</div>
<div class='g-text-image large reverse'>
<div>
<img src='/assets/images/consul-connect/service-access-graph.png' alt='Service Access Graph '>
</div>
<div>
<div>
<h3>Service Access Graph </h3>
<p>Define and enforce service to service communication with a simple Intentions configuration. Service based rules, instead of IP based rules, make it easy to manage dynamic infrastructure with frequently changing IPs.</p>
<p>
<a class="learn-more" href='#'>Learn more<svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='g-text-image'>
<div>
<img class="shadow" src='/assets/images/consul-connect/code-sample-2.png' alt='DNS Query Interface'>
</div>
<div>
<div>
<h3>Secure services across any runtime platform</h3>
<p>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.</p>
<p>
<a class="learn-more" href='#'>Learn more<svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='g-text-image reverse'>
<div>
<img class="shadow" src='/assets/images/consul-connect/code-sample-2.png' alt='DNS Query Interface'>
</div>
<div>
<div>
<h3>Certificate-Based Service Identity</h3>
<p>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.</p>
<p>
<a class="learn-more" href='#'>Learn more<svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
<section class='g-section border-top'>
<div class='g-container'>
<div class='g-text-image'>
<div>
<img class="shadow" src='/assets/images/consul-connect/code-sample-2.png' alt='DNS Query Interface'>
</div>
<div>
<div>
<h3>Encrypted communication</h3>
<p>All traffic between services is encrypted and authenticated with mutual TLS. Using TLS provides a strong guarantee of the identity of services communicating, and ensure all data in transit is encrypted.</p>
<p>
<a class="learn-more" href='#'>Learn more<svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10"><g fill="none" fill-rule="evenodd" transform="translate(-6 -3)"><mask id="a" fill="#fff"><path d="M7.138 3.529a.666.666 0 1 0-.942.942l3.528 3.53-3.529 3.528a.666.666 0 1 0 .943.943l4-4a.666.666 0 0 0 0-.943l-4-4z"/></mask><g fill="#1563FF" mask="url(#a)"><path d="M0 0h16v16H0z"/></g></g></svg></a>
</p>
</div>
</div>
</div>
</div>
</section>
</div>