NextJs + Redux generates a new instance in Redux Dev Tools at every store file change - react-redux

I noticed in an app that every time that I make a change —even a comment— in develop to anything related to the redux store — thunk/reducer/store/etc files— will create a new instance of that store visible in the Redux Dev Tools:
At the beginning I thought that it had to do with the Redux setup of my app, however I created a sample app with create-next-app + the with-redux example from the NextJs repo and the situation persists there.
Why is this hapenning? Should I be concerned about this?
I know that in production no changes will be made to the source files, thus making it impossible to generate more instances of the app in the browser, but I'm really curious of why it's hapenning and its possible side effects.

Related

How best to use reselect in a react project without redux?

I am in a project right now that uses useReducer + Context API for all state management. The app has grown to the point that state management is getting a little "messy". My question is how best to leverage reselect for performance and reusability in a react app that manages state this way. My assumption would be:
create and export selectors from a separate file
import the selectors into individual react components, and pass in state obtained from useContext,
use the values returned from the selectors in place of the state from context for the rest of the code in the component.
Is it that simple, or is there a better way to do it? Is it worth doing if the app is starting to get bogged down with rerenders??
ps. I can edit this question to include a code example of the steps above if that would be helpful.

Caching a Dynamic Laravel-based Progressive Web App for Offline Mode

I am currently in the process of converting a dynamic Laravel-based web application into a PWA.
Specifically, I am trying to get the offline caching for my app to apply across the entire code structure.
Ultimately, if a user saves the app to their mobile device after logging in then they should be able to use all the pages/features offline with caching which typically involves creating objects using front-end forms, etc.
So far, I have installed the Composer package 'Laravel PWA' to my app which all works as expected.
However, the next step is to get offline mode working for every route of the app.
If someone could help point me in the right direction it would be greatly appreciated.

Web Dev stacks - GONE WILD --- Best Practice Architecture & Deployment?

I've run into a problem that I'm sure many new/junior web developers are facing. Before I state the problem, it's best if I first list the events that drove me to the "issue".
Step 1 - The Front-End:
I followed tutorials which allowed me to create a Vue project using the vue-cli - I now have a nice front-end ready to go, albeit it is in a way "standalone". It sits in its own directory.
Step 2 - The Back-End:
I move on, I start to look at the back-end. Laravel plays well with Vue so I go with it. Once again I follow tutorials, I create a database and an API. Fantastic.
I now have the barebones core elements for a CRUD application. However, the way the back and front end are connected seems to be convoluted (although this may be due to my inexperience and improper understanding).
Solution 1:
Some tutorials insist that the Vue project is "re-created" within the Laravel directories so Laravel is in charge of rendering the views.
Solution 2:
Others, from what I can tell keep them physically separate and have the front-end interact with Laravels API only.
What are the best practices when it comes to stack architecture? Should we aim to bundle the stack together as proposed in solution 1? Is solution 2 even possible or is that due to my misunderstanding? If it is, how is deployment handled?
From my point of experience, both are correct and the answer depends on what you want to build 😀
First, if you have a simple website and you want to make the front-end of it in vue and it is only this one website, you can put it all together and make the frontend in Vue, which is handled by laravel in the backend and you are done.
Second, the step further, is for this case, that you can have several frontends for your project. Example: You have a website and several (native or universal) apps to display your data. In this case, you can build an API, that handles all the logic, all the business secrets, and this stuff, that no one should know in detail. After that, you are free to build any frontend (Vue, native, plain-HTML), whatever) you like, that's the only purpose is to display the data the API gives back (with some little logic in it, of the cause, but the secret business logic is hidden in the API). You can even outsource the generation of an app, so you build the website frontend in Vue and another one can build an ios-app with swift or an android app with kotlin.
Hope, you get the point, the answer is, as often: it depends 😉

unity dynamic ui save

I am developing with unity is dynamically generated the ui part of my application.
This ui is created by pulling information from the server.
The ui device I created is being recorded.
Whenever there is a change, I pull ui from the server, but if there is no change, I want it to run directly from the device. I need information on this subject.
Welcome to Stackoverflow Alper. In order to achieve this, you need to store the data and see if there are any changes from the previous launch. The easiest way to do this is by using PlayerPrefs which is pretty straightforward.
PlayerPrefs.SetInt("someName", varName);
and similar if you want to save string:
PlayerPrefs.SetString("someAnotherName", stringVarName);
Then if you want to access it you can use:
PlayerPrefs.GetInt("someName");
PlayerPrefs.GetString("someAnotherName");
Have in mind that PlayerPrefs is not secure and can be accessed very easy outside of your application. If the information you are going to store have something private I suggest you to use SQLite.

React JS: backend web application framework

React's website states:
Lots of people use React as the V in MVC.
From this, I am inferring that React does not play the "M" and the "C" roles in MVC.
If this is correct, it means one cannot build an entire web application solely with React JS.
Then, how?
Does React require a complete MVC framework for the backend, such as Rails or Laravel?
Can React simply pull data from a backend where a framework, such as Rails or Laravel, would be setup as a web API?
Does React not need any of this and works in a totally different way (in other words: am I completely missing the point)?
MVC is just a term for structuring data flow in an application.
You do not need MVC to build an application, even if it might help.
What React does is that it specializes in building isolated components - where the data flows in a single direction(the von neumann model of computing).
This is very nice because you can build an application with the premise that everything is always rerendered when data is changed, thus avoiding hard to read "two way bindings".
The thing is that it's very inefficient to rerender every view when some minor data is altered, but Reacts "Shadow DOM" optimizes this process, and makes efficient rerenders.
But React does not care where it gets data from. You could build a backend with nodejs/php/ruby or whatever you want. How you communicate and send data between the frontend and the backend is also left up to you. You could use jquery/socketio/superagent or whatever you want.
You can also combine React with any other framework, or just skip frameworks all together and fetch the data directly from a react component.
Facebook, the creators of React, have their way or organising projects called flux, which plays well with react(even if it is not needed).
https://github.com/facebook/flux

Resources