Skip to main content

From JSP to AngularJS

Our team maintained a project that was used a quite old web technology JSP. Our project likes a web portal that can contain some other smaller projects, I called it a module. Now, our customers want to add a new module into it.

We met a problem is the current projects can't be testable and hard to maintain because both the logic and GUI are mixed together by using JSP and JSTL. It was really a messy project structure. Therefore, we didn't want to continue this approach. Testing is very important, as well as a good structure for maintenance. We would like to apply MVC pattern for testable and maintainable ability purpose. Yeah, that was actually time for changes.

Our project structure can't be testable and has poor structure.


We listed out some options:
  1. Refactoring all current modules -- terrible approach, too much efforts, too risky due to a lot of modules.
  2. Using MVC just for the new modules with Servlet for Controller, Java class for Model and JSP for View -- actually, it was impossible for us also because our back-end technology was covered by Axon.ivy, the Servlets were fixed and we didn't want to modify a lot without Axon.ivy's official ways.
  3. Finding a new front-end frameworks that can work with Axon.ivy and apply MVC also -- it seems a best solution, we just should learn a lot by choosing this approach.
We found AngularJS is one of the best choices in that time. we did a quick research and we found AngularJS can help us using MVC. Moreover, we can test with Javascript by using some Javascript test framework, likes Jasmine. We also can setup a Jenkins job for auto-run tests by using Karma.

We used AngularJS and some related technologies to overcome our problems.

That was cool and we decided to go for it.

Comments

Popular posts from this blog

My 2017 Review

Passion for System Design After finishing a one year project, my longest stable team (lasted for 3 years) was separated into two smaller teams. Sadly, but that was a good chance for me to become a key member in my new team. My preferred skills were about system architectures; therefore most of the tasks of building the application structures were handled by me. In order to enhance my design system skills, I have spent much my time for reading books closely after work. These following books help me a lot. - Object-Oriented Thought Process | Matt Weisfeld - Head First Design Pattern  | Elisabeth Freeman and Kathy Sierra - Java 8 in Action: Lambdas, Streams, and Functional-style Programming | Alan Mycroft and Mario Fusco Junior Technical Architect I was requested to join a technical architect team (aka Team. Alpha) where I actually had gained experiences almost on interviewing candidates for my company (lol). Besides, I noticed myself must improve the skills of convinci...

Attribute 'for' of label component with id xxxx is not defined

I got the warning in the log file when I have used the tag <h:outputLabel> without attribute " for " in xhtml file. It was really polluting my server log files. The logged information actually makes sense anyway! We could find an answer as the following: "Having h:outputLabel without a "for" attribute is meaningless. If you are not attaching the label, you should be using h:outputText instead of h:outputLabel." However, these solutions are not possible just for my situation. Instead of using h:outputText for only displaying text, my team has used h:outputLabel too many places. We were nearly in our release time (next day) so it is quite risky and takes much efforts if we try to correct it. Because the style (with CSS) is already done with h:ouputLabel . The alternative by adding attribute " for " the existing h:outputLabel is not reasonable either. I really need to find another solution. Fortunately, I came across a way if I cha...

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...

Resolution for 2016

HCM full stack developer Meetup 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 becom...

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...