Questions tagged [reactjs]

The tag has no usage guidance.

33 questions with no upvoted or accepted answers
Filter by
Sorted by
Tagged with
3
votes
0answers
74 views

Architecture and Security in a Web/Native app while generating PDFs

I am trying to make a system where a user can view/download his statements (say salary slips). The user will have ability to download PDF versions of these statements and can also save them to Google ...
3
votes
0answers
409 views

Fetch data in parent vs fetching data in child

I know that I want to develop a React App like so: <PhotoPage> <FeedFilter/> <PhotoFeed/> </PhotoPage> Without using Redux, I know that I need to fetch a dataset of ...
3
votes
0answers
349 views

React DOM manipulation vs CSS for responsive breakpoints?

Specifically for ReactJS and responsive frameworks that show/hide elements based on width like Bootstrap. Because ReactJS has a virtual DOM I am presuming doing the DOM manipulation is faster and in ...
3
votes
0answers
1k views

How to passing variables from php to react.js component?

For example, I have a react.js component named Question which need the props title,id,content. <div id="main-section"> <div id="question"></div> </div> ReactDOM.render( ...
3
votes
0answers
288 views

Hot swapping files and metaprogramming with front-end JavaScript

I was inspired by a video on hotswapping JS files with React + Webpack for the web. I started trying it out with React + Backbone + RequireJS. Seems to work, as long as I stick to the stateless parts ...
2
votes
0answers
30 views

React Hooks: using state in useEffect without depending on it

I have run into a situation in React where I want to run a function F in a useEffect hook whenever a value V1 from the store changes. F uses another value from the store V2. I only want to run F when ...
2
votes
0answers
57 views

Where to store the state of a complex form in React?

Let us consider a complex form of registering a driver and owner. The driver will have all these fields: driver = { firstName: "xyz", lastName: "abc", phone: "1234", email: "m@g.com, licence: "...
1
vote
0answers
11 views

Best way to allow other components to change table's focused row?

I have displayProjectTable that gets state from reducer projectData and populates itself. Currently displayProjectTable has a local state that stores focusedRowID. My problem is that I want other ...
1
vote
1answer
40 views

ReactJS with Elasticsearch App Architecture

I want some advice regarding my architecture and hosting options. I'm attempting to build an e-commerce site for e-books. It will use nestJS for the backend and ReactJS+Typescript for the frontend. ...
1
vote
0answers
36 views

Where to place code which synchronizes state of Redux with localStorage?

In our project, I was need to sync a piece of information between localStorage and the Redux state. Actually I subscribed to changes in a localStorage and in Redux, and if change happens in ...
1
vote
0answers
31 views

Dependency injection of UI components via React context

In React, it's common for libraries, and app-internal utilities, to used context-based dependency injection. Some examples: function MyComponent() { const client = useApolloClient(); // Apollo ...
1
vote
0answers
271 views

Updating nested state with React Hooks and Typescript - performance vs clarity

I have some deeply nested react components. Let's limit them to 3 levels of nesting and call them Parent, Children and Grandchildren. The state for the entire app is stored in a single object in the ...
1
vote
0answers
57 views

Plugins system for an Electron/React app

I'm developing a Electron/React app which uses Webpack and Asar technologies. It's designed to be a host app providing a common platform for some plugins. These plugins are downloaded and plugged into ...
1
vote
0answers
186 views

Write integration tests with React using Jest

Let's imagine that we have this Page component: const Page = () => <> <Topbar /> <Drawer /> <Content /> </> I'd like to test some interaction within ...
1
vote
0answers
80 views

How to Implement Certain timeout session on multiple pages of a website - REACTJS

Suppose there 5 pages to a website. User flow will be 1->2->3->4->5->FINISH. I want to implement is that whenever a user enters page 3 a timer starts and if he doesn't finish a task ...
1
vote
0answers
29 views

React JS: Mixing data types for one state property

In the spirit of minimising state I always have a desire to mix data types for a given state property. For instance, if I were creating a React page that rendered a list of items that could either be ...
1
vote
0answers
322 views

Implement FSM explicitly in re-frame/reagent/react?

I'm in the process of making a simple game using re-frame (and thus react and reagent), but I'm stuck at one point. In https://github.com/Day8/re-frame#control-via-fsm they claim Not every app ...
0
votes
0answers
12 views

Best practice for plugin structure in webpack bundling

We have a software today that we are trying to port to React with the help of Webpack, but before I start, I want some input for best practice since I have only worked with single entry, simple ...
0
votes
0answers
37 views

Managing adjacent components

(originally asked here, but aparently not the right place) I managed to create a minimalistic example to reproduce the confusion I'm facing, here's a working SandBox. I have a page ( see the Profile ...
0
votes
0answers
12 views

Storing partial data in a redux store, how should be this done?

In my app I have some data to be fetched from the server (a list of recipes). In certain views, only a preview of the recipe is shown--this includes fields like title, rating, and an image of the ...
0
votes
0answers
25 views

Methods for storing data pre-registration in a web app

I have a web app - it's more complicated than a todo list but for simplicity sake let us assume it is a todo list. The user has the choice to sign up and create an account thus allowing them to store ...
0
votes
0answers
45 views

Is it better to have a default avatar library on client or server side?

I have a webapp using ReactJS as the frontend and Rails as the backend service. I have an account manager, where a user can choose multiple avatars from a default library. This library contains ...
0
votes
0answers
83 views

Handling user permissions in front-end

I'm building an API that will be used by the front-end in React and I'm not quite sure how I should send the permissions of each user based on their roles. Some fields can only be edited in some ...
0
votes
1answer
202 views

Integrate react app with php app

I have an old php web application, with very bad code. While a lot of it just has html and ajax calls in the, the wrapper is still php. I want to develop the new modules in react, and slowly replace ...
0
votes
0answers
62 views

Do database CRUD operations dictate whether and application should be one-way or two-way binding?

I am confused (easily done). To me model is the data from the database sent back as JSON. When I think of that in an Angular context, when two-way binding is configured, it makes me think the ...
0
votes
1answer
208 views

Does Angular2 or Angular4 offer an app state and middleware promise like React / Redux?

I used Angular 1 and React / Redux, and one thing I like about React / Redux is that there is a definite app state, and a middleware that can convert a promise into real data. In Angular 1, we often ...
-1
votes
0answers
22 views

Best practice for loading data in Redux store on App load

I have an app that is consuming multiple external APIs. I am getting a lot of data that I don't need to consume in my application, at least not right now. I am thinking of loading only the required ...
-1
votes
0answers
29 views

Sorting in React Component

I need to sort team cards alphabetically inside my Container component with a button. At the moment the code sorts alphabetically without the button being pressed since I have the sorting logic being ...
-1
votes
1answer
62 views

Recommend a way to handle multiple UI frameworks in a pattern library

We are setting up a pattern library. It's use is on the one hand to document and display our UI elements in a web view. On the other hand, it should also be the place where components are built. The ...
-1
votes
2answers
315 views

React.js + Flux, immediate response during history back/forward

In Instagram (web), when you click back/forward arrows - I've noticed that the content isn't loaded from the server and it immediately show up. After reading the docs on react.js + flux, I had this ...
-2
votes
1answer
45 views

React class or function for stateful components?

Which is better to use? react class based stateful component or react hooks functional stateful component? I've searched a bit but couldn't find what is preferred to use.
-3
votes
0answers
49 views

Is it a good/bad design to do CRUD from SPA like React?

I am creating a responsive web app using ReactJS as front end and MongoDB at the backend. I have the below two options and would like to know which one is preferred to perform CRUD operations. ...
-5
votes
1answer
37 views

Easiest way to add tracking of interactivity (mouse clicks, scrolls, multi-touch gestures) to a React Web App already developed?

Context: we have a responsive web application developed in React.js, which we have successfully used a few times to run user studies on Amazon Mechanical Turk. Now, we would like to add interactivity ...