NFC Wear case study – NestJS solution for landing page creation process

Overview

NFC Wear is a brand that sells NFC chips and NFC chip-implanted clothing. Chips contain brand data and can link to a personalized landing page.

NFC Wear sought to prepare a tool for such a landing page creation process. They required a backend system that could handle a user-friendly landing page generation based on a predefined template and user-provided content.

To achieve this, we developed a backend solution using NestJS, a progressive Node.js framework that could communicate with Next.js frontend applications via REST API.

Client requirements

• Dynamic content: The system should allow users to input dynamic content such as text, images, links, and buttons for the landing pages.
• Template flexibility: Templates should be customizable to accommodate client preferences.
• Security: Each user should only have access to their own landing pages. All routes and resources should be restricted only to users with adequate access.
• Quick MVP: Start with a basic product version that could still provide commercial value and scalability – after collecting user feedback, future improvements should be easy and quick to implement.

Solution

We started with preparing a list of crucial features of the application, taking into consideration their importance and time to set up. The next step was to estimate and summarize the time of development to see which additional functionalities could be added.

When we had the MVP version fully planned, we brainstormed a tech stack optimal for our needs.
For the backend, we settled on the NestJS framework because of its main features:

• Modularity, which provided organized structure of the files so the code was easy to read and understand. Each module is reusable and supplies encapsulation. As a result, we could hide implementation details and expose only the necessary interfaces of the app.
• Scalability, which ensured we could easily modify and expand the application after its release
• Ease to quickstart a backend from scratch – we started with a vanilla version of NestJS, which already satisfied our needs. We developed the backend from scratch, so there weren’t any unnecessary additional dependencies.
• TypeScript support, which provided type safety and minimized the risk of type-related bugs and issues,
• JavaScript language – as we also picked the Next.js framework to use on the frontend application, it became easier for the backend and frontend to communicate with each other. What’s more, it allowed us to share some logic and data types between those two parts of the application.
• We decided to use the Kanban methodology with weekly calls in project management. It helps to keep the client up to date, stay transparent, focus on value delivery, and reduce the risk of misunderstandings in communication.

Architecture

• Modularity – we separated the backend into modules, each one being responsible for specific functionality, such as communication with the database, landing page management, and authentication.
• We settled on the TypeORM library for database interaction, as it was easy to integrate with the NestJS framework.
• We handled all logic by using “Service & Repository Pattern” which made the code easy to maintain and extend. This approach provided us with a clean and organized code.
• JWT tokens were used for authentication and authorization, as they make data secure and prevent injection attacks.
• User & Landing Page management – we prepared endpoints to communicate with the frontend application and allow CRUD actions on both users and landing pages. We used NestJS decorators on each endpoint to provide security and validate data from requests.
• AWS S3 integration – to leverage the number of files stored on the server, we decided to store them in Amazon’s services, which support fast, easy, and secure file upload and download.

Outcome

The developed backend system provided the client with a scalable and efficient solution for generating dynamic landing pages. Administrators could manage application users and their access rights to specific landing pages.

Each landing page could be freely edited. The “preview before publishing” functionality allowed users to see how their latest changes impacted the landing page layout. Additionally, the modular architecture of the NestJS backend allowed for easy integration with other systems and future scalability.

Conclusion

Through collaboration with the client and utilizing the capabilities of NestJS, we successfully delivered a backend solution that met all project requirements. The landing page generation system allowed our client to expand their brand and provide more valuable features for their customers.