web app architecture 101

8/10/2019 Web App Architecture 101

1/20

www.aestheticio.com

Web App Architecture 101

Learn how you can build better web architectures byfocusing on the fundamentals.

AESTHETIC IO
http://www.aestheticio.com/


2/20

Web App Architecture 101 2 AESTHETIC IO

Copyright 2014 Stephen Young

All Rights Reserved

Feel free to email, tweet, blog, and pass this ebook aroundthe web ... but please dont alter any of its contents when you

do. Thanks!

www.aestheticio.com

www.aestheticio.com


3/20


ContentsContents 3

How you can get ahead by focusing on principles and not technologies 5 Why should you focus on principles and not technologies? 5

Some practical tips. 6

Conclusion 7

15 Questions developers must ask themselves every day. 8

Is there a pattern here? 8

How can I make this simpler? 8

Why does it work like that?

9

Has somebody done this before? 9

Who said it rst? 9

Do I love what Im doing? 10

Where else could I use this? 11

What did I fail at today? 11

How can we make this possible? 11

Who can I learn from? 12

Am I learning the right things? 12

How can I make this more transparent? 13

What is the return on effort? 13

Am I solving the right problem? 13

Does anybody care? 14

Start today 14

12 Attributes of a good web architecture 15

Developer productivity 15 Elegance 15

Usability 16

Security 16

Reliability 16

Performance 17

Scalability 17

Testability 17

Interoperability 18

Transparency and troubleshooting. 18

www.aestheticio.com


4/20

Web App Architecture 101 4 AESTHETIC IOCommunity and Product Growth 18

Deployability 19

Learn how to build damn good web apps 20

www.aestheticio.com


5/20


How you can get ahead byfocusing on principles and nottechnologiesAre you running to stand still?

Well, in our country, said Alice, still panting a little, youd generally get tosomewhere else if you run very fast for a long time, as weve been doing.

A slow sort of country! said the Queen. Now, here, you see, it takes all therunning you can do, to keep in the same place. If you want to get somewhereelse, you must run at least twice as fast as that!

- Lewis Carroll from Alice in Wonderland.

As web app developers you are accustomed to the process of constantly having tolearn and adapt to an ever changing technology landscape. It is obvious that tokeep your skills relevant and competitive you need to always be up to date withthe latest technologies.

Why should you focus on principles and nottechnologies?

If all you are doing is learning each new technology as it comes out what you aredoing is running as fast as you can just to stand still. You need to run faster than

that!

So how do you do this?

By looking for the underlying principles and driving forces behind newtechnologies. Technologies are coming out at an ever increasing pace. If you payattention you will start to notice the underlying trends that drive this relentlessinnovation.

What do DCOM, CORBA and Webservices have in common? One similarity is thatthey are all RPC mechanisms. Each one progressively tries to be more and more

www.aestheticio.com


6/20


platform agnostic. They are very different beasts yet they share a few corecharacteristics.

Since they share characteristics you can safely assume that they will also havesome of the same problems in your web app. How do you handle versioning of theRPC call? If you have a large distributed team, how do you limit uncontrolledgrowth of your remote APIs?

The more you focus on the underlying similarities the larger head start you willhave the next time something new comes along.

By all means learn those new web app technologies but dont just learn the newAPI, try understand what makes this new solution unique (if anything). Try seehow this new solution is just a re-incarnation of a previous one. Over time as youdo this you will gain perspective.

Principles like information hiding, decoupling, simplicity and the like are universaland change very slowly if at all. Technologies like Microsoft Application Blocks,Ruby on Rails, the latest IoC container change at a break neck pace.

Some practical tips.

Here are a few tips to keep in mind as you learn a new technology.

Try to answer these questions about each new technology you learn:

Which older technologies was this inspired by? Which problems is it trying to solve? Which other new technologies are also solving the same problems?

How are all these technologies similar? How do they differ?

Then try to complete this sentence in as few words as possible:

Just like is . Unlike previous attempts is by .

www.aestheticio.com


7/20


Conclusion

Any good web app developer eventually starts seeing these trends just based ondepth of experience. You can get a head start by actively paying attention.

