diff --git a/public/img/work/millipore/catalog-details.png b/public/img/work/millipore/catalog-details.png new file mode 100644 index 0000000..19afe41 Binary files /dev/null and b/public/img/work/millipore/catalog-details.png differ diff --git a/public/img/work/millipore/catalog.png b/public/img/work/millipore/catalog.png new file mode 100644 index 0000000..5ac6244 Binary files /dev/null and b/public/img/work/millipore/catalog.png differ diff --git a/public/img/work/millipore/deployed-envs.png b/public/img/work/millipore/deployed-envs.png new file mode 100644 index 0000000..2a9bd23 Binary files /dev/null and b/public/img/work/millipore/deployed-envs.png differ diff --git a/public/img/work/millipore/graphql-playground.png b/public/img/work/millipore/graphql-playground.png new file mode 100644 index 0000000..fa5c94b Binary files /dev/null and b/public/img/work/millipore/graphql-playground.png differ diff --git a/public/img/work/millipore/graphql-voyager.png b/public/img/work/millipore/graphql-voyager.png new file mode 100644 index 0000000..374f9d8 Binary files /dev/null and b/public/img/work/millipore/graphql-voyager.png differ diff --git a/public/img/work/millipore/release-notes.png b/public/img/work/millipore/release-notes.png new file mode 100644 index 0000000..dbfe6ce Binary files /dev/null and b/public/img/work/millipore/release-notes.png differ diff --git a/public/svgs/clients/millipore-sigma.svg b/public/svgs/clients/millipore-sigma.svg new file mode 100644 index 0000000..bdd05da --- /dev/null +++ b/public/svgs/clients/millipore-sigma.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/clients/millipore-sigma.svg b/src/icons/clients/millipore-sigma.svg new file mode 100644 index 0000000..bdd05da --- /dev/null +++ b/src/icons/clients/millipore-sigma.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/work/millipore.astro b/src/pages/work/millipore.astro new file mode 100644 index 0000000..ee45933 --- /dev/null +++ b/src/pages/work/millipore.astro @@ -0,0 +1,260 @@ +--- +import { Img } from 'astro-imagetools/components'; +import { Icon } from 'astro-icon'; + +import BaseLayout from '../../layouts/BaseLayout.astro'; +import BottomLinks from '../../components/BottomLinks.astro'; + +const title = 'Millipore Sigma Internal Developer Platform'; +const description = + 'Ship Shape helped Millipore Sigma set up and customize Backstage to enable org-wide service discoverability and standardize access to documentation across teams.'; +--- + + +
+
+

Millipore Sigma

+ +
+ + +

Case Study

+
+ + + + A detailed overview of the catalog table +
+
+ +
+
+

About the Client

+ +
+
+

+ MilliporeSigma is the Life Science business of Merck KGaA, Darmstadt, Germany, a leading science and technology company, operating across healthcare, life science and Electronics. Over 60,000 employees in 66 countries work to make a positive difference to millions of people's lives every day by creating more joyful and sustainable ways to live. +

+
+ +
+ +
+
+
+
+ +
+
+

Challenge

+ +

+ MilliporeSigma has the issue of fragmented engineering teams, unclear service ownership, and a lack of consistent documentation strategy. + This caused issues in understanding how to work with services, where to ask for help, or how to request features. This serverly impacted + the delivery of new features. This also had the side effect of uncertainty on the risk of introducing changes within the main ecommerce application. +

+ +
+
+ Sales execution report detail +
+
+ Complex schema and resolvers across services +
+
+
+
+ +
+
+

Solution

+

+ By creating an internal developer portal with Backstage, Ship Shape provided one location where everyone in the organization to have a singular way of viewing these services, accessing their repositories, documentation, and learning how to collaborate with the individuals behind them. +

+ +

+ MilliporeSigma teams create tools without any particular "golden path" on technologies or documentation practices. Ship Shape leveraged the Catalog plugin for collecting the information on the existing teams and the codebases each own. Secondly, we implemented the TechDocs plugin to unify the way in which documentation can be created/maintained moving forward. As part of the documentation ease effort, we created a custom plugin to display the release notes for each release of the main e-commerce application. +

+ +
+
+

Deployed Environments

+ +

+ MilliporeSigma uses a GitOps process to automate the continuous integration and delivery pipelines, + but this process limits the transparency of the software development lifecycle to + other stakeholders outside the of the engineering teams. We developed a custom plugin + to parse the YAML deployments and provide a simple interface to determine what + releases are in each environment. +

+
+ +
+
+ Deployed Environments custom plugin +
+
+ Custom YAML parsing to display the release tags +
+
+
+ +
+
+

Graphical Schema Display

+ +

+ Using the graphql voyager package, + we created a custom plugin for a visual mapping of the schema and entity relations. This also provides + an easier to search interface for UI creators to find entity fields as options when creating new or + editing existing queries. +

+
+ +
+
+ GraphQL Voyager custom Backstage plugin +
+
+ Graphql voyager custom Backstage plugin +
+
+
+
+
+ +
+
+

Outcome

+ +
+ A detailed overview of all candidate assessment results +
+ +

+ Backstage empowers organizations to better understand their infrastructure through the Catalog and easily find documentation through TechDocs. Ship Shape was able to help their engineers extend beyond Backstage’s available capabilities to develop custom solutions for both developers and non-developer partners. Ship Shape helped MilliporeSigma in adopting Backstage open source software, while creating bespoke solutions to shape it into the IDP they needed. +

+
+
+ +
+
+ +
+
+
diff --git a/tailwind.config.cjs b/tailwind.config.cjs index 5aa634f..5d0a3e3 100644 --- a/tailwind.config.cjs +++ b/tailwind.config.cjs @@ -13,6 +13,7 @@ module.exports = { 'navy-card-dark': '#133254', 'navy-card-light': '#1B3B5E', 'navy-light': '#073256', + 'millipore-purple': '#503091', 'netflix-red': '#E50914', 'enigma-blue': '#1B1D36', grey: 'var(--grey)',