Bce.design

screenshot of Bce.design

minimal magic, minimal tooling, essential dependencies, high productivity, no transpilations and no migrations. The Web Components starter ships with integrated lit-html, redux-toolkit and vaadin router components.

Overview

The BCE.Design project offers a powerful, minimalistic approach to developing modern web applications. Designed with high productivity in mind, it leverages native web standards and browser APIs, allowing developers to create robust applications without the constraints of specific frameworks. The emphasis on the Boundary Control Entity (BCE) architecture facilitates clear separation of concerns, ensuring that the application remains organized and manageable as it grows.

This starter kit is ideal for those looking to build non-trivial applications that require efficient state management and easy scalability. With its user-friendly setup and support for modern development tools, BCE.Design simplifies the development process while promoting best practices in coding structure and data flow.

Features

  • Minimal Tooling: Focus on essential dependencies ensures a lightweight footprint, maximizing productivity.
  • High Productivity: Streamlined setup process through tools like browsersync and Vite for quick development feedback.
  • Web Standards Compliance: Built on native Web Components and ES modules, avoiding any framework lock-in and promoting longevity.
  • Unidirectional Data Flow: Implements Redux Toolkit for predictable state management, with data flowing in a clear, one-directional manner.
  • BCE Pattern Implementation: Organizes code into Boundary, Control, and Entity layers, enhancing clarity and easing maintenance.
  • Static Hosting Support: Easily serve your application with options like Quarkus and Amazon S3 for production-ready environments.
  • Custom Elements: Utilize Web Components to create reusable UI components that enhance user interaction.
  • Comprehensive Testing Setup: End-to-end testing with integrated code coverage ensures quality and reliability throughout the development process.
template
Templates & Themes

A template or theme refers to a pre-designed layout or structure that provides a basic framework for building a specific type of application or website. It typically includes good design, placeholder content and functional features, allowing developers to customize and fill in the details according to their specific needs.

Pwa

A Progressive Web App (PWA) is a type of web application that uses modern web technologies to provide a native app-like experience to users, including offline functionality, push notifications, and device hardware access. PWAs can be installed on a user's home screen and launched like a traditional app, but do not require a separate app store listing or download.

Redux

Redux is a state management library for JavaScript apps that provides a predictable and centralized way to manage application state. It enables developers to write actions and reducers that update the state in response to user interactions, server responses, and other events, and can be used with a variety of front-end frameworks and back-end technologies.

rollup
Rollup

RollupJS is a popular and efficient JavaScript module bundler that takes the code from multiple modules and packages them into a single optimized file, minimizing the overall size of the application and improving its performance.