frontend.yaml

---
-
  name: JavaScript 5
  ring: hold
  quadrant: languages & frameworks
  isNew: FALSE
  description: >
    JavaScript 5 is the "old" version of JavaScript as currently supported by browsers (mostly JavaScript 5).
    See https://en.wikipedia.org/wiki/JavaScript. Good to be used directly on small projects where build tools 
    and transpiling are overhead. We prefer the use of ES2015 and beyond and use Babel for transpiling so more
    modern an powerful JavaScript language features can be used. SXA
-
  name: ESNext
  ring: adopt
  quadrant: languages & frameworks
  isNew: FALSE
  description: >
    The new version of JavaScript with way more powerful language constructs. See http://www.ecma-international.org/ecma-262/6.0/ for
    the language specification. Not all browser support the new ES2015 features, so use Babel - https://babeljs.io/ - for transpiling.
    This means that the project requires a build system. https://babeljs.io/learn-es2015/ gives nice overview of the new ES2015 features.
    TypeScript (as a better ES2015+ - needs transpiling anyway)
-
  name: SASS
  ring: adopt
  quadrant: languages & frameworks
  isNew: FALSE
  description: Is used for all transpiled "CSS" styling, if not css in js used.
-
  name: Bootstrap
  ring: adopt
  quadrant: languages & frameworks
  isNew: FALSE
  description: 'Still the #1 library for web UI''s, especially for administrative screens.'
-
  name: Typescript
  ring: adopt
  quadrant: languages & frameworks
  isNew: FALSE
  description: Use latest version where possible, use strict mode where possible (required by Create React App)
-
  name: Jest
  ring: adopt
  quadrant: languages & frameworks
  isNew: FALSE
  description: Testing library to describe your test.
-
  name: Mirage JS
  ring: adopt
  quadrant: languages & frameworks
  isNew: FALSE
  description: API mocking library, no need of backend services, mock data within components.
-
  name: RX-JS
  ring: assess
  quadrant: languages & frameworks
  isNew: FALSE
  description: Reactive programming with JavaScript
-
  name: SVG
  ring: adopt
  quadrant: languages & frameworks
  isNew: FALSE
  description: Scalable Vector Graphics - the solution for resolution independent graphics.
-
  name: ReactJS
  ring: adopt
  quadrant: languages & frameworks
  isNew: FALSE
  description: Our current choice as view library.
-
  name: Angular
  ring: assess
  quadrant: languages & frameworks
  isNew: FALSE
  description: Full-fledged framework for line-of-business SPA applications.
-
  name: Webpack
  ring: adopt
  quadrant: tools
  isNew: FALSE
  description: >
    The coordinator behind transpilation, minification and obfuscation. Client-side bundles CRA2 where possible, 
    server-side bundles custom webpack configuration.
-
  name: Redux
  ring: adopt
  quadrant: languages & frameworks
  isNew: FALSE
  description: State management for ReactJS, use redux-toolkit. Not for server state (see eg. react-query).
-
  name: React-query
  ring: adopt
  quadrant: languages & frameworks
  isNew: TRUE
  description: server state library, Powerful and performant data synchronization between server and client 
-
  name: React-router
  ring: adopt
  quadrant: languages & frameworks
  isNew: TRUE
  description: Collection of navigational components, Routing 
-
  name: React forms
  ring: adopt
  quadrant: languages & frameworks
  isNew: TRUE
  description: Form builder/handling, big JSON schema's use react-json-schema-form, else use react-hook-form
-
  name: Formik
  ring: hold
  quadrant: languages & frameworks
  isNew: TRUE
  description: React form builder, prefer react-hook-form or react-json-schema-form over Formik
-
  name: Ag-grid
  ring: assess
  quadrant: languages & frameworks
  isNew: TRUE
  description: JavaScript grid
-
  name: HTML(5)/CSS(3)
  ring: adopt
  quadrant: languages & frameworks
  isNew: FALSE
  description: The core of everything.
-
  name: VueJS
  ring: hold
  quadrant: languages & frameworks
  isNew: FALSE
  description: Used in some of the Macaw projects. Not our default starting point, but a viable alternative.
-
  name: D3.js
  ring: assess
  quadrant: languages & frameworks
  isNew: FALSE
  description: The library for advanced data visualization and animation.
-
  name: AMP
  ring: assess
  quadrant: languages & frameworks
  isNew: FALSE
  description:  Accelerated Mobile Pages.
-
  name: Web Components
  ring: adopt
  quadrant: languages & frameworks
  isNew: FALSE
  description: Already using it in projects, see StencilJS as framework. Great alternative way of working with components in SXA
