Skip to content

Commit

Permalink
Tighten Home Page Communication with CTA to Quickstart (#694)
Browse files Browse the repository at this point in the history 
Co-authored-by: Rob Dominguez <[email protected]>
  • Loading branch information
@seanparkross @robertjdominguez
seanparkross and robertjdominguez authored Oct 9, 2024
1 parent c963862 commit a55b1ea
Show file tree
Hide file tree
Showing 4 changed files with 86 additions and 61 deletions.
18 changes: 14 additions & 4 deletions docs/basics/background.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,15 +24,25 @@ import Thumbnail from "@site/src/components/Thumbnail";

## Why are we building Hasura DDN?

With the rapid evolution of digital experiences, businesses are constantly seeking solutions to build next-generation
applications efficiently and cost-effectively. However, a common bottleneck is the inability to swiftly provide secure
and efficient access to necessary data.
A common bottleneck to building next-generation applications is the inability to swiftly provide secure and efficient
access to necessary data.

Hasura DDN addresses this challenge, by utilizing the **[data supergraph](/basics/core-concepts.mdx#supergraph)**
architecture and development methodology in a way which unlocks improved team and developer productivity.

In conversations with developers focused on building APIs and microservices, we've identified key challenges within the
community. Hasura DDN is designed to address these challenges, simplifying the workflow for software developers and
community.

- Slow product development and time-to-market cycles.
- Difficult data source federation and API composition.
- Runaway microservice sprawl.
- Unstructured governance with difficult collaboration.
- Complex and untrustworthy security.
- Compromised performance and difficult scalability.
- Opaque query observability.
- Multiple API consumers with different requirements.

Hasura DDN is designed to address these challenges, simplifying the workflow for software developers and
architects globally.

### For API Authors
Expand Down
74 changes: 23 additions & 51 deletions docs/index.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ import Thumbnail from "@site/src/components/Thumbnail";
import Basics from "@site/static/icons/book-open-01.svg";
import GraphQLAPI from "@site/static/icons/graphql-logo.svg";
import ChevronRight from "@site/static/icons/chevron-right.svg";
import GetStarted from "@site/static/icons/cloud-lightning.svg";
import Quickstart from "@site/static/icons/cloud-lightning.svg";
import Introduction from "@site/static/icons/award-02.svg";
import { OverviewIconCard } from "@site/src/components/OverviewIconCard";
import Link from "@docusaurus/Link";
Expand All @@ -37,42 +37,14 @@ import Link from "@docusaurus/Link";

<div className={'front-matter'}>
<div>
Hasura DDN directly addresses the problems developing and running modern APIs, including:
<ul className={"introList"}>
<li>
Slow product development and time-to-market cycles.
</li>
<li>
Difficult data source federation and API composition.
</li>
<li>
Runaway microservice sprawl.
</li>
<li>
Unstructured governance with difficult collaboration.
</li>
<li>
Complex and untrustworthy security.
</li>
<li>
Compromised performance and difficult scalability.
</li>
<li>
Opaque or impossible complex query observability.
</li>
<li>
Multiple API consumers with different requirements.
</li>
</ul>

Hasura DDN solves all of these issues.

Hasura's approach is to facilitate connection between the Hasura Engine and data sources via Data Connectors and to
define these connections using simple, declarative metadata in order to create a rich Supergraph of
interconnected sources, business logic, and third-party APIs.
Hasura DDN streamlines the development and operation of modern federated data APIs, <Link to="/basics/background/">solving key challenges</Link> in the process.

With powerful tooling and a code-driven workflow, Hasura DDN is not just an improvement in the data access
portion of the product development lifecycle, but a complete game-changer in the way APIs are created and run.
portion of the product development lifecycle, but a complete game-changer in the way you create, run, and manage APIs.

<Link to="/getting-started/quickstart/" className="cta-button mb-5 xl:mb-0 xl:mt-8">
<span>Quickstart.</span> Free. Easy. Fast.
</Link>

</div>
<div className={'video-wrapper'}>
Expand All @@ -89,38 +61,38 @@ import Link from "@docusaurus/Link";
### Popular Topics

<div className={"card-wrapper"}>
<div className={"card"}>
<div className={"card"}>
<div className={"card-content-items"}>
<Thumbnail src="/img/basics.png" alt="Basics" />
<Thumbnail src="/img/get-started.png" alt="Get Started" />
<div className={"card-content"}>
<h4>
<Basics />
Basics
<Quickstart />
Quickstart
</h4>
<p>
Here, you can learn more about our core concepts; we'll cover all the basics so you're ready to start
building.
</p>
<p>Learn how to get started with Hasura and deploy a GraphQL API on your data in minutes.</p>
</div>
</div>
<Link href={"/basics/overview/"}>
Learn the basics
<Link href={"/getting-started/quickstart"}>
Quickstart with Hasura DDN
<ChevronRight />
</Link>
</div>
<div className={"card"}>
<div className={"card-content-items"}>
<Thumbnail src="/img/get-started.png" alt="Get Started" />
<Thumbnail src="/img/basics.png" alt="Basics" />
<div className={"card-content"}>
<h4>
<GetStarted />
Get Started
<Basics />
Basics
</h4>
<p>Learn how to get started with Hasura and deploy a GraphQL API on your data in minutes.</p>
<p>
Here, you can learn more about our core concepts; we'll cover all the basics so you're ready to start
building.
</p>
</div>
</div>
<Link href={"/getting-started/overview"}>
Create your first project
<Link href={"/basics/overview/"}>
Learn the basics
<ChevronRight />
</Link>
</div>
Expand Down
8 changes: 4 additions & 4 deletions docs/support/faq.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -109,7 +109,7 @@ This ensures that your API remains available to users while updates are being ap
unique build ID, making it easier to track and manage different versions of your metadata. This enhances transparency
and auditability during the development process.

### What can be automated?
## What can be automated?

Since metadata authoring is mostly code driven using the
[Hasura VS Code extension](https://marketplace.visualstudio.com/items?itemName=HasuraHQ.hasura) and the CLI, many
Expand Down Expand Up @@ -178,7 +178,7 @@ We will still support, maintain and improve Hasura v2 as per our
[version support policy](https://hasura.io/docs/latest/policies/versioning/) and will be providing migration tools to
move Hasura v2 deployments to DDN in the near future.

# If I have an Alpha/Beta DDN project, will it be compatible with the GA release?
## If I have an Alpha/Beta DDN project, will it be compatible with the GA release?

We recommend [creating a new project](getting-started/build/index.mdx) and use the new CLI to populate metadata again.

Expand All @@ -195,14 +195,14 @@ Rust's performance, ecosystem and community for DDN. Rust is a modern, high-perf
also gaining much traction in the cloud-native space, and we are excited to be using it for the significant parts of the
Hasura DDN codebase. If you are a Rust developer and want to do cool stuff, please check out our careers page.

### If currently running a v2.x will it be moved automatically to v3?
## If currently running a v2.x will it be moved automatically to v3?

No, it will not. The v2 cloud projects will remain untouched and there will be no change of business. Moving to DDN will
be an opt-in process. Having said that, we strongly encourage upgrading to DDN early when features you require are
available. Our teams are available to make the migration process as smooth as possible and please keep an eye on our
[official announcements and releases](https://hasura.io/community/) for upcoming information about migration tools.

### Can we request to lock ourselves to 2.x?
## Can we request to lock ourselves to 2.x?

The migration is an opt-in process, so you do not need to request to have yourselves locked to a particular version. If
however, you see no upgrade path even in the next two years, please give us a heads-up and we will work out options with
Expand Down
47 changes: 45 additions & 2 deletions src/css/custom.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@
--ifm-color-info-dark: #c6d6ff;
--purple-pill: #8c49fa;
--ifm-menu-link-sublist-icon: url('data:image/svg+xml;utf8,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15,12.5,L10,7.5L5,12.5" stroke="gray" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/></svg>');
--cta-button-green: #22c55e;
}

/* For readability concerns, you should choose a lighter palette in dark mode. */
Expand Down Expand Up @@ -515,6 +516,48 @@ div:has(> .DocSearch.DocSearch-Button) {
background-color: var(--primary-blue-600);
}

.cta-button {
display: inline-block;
/* @apply bg-green-500; */
background-color: var(--secondary-blue-500);
padding: 12px 24px;
border-radius: 38px;
cursor: pointer;
transition: background-color 0.3s ease;
}

.cta-button:hover {
/* @apply bg-green-600; */
background-color: var(--primary-blue-600);
text-decoration: none;
}

.cta-button p {
color: var(--base-neutral-0);
margin-bottom: 0;
display: flex;
align-items: center;
}

.cta-button p span {
@apply font-bold;
margin-right: 8px;
}

.cta-button p::after {
content: '';
background-image: url('data:image/svg+xml;utf8,<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.5 15.5L12.5 10.5L7.5 5.5" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
width: 20px;
height: 21px;
margin-left: 8px;
display: inline-block;
transition: transform 0.3s ease-in-out;
}

.cta-button:hover p::after {
transform: translateX(4px);
}

/* Header */

/* Breadcrumb */
Expand Down Expand Up @@ -1465,10 +1508,10 @@ table td {
ol {
font-size: 0.9375rem;

li {
/* li {
@apply mb-4 mt-4;
line-height: 1.625rem;
}
} */
}

.front-matter li {
Expand Down

0 comments on commit a55b1ea

Please sign in to comment.