Skip to main content

Posts

JSF 2 - Dynamically manipulating the component tree with system events

Let's suppose we want to modify the metadata (attributes)  of elements such as render, requried, maxlength but we do not define in JSF tags. The manipulating components can be conducted in Drools files, for example. How could we do? I think that is what we need to change something of component tree during JSF life-cycle.


JSF supports event handling throughout the JSF life-cycle. In this post, I use two events: postAddToView for scanning components tree and preRenderView for manipulating the meta of components before rendering to GUI.

I modified my own project from previous post for this example. This is my first further JSF trying out with the project as I said before. :)

We define the tags f:event below the form - a container component of the components which we want to work on. The valid values for the attribute type for f:event can be found from tag library document of JSF 2.

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:f="http://java.…

The HelloWorld example of JSF 2.2 with Myfaces

I just did by myself create a very simple app "HelloWorld" of JSF 2.2 with a concrete implementation Myfaces that we can use it later on for our further JSF trying out. I attached the source code link at the end part. Just follow these steps below:

1. Create a Maven project in Eclipse (Kepler) with a simple Java web application archetype "maven-archetype-webapp". Maven should be the best choice for managing the dependencies, so far. JSF is a web framework that is the reason why I chose the mentioned archetype for my example.

2. Import dependencies for JSF implementation - Myfaces (v2.2.10) into file pom.xml. The following code that is easy to find from http://mvnrepository.com/ with key words "myfaces".

<dependency> <groupId>org.apache.myfaces.core</groupId> <artifactId>myfaces-api</artifactId> <version>2.2.10</version> </dependency> <dependency> <groupId>org.apache.myfaces.core</groupId&g…

How to apply Lean - Kanban for your business

This is the topic of Scrum Breakfast meetup this time, speaker: Ms. Phuong Bui - Technical Project Manager of YOOSE Pte. Ltd.

http://www.meetup.com/Scrum-Breakfast-Vietnam-Agile-and-Scrum-Meetup/events/230313727/
Lean comes from Lean manufacturing is a method that focuses on elimination of wastes. In other words, this is a set of principles for archiving the quality, speed and customer alignment. The first time I knew about the term "Lean" is  from the book Software Craftsmanship. Sandro recommends if we want to transform our pet projects into a real business, we should get familiar with Lean Startup concepts.

In this talk, Ms. Phuong pointed out some major wastes includes information (ex: unclear requirements), processes (ex: waiting), physical environment and people. Knowing what the problems should be the best way to eliminate them.

The difference between Single item flow and Batch processing is the second main point; and it is the Lean's idea. Batch processing perform…

A simple way to mock objects without using mock unit testing framework

When writing unit test, there are some cases that I have to mock objects:
It makes sense to mock provided objects by libraries (APIs) such as FacesContext (JSF) because of no real environment running. It makes sense to mock a lower layer objects and it is already tested, for example: mocking Dao layer objects when testing Service layer (Service calls Dao). At beginning I was aware of Mockito (a mocking framework) in order to overcome the issue. And currently, I am interested in another way like an alternative because it looks more simple. That is just create mock objects manually and just do anything we want. I've just known this approach from Primefaces' source code. :)

Follow my simple example below and we can see what different from these 2 ways are:

I have an interface Foo and a class Bar

public interface Foo { String greet(); } public class Bar { public String greet(Foo foo){ return foo.greet(); } }
Using Mockito example:

public class MockitoExampleTes…

Agile Testing - A defense system from my team stories

Today, I love to tell you about my team story about testing. That started from no testing to extreme testing system.

Guess what? That is really an exciting idea from the picture(no?). These devices can work with Jenkins. Whenever they build a Jenkins job, this system notifies instantly to developers the status of their system.


That is not 100% related to testing but somehow it is like our testing mindset. Because, in my team,  we call our testing system is a defense system :). There is no doubt that it is very hard for us to remember all features of our applications even which is developed for a long time. Like a document, tests help us make sure no features will be lost after changes such as adding new more features, fixing bugs or refactoring code.

That was the reason why we cared much about testing. It was really important for developing apps. Back then, we thought about how to test effectively.
The "testing pyramid" points out that basing on the efforts, the agility of …

Resolution for 2016

This is the topic of HMC full stack developers' meetup this time. We have shared our ideas and discussed about them. Most of discussions is focused on career path for developers in Vietnam and what next we will do in 2016.
I have a problem with my career path in Vietnam. I seem to get lost my motivation because I don't like to become either a manager or a TA (such as Technical Assistant, Technical Analysis, Technical Architect).
But, why only are there either manager or TA in Vietnam? How about a 60-years experiences developer? Salary is actually an issue.
I admire several great developers in the world such as Jeff Atwood (stackoverflow.com founder), John Sonmez (simpleprogrammer.com fouder). They created very great and valuable stuffs for the community and they are free of finance - of course, I think. Why can't I follow that way? I would like to not only create cool stuffs but also get high salary.
I love to become a "many years" developer. Coding is one of my …

