DEV Community

Cover image for Case Study: Migrating Aleteia to Frontity
Reyes Martínez for Frontity Framework

Posted on • Updated on • Originally published at frontity.org

Case Study: Migrating Aleteia to Frontity

Background

Aleteia is an online Catholic publication launched in 2013 and currently distributed in seven languages (English, French, Portuguese, Spanish, Italian, Polish and Slovenian).

With more than 670,000 subscribers to their newsletter and more than 4 million fans on Facebook, Aleteia reaches over 13 million unique visitors and draws 40 million page views per month, making it the most popular Catholic website in the world.

In May 2020 Andrea Romano, Chief Technology Officer at Aleteia, contacted us to let us know that his team was discussing the opportunity to migrate all their websites to Frontity. Both the digital publishing industry and user behavior have evolved quickly during the last years. They wanted a performant, flexible, and modern stack to improve their web experience and meet today's users expectations.

Although it's been only a few months since they finished the migration to Frontity, we wanted to talk with Andrea to know how it went and how Frontity has helped them so far.

Project needs

After Google’s algorithm core changes as well as Facebook’s strategy to give less organic post visibility on the news feed, Aleteia's global traffic wasn’t growing as expected at the beginning of 2020. Andrea and his team identified some areas of improvement, and one the biggest one was related to web performance and SEO.

"Site speed is a ranking factor, and it’s especially critical for mobile pages. Slow websites have a lower number of conversions, a lower number of page views per visit, and higher bounce rates. Essentially, a slow site means people will bail because no one has the patience to wait for a website to load."

Andrea Romano, CTO at Aleteia.

We met Andrea in late 2018, when he approached us to learn more about our previous product (Frontity PRO) and how it could positively impact on Aleteia's performance and UX. Since then, the idea of building a React theme has been hanging over his head.

The traffic drop made the need for a modern web app a priority. Google just announced new metrics to evaluate how users perceive the experience of interacting with a web page, and they were also worried that their website could be penalized in the future. It was time to update the tech stack to correspond to the team needs.

While their previous stack was stable, it lacked flexibility. In order to improve the overall web experience, Andrea aimed to move Aleteia to a modern frontend which they could have more control over while maintaining the WordPress backend. They also needed something that would integrate well with all the services used by Aleteia.

Lastly, they wanted a technology partner who could support them during the process. We have been in contact with Andrea for some time now. He already knew the benefits that Frontity brings for digital publishers as well as our dedication to help them succeed.

When the time came to make a decision on the frontend stack, Frontity and our team just gave them the confidence they needed.

Approach

Andrea's first approach for upgrading Aleteia's website was to develop a whole new custom theme in React using Frontity. However, as any greenfield project of this magnitude, they quickly realised that this was going to require a longer time frame.

In order to address some of the above concerns quickly, the development team finally decided to put their efforts into migrating their WordPress theme to Frontity first. This would help simplify the process.

As soon as we knew about their decision we connected Andrea with Eduardo Campaña, who formerly worked at Frontity. They hired him as a freelancer to work on the project along with their two in-house engineers, who were new to Frontity.

According to Andrea, Eduardo's help and guidance was fundamental in their transition to Frontity. He enabled the team to quickly get up and running with the framework and its development practices.

In just a couple of months, they managed to complete the migration of all their websites. That is seven websites in total (one per language), including the implementation of several packages to integrate their analytics and ads partners, as well as their GDPR and web push notifications services.

Frontity's extensibility and its package management interface made this integration more efficient and allowed the team to continue using their preferred services.

Aleteia's current tech stack is:

  • WordPress multisite as backend for managing the content.
  • One Frontity multisite installation which serves the content from their websites.
  • WordPress VIP Go enterprise hosting platform with Node.js support.

You can visit Aleteia's main website at [aleteia.org](https://aleteia.org/).

Right now, Andrea and his team are working on adding premium content for paid subscriptions. They will keep adding progressive enhancements and features to Aleteia during the next months.

Among the reasons for choosing Frontity, Andrea's particular emphasis was on the support and expertise from our team. "We didn't choose Frontity only for technological reasons. One of the key factors which convinced us to use it was the team behind it, because they gave us a sense of real support" he said. Andrea also recognised that the fact of being invested by Automattic was a plus that reaffirmed his confidence in the project.

"I truly believe in the people. If the team is well prepared, I trust in what they are building. And the people who work at Frontity is what makes it unique."

Andrea Romano, CTO at Aleteia.

Outcomes

Frontity brings a lot of advantages that go beyond performance, SEO, and scalability. A great developer experience when it comes to creating a more complex UI among the top ones.

Going for WordPress and Frontity in the stack ensured that Aleteia doesn't spend time re-inventing the wheel and that they get the best possible results in the short term.

A seamless migration

Frontity helped the migration run smoothly, which allowed Aleteia's team to reduce the development time to two months and accomplish their goals in a very short period of time.

While they still have bigger plans with the framework, switching to Frontity was already a great first step in evolving their website, and it helped them cut the time it takes to migrate seven editions.

"Everything went smoothly and in just a couple of months we were able to publish all the websites. I recommend using Frontity because it significantly helps minimize the development time. The product is solid and stable."

Andrea Romano, CTO at Aleteia.

A powerful, extensible frontend stack

Aleteia now uses the latest in frontend technologies and provides a greater overall user experience.

They are armed with a performant website that is easier to maintain, allows them to handle iterations easily, and gives them room to implement new features and third-party integrations as new requirements emerge.

"One of the best things about Frontity is that it's very flexible. Even a complex website like Aleteia, with seven editions and different packages between them, is quite easy to tweak."

Eduardo Campaña, developer in the Aleteia project.

In addition, because Frontity is rendered dynamically, it makes it a great fit for medium and large scale publishers like Aleteia with a lot of content that might change rapidly, giving them a great power and reliability when it comes to frequent and real-time updates.

The same robust editorial experience

Lastly, moving to Frontity meant no interruption to Aleteia’s publishing workflow. This is especially important for teams that produce many pieces of content every day, as even the smallest impact on their workflow can pay dearly.

With the new decoupled approach only the development team at Aleteia works directly with Frontity, leaving the content editors to continue working in WordPress as if nothing had changed.


We are proud to see what Aleteia has accomplished in such a short time. Special thanks to Andrea Romano and his team for taking the time to share their story with us, and for contributing to make Frontity better with their feedback.

This project has allowed even a closer collaboration between both teams, and we look forward to growing together.

Discussion (0)