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
- Succeeding as a technologist
- Deliver a value stream
- Embrace AI
- Adopt the new Angular
- Be disciplined and balanced
Succeeding as a technologist
1
What's the #1 ingredient?
people
Understand the Business Impact
- How critical is the success of this project to the business?
- What are the consequences of failure?
- What does it mean to fail?
- Which features will deliver the most value?
- What are the parameters you must operate under?
- What’s negotiable and what’s not?
- Is there a Business Impact Analysis in place?
Set Parameters of Success
- Align strengths and passion to project needs
- Balance experimentation with execution
- Treat the project as a journey
- Know where the guard rails are
Show Elastic Leadership
- Play your role
- Don't be static, be elastic
-
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
- Develop a roadmap and scope
- Design with lazy loading in mind
- Implement a walking-skeleton navigation experience
- Achieve a stateless, data-driven design
- Enforce a decoupled component architecture
- Differentiate between user controls and components
- 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
- First Contentful Paint (FCP): Measures the time from page start to the first visual content displayed
- Time to Interactive (TTI): Measures a page’s load responsiveness and helps identify where a page looks interactive but isn’t
- Latency: The delay between a user’s action and its response
- 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
- The size of our app
- The reason we are developing the app
- The skill level of developers
- Iterative and incremental delivery
- The constant forward flow of features
- 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!