-
  name: jQuery
  ring: hold
  quadrant: languages & frameworks
  isNew: FALSE
  description: don't start another project with jQuery, except when innevitable on for example commerce projects or projects with out-of-the-box components.
-
  name: LESS
  ring: hold
  quadrant: languages & frameworks
  isNew: FALSE
  description: Favor SASS over LESS.
-
  name: Tailwind
  ring: trial
  quadrant: languages & frameworks
  isNew: TRUE
  description: Utility-first CSS framework, small library
-
  name: Material UI
  ring: assess
  quadrant: languages & frameworks
  isNew: TRUE
  description: React UI framework with standard set of components
-
  name: Ionic framework
  ring: assess
  quadrant: languages & frameworks
  isNew: TRUE
  description: Mobile app framework where developer can choose between React, Angular and Vue.js implementations
-
  name: XState
  ring: trial
  quadrant: languages & frameworks
  isNew: TRUE
  description: JavaScript/TypeScript state machine, declarative description of application behavior
-
  name: .NET Core/5/6
  ring: adopt
  quadrant: platforms
  isNew: FALSE
  description: 
-
  name: Azure
  ring: adopt
  quadrant: platforms
  isNew: FALSE
  description: 
-
  name: Solr
  ring: adopt
  quadrant: platforms
  isNew: FALSE
  description: Part of the Sitecore box, for custom search adopt ElasticSearch
-
  name: Sitecore SXA
  ring: adopt
  quadrant: platforms
  isNew: FALSE
  description: Prefered platform for out of the box Sitecore implementations
-
  name: Sitecore JSS
  ring: assess
  quadrant: platforms
  isNew: FALSE
  description: To use Sitecore as a headless platform. Use in combination with NextJS
-
  name: Sitecore Edge
  ring: assess
  quadrant: platforms
  isNew: TRUE
  description: Headless content delivery, available with Content Hub or XM
-
  name: Docker / containers
  ring: adopt
  quadrant: platforms
  isNew: FALSE
  description: For unit of deployment, linux, Azure Web Apps / kubernetes
-
  name: ElasticSearch
  ring: adopt
  quadrant: platforms
  isNew: FALSE
  description: Dutch company, local support, based on usage look at Azure Search
-
  name: Tree Shaking
  ring: adopt
  quadrant: techniques
  isNew: FALSE
  description: Minimal bundle size - webpack / rollup?
-
  name: Production First - CI/CD
  ring: adopt
  quadrant: techniques
  isNew: FALSE
  description: Azure DevOps - pipelines
-
  name: Full Stack devs
  ring: adopt
  quadrant: techniques
  isNew: FALSE
  description: 'Don''t be scared of install complete platform and edit Razor views'
-
  name: OAuth2
  ring: adopt
  quadrant: techniques
  isNew: FALSE
  description: Mostly used under the hood
-
  name: Content as a service
  ring: adopt
  quadrant: techniques
  isNew: FALSE
  description: JSS, Netlify-cms, BLS...
-
  name: HTTP/2
  ring: adopt
  quadrant: techniques
  isNew: FALSE
  description: Loading multiple small bundles at high speed
-
  name: PWA
  ring: adopt
  quadrant: techniques
  isNew: FALSE
  description: Progressive Web Apps
-
  name: SEO
  ring: adopt
  quadrant: techniques
  isNew: FALSE
  description: Technical SEO - Schema.org, JSON-LD, OpenGraph, ...
-
  name: A11Y/ARIA
  ring: trial
  quadrant: techniques
  isNew: FALSE
  description: Accessibility, Adobe React Aria
-
  name: Image optimization as a service
  ring: adopt
  quadrant: techniques
  isNew: FALSE
  description: Use image services like Kraken, ContentHub
-
  name: Serverless
  ring: adopt
  quadrant: techniques
  isNew: FALSE
  description: 'Serverless computing: Azure Functions, Netlify Functions'
-
  name: Unit tests
  ring: adopt
  quadrant: techniques
  isNew: FALSE
  description: Jest, testing-library.com 
-
  name: UI Testing
  ring: assess
  quadrant: techniques
  isNew: FALSE
  description: Cypress
-
  name: Web Assembly
  ring: assess
  quadrant: techniques
  isNew: FALSE
  description: Blazer for example
-
  name: JAMStack
  ring: adopt
  quadrant: techniques
  isNew: TRUE
  description: new standard for web architecture, CDN, Microservices
