Angular CMS app
Worked on a CMS app made in Angular, using Bootstrap with atomic design principles and in compliance with Section 508 accessibility standards.
Built several unique features including dockable modals, and spearheaded atomic design strategy with integrated style guide, components library, and visual regression testing suite.
Architecture & Workflow
We began with Angular 1.6. As we built our app, we focused on creating reusable services and factories, and relying less on more restrictive controllers; we migrated to 2.0-compatible components later on.
Our front-end workflow included a self-imposed rule to add any new elements to our style guide and component library first, and using them for testing purposes and 508 compliance. Only afterwards did we add any new front-end code to the app itself. This kept our code agile in a very organic manner.
Our team's agile development process was enhanced greatly by a company-sponsored event run by Lance Dacy (thanks, Lance!).
Tech debt sprints were integrated into our process, allowing our code to stay polished. We managed to avoid having any skeletons in our closet when it came time to show off our codebase. This was also crucial to maintaining our atomic design discipline.
In creating our UI/UX codebase, we were influenced greatly by atomic design principles. We broke down every element into the smallest possible chunks of code, then built them back up as context-free as possible.
This technique allowed us to build a library of pieces we could reuse across the app to assemble our more complex components, while keeping our CSS small and maintainable. It also made testing for 508 compliance much easier, as most of the atomic parts' compliance scaled up into the larger components regardless of how we combined them.