diff --git a/nuxt/assets/css/getting-started.css b/nuxt/assets/css/getting-started.css new file mode 100644 index 0000000000..ce49532a43 --- /dev/null +++ b/nuxt/assets/css/getting-started.css @@ -0,0 +1,232 @@ +/* Shared styles for the /getting-started guide. Imported once by the + getting-started layout so every section page is pure content (no per-page diff --git a/nuxt/components/GsFlow.vue b/nuxt/components/GsFlow.vue new file mode 100644 index 0000000000..aaedb9237c --- /dev/null +++ b/nuxt/components/GsFlow.vue @@ -0,0 +1,49 @@ + + + + + diff --git a/nuxt/components/GsGoDeeper.vue b/nuxt/components/GsGoDeeper.vue new file mode 100644 index 0000000000..71bb509b41 --- /dev/null +++ b/nuxt/components/GsGoDeeper.vue @@ -0,0 +1,41 @@ + + + + + diff --git a/nuxt/components/GsGuide.vue b/nuxt/components/GsGuide.vue new file mode 100644 index 0000000000..bf50036c49 --- /dev/null +++ b/nuxt/components/GsGuide.vue @@ -0,0 +1,156 @@ + + + + + diff --git a/nuxt/components/GsProgress.vue b/nuxt/components/GsProgress.vue new file mode 100644 index 0000000000..7dca675c2a --- /dev/null +++ b/nuxt/components/GsProgress.vue @@ -0,0 +1,55 @@ + + + + + diff --git a/nuxt/components/GsSectionShare.vue b/nuxt/components/GsSectionShare.vue new file mode 100644 index 0000000000..6d34068663 --- /dev/null +++ b/nuxt/components/GsSectionShare.vue @@ -0,0 +1,49 @@ + + + + + diff --git a/nuxt/components/GsShare.vue b/nuxt/components/GsShare.vue new file mode 100644 index 0000000000..9160bcf16d --- /dev/null +++ b/nuxt/components/GsShare.vue @@ -0,0 +1,61 @@ + + + + + diff --git a/nuxt/components/GsStickyCta.vue b/nuxt/components/GsStickyCta.vue new file mode 100644 index 0000000000..1dd2d421e1 --- /dev/null +++ b/nuxt/components/GsStickyCta.vue @@ -0,0 +1,42 @@ + + + + + diff --git a/nuxt/components/GsStories.vue b/nuxt/components/GsStories.vue new file mode 100644 index 0000000000..b433e6fd20 --- /dev/null +++ b/nuxt/components/GsStories.vue @@ -0,0 +1,45 @@ + + + + + diff --git a/nuxt/layouts/getting-started.vue b/nuxt/layouts/getting-started.vue new file mode 100644 index 0000000000..93d573a344 --- /dev/null +++ b/nuxt/layouts/getting-started.vue @@ -0,0 +1,69 @@ + + + + + diff --git a/nuxt/nuxt.config.ts b/nuxt/nuxt.config.ts index 4be0ef5315..f284601d5d 100644 --- a/nuxt/nuxt.config.ts +++ b/nuxt/nuxt.config.ts @@ -381,6 +381,10 @@ export default defineNuxtConfig({ // or the route is missing from nuxt/dist and every link to it breaks. '/ai', ...collectProductRoutes(join(__dirname, 'content/products')), + // Static file-based page (pages/getting-started/index.vue). crawlLinks is + // off, so it must be listed explicitly or it never prerenders and the nav + // link to it 404s site-wide. + '/getting-started/', // Without this, @nuxtjs/sitemap only bakes /sitemap.xml statically when // isNuxtGenerate() is true, which checks for nitro.static/preset "static" - // the netlify preset here is hybrid (prerendered pages + a fallback diff --git a/nuxt/pages/getting-started/index.vue b/nuxt/pages/getting-started/index.vue new file mode 100644 index 0000000000..fe02371669 --- /dev/null +++ b/nuxt/pages/getting-started/index.vue @@ -0,0 +1,326 @@ + + + diff --git a/nuxt/pages/product/index.vue b/nuxt/pages/product/index.vue index cbe76413cc..a45d950efa 100644 --- a/nuxt/pages/product/index.vue +++ b/nuxt/pages/product/index.vue @@ -38,6 +38,24 @@ const TIERS = [ }, ] +const DIFFERENTIATORS = [ + { + heading: 'Vendor-Free Open Source', + description: 'Every factory is different, so why deploy the same solution as everyone else? Build your way with ready-made blueprints, your own app store, or anything in between — we never dictate your tools.', + icon: 'i-lucide-puzzle', + }, + { + heading: 'Flexible and Secure', + description: 'From whole-factory rollouts to last-mile fixes across any industry. Build your solution, then secure it with granular RBAC, auditing, version control, and traceability.', + icon: 'i-lucide-shield-check', + }, + { + heading: 'Seamless Collaboration', + description: 'OT teams prototype and deploy fast while IT keeps the governance, security, and auditability they need — no trade-offs.', + icon: 'i-lucide-handshake', + }, +] + const CAPABILITIES = [ { label: 'Industrial AI', to: '/ai/' }, { label: 'IT/OT Middleware', to: '/use-cases/it-ot-middleware/' }, @@ -115,7 +133,17 @@ onUnmounted(() => {

The needs of modern industry requires modern solutions

- +
+
+ +

{{ diff.heading }}

+

+

+
@@ -161,6 +189,8 @@ onUnmounted(() => {

The FlowFuse platform is the foundation for all of your IT/OT applications

Leveraging enterprise-grade development, deployment, and governance solutions, you can build faster, scale more efficiently, and secure deployments of any size.

+

Every application is assembled from the same core pieces — managed Node-RED instances running in the cloud or at the edge, a built-in Team Broker for your Unified Namespace, shared Tables for operational data, operator dashboards, and fleet-wide device management. The same building blocks arrange into the IT, OT, and IIoT architectures that fit how you run — wherever the work happens.

+ Get started building →
Integrations