Overview

Sun Education Group is a merger of three education consultants in Indonesia and they are in the industry for more than 40 years. Their core services are giving consultation and handling study abroad matters which include: program consultation, admission, documents translation, IELTS™/TOEFL®/SAT® preparation, student visa, study tour.

Sun Education has a software suite called sunnies that handles all their workflows from Education Consultancy Events, Register students who want to study abroad(Leads), Follow Up those students, Prepare the application to apply in universities and send them to study abroad.

Client Requirements 

Our client is the leading education consultation group in Indonesia and their application was being used to handle the student leads across the country. Their application was developed in 2010 on older technologies that were not coping up with the current user needs and data volumes that it has been grown up to. Secondly, it was difficult to maintain and develop any additional feature into the application because of the legacy codebase.

So clients come up with the decision to rewrite the whole application that can be a fair representation of their top-notch consultancy services that they are providing in the education sector. The aim was to rewrite their application to the newer technologies which should be fast, easy to maintain and follows the latest web application standard UI & UX. 

Discovery While evaluating the old application of sunnies, it appeared that the application was built on some custom framework of javascript and Lodash templating engine with PHP 4.3. Application architecture was highly cluttered which made the code difficult to understand and there was no sense of modularity, function, or any separation of concerns implementation. The technical debt of the codebase was very high. Application UI was outdated with some older UI components and there was very basic use of modern browser features like CSS 3 and HTML5  which makes the application look outdated. Operational wise the application was stable and performing the daily tasks with some lag. But some sections like reporting and dashboard were really problematic and the application was severely lagging and crashes all the time. The application was built on a relational database Mysql 5.1 with an older MyISAM engine. Database design was implemented without any foreign key constraint which makes the database suspect for data redundancy. Overall application database design holds some major setbacks when the matter comes to extendability and new features implementation.

Strategy Domain and Application understanding during our discovery process drove us into the very important decisions that were made during UI Designs, Technology selections, and Architecture. We knew that the application that we are going to work on has role-based users with more than 10 years of hands-on experience. So it was important for us to design the new application to utilize previous experience while giving the benefits of the latest web-based features. Material Designs was finalized as the base for component designing and overall look & feel. To improve the workflows we decided to use a 3rd party grid system that will give users some advanced functions like inline edits, data pivoting. Toaster messages for warning, errors, and success notification were decided as base features to make the application more transparent and user-friendly. The client does not have any Technology preference but some base guidelines for their future application including some points like it should be fast and easy to maintain. Nodejs and Angular on the front end were suggested in the presentation by our CTO with the client management team.

Build

We jumped into designing the main layout of the application with the close coordination of our client team, which leads to the project setup and architecture design, Back end project was established on node.js and Express framework with Sequelize as an ORM. The Frontend project was set up with Angular 9 and ag-grid was used as a grid system.

While building the application's architecture the core focus was to set up a project which followed the market standard and best coding practices. A sheet of coding practices was shared across the team who was working on the project and the best practices were ensured with peer code reviews and pull request approvals before it merged to the main repo.

Sunnies Application has multiple users and the functionality was distributed across different users and roles like Manager, Counselor, ToDo: add right role name. so a specific permission system was implemented that was guarding each API call, plus drawing each component on the front-end based on user permissions.

The project timeline was set up and scattered into weeks resulting in a build each week with a checklist of completed features to client QA teams after performing the initial testing on our end.

When converting the backend code from PHP to Node.Js API few points were compulsory to follow for each developer who was working on it, i.e performance optimization, code cleanup, and API documentation.

Delivery

Development was completed within the planned timeline and the project was deployed for final client feedback and UAT, but users on the client end were reluctant to use the new system and gave their feedback. We have to conduct a few meetings and demos to motivate the users to experience the new system and give their feedback. once the users start to take interest in the new system we get the UAT approval after a few days of bug fixing and changes.

After running some final tests when both teams were confident about the system we were ready to launch. Since all the database migrations were written during the development process and have been tested throughout the internal testing and UAT testing process we were pretty confident about the launch.