Software Craftsmanship by Sandro Mancuso

Source: http://www.goodreads.com/book/show/18054154-software-craftsmanship
My first time to know about the term "Software Craftsmanship" is from Agile Tour Vietnam 2015. I finally read this book written by Sandro Mancuso who I met at this event.

Software Craftsmanship is a metaphor for software development: software as a craft and developers as blacksmiths. In other words, Software Craftsmanship is about professionalism in software development.

The Software Craftsmanship manifesto:
Not only working software, but also well-crafted software: regardless how old the application is, developers can understand it easily; high an reliable test coverage, clear and simple design, business language well expressed in the code.Not only responding to change, but also steadily adding value: constantly improving the structure of the code, keeping it clean, extendable, testable, and easy to maintain; always leave the code cleaner than we found it.Not only individuals and interactions, but al…

Brainstorming camp

My team just started  building a new project about finance. There are something new with us rather than other processes happened before. Here is we didn't have requirements/user stories about the project yet and we needed to work together with another team in this time. Our product manager (PM) decided to have a camp to collect the ideas in order to getting started as well as make the communication between the teams.

Firstly, our PM gave an introduction about the project to all members. Then, we decided to split and focus on four topics that we needed to discuss about them. They are:
- General information: working agreements between two teams included coding convention.
- Data model: structure of data.
- GUI design: user interface and user experience (UX).
- GUI technical framework: how data model and GUI can be worked together.

The target of each topics should be given an overview and can be shown why and how to work with chosen approach. Finally, we separated all members from o…

BarcampSaigon 2015

Barcamp Saigon is one of my most expected events of the year. This year, it took place at RMIT university. As usual, it brought many useful topics to the community. Here is all topics that I have attended. Scale it! - Lars Jankowfsky Lars is founder of 8bitrockr.com
How do we make a decision correctly? It is hard to know that until we try and measure it. He gave an example about how good an app was. And, most of people thought that the app with nice user interfaces is good at the first look. But it is not correct because it is only true until we try to use it, even the nice GUI app sometime is not good at UX, functionalities, etc.
The key of success for working in team is collaboration. We can not only base on the experience of members likes: "In my opinions| As I know.... this is the best way..bla..bla.." but we should test it. Therefore, manually testing as well as automation testing is more and more necessary nowadays.
"Don't think, just try" - he said. She…

Agile Tour Vietnam 2015 in HCMC

I had a chance to join this event today. It was great! Agile Tour Vietnam 2015 in HCMC

For who don’t know Agile Tour, the following is the basic information from http://at2015.agiletour.org/ “Agile Tour has been a way for enthusiasts of Agile to spread the word about Agile practices and to share their experiences, both good and bad, within their local community. These non-profit events occur every year in October and November in several cities.” Many valuable topics were shared to the community. The topic I like best is “Software Craftsmanship” from Mr. Sandro Mancuso. “Software craftsmanship” is an approach to software development that emphasizes the coding skills of the software developers themselves (wikipedia). I would like to share with you my notes about it: Agile is actually “a quick feedback loop”. For example, we review the user stories after 2 weeks, we will get feedback; we apply TDD, we will  get feedback immediately, etc.Scrum, a Agile framework, is one main stream of Agile’s …

AngularJS - Build a custom validation directive for using multiple emails in textarea

AngularJS already supports the built-in validation with text input with type email. Something simple likes the following:
<input name="input" ng-model="email.text" required="" type="email" /> <span class="error" ng-show="myForm.input.$error.email"> Not valid email!</span>
However, I used a text area and I wanted to enter some email addresses that's saparated by a comma (,). I had a short research and it looked like AngualarJS has not supported this functionality so far. Therefore, I needed to build a custom directive that I could add my own validation functions. My validation was done only on client side, so I used the $validators object.

Note that, there is the $asyncValidators object which handles asynchronous validation, such as making an $http request to the backend.

This is just my implementation on my project. In order to understand that, I supposed you already had experiences with Angular…

9 Most important characters of business emails in English

1. Clarity

- The content should be simple, easily to follow, short words rather than long one.
- Use the active voice, positive words rather than complaint one.

 2. The "One Thing" rule

- Keep the message focused. The another thing should be written in another email.

3. Be political

- The message is in more the two paragraphs, it should be reduced.
- Use "Please" and "thank you"
- Use phrase that states you are not sure of something: I think that..., It is possible..., The optimal solution...

4. Meaning Subject