Are you happy with running to stand still or do you want to get ahead of the pack?

The choice is yours.

www.aestheticio.com


8/20


15 Questions developers must askthemselves every day.So you want to be a great developer?

Well then its time to put down that Learn Super Duper Language v8.3 in 24 hoursbook. Instead, make it a habit to ask yourself these 10 questions every day.

Is there a pattern here?

Looking for patterns in what works and what doesnt work leads to discovering theunderlying principles that drive seemingly unrelated concepts and behaviours. Toget a deeper understanding of the work that you do make it a habit of askingyourself Is there a pattern here?.

This applies to more than just your code. Is there a pattern in the types of changesrequested by business? Is there a pattern in the way technologies evolve? Are youseeing the same types of bugs popping up again and again?

To understand is to perceive patterns- Isaiah Berlin

How can I make this simpler?

Often as developers we want to produce complex and scalable solutions. Making

something tremendously complex makes you feel like the master of your universe.The problem is that you will never be able to predict how your product andbusiness is going to change in the future.

Architecture and coding is much more like gardening than architecture. You needto be able to adapt to an ever changing environment. The more complex yoursolution the more difficult this becomes.

Simplicity is the ultimate sophistication.- Leonardo da Vinci

www.aestheticio.com


9/20


Why does it work like that?

Knowing that something works and knowing why it works that way are two verydifferent things. If you know why something behaves the way it does you are able

to make significantly better decisions.

The difference between a great coder and somebody who knows a programminglanguage is the depth of understanding that comes from understanding why.

The same principle applies when fixing an issue. Just restart the service. Haveyou tried rebooting it? We have all said something along those lines when aproblem pops up. Every time you say something like that you lose a goldenopportunity to learn.

Understanding why something broke allows you to fix the root cause andeliminate this class of issues permanently. At the very least you wont make thesame mistake again.

Has somebody done this before?

Whenever you find yourself inventing a complex algorithm you are probably on thewrong track. Unless you are busy researching a PHD thesis chances are extremelygood that somebody else has already solved this problem.

Need to write an algorithm to add a label to the item closest to a users mouse?Have a look at Voronoi Tesselations. Want to find the shortest path for a deliverytruck? Look at Dijkstra. Want to find tags similar to the one the user just entered,

how about figuring out its Levenschtein distance.

Those are just a few examples but trust me, they are everywhere.

If I have seen further it is by standing on the shoulders of Giants.- Isaac Newton

Who said it rst?

www.aestheticio.com


10/20


So you think you know REST right?

Have you read Roy Fieldings original paper describing REST and do youunderstand its intended purpose? That blog post by that guy who has 5 minutesmore experience than you using the REST API generation wizard in Super cool IDEv7 doesnt count.

Do yourself a favour and always try read the original source of a concept or theory.Then by all means go read the latest developments by industry thought leadersbut if you dont know where they started how can you follow where they are going?

Do I love what Im doing?Lets face it programming is hard.

Besides being hard programming is constantly evolving. The state of the artframework from 2 years ago is a clunky dinosaur by todays standards. To stay atthe top of your game you will need to commit to a lifelong process of learning andresearch.

If you dont love what you are doing you dont have a hope in hell of keeping upwith the guys who do. So find out what kind of coding gets you fired up. Dontdecide to become a security specialist because there is a gap in the market orbecause it pays well, dont become a UX expert just because an article just cameout in WIRED saying that UX is the hottest job in tech.

Ill say it again, do what you love.

Do what you love and the necessary resources will follow.- Peter McWilliams

www.aestheticio.com


11/20


Where else could I use this?

One of the biggest limits I see developers placing on themselves is a failure ofimagination.

If we learn something in a specific context or see a technique used to solve aspecific problem we assume thats the only place it applies. This is almost alwayswrong. Every time you learn something new ask yourself: Where else could I usethis?.

Found great new positioning methods to place nodes on a graph, how aboutapplying that same technique to find interesting data points in a dataset that has2 dimensions? Found a cool way to send data over websockets from the client tothe server? How would this apply in making a scalable set of backend services?Sometimes you will be wrong, but sometimes you will be right.

