Design System

Overview:

The Royal Navy Design System is a tool that allows developers to build web applications that meet the standards of the Royal Navy service. It provides a set of components and guidelines for creating visually consistent and user-friendly interfaces. The system follows semantic versioning and is published on the NPM registry.

Features:

• Component Usage Guidelines: Storybook provides interactive examples, code snippets, and details on how to consume each component effectively.
• Monorepo & Package Management: Splitting large codebases into separate independently versioned packages allows for better code sharing. Yarn workspaces manage dependencies and provide instant updates in Storybook.
• Browser Support: The Royal Navy Design System supports all major evergreen browsers.

Installation:

To install the Royal Navy Design System and add it to your project’s dependencies, run the following command in the terminal:

npm install @royalnavy/design-system

Note: styled-components is a required peer dependency and will be installed automatically.

To quickly get started with the Royal Navy Design System, you can use the following example application:

// Example application code goes here

Summary:

The Royal Navy Design System is a comprehensive tool for building web applications that meet the standards of the Royal Navy service. It provides guidelines, components, and package management features to streamline development and ensure consistency. With its support for major browsers and easy installation process, the Royal Navy Design System is a valuable resource for developers working on projects related to the Royal Navy.