Challenges of

Building Enterprise Apps

Doguhan Uluca

Principal Fellow  at

@duluca

Modern Software Delivery, GenAI, CyberSecurity

2024

engineering

problem

solution

problem

solution

problem

architecting

Personal development

Enterprise development

Amount of Learning and Expertise Needed

Tech 1

Tech 2

Tech 3

Tech 5

Tech 4

Tech 6

Tech 7

Tech 8

Tech 9

Tech 10

500 xp

 400 xp
200 xp
100 xp

1,000 xp

750 xp

5,000 xp

200 xp

300 xp

8,450 xp

Sandbags of Complexity

features

Features

Time

Quality

Roy Osherove

the enterprise

the Sinkhole effect

everything is fine

until

it's not

learn when and how to say no

Building Enterprise Apps

  1. Succeeding as a technologist
  2. Deliver a value stream
  3. Embrace AI
  4. Adopt the new Angular
  5. Be disciplined and balanced

Succeeding as a technologist

1

What's the #1 ingredient?

people

Understand the Business Impact

  1. How critical is the success of this project to the business?
  2. What are the consequences of failure?
  3. What does it mean to fail?
  4. Which features will deliver the most value?
  5. What are the parameters you must operate under?
  6. What’s negotiable and what’s not?
  7. Is there a Business Impact Analysis in place?

Set Parameters of Success

  1. Align strengths and passion to project needs
  2. Balance experimentation with execution
  3. Treat the project as a journey
  4. Know where the guard rails are

Show Elastic Leadership

  1. Play your role
  2. Don't be static, be elastic
  3. Understand the state of your team
    • Survival - dictator or protector
    • Learning - coaching
    • Self-organizing - facilitator or servant leader

No plan survives first contact with the enemy

Moltke the Elder

Plans are of little importance, but planning is essential

Churchill & Eisenhower

Agile

Agility

Deliver a repeatable value stream

2

GitHub Flow

Branch

Commit

Open Pull Request

Discuss and Review

Deploy

Merge

  • enforce coding standards

  • ensure high test coverage

  • isolate changes

  • make it repeatable

Branch

Merge

Ship

The Configuration Gap

  • adopt Infrastructure-as-Code

  • script everything

  • scan libraries and containers 

  • achieve DevSecOps

  • close the configuration gap

  • push button deployments

  • ephemeral test environments

  • go serverless

  • repeatable integration

Adopt Reliable Engineering Practices

  • High cohesion & Low coupling
  • DRY
  • KISS
  • AC/DC
  • Self-documenting code
  • Unit Testing
  • SOLID
  • Stateless & Data-Driven
  • Shift complexity to the back
  • Iterative & Incremental
  • Leverage OOP and reactive coding appropriately

Optimize architecture

Router-First Architecture

the 80-20 solution

The Pareto Principal

What is Router-First Architecture?

  • enforce high-level thinking
  • ensure consensus on features, before you start coding
  • plan on your codebase/team to grow
  • introduce little engineering overhead

A way to

  1. Develop a roadmap and scope
  2. Design with lazy loading in mind
  3. Implement a walking-skeleton navigation experience
  4. Achieve a stateless, data-driven design
  5. Enforce a decoupled component architecture
  6. Differentiate between user controls and components
  7. Maximize code reuse

How to implement Router-First?

Embrace AI

 

3

Overcome the FUD

  • Adopt it holistically
  • Be transparent, responsible, fair, and ethical
    • Enforce this with a company policy
  • Replace tasks, not jobs
    • Automate annoying tasks
    • Translate and refactor code
  • You're the "Final goods assembler"

Origins of Code

Succeeding with GenAI

  • Be transparent
  • Replace tasks, not jobs
  • Responsible, fair, and ethical use is key
  • You're the "Final goods assembler"
  • Adopt it holistically

DevSecOps is Key

Engineer owns code creation

Code Review & Static Analysis

Automated Validation in CI pipeline

Gated deployments with CD

, forward flow

consistent

of features

It's up to you to deliver a quality product

Adopt the new Angular

4

Runtime performance

  1. First Contentful Paint (FCP): Measures the time from page start to the first visual content displayed
  2. Time to Interactive (TTI): Measures a page’s load responsiveness and helps identify where a page looks interactive but isn’t
  3. Latency: The delay between a user’s action and its response
  4. Frame drops: Occurrences when frames can’t be generated fast enough to render a UI smoothly

Understand resumability

Hydration

Ready

Ready

Resumable

Bind listeners

Parse & execute JS

Download all page JS

Get HTML

Get HTML

Understand resumability

Other frameworks have good ideas:

  • Qwik.js
  • Arrow.js
  • Analog.js

Adapted from Michael Hladky

Master change detection

zone

.js

TICK

UPDATE

_

Idling

Dirty marking

Rendering

OnPush helps performance

Idling

Dirty marking

Rendering

Adapted from Michael Hladky

Using rxAngular is time travel

Idling

Dirty marking

Rendering

_

Adapted from Michael Hladky

Something, something...

zoneless change detection

Ditch Observables and RxJS*

  • Signals
  • Control Flow
  • NgRX/SignalStore
  • SignalState

In favor of: 

In favor of: 

*To the extent it's possible and sensible

Angular Tips 

  • Understand resumability
  • Write zoneless compatible code
  • Avoid RxJS and Observables

Be Disciplined and Balanced

5

Consider the larger problem space

  1. The size of our app
  2. The reason we are developing the app
  3. The skill level of developers
  4. Iterative and incremental delivery
  5. The constant forward flow of features
  6. Cloud architecture, operational costs, and cybersecurity

In building for the enterprise, you must consider:

only you can deliver

quality code

We're hiring, including fully remote positions!

Challenges of Building Enterprise Apps in 2024

By Doguhan Uluca

Challenges of Building Enterprise Apps in 2024

At scale everything breaks. All the Angular and React in the world can't help, when even laws of physics break down at different scales. Qwik is an upcoming new framework to build web applications with O(1) scalability. It forgoes hydration in of favor resumability and embraces server-side-rendering in a seamless/magical way. Qwik has plans to implement React and Angular integrations in the future, so this is definitely a framework to watch and experiment with.

  • 53