fleet/website/views/pages/fleet-gitops.ejs
Eric 75ffd8b12f
Website: Update login/register flow, add Fleet UI background to /try and /login (#39290)
Closes: https://github.com/fleetdm/fleet/issues/36465
Closes: https://github.com/fleetdm/fleet/issues/36467
Related to: https://github.com/fleetdm/confidential/issues/14254

Changes:
- Updated "Try it yourself" links to go to the `/try` page (Which
redirects users who aren't logged in to the /login page)
- Removed the `<signup-modal>` and `<signup-button>` components
- Removed the route for the /register page, and added a redirect to go
to /login
- Updated the /login page to have the signup form, and to match the
latest wireframes
- Updated the /try page to have a fake Fleet UI as a background
(previously an image)
2026-02-10 12:32:49 -06:00

179 lines
11 KiB
Text
Vendored
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<div id="fleet-gitops" v-cloak>
<div purpose="page-container">
<div purpose="page-hero">
<div purpose="hero-text">
<div>
<h4>Fleet GitOps</h4>
<h1>The future of device management is declarative</h1>
</div>
<p>See every change, undo any error, repeat every success. Fleet and GitOps work together to optimize your endpoint management strategy.</p>
<div purpose="button-row">
<a purpose="cta-button" class="btn btn-primary" href="/contact">Get a demo</a>
<!-- <animated-arrow-button href="/try">Try it yourself</animated-arrow-button> -->
</div>
</div>
<div purpose="list-and-cta">
<div purpose="features-list">
<div purpose="list-item">
<h5>Get to know Fleet GitOps</h5>
<p>Implement collaboration, version control, and automation workflows built into Fleet that accelerates enforcing controls, OS updates, software deployments, and reduce downtime.</p>
<a href="#get-to-know-fleet-gitops">Learn more</a>
</div>
<div purpose="list-item">
<h5>Benefits of using infrastructure as code</h5>
<p>GUI-based device management practices are difficult to maintain and audit. Undo complex change management and leave manual, repetitive tasks behind. Add real business value in IT and get time back for your team.</p>
<a href="#benefits-of-using-infrastructure as code">Learn more</a>
</div>
<div purpose="list-item">
<h5>Challenges</h5>
<p>The most common first question about GitOps: “Is it hard?” Acknowledging complexity and meeting resistance with investments in tools and training can help to relieve bottlenecks during adoption.</p>
<a href="#challenges">Learn more</a>
</div>
</div>
<div purpose="workshop-cta">
<div purpose="cta-image">
<img alt="GitOps workshop" src="/images/gitops-training-hero-471x471@2x.png">
</div>
<div purpose="cta-text">
<h3>GitOps workshop</h3>
<p>Device management is evolving. Master the principles of configuration-as-code for managing devices at scale.</p>
<animated-arrow-button href="/gitops-workshop">Join a workshop near me</animated-arrow-button>
</div>
</div>
</div>
</div>
<div purpose="page-section">
<div purpose="section-title">
<h2 id="get-to-know-fleet-gitops">Get to know Fleet GitOps</h2>
</div>
<div purpose="section-image">
<div purpose="image-container">
<img alt="An image showing the process of the Fleet Gitops workflow. A developer pushes a device management profile to GitHub, and an IT admin approves the new profile. When the updated profile is merged, the CI/CD runner sends the profile to a Fleet server. The Fleet server then sends the updated profile to a managed device and verifies the result." src="/images/fleet-gitops-workflow-471x337@2x.png">
</div>
<p purpose="image-caption">Fleet <a href="/docs/configuration/yaml-files">GitOps commands</a> to modify the Fleet UI are executed by the fleetctl binary (the “engine” under the hood.) The binary lives on a CI / CD “runner” (e.g., GitHub Actions). A git push with updated YAML code kicks off automation that results in real-time changes you can see.</p>
</div>
<div purpose="two-column-features">
<div purpose="feature">
<h5>Declarative device management</h5>
<p>Most device management solutions have an API, but most do not provide comprehensive control over the admin console with configuration-as-code like Fleet.</p>
<p>Managing the Fleet UI console with GitOps means you have total declarative control over your devices.</p>
<p>Unlock powerful automations that allow you to:</p>
<ul>
<li>Ensure every change is peer-reviewed</li>
<li>Ensure every setting is version-controlled</li>
<li>Easily roll back to a previous state</li>
<li>Declare the state of the Fleet UI in code, continuously</li>
</ul>
</div>
<div purpose="feature">
<h5>Observable, reversible, and repeatable workflows</h5>
<p>Nothing builds knowledge, trust, and fosters engineering teamwork like peer-reviewed changes made in the open.</p>
<p>Collaboration on Fleet GitOps workflows helps to prevent problems before they occur. Version control means it is straightforward to fix problems that do make it into production (nobodys perfect...)</p>
<p>Another powerful technical benefit: less effort on long-term maintenance. Controlling the Fleet UI with code results in a library of stable, known-good configurations that can be copied and modified to easily add new management objects, like device profiles and software. Tame the endless sprawl of manually re-creating automations and scoping.</p>
</div>
</div>
</div>
<div purpose="page-section">
<div purpose="section-title">
<h2 id="benefits-of-using-infrastructure as code">Benefits of using infrastructure as code</h2>
</div>
<div purpose="features-section">
<div purpose="feature">
<h5>Rethink change managment</h5>
<p>Replacing change management forms and risk assessments with asynchronous GitOps workflows and approvals can dramatically increase operational speed.</p>
</div>
<div purpose="feature">
<h5>Stay the course</h5>
<p>Changes made in the console or to devices directly can cause device state to “drift” - away from compliance, security posture, and an organizations intended user experience.</p>
</div>
<div purpose="feature">
<h5>Choose automation over repetition</h5>
<p>Applications build muscle memory. But what could you do with the time gained back from manual tasks and visual scans in your current device management solution?</p>
</div>
<div purpose="feature">
<h5>Cancel the CAB</h5>
<p>How much does it cost organizations in time and money to get senior engineers and their bosses on an advisory board call to discuss information that could be in a pull request?</p>
</div>
<div purpose="feature">
<h5>Make end users happy</h5>
<p>Mired in engineering details, its easy to lose sight of an important, oft-stated goal that should be part of any device strategy aimed at operational excellence: enabling work.</p>
</div>
<div purpose="feature">
</div>
</div>
</div>
<div purpose="page-section" class="d-none">
<div purpose="section-quote">
<p purpose="quote-text">“One Fortune 500 company had a 1.5-hour Change Advisory Board (CAB) meeting, 100 attendees, and they reviewed around 50 changes per meeting. This cost them $750k not including opportunity costs.”</p>
<div purpose="quote-attribution">
<p><a href="https://www.thirdera.com/insights/why-do-you-still-have-a-change-advisory-board" target="_blank" no-icon>https://www.thirdera.com/insights/why-do-you-still-have-a-change-advisory-board</a> - May 10, 2023</p>
</div>
</div>
</div>
<div purpose="page-section-sm-padding">
<div purpose="section-title">
<h2 id="challenges">Challenges</h2>
</div>
<div purpose="two-column-features">
<div purpose="feature">
<h5>Your culture matters, and so does ours</h5>
<p>For some organizations, GitOps is a natural fit to the engineering culture even if IT teams lack experience or the practice is new.</p>
<p>If DevOps or GitOps is already used by an organization, device management engineers may be aware of the concepts and tooling. Having an internal example to follow can result in an easier path to adoption.</p>
<p>But, GitOps adoption is not always simple. Admins may resist unfamiliar workflows or solutions. They may also have concerns about losing the value of certifications or specialized training.</p>
<p>By meeting potential challenges with phased implementation and thought leadership, any team can successfully adopt Fleet GitOps. Weve seen it, and weve helped our customers do it.</p>
</div>
<div purpose="feature">
<h5>Making GitOps benefits real</h5>
<p>At Fleet, we believe that showing organizations how to migrate to GitOps workflows represents an enormous opportunity for them to increase engineering efficiency and operational speed. This ultimately improves both end user experience and enterprise compliance. We design the product around these goals. We want to help you achieve them.</p>
<p>One way we can help is by improving the product itself, which were doing every day.</p>
<p>Another way we can help is through training. To learn more about GitOps, you can attend one of our free, hands-on, in-person <a href="/gitops-workshop">GitOps workshops</a>, or you can request that one be delivered in your area.</p>
</div>
</div>
</div>
<div purpose="page-section">
<div purpose="section-quote">
<p purpose="quote-text">“The shift to GitOps has modernized our operations, giving us the agility and change control we needed, giving leadership real-time confidence in device health and compliance.”</p>
<div purpose="quote-author-info">
<div purpose="quote-author-image">
<img alt="Dan Jackson" src="/images/testimonial-author-dan-jackson-48x48@2x.png">
</div>
<p purpose="author-name">Dan Jackson</p>
<p purpose="author-title">Sr Manager Systems Engineering, Fastly</p>
</div>
</div>
</div>
</div>
<div purpose="tweets-container" class="d-flex flex-column justify-content-center">
<div purpose="page-container" class="py-0">
<div purpose="section-heading" class="mx-auto text-center">
<h2 class="mb-3">What people are saying</h2>
</div>
</div>
<scrollable-tweets :testimonials="testimonialsForScrollableTweets"></scrollable-tweets>
</div>
<div purpose="page-container" class="py-0">
<div purpose="page-section">
<div purpose="bottom-cta">
<div>
<h4>Fleet GitOps</h4>
<h2>The future of device management is declarative</h2>
</div>
<div purpose="button-row">
<a purpose="cta-button" class="btn btn-primary" href="/contact">Get a demo</a>
<!-- <animated-arrow-button href="/try">Try it yourself</animated-arrow-button> -->
</div>
</div>
</div>
</div>
<%/* Cloud city banner */%>
<parallax-city></parallax-city>
</div>
<%- /* Expose server-rendered data as window.SAILS_LOCALS :: */ exposeLocalsToBrowser() %>