Logic will get you from A to Z; imagination will get you everywhere.- Albert Einstein

What did I fail at today?One of the easiest ways to increase innovation is to lower the cost of failure.

The game developing company Valve has embraced this like few others. The sameapplies to your progression as a developer, if you are afraid to fail you will nevermake those big breakthroughs.

Be brave, try something, fail, learn and try again.

Do not fear mistakes. You will know failure. Continue to reach out.- Benjamin Franklin

How can we make this possible?

In the world we live in there really is very little that is impossible (with a fewexceptions).

www.aestheticio.com


12/20

Web App Architecture 101 12 AESTHETIC IO Start from the assumption that whatever you want to do is possible and then workyour way back. You might find that what you wanted to do is impractical for thetime being but with the pace of change in todays world, it might become practicalsooner than you think.

It always seems impossible until its done.- Nelson Mandela

Who can I learn from?

You should never work anywhere where you are the smartest person in the room.

Pick jobs and companies where you can work with people who inspire you andchallenge you to be better. It doesnt have to be coding related, there is a worldoutside your text editor and the command line. Learn things from other fields andfind ways to apply it in your job.

Being competent isnt good enough anymore.

Am I learning the right things?

I assume you are already actively learning.

You wouldnt be reading this post if you didnt want to learn. Are you learning theright things though?

People often tell me: Im learning a new language and they invariably mentionanother language just like the one they already know. If you have a toolbox full ofhammers rather invest in a screwdriver.

If you know OO, learn a functional language. I recommend Haskell since there is noway to cheat, be warned, your brain might melt a little.

If you have those 2 under the belt check out a logical language like Prolog. Makesure you know a dynamic language like Ruby. And if you get a chance check outAPL. Its beautiful.

www.aestheticio.com


13/20

Web App Architecture 101 13 AESTHETIC IO How can I make this more transparent?

The hardest part of fixing a problem is finding it.

Do everything in your power to make your solutions transparent. Write lavish logs,throw exceptional exceptions, make your code clean and sparkly.

Every time you struggle to find a problem make sure the next guy can find it withless effort.

What is the return on effort?

Everything comes at a cost. Not writing that unit test buys you a few minutes rightnow but at what cost later on? Taking a week to research existing algorithmsmight save you 3 months in development time by the end of the project.

If it takes you 20 minutes to do a deployment and you do 10 deployments a week,how long until taking those 3 hours to automate it is paid back?

That plugin framework that might possibly save you 2 days one day. Does it makethe things you do everyday take 5 minutes longer? How long until those 5 minutesadd up to more than those mythical 2 days?

This is a marathon, not a sprint.

Am I solving the right problem?

Writing a script to periodically restart a service to improve stability is awesome.Whats even more awesome is fixing the memory leaks that make the servicecrash.

Created a marvellous multi threaded app to generate 20 concurrent crystalreports? Nice! Why not investigate a switch to XSL-FO so each report doesnt take

3 years to generate.

www.aestheticio.com


14/20


Question everything.

If you get a set of requirements that dont solve the right problem. Speak up! Youare more than a code typist, you are a problem solver.

Does anybody care?

This is probably the most important one of the lot.

If what you are building doesnt make somebodies life better, gives them moretime, saves them money.

Why are you doing it?

Start today

I know this list is long and it might seem like a lot to take in.

You dont have to do it all at once though. Try this; find somebody you work withwho is also on a mission to be the best they can be. Pick one question per weekand commit to asking each other that question at least once a day. Think aboutyour answers, be honest, be better.

Good luck!

www.aestheticio.com


15/20


12 Attributes of a good webarchitectureSo you have a working web app but is the architecture any good?

While every solution is unique there are a few attributes that any good architectureshould display. If you have been asking yourself the questions I listed previouslyyou should have a solution that shows most of these attributes.

Have a look at your last web app and see how it scores on the list of 10 qualityattributes below.

Developer productivity

Since smart people are the most precious resource you have any framework orarchitecture we adopt needs to help optimize developer productivity time.

Attributes:

Simplicity Concise but not obtuse Standardized way of doing things Great supporting tools Short feedback loops Expressiveness Quality 3rd party packages?

