Agile Design

How can you design the software which is built in tiny increments?

How can you ensure that the software has a good structure which is flexible, maintainable and reusable?

ARE'NT YOU GOING TO MISS THE BIG PICTURE?

Not really! In an agile team, the big picture evolves along with the software.

How? With each iteration, the team improves the design of the system so that it is as good as it can be for the system as it is now. They focus on the current structure of the system, making it as good as it can be.

How do we know if the design of software is good?

Avoiding these following symptoms of poor design (design smells) should be a way.

1. Rigidity - The design is hard to change.
2. Fragility - The design is easy to break.
3. Immobility - The design is hard to reuse.
4. Viscosity - It is hard to do the right thing.
5. Needless Complexity - Overdesign
6. Needless Repetition - Mouse abuse
7. Opacity - Disorganized expression

These symptoms are similar in nature to code smells, but they are at a higher level. They are smells that pervade the overall structure of the software rather than a small section of code.

How to avoid design smells?

The principles of object-oriented design that help developers eliminate design smells and build the best designs for the current set of features.

1. SRP - The Single Responsibility Principle
2. OCP - The Open-Closed Principle
3. LSP - The Liskov Substitution Principle
4. DIP - The Dependency Inversion Principle
5. ISP - The Interface Segregation Principle

These principles are not the product of a single mind, but they represent the integration of the thoughts and writings of a large number of software developers and researchers.

Agile teams apply principles to remove smells. They don't apply principles when there are no smells.

Often, a design smell is caused by the violation of one or more of the principles.

Principles are not a perfume to be liberally scattered all over the system. Overconformance to the principles leads to the design smell of Needless Complexity.

Reference:
Image result for agile software development book

Image result for agile software development book

Robert C.Martin, Agile Software Development, Principles, Patterns, and Practices; Section 2, Agile Design.

Comments

Styling Sort Icons Using Font Awesome for Primefaces' Data Table

So far, Primefaces has used image sprites for displaying the sort icons. This leads to a problem if we want to make a different style for these icons; for example, I would make the icon "arrow up" more blurry at the first time the table loading because I want to highlight the icon "arrow down". I found a way that I can replace these icons with Font Awesome icons. We will use "CSS Pseudo-classes" to achieve it. The hardest thing here is that we should handle displaying icons in different cases. There is a case both "arrow up" and "arrow down" showing and other case is only one of these icons is shown. .ui-sortable-column-icon.ui-icon.ui-icon-carat-2-n-s { background-image: none; margin-left: 5px; font-size: 1.1666em; position: relative; } .ui-sortable-column-icon.ui-icon.ui-icon-carat-2-n-s:not(.ui-icon-triangle-1-s)::before { content: "\f106"; font-family: "FontAwesome"; position: ...

[Snippet] CSS - Child element overlap parent

I searched from somewhere and found that a lot of people says a basic concept for implementing this feature looks like below: HTML code: <div id="parent"> <div id="child"> </div> </div> And, CSS: #parent{ position: relative; overflow:hidden; } #child{ position: absolute; top: -1; right: -1px; } However, I had a lot of grand-parents in my case and the above code didn't work. Therefore, I needed an alternative. I presumed that my app uses Boostrap and AngularJs, maybe some CSS from them affects mine. I didn't know exactly the problem, but I believed when all CSS is loaded into my browser, I could completely handle it. www.tom-collinson.com I tried to create an example to investigated this problem by Fiddle . Accidentally, I just changed: position: parent; to position: static; for one of parents -> the problem is solved. Look at my code: <div class="modal-body dn-placeholder-parent-positi...

JSF, Primefaces - Invoking Application Code Even When Validation Failed

A use case I have a form which has requirements as follow: - There are some mandatory fields. - Validation is triggered when changing value on each field. - A button "Next" is enable only when all fields are entered. It turns to disabled if any field is empty. My first approach I defined a variable "isDisableNext" at a backend bean "Controller" for dynamically disabling/enabling the "Next" button by performing event "onValueChange", but, it had a problem: <h:form id="personForm"> <p:outputLabel value="First Name" for="firstName"/> <p:inputText id="firstName" value="#{person.firstName}" required="true"> <p:ajax event="change" listener="#{controller.onValueChange}" update="nextButton"/> </p:inputText> <p:outputLabel value="Last Name" for="lastName"/> <p:i...

How to convert time between timezone in Java, Primefaces?

I use the calendar Primefaces component with timeOnly and timeZone attributes for using only hour format (HH:mm). Like this: <p:calendar id="xabsOvertimeTimeFrom" pattern="HH:mm" timeOnly="true" value="#{data.dateFrom}" timeZone="#{data.timeZone}"/> We can convert the value of #{data.dateFrom} from GMT/UTC time zone to local, conversely, from local time zone to GMT/UTC time zone. Here is my functions: package vn.nvanhuong.timezoneconverter; import java.text.ParseException; import java.text.SimpleDateFormat; import java.util.Calendar; import java.util.Date; import java.util.TimeZone; public class TimeZoneConverter { /** * convert a date with hour format (HH:mm) from local time zone to UTC time zone */ public static Date convertHourToUTCTimeZone(Date inputDate) throws ParseException { if(inputDate == null){ return null; } Calendar calendar = Calendar.getInstance(); calendar.setTime(inputDate); int ...

Build Dynamic Forms in AngularJS Directives

We wanted to build a dynamic form that has some types of elements such as text field, text area, label, date picker, combobox, file uploader, etc. Beside that, the form is dynamic because basing on the provided configuration data, it should render our expected GUI. We conducted a research with two options: building our own directives or using a third-party directives. - Approach 1: using a third-party directives + Google keyword: " build dynamic forms directives + angular third party " + This idea met our idea: " http://blog.backand.com/build-dynamic-forms/ ", but it's not free to use. + This 3rd-party was possible: http://schemaform.io/ Schema form hello world app: http://plnkr.co/edit/7Oqxxl?p=info - Approach 2: building our own directives We chose this approach because it looks more simple than using "schema form" 3rd-party and we thought that we can confidently handle it. Example: http://codepen.io/cavoirom/pen/meJBxv?edit...

vhandit

Search This Blog