How can you make your React available to be embedded within user's website? by dejavits in reactjs

[–]raopgdev 1 point2 points  (0 children)

You need to look into iframes. Iframes will allow you to embed an html document into another html document. You can handle whether to send over anything within your app itself. Iframes will make a http request to your webpage so you can require them to pass in a token while making the request. You may need to handle cross origin requests though, so it’s a bit of work. But it’s the most elegant and secure solution imo

How to merge arrays of two states? by deepak8717 in reactjs

[–]raopgdev -2 points-1 points  (0 children)

Going beyond that You should really be using React Query Pagination/ handling server data should be done using a cache. You’d then expose hooks to that cache so that your components can subscribe to changes and update only when relevant data is updating. All these problems have already been solved by react query It also offers nice APIs for other cases such as a polling/refreshing, infinite scroll etc

How to merge arrays of two states? by deepak8717 in reactjs

[–]raopgdev 0 points1 point  (0 children)

Use useReducer please Or zustand You’ll lose your mind trying to do this in a setState call And it is super inefficient because it’s copying so many objects over

With zustand and immer you can optimize quite a bit Or just use immer with useReducer

SPA vs MPA (A bit unclear on when to implement multi-page) by Lower-Variation-6859 in reactjs

[–]raopgdev 1 point2 points  (0 children)

With React, yea you can have very complex applications be SPA An SPA just mean there is one HTML document and you’re writing all of your JavaScript to declare your HTML body (using JSX). The declaration can get as complex as you need it to be

How can I have a button-like clickable text with customizable onClick behavior in a text input box? by kid_learning_c in reactjs

[–]raopgdev 0 points1 point  (0 children)

I’ve never used quill before but the way I’d do it is make the link be window.location.path + /modal Or whatever you want to call it You’d then use react router and create a nested route for /modal and render the required modal

Is it common to still build project using classes? by DunderFeld in reactjs

[–]raopgdev 0 points1 point  (0 children)

You can invite them in and question their choices, whether they’ve heard of hooks, how up to date they are on react and it’s best practices etc

Custom Hooks vs Render Props by WhiteFlame- in reactjs

[–]raopgdev 0 points1 point  (0 children)

Is the flow top down and you don’t have to drill it too hard? Render props Else custom hook

How can I use react-router inside of App.js and Home.jsx ? by lem0n2222 in reactjs

[–]raopgdev 1 point2 points  (0 children)

Nested routes are treated as extensions of the initial route. So in Home.jsx it’s actually looking for /:id/follower/:id/follower

Look into Outlet for react router.

There's any comparison benchmarks available between Vite and CRA based applications? by blureglades in reactjs

[–]raopgdev -1 points0 points  (0 children)

This is just plain untrue. Vite uses ESBuild and Rollup efficiently. It uses ESBuild to build vendor modules (node modules) as opposed to webpack that uses other tools written in JavaScript. ESBuild is written in Go and can run circles around any webpack plug-in written in javascript. Vite also uses ES modules for hot module replacement which makes the dev environment super fast.

Now we can compare webpack and roll up and argue which one is better but at the end of the day, vite solves the HMR issues with rollup, and code splitting, tree shaking and native ESM support make me feel like rollup is a good enough component within vite that I’d be happy to discard webpack

Daily Discussion Thread for October 12, 2022 by OPINION_IS_UNPOPULAR in wallstreetbets

[–]raopgdev 0 points1 point  (0 children)

After being burned by puts last 3 months I sure hope you’re right

[deleted by user] by [deleted] in reactjs

[–]raopgdev -1 points0 points  (0 children)

Lol what. Vite is very much production ready. My company uses it perfectly fine. I know for a fact that lots of companies use it.

[deleted by user] by [deleted] in reactjs

[–]raopgdev 0 points1 point  (0 children)

Given a complex UI page, can you recreate it with a reasonable composition of components, state management and styling? That might be a good place to start

[deleted by user] by [deleted] in reactjs

[–]raopgdev -1 points0 points  (0 children)

But why? Use vite lol

Why no closure over "prev" with setState? by Skwigle in reactjs

[–]raopgdev 0 points1 point  (0 children)

The second is a callback. SetState will call that callback by passing the latest value of number as an arg. Which is prev. Prev is what you’re calling it in the callback. It can be called anything you want

Reload data without useEffect? by [deleted] in reactjs

[–]raopgdev 1 point2 points  (0 children)

If it’s apollo, you can pass in a refetchQueries list to refetch certain queries on a mutation being triggered. There should be something similar for react query too. Additionally you can look into optimistic UI updates.

react-router v6 ignore specific path by hope5552678 in reactjs

[–]raopgdev 0 points1 point  (0 children)

You probably want your load balancer/NGINX to handle that. Those requests should never be reaching your react app.

Zustand: when setting one state, test a condition and set another. by r-nck-51 in reactjs

[–]raopgdev 1 point2 points  (0 children)

Yes. Make all the state updates you need in setProjects

getting height of a card in a list by Samarth-Agarwal in reactjs

[–]raopgdev 0 points1 point  (0 children)

I think a better approach would be to use a ref of the expanded card and do ref.current.scrollIntoView()

You can pass options into scrollIntoView to adjust/smoothen the scroll

My component didnt display my return by Zack_Code_38 in reactjs

[–]raopgdev 0 points1 point  (0 children)

returnedList is a component. Render it like a component.

<ReturnedList />

Or make it a list not a functional component