Insight: Javascript helps to create a web page more interactive and engaging, which results in better user engagement. Also, with JavaScript, you get an event loop module which can run several different sets of instructions at the same time. We have used Javascript in many projects as Agora ImagesNestlé & Carnovo among others.

Insight: In Apiumhub we believe that TDD is crucial for any project we work on. With TDD we can desing code robust, secure and change tolerant. A good for example using TDD is Privalia.

Insight: We love SOLID in Apiumhub, it helps us to build working software by having low coupling, high cohesion and strong encapsulation.

Insight: In Apiumhub we say that “once you try it, you just stay with it”. Typescript allows code scalability with “Interface oriented development”, also Types make the code more readable.

Insight: Basically what we get with Lenses is to reuse the data access of a structure in a modular and immutable way, either to obtain the data or to modify it. Also, with the composition of Lenses we will be able to reach the most profound data within our structure in a simpler way.


Insight: Despite being widely used today, Webpack is still a black box for many developers who simply use an existing configuration without knowing how it really works. Using Webpack modules we can divide our code into different files, so that each file has a single responsibility, which will make our code much more understandable and easy to test.

Related Post: Webpack modules

Insight: Functional programming becomes critical when the focus is the ultimate result — what to solve rather than how to solve it. Functional programming leads to a more transparent, cleaner code that helps the user in debugging and maintenance, and is fast becoming the go-to method for developers.


Insight: React Query is a library that has 2 simple hooks which provide fetching, caching and updating asynchronous data in React applications. It is proven that it is very useful in server state management in React applications.

Some of the advantages that React-Query gives are:
– Configuring the stale, cache, retry delay time creating a queryClientConfig object.
– Updating the stale data in the background since react-query prefetches.
– Optimizing the requests to the backend.
– With the refetchOnWindowFocus feature, it can refetch in the background when the user changes the browser tab or when they come back to the app.

React query is a great tool to use in React applications to manage the server state, lazy loading, pagination and the cache maintenance. It has a simple approach and implementation. With its devtools support, it is clear to use also in more complex applications. After working with the projects which includes.
React/Redux where all the state is in local, React-Query saves so much boilerplate code and synchronizes local state with server.

React-Query was used in Nestlé.


Insight: BEMIT is simply BEM + ITCSS. Like BEM, it is a naming methodology to define the classes of the HTML nodes. Thanks to BEM, developers can know how classes are related to each other. BEM provides a system to communicate clearly the relationships between blocks and the elements contained in them, helping to create a standard. ITCSS offers a system to structure style files and helps to locate the rules defined in them, besides minimizing the inheritance and specificity conflicts that give so many headaches when project starts to grow, both in size and people. So, the idea is to add the ITCSS hierarchy system to BEM.  

Related Post: BEMIT: ITCSS + BEM

Insight: Microfrontends is an architectural style where independently deliverable frontend applications are composed into a greater whole. The micro-frontend architecture is a type of design applied to the frontend that allows us to divide it into smaller, individual and semi-independent applications that work together. This frontend concept is very much inspired by the microservices used mostly in the backend. The goal of this architecture is to see web applications as a composition of functionalities where each one is worked by independent teams. Each team has a specific business area and development is done end-to-end, from the database to the user interface. 

Languages & Frameworks

Insight: By using CSS for style and layout, you only have to adjust one style sheet to make adjustments right across your website. Also, CSS-based websites use simpler and better structured markup (HTML) and are therefore more accessible to search engines. At Apiumhub we have used SCSS (Angular), LESS, CSS-in-JS (React) in many projects.

Insight: Next.js is commonly used by companies like Netflix, Twitch, or Uber. It is considered one of the fastest-growing React frameworks. With Next.js website can be rendered on the server side before sending it to the client. Next.js uses Hot Module Reloading (HMR) and is enabled by default. Next.js has built-in support for font and script optimization. Next.js has built-in support for internationalized routing and has out-of-the-box support for AMP. Remix is a full stack web framework that lets you focus on the user interface and work back through web standards to deliver a fast, slick, and resilient user experience. Remix is a seamless server and browser runtime that provides snappy page loads and instant transitions by leveraging distributed systems and native browser features instead of clunky static builds. Remix supports Cookies, Sessions, and Authentication. Remix work through most of its functionalities without executing JavaScript and it can contain independent routes inside nested ones.
Remix & Next.Js were used in Bitpanda.

Insight: Formik is the world’s most popular open source form library for React and React Native. Formik is a good fit for validation, keep track of visited fields and handling form submission. Formik uses controlled components. Since form state is kept localized and is managed by Formik it is good for building multi-step forms. Formik is useful to do in-place validation and give specific input format.

React Hook Form is performant, flexible and extensible form with easy-to-use validation. React Hook Form uses uncontrolled components. Since uncontrolled components keep the source of truth in the DOM, it is easier to integrate React and non-React code. React Hook Form isolates input components from the others and prevents re-render of the form for a single input. It avoids this unnecessary re-rendering. So it is a great advantage in terms of the performance. React hook form is great for simple forms and it does not have any dependencies. Formik & React Hook were used in Nestlé.


