Skip to content
This repository has been archived by the owner on Jan 11, 2023. It is now read-only.

robatwilliams/enforce-frontend-architecture

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 

Repository files navigation

Enforce frontend architecture

ArchUnit for JavaScript doesn't exist. What can we do about that?

Use cases

Dependencies

Restrict dependencies between certain parts of the application. Don't use that from there.

Restrict where certain libraries can be used from. Don't use jQuery in new areas.

Restrict where certain browser APIs can be used from. Don't fetch() directly from UI components.

Restrict where certain data types can travel. Don't pass Backbone model to React component.

Prohibit cyclic dependencies.

Structure

Require a certain kind of structure in certain places. Those should all look like this.

Restrict where certain types of files can exist. Don't put that there.

Build-time

Restrict which bundles certain parts of the application end up in. Don't ruin code splitting via accidental transitive imports.

Defining the rules

Define what is allowed, what is not allowed, or both. Anything is ok except this, vs. only this is ok.

Provide an explanation as to why a restriction exists. So you remember, so someone doesn't remove it or add an ignore without understanding it (see: Chesterton's fence), to suggest alternatives when a violation occurs.

Make exceptions to the rules. For special cases, or things which have become entangled with absolutely everything, it's less repetitive to have an exception than to have lots of ignores.

Violations

Ignore a violation. There may be good reason, or it might be pre-existing.

Require justification for ignoring a violation. Documentation, encourages thinking. Distinguishes acceptable exceptions from pre-existing problems to avoid the latter being taken as precedent.

Conveniently ignore pre-existing violations when applying to an existing codebase. Start enforcing the future without first needing to finish soring out the past. There may be hundreds, or thousands.

Usage

Display violations in the editor/IDE. Like ESLint.

Use with TypeScript or Flow, which may be necessary for some features.

Use with a bundler, which may be necessary for some features.

Existing capabilities

Releases

No releases published

Packages

No packages published