-
  name: Date formatting
  ring: adopt
  quadrant: techniques
  isNew: TRUE
  description: Date-fns or day-js depending on how intensive/widespread date is being used
-
  name: Code splitting
  ring: adopt
  quadrant: techniques
  isNew: TRUE
  description: (fe. Dynamic imports)
-
  name: Internationalization
  ring: adopt
  quadrant: techniques
  isNew: TRUE
  description: FormatJS (react-intl)
-
  name: Azure static web apps
  ring: assess
  quadrant: techniques
  isNew: TRUE
  description: Automatically build and deploy full stack web apps to Azure; Azure Functions
-
  name: Websockets
  ring: assess
  quadrant: techniques
  isNew: TRUE
  description: two way interactive communication between user's browser and server (fe. SocketIO)
-
  name: Service workers
  ring: adopt
  quadrant: techniques
  isNew: TRUE
  description: event-driven scripts that run independently of web pages (fe. push notifications), programmable network proxy.
-
  name: Web workers
  ring: trial
  quadrant: techniques
  isNew: TRUE
  description: run scripts in background threads independently of user-interface scripts, they can perform I/O using XMLHttpRequest.
-
  name: Terminal
  ring: adopt
  quadrant: tools
  isNew: FALSE
  description: Commandline tooling, CLI's
-
  name: Sonarcloud
  ring: adopt
  quadrant: tools
  isNew: TRUE
  description: Analyze repository on code quality & security
-
  name: Gulp
  ring: adopt
  quadrant: tools
  isNew: FALSE
  description: 
-
  name: npm
  ring: adopt
  quadrant: tools
  isNew: FALSE
  description: 
-
  name: Deno
  ring: trial
  quadrant: tools
  isNew: TRUE
  description:  JavaScript/TypeScript runtime built in Rust, secure, supports TypeScript out of the box
-
  name: Esbuild
  ring: trial
  quadrant: tools
  isNew: TRUE
  description: build tool, fast build time
-
  name: Snowpack
  ring: trial
  quadrant: tools
  isNew: TRUE
  description: build tool, fast build time
-
  name: Git
  ring: adopt
  quadrant: tools
  isNew: FALSE
  description: 
-
  name: PostCSS
  ring: adopt
  quadrant: tools
  isNew: FALSE
  description: 
-
  name: Babel 7
  ring: adopt
  quadrant: tools
  isNew: FALSE
  description: Can be relevant in build tooling 
-
  name: Node.js
  ring: adopt
  quadrant: languages & frameworks
  isNew: FALSE
  description: Used in Azure Functions and local prototypes and tooling
-
  name: Lint tools
  ring: adopt
  quadrant: tools
  isNew: FALSE
  description: ESLint, stylelint
-
  name: Visual Studio Code
  ring: adopt
  quadrant: tools
  isNew: FALSE
  description: And team configurations (editor config)
-
  name: Yarn
  ring: hold
  quadrant: tools
  isNew: FALSE
  description: npm/yarn move in same pace - make a choice --> npm
-
  name: ASP.NET
  ring: adopt
  quadrant: platforms
  isNew: FALSE
  description: 
-
  name: Zeplin
  ring: adopt
  quadrant: tools
  isNew: TRUE
  description: 
-
  name: Sketch
  ring: adopt
  quadrant: tools
  isNew: TRUE
  description: 
-
  name: Invision
  ring: adopt
  quadrant: tools
  isNew: TRUE
  description: 
-
  name: Marvel app
  ring: adopt
  quadrant: tools
  isNew: TRUE
  description: 
-
  name: Axure
  ring: adopt
  quadrant: tools
  isNew: TRUE
  description: 
-
  name: Gatsby
  ring: adopt
  quadrant: tools
  isNew: TRUE
  description: 
-
  name: Storybook
  ring: adopt
  quadrant: tools
  isNew: TRUE
  description: 
-
  name: Nextjs
  ring: adopt
  quadrant: tools
  isNew: TRUE
  description: 
-
  name: Google Analytics
  ring: adopt
  quadrant: platforms
  isNew: TRUE
  description: 
-
  name: Google Tag Manager
  ring: adopt
  quadrant: platforms
  isNew: TRUE
  description: 
-
  name: GraphQL
  ring: trial
  quadrant: languages & frameworks
  isNew: TRUE
  description: 
-
  name: OData
  ring: adopt
  quadrant: languages & frameworks
  isNew: TRUE
  description: 
-
  name: Application Insights
  ring: adopt
  quadrant: tools
  isNew: TRUE
  description: 
-
  name: CDN
  ring: adopt
  quadrant: platforms
  isNew: TRUE
  description: