Client
HelloWorld Devs
Industry
Digital Marketing
Service
Drupal & Laravel Development
Technology
Drupal, Laravel, Vue
Timeline
Ongoing Support with Multiple Phases
Goal
The primary goal of the project was to migrate from a traditional CMS to a headless architecture. Using Drupal for backend and Angular for frontend development, we aimed to improve:
Scalability: Enabling the client to handle increased traffic and content growth seamlessly.
Performance: Reducing load times by decoupling the frontend from backend dependencies.
Flexibility: Simplifying future updates and integrations with new technologies.
Maintainability: Providing an easier, modular approach to manage both frontend and backend systems.
Challenge
One of the main challenges was the integration of Angular with Drupal in a headless configuration. The lack of direct access to the frontend from a backend perspective created communication barriers and delays, complicating the overall development process. Coordination between teams was essential to overcome this.
Technical Workflow
Our technical approach focused on:
Backend Development
- Migrating from an outdated monolithic CMS to a modular structure using Drupal 9.
- Utilizing Drupal’s JSON:API to expose content to the Angular frontend.
- Developing tailored Drupal modules to handle specific business logic, like advanced user permissions and dynamic content generation.
Frontend Development
- Designing a single-page application (SPA) in Angular for a seamless and dynamic user experience.
- Using NgRx for efficient state management, enabling smooth navigation between components and minimizing API calls.
- Integrating Material Design principles for an adaptive, user-friendly interface.
Opigno LMS Customization
- Designed role-based learning paths for tailored experiences.
- Enhanced analytics and reporting for progress tracking.
- Added gamification features to improve engagement.
Middleware
- Deploying Laravel for handling specific API integrations and ensuring secure communication between the frontend and backend systems.
- Implementing Redis for faster API responses, reducing latency during data fetches.
Testing & QA
- Using Cypress and PHPUnit for frontend and backend testing.
- Conducting load testing using JMeter to ensure the system could handle traffic spikes.
- Using Jira for sprint-based bug tracking and resolution.
Outcome
The implementation of a dedicated QA team improved testing efficiency across both the frontend and backend, making the development process smoother. We successfully upgraded custom-built Drupal websites, overcoming numerous challenges.
Project Timeline
| Month 1 | Month 2 | Month 3 | Month 4 |
|---|---|---|---|
| Discovery | Testing Website | ||
| Redisgn and Iterations | |||
| Webflow Implementation | |||