Implementing a builder pattern with @Ngrx/Store

Feeling a bit uncertain... I'm wondering if it's suitable, awesome or not advisable to employ a builder pattern to retrieve API response and then apply the builder pattern on that response before storing it in @ngrx/store? And later on when accessing it from the store in my components, would I be able to access the functions implemented on the api response from the builder object?

I'm seeking some input on this... Am I perhaps overthinking this situation... Or is it a beneficial approach to incorporate the builder pattern with @ngrx/store?

Could someone provide assistance with this?

angulartypescriptbuilderngrxngrx-store

Answer №1

There doesn't seem to be a major issue with this approach, aside from the trade-off between memory usage and the convenience of immediately having class instances available if that suits your preference.

However, it is crucial to remember that these Objects must remain immutable. They should have no state and their functions must not alter their own data.

Essentially, by making them immutable you lose the advantages of object instances as they become just a collection of functions tied to read-only data. In this case, the functions on the objects could simply be external functions that operate on the store data instead.

Alternatively, you could create the object instances later based on the data (making sure not to modify any references to the store data).

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

"TypeScript function returning a boolean value upon completion of a resolved promise

When working on a promise that returns a boolean in TypeScript, I encountered an error message that says: A 'get' accessor must return a value. The code snippet causing the issue is as follows: get tokenValid(): boolean { // Check if curre ...

javascripttypescriptes6-promiseionic3ionic-storage

Tips for efficiently parsing multiple JSON files in Typescript while maintaining clean and concise code

Currently, my app is designed to read multiple Json files in Typescript and populate select boxes. However, I am striving to avoid repeating code with the wet (write everything twice) principle and keep things dry (don't repeat yourself). Initially, I ...

jsontypescriptinterfacedry

Exploring the power of async/await and promise in TypeScript

I'm puzzled as to why the return type string in this method is showing up as a red error: exportPageAsText(pageNumber: number): string { (async () => { const text = await this.pdfViewerService.getPageAsText(pageNumber); ...

javascripttypescriptasynchronousasync-await

"Upload a video file and use JavaScript to extract and save the first frame as an image

I have a webpage where users can upload a video file, and the page will generate a thumbnail based on a timestamp provided by the user. Currently, I am focusing on generating the thumbnail from the FIRST frame of the video. Here is an example of my progr ...

javascripthtmltypescript

The language in the React Native app remains unchanged despite utilizing i18next.changeLanguage

I am currently attempting to integrate the i18next library into my React Native app in order to facilitate language changes, but I have encountered difficulties with translation. image description here I have created an i18n.tsx file. import i18next from & ...

reactjstypescriptreact-nativei18next

Creating a standard arrow function in React using TypeScript: A Step-by-Step Guide

I am currently working on developing a versatile wrapper component for Apollo GraphQL results. The main objective of this wrapper is to wait for the successful completion of the query and then render a component that has been passed as a prop. The componen ...

reactjstypescriptgenericsreact-apolloreact-functional-component

What is the best way to handle a global path parameter in a Nest.js application?

Currently, I am in the process of constructing a rest API for a fully multi-tenant system using a single database and application. To achieve this, I have chosen NestJS as my framework of choice. My goal is to structure all modules based on the :tenantID t ...

typescriptnestjs

Detecting changes in a readonly input in Angular 4

Here is a code snippet where I have a readonly input field. I am attempting to change the value of this readonly input from a TypeScript file, however, I am encountering difficulty in detecting any changes from any function. See the example below: <inp ...

javascriptjqueryhtmlangulartypescript

Dealing with Errors in Node.js Using Typescript and Express

As I embark on my journey with Node and Typescript, a question has cropped up in my mind. There are two key files in my project: server.ts import express = require('express'); import IConfiguration from "../config/config"; export default clas ...

node.jstypescriptexpress

Bringing in a TypeScript module to an Angular component

Having trouble with including a specific library in my component Here is the code for my component which uses geolib as the library: import { Component, OnInit } from '@angular/core'; import { StationsService } from '../../../services/stati ...

angularnpmnode-modulesangular5

Sending real-time data from the tRPC stream API in OpenAI to the React client

I have been exploring ways to integrate the openai-node package into my Next.js application. Due to the lengthy generation times of OpenAI completions, I am interested in utilizing streaming, which is typically not supported within the package (refer to he ...

typescriptnext.jsstreamopenai-apitrpc.io

What is the process for exporting a class and declaring middleware in TypeScript?

After creating the user class where only the get method is defined, I encountered an issue when using it in middleware. There were no errors during the call to the class, but upon running the code, a "server not found" message appeared. Surprisingly, delet ...

javascriptangularjstypescriptexpressrouting-controllers

Discover the combined type of values from a const enum in Typescript

Within my project, some forms are specified by the backend as a JSON object and then processed in a module of the application. The field type is determined by a specific attribute (fieldType) included for each field; all other options vary based on this ty ...

typescript

Using the transform property with the scale function causes elements positioned in the bottom right corner to vanish

Issue specific to Google Chrome and Windows 10 I'm currently working on a flipbook that adjusts content size using transform:scale() based on the user's screen size. There is also a zoom feature that allows users to adjust the scale factor. I ha ...

javascriptcssangularcss-transforms

Troubleshooting Issue: Angular 6 - Authentication token interceptor not including headers

After experimenting with various approaches using Angular 6 for the past couple of days, I recently tried implementing a solution mentioned in this post: . Despite my efforts, the header in the requests still remains unset. import {Inject, Injectable} fro ...

angulartypescript

Notifying locally in Ionic 3 every couple of hours

I have a concept for my app where users can choose to receive notifications every 3 hours. The challenge is setting up a toggle on the HTML that, when activated, prompts the user to input the first time they eat in a day. From there, the app will send remi ...

angularionic-frameworknotifications

Encountering a 401 error in Ionic 2 when making a post request to the WP-REST API, even though

I'm currently working on a simple application to manage posts in Wordpress using the wp-rest api. Everything, including creating, updating, and deleting posts, works perfectly fine when tested in Postman. I am also able to fetch posts successfully usi ...

httpangularionic2basic-authenticationwp-api

Obtaining the attribute value from a custom tag in Angular: A comprehensive guide

I am currently working on creating a customized password component in Angular5. I am having difficulty obtaining the minimum and maximum attribute values required to validate the password. I attempted to retrieve the values using JavaScript's getAttr ...

angulartypescript

Visual Studio Code's Intellisense is capable of detecting overloaded functions in JavaScript

What is the best way to create a JavaScript overload function that can be recognized by Visual Studio Code IntelliSense, and how can this be properly documented? A good example to reference is Jasmine's it() function shown below: function it(expecta ...

javascripttypescriptvisual-studio-code

Using NGRX Effects to Load Data for a Specific Item in Angular

On my website, there is a page that displays a range of products from the store managed by a reducer called products. When an action PRODUCTS.LOAD_ALL is dispatched, it triggers an API call through an effect and then sends a PRODUCTS.LOAD_ALL_SUCCESS actio ...

javascriptangularjsstoreeffectsngrx