Exploring NX - A groundbreaking development tool for optimizing application development process

Hello, I'm Huu from the development department, and today I want to write an introduction to NX and what I'm particularly impressed with about it.

Before introducing NX, I also want to say that my front-end coding ability is not really good, so there will be some limitations in my understanding of the content of the article. If there is any incorrect information, I hope to receive more contributions to improve it. In this article, I will not go into detail on how to use NX because it has been clearly explained on the nx homepage. Therefore, I will focus on my impressions of NX and what I am using it for, as well as my opinions on how it can be applied in Manebi's projects.

My Experience and Impressions of NX

Recently, I have tried to make demos of a few projects, including a web application using ReactJS and a mobile application using React Native. The common point of these projects is that the website and app will work together with an API, and all the logic will be the same between the web and the application. And I happened to know about NX, a great framework to improve work efficiency.

What I am particularly impressed with NX is that it can integrate many applications into a workspace. Let's go back to the example I mentioned earlier, I built a mobile application and a website using ReactJS and React Native, and the common point is that they use the same logic to work with the API, and fortunately, NX is doing very well in this regard. It allows sharing API logic between applications, meaning that you only need to code the API in one place, and other applications can reuse it. This will help you save time building a system without having to write the logic for each application. To illustrate the sharing feature more clearly, NX allows you to create reusable libraries. This helps create features or core functions of the application once and reuse them in many different projects. For example, if you are developing an e-commerce application, you can create a library containing features such as payment, cart management, or order management, and use them in many different applications. Reusing these features helps save time and resources in the development process. And not only sharing between ReactJS and React Native, but NX also supports some popular frameworks like Vue, NextJS, NestJS, and Angular...

The second thing that impressed me is the ability to share interfaces between applications This helps to create unified interfaces in different applications, which helps to create a better user experience. If you are developing multiple applications with the same interface, you can create a library of components, styles, or templates and use them in different applications. For example, you can create a library of components, styles, or templates for the menu bar, footer, or logo icons, and use them in different applications. Sharing interfaces helps to reduce repetitive work during development, saving time and resources.
A concrete example of NX's interface and logic sharing might be a project to develop web and mobile applications for a travel agency. The project includes common features such as login, registration, account management, the home page, and a menu bar. These features can be separated and made into reusable libraries. For example, the account management library can be used for both mobile and web applications, and the menu bar and home page can be shared between web applications.

In addition, NX also supports other features such as linting, testing and build automation to help increase the professionalism of the application. It also offers extensibility and customization to fit the evolving needs of projects. NX allows the use of tools and libraries that are popular in the web development community such as Jest, Cypress, Prettier, ESLint, and many more.

The potential application of NX in manebi's projects.

Please note that this is just my personal opinion and it may not align with the company's development direction, and you may not agree with this perspective, so I would like to hear your feedback on this.

As you know, the shin-playse project of manebi has separated the project into front-end and back-end. The front end is currently being developed using ReactJS, and in the future, shin-haken will be implemented based on the base of shin-playse. I think it would be great if we apply NX to these two projects so that we only need to code the core network to work with APIs for both projects. And later, we could expand to other projects such as shin-forshain, shin-school. Or develop mobile applications for the projects of playse or haken. In addition, most of the interfaces of the two projects will be reused, we can separate them into components and share them with the projects that use them.

In conclusion, NX is a great framework that helps improve work efficiency by integrating many applications into a single project and allowing sharing between them. This is especially useful for Manebi's projects that require working with multiple applications and APIs. With the ability to reuse features and share interfaces, we can save time and resources in the development process and create a consistent and improved user experience.I believe that if we can do this, it will save a lot of development time for the projects. Instead of requiring two separate frontend teams, we can only need one frontend team to develop both projects.

Above are my thoughts on NX and its feasibility with manebi. Thank you for reading the article.
You can find more information about nx at: nx.dev