Insight: NestJs is a framework for building efficient, scalable Node.js web applications. It is an open-source Node.js framework for developing challenging backend systems that use the design paradigm convention over configuration that eliminates the need for explicit configuration by allowing developers to utilize common tools and code in a particular way. It gives you true flexibility by allowing use of any other libraries thanks to modular architecture. An adaptable ecosystem that is a fully-fledged backbone for all kinds of server-side applications. And it takes advantage of latest JavaScript features, bringing design patterns and mature solutions to Node.js world. NestJs is created for both Monoliths and Microservices. NestJs’s documentation is one of the most thorough and understandable by quickly scanning the documentation, you can find the answer to your bug and cut down on the amount of time spent debugging. In NestJs everything can be controlled with decorators. You can connect a controller to a collection of routes, specify a request method, add request body content or parse request parameters. You can also create your own custom decorators to use inside your project. With NestJs you may construct domain-wise clear boundaries, write reusable modules, and write loosely coupled and maintainable code. NestJS was used in Bitpanda.


Insight: Pinia is a new state management library for the Vue ecosystem. As a state manager, it fulfils the same function as Vuex and many other libraries with the same purpose, although in this case, Pinia is official and has the support of the team in charge of Vue. It is intuitive, stores are as familiar as components. API designed to let you write well organized stores. Reacts to store changes to extend Pinia with transactions, local storage synchronization, etc. Types are inferred, which means stores provide you with autocompletion even in JavaScript! Build multiple stores and let your bundler code split them automatically. Pinia hooks into Vue devtools to give you an enhanced development experience in both Vue 2 and Vue 3. And Pinia weighs just ~1.5kb


Insight: Next.js is commonly used by companies like Netflix, Twitch, or Uber. It is considered one of the fastest-growing React frameworks. With Next.js website can be rendered on the server side before sending it to the client. Next.js uses Hot Module Reloading (HMR) and is enabled by default. Next.js has built-in support for font and script optimization. Next.js has built-in support for internationalized routing and has out-of-the-box support for AMP. Next.Js was used in Bitpanda.

Related Post: NextJS

Insight: Angular is a TypeScript-based free and open-source web application framework led by the Angular Team at Google and by a community of individuals and corporations. Since Angular is a framework, it offers many more functionalities than React, such as the handling of forms, the routing and the requests handling. Angular was used in Bitpanda.


Insight: Gatsby is an open-source Static Site Generator (SSG) that uses React for development, Webpack for bundling, and GraphQL for fetching CMS data. It allows you to get data from various resources, such as WordPress, Contentful, DatoCMS, and many more. Querying with GraphQL means that you can create custom requests declaratively, and it also gives you a full interface for creating, testing your queries, and previewing the results. Since Gatsby is React-based, it is possible to work on it as any other React application, with components, hooks, styling libraries, and so on, giving developers full control over the design and behavior. You can create your own design system and make use of it on your Gatsby website.


Insight: React is a widely used JavaScript library for building user interfaces. It allows developers to create reusable and interactive UI components that efficiently update and render as the application’s state changes.

Insight: Vue.js is a progressive JavaScript framework for building user interfaces. It is designed to be approachable, flexible, and easy to integrate into existing projects.

Related Post: Vue 3 Composition API


Insight: Plop is a file generator tool system which allows you to define a script file to generate all the boilerplate files for you.

Insight: Within the context of the Single Responsibility Principle, responsibility is defined as a reason to change. That is why we consider the phrase of Robert C. Martin as a perfect definition of what is the Single Responsibility Pinciple: “A class should have only one reason to change.” By following the single responsibility principle, you make sure that your class or module has high cohesion, which means that your class does not more than what it should do. In short, one unique reason to change.

Insight: Microfrontends replicate the benefits that microservices bring to the server side, but this time directly in front of the final user in his browser. It allows to have more cohesive codebase, simplified maintanence, scalability and independent deploy.

Insight: Redux itself is a standalone library that can be used with any UI layer or framework, including React, Angular, Vue, Ember, and vanilla JS. Although Redux and React are commonly used together, they are independent of each other. In Apiumhub we believe that it encourages good react architecture.
Related Post: Demystifying Redux

Insight: Storybook is a frontend workshop for building UI components and pages in isolation. It helps you develop hard-to-reach states and edge cases without needing to run the whole app.With Storybook you can implement components and pages without needing to fuss with data, APIs, or business logic. Storybook was used in Bitpanda.

Insight: Web Components are a set of web platform APIs that allow developers to create reusable and encapsulated custom elements in web applications. They provide a way to build modular and self-contained components that can be easily used across different projects.

Insight: React Router is a popular library for handling routing in React applications. It enables developers to create single-page applications (SPAs) with multiple views, allowing users to navigate between different pages without full page reloads.

Secured By miniOrange