Psammead

screenshot of Psammead
react

React component library for BBC World Service and more

Overview

Psammead is a versatile package library that provides a variety of components, containers, and utilities optimized for building applications with a focus on compliance with the BBC’s GEL standards. Designed with React, Psammead allows developers to create high-quality user interfaces quickly and efficiently. This library's recent migration to a legacy folder in the Simorgh repository underlines its long-term stability, making it a great option for those looking to build scalable Single Page Applications.

With a structured approach to development and community contributions, Psammead ensures that developers can easily integrate and maintain its components. The inclusion of solid documentation and a welcoming attitude towards pull requests enhances the overall experience, enabling a smooth development process.

Features

  • GEL-compliant Components: Psammead offers out-of-the-box components that meet BBC's GEL design specifications, ensuring consistency across applications.
  • Functional Containers: The package includes functional components that can be seamlessly integrated with presentational components, promoting modular development.
  • Shared Utilities: A set of shared dependencies is provided to aid in building additional GEL-compliant components and enhancing overall functionality.
  • Easy Onboarding: The repository offers clear guidelines and documentation for new contributors, making it simple to get started.
  • Yarn Package Management: Utilizing Yarn for package management ensures efficient installation and dependency management within the project.
  • Robust Testing Framework: Built-in testing capabilities using Jest enable developers to maintain code integrity through a comprehensive testing suite.
  • Customizable Storybook: The inclusion of a Storybook configuration allows for interactive development and visualization of components in isolation.
  • Browser Support Guarantee: Psammead components come with a commitment to supporting specific browser versions, ensuring accessibility for a broad audience.
react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.

github-pages
GitHub Pages

Gridsome is a Vue.js-based static site generator that makes it easy to build fast and flexible websites and applications by leveraging modern web technologies like GraphQL, Webpack, and hot reloading

postcss
Postcss

PostCSS is a popular open-source tool that enables web developers to transform CSS styles with JavaScript plugins. It allows for efficient processing of CSS styles, from applying vendor prefixes to improving browser compatibility, ultimately resulting in cleaner, faster, and more maintainable code.

Stylelint

Stylelint is a modern linter for CSS that helps you avoid errors and enforce consistent styling conventions. It provides rules for detecting errors and warnings, and can be configured to match your specific project's requirements.