EleganceThe elegance of the solution speaks to how well the solution fits the problemspace and how coherent the solution is.

Attributes Consistent way of solving a problem. The most common tasks are the easiest to do. Clear guidance on how to make architectural choices. Easily extendable in the appropriate places. As simple as possible but no simpler.

www.aestheticio.com


16/20


Strong cohesion / low coupling The problem space forms a large percentage of the frameworks solution space

Usability

Usability is vitally important for a number of reasons. It improves trust, customersatisfaction and reduces support costs. Any technology you use should allow youto build a world class user experience.

Attributes No vendor specific technologies Support the latest standards Must provide fast response times in the UI Allow for use of graphic and charting capabilities Allow animation where appropriate Must support A/B testing Must support analytics

Security

Security is the capability of a system to reduce the chance of malicious oraccidental actions outside of the designed usage of the system, and preventdisclosure or loss of information.

Attributes Passes 3rd party penetration tests Uses security standards wherever possible Follows security best practices.

Reliability

Reliability is the ability of a system to continue operating in the expected way overtime. Reliability is measured as the probability that a system will not fail and thatit will perform its intended function for a specified time interval

Attributes It doesnt crash Autonomic when it crashes it heals itself No single point of failure

www.aestheticio.com


17/20


Performance

Performance is an indication of the responsiveness of a system to executespecific actions in a given time interval. It can be measured in terms of latency or

throughput. Latency is the time taken to respond to any event. Throughput is thenumber of events that take place in a given amount of time.

Attributes Support an appropriate level of performance. Low latency to the UI (< 250 ms for 90% of requests,,


18/20


Interoperability

Do you play well with others? Communication protocols, interfaces, and dataformats are the key considerations for interoperability. Standardisation is also an

important aspect to be considered when designing an interoperable system.

Attributes Use open standards where available. Publish standards where not available. Provides you with many options when selecting 3rd party systems

Transparency and troubleshooting.

When something goes wrong how easy is it to track down the error and re-produceit?

Attributes All errors and important events are logged in a meaningful way Easily comprehensible stack traces All data needed to re-produce an error is included in the log

Debug logs can be turned on and off It should be easy to trace an error all the way through the application.

Community and Product Growth

There should be a strong community behind the product you are using. Havingother people who have already solved the problems you are facing is a majorfactor in how easy a product or framework is to live with.

Attributes Many plugins and open source projects related to the framework Active repo on github if its open source Lots of questions and answers on stack overflow. A Google trends graph that is going up and to the right. Many books, blogs and tutorials.

www.aestheticio.com


19/20


Deployability

Deployment and propagation through different environments is a huge cost. Aproduct that is difficult to deploy requires longer release cycles and makes it

harder to respond to change or fix bugs.

Attributes Automated scriptable deployments Automated tests are easy to write. Fast build times. File based configuration or easily scriptable configuration. Small physical size. Licensing should not prevent multiple environments. Easy rollback

Next time you evaluate a web stack or your app design go through this list and trysee if you can tweak your design to tick more of the boxes outlined above.

www.aestheticio.com


20/20


Learn how to build damn goodweb appsBuilding world class web apps is hard.

Trust me I know, I have been building web apps for the last 15 years. There is amassive amount to know and a new technology comes out almost on a dailybasis. This site isn't for people looking for a silver bullet. It's for those of you who

love the web and are willing to put in the time and effort required to build your skillset. In the free member library I try and point you in the right direction.

With the eBooks in the library I help you focus on the right things so you don'twaste your time.

You will learn:

How to be better at learning and get a head start. How focusing on principles gives you an unfair advantage. How to build skills outside your current role and become more marketable.

Click the Free Registration button below, choose your username and password,and sign up for our free membership library. You will get instant access to ebooksabout every facet of building damn good web apps.

www aestheticio com

Free Registration

Click Here to nd out more
http://aestheticio.com/free-member-libraryhttp://aestheticio.com/free-member-libraryhttp://aestheticio.com/free-member-libraryhttp://www.aestheticio.com/http://aestheticio.com/free-member-library

web app architecture 101

Documents