Services: React
While working for Just Eat Takeaway.com, I was tasked with building an informative landing page for the 'Did Somebody Say' global brand campaign. The page was built using Vue Js and will be featured in all Just Eat markets and languages.
Services: React
Below I have listed some key features on the landing page. They include frontend features that help promote the campaign as well as elements of code to show how I can save time and repetition when coding for more than one market.
I built this project in Vue JS and used a js file to pull the content. This allows me to have one codebase with different content, allowing for each market.
The content.js file is seperated into localities, representing the country and language. When the project is built it finds the locality (which is set in the local environment file) and pulls the relevant data through. The file also allows the logos to change to the local brand name (i.e Thuisbezogd, Pyszne.pl and Takeaway.com). Within each section below I have explained in more detail about the code.
You can see the other landing pages here: Ireland, Bulgaria, Germany, Netherlands, Switzerland and Austria.
When a consumer first lands on the page they will notice the large image of the talents (Christina Aguilera & Latto) as well as the 'Did Somebody Say Just Eat' logo. The background is set to the brand orange allowing consumers to know they are on the Just Eat platform.
Within the code we import the content.js file and call the data through to the relevant places.
The third and fourth sections of the landing page focus on the advert itself, allowing consumers to watch the video and read the lyrics to the song.
The video is a youtube embed and it pulls the ID from the content.js file, allowing for each market to have its own advert in the local language.
Section 5 of the Landing Page allows consumers to purchase the items of food featured in the video.
On mobile the list only shows the first few items, with a 'See more' accordion allowing the consumers to see the full list.
Within the code we input the Image, text and link to the food.
The final section of the landing page allows consumers to hear from the people invloved in the project, including Christina Aguilera and Latto, using a carousel.
Within the code we call the content.js file and loop through the slides. This allows us to have different quotes per country.
One of the features of the landing page is the large footer that follows the same styling as the main footer on the Just Eat homepage.
Within the content.js file I list the links and accordions, so I can easily edit the footer for multiple languages.
Creating an Informative Landing Page allows consumers to read about and learn more information on the campaign. It also allows Just Eat Takeaway.com to focus on certain areas of the campaign and generate more interactions, ultimately leading to more orders through the platform.