Bad: Important. Please read
Better: Meeting set for tomorrow at 10AM - Need a room

5. Think before you write

- Don't send e-mails in haste
- Avoid using context (background information)

6. Understand you Audience

- What they like to hear
- See your writing from their perspective

7. Sign-off like a professional

- Add signature block with appropriate contact information

8. Make sure no errors with spelling and grammar before you click the "Send&quo…

How did I start practising BDD?

At the beginning days I have practised TDD (Test Driven Development) with using JUnit, I approached that I should test methods belong to a class. For example:

I have a class with some methods:

public class A{ public void method1(){ } public void method2(){ } }
And then, I wrote some test methods to check the corresponding ones, for example:

public class ATest{ @Test public void testMethod1(){ .... assertTrue(...); ..... assertEquals(...); } @Test public void testMethod2(){ } }
After that, I know that a test method (ex: testMethod1) should just only tests one thing, so I decided to write more methods for each cases. It looks like the following:

@Test public void testMethod1_When_Case1(){ .... assertTrue(...); } @Test public void testMethod1_When_Case2(){ .... assertEquals(...); }
However, it was not a really good approach because it seems that I just focused on test the functionality of the method of the class. With TDD approach, I knew that I should test the…

Adding a default text to the beginning of an text area

I have a text area where I can enter a SQL statement. The text "SELECT TOP 1" is used at the begining of the sql statement as a default prefix that can not be removed.


In order to archive this functionality, I found three options:

1. Use an inputMask and build a pattern for the entered text. We can use the prefix inside the text area:

http://jsfiddle.net/SEXAj/2130/

2. Create an javascript event listener on event "input" and calculate to prevent the prefix is removed

http://jsfiddle.net/sarbbottam/TUc94/

3. Use another html tag like "div"/"span" that contains the prefix and calculate the suitable position

+ Tag "span": http://jsfiddle.net/4YzZy/
+ Tag "div": http://jsfiddle.net/215b34fs/

I chose the 3rd approach with tag "div" because it's the most easiest solution and suitable for me at that monment.

References:
[1]. http://stackoverflow.com/questions/24846041/how-do-i-add-a-default-text-to-the-beginning-of-an-htm…

Strategy Design Pattern

For example, I have an program with an Animal abstract class and two sub-classes Dog and Bird. I want to add a new behavior for the class Animal, this is "fly".  Now, I face to two approaches to solve this issue:

1. Adding an abstract method "fly" into the class Animal. Then, I force the sub-classes should be implemented this method, something like:

public abstract class Animal{ //bla bla public abstract void fly(); } public class Bird extends Animal{ //bla bla public void fly(){ System.out.println("Fly high"); } } public class Dog extends Animal{ //bla bla public void fly(){ System.out.println("Cant fly"); } }
2. Creating an interfaces with method "fly" inside. The same issue to abstract class, I force the classes these implement this interface should have a method "fly" inside:

public interface Flyable{ public void fly(); } public class Bird implements Flyable{ //bla bla public void fly(){ System.out.println…

AngularJS Fundamentals

1. Single Page Application (SPA)

- Single page application versus  Traditional multi-page

- "Single-Page Applications (SPAs) are Web apps that load a single HTML page and dynamically update that page as the user interacts with the app. SPAs use AJAX and HTML5 to create fluid and responsive Web apps, without constant page reloads. However, this means much of the work happens on the client side, in JavaScript"
src: https://msdn.microsoft.com/en-us/magazine/dn463786.aspx

- "Web browser JavaScript frameworks, such as AngularJS, Ember.js, ExtJS and React have adopted SPA principles"
src: https://en.wikipedia.org/wiki/Single-page_application

2. Directive and Data Binding Expression

<!DOCTYPE html> <html lang="en-US"> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> <body> <div ng-app=""> <p>Name : <input type="text" ng-model="name"&…

AngularJS - Using broadcast or shared service to communicate controllers' data

Either using broadcast approach or shared service is enough to solve the problem about communicating data between two controllers. Using broadcast can update immediately the child controller data when performing an event on parent.

Code example on Codepen :
http://codepen.io/vnnvanhuong/pen/ojXJRw?editors=101

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?editors=101 | http://codepen.i…

Selenium - tests don't interact with IE

Have you ever faced to a problem that your tests work well on Chrome or Firefox, but don't do anything on Internet Explorer after launching the browser? I have met this issue.

Even when my tests have no problems with IE8 but they do not interact with the browser which is upgraded one - IE11, no clicking, no entering anymore. And I got an exception.

These below maybe are one of the solutions:

1. Make sure the zoom is 100% (press Ctrl + 0)

2. Uncheck Enable Protected Mode, and set lowest security level too.


3. Add your address to trust sites.


[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-position"> <div clas…