ReactJS debugging with WebStorm connection_err - javascript

I am new to ReactJS and I am trying to debug it. I keep getting the following.
[Fiddler] The connection to 'localhost' failed.
Error: ConnectionRefused (0x274d).
System.Net.Sockets.SocketException No connection could be made because the target machine actively refused it 127.0.0.1:3000
This is my configuration in WebStorm:

Thanks, everyone, just got everything to work.
ReactJS is different from Angular.
We need to start the server manually by hand and just keep saving changes to app.js
1.Open nodeJS CMD
2. navigate to the project folder.
3. npm start
There you go!.

Related

Weird CORS errors on fresh vue cli project

I just started building my second Vue project, and for the first time I wanted to use the Vue CLI and NPM rather than just loading Vue via CDN.
Installing the CLI and setting up the project worked without problems, but when I ran "npm run serve" and navigated to localhost:8080 in my browser (latest Firefox) to see if it worked, I got the following error message in my browser console multiple times:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://10.126.86.51:8080/sockjs-node/info?t=1584021154635. (Reason: CORS request did not succeed).
I also get this error message once right after loading the page:
[WDS] Disconnected!
Does anyone know what these errors mean, why I get them and how I can get rid of them?
The first one seems to be related to some kind of cross-origin call that the app is making using the host's actual IP rather than localhost, but I can't think of any reason why it would, given that I literally just installed and served the example project and did not change anything after running "vue create"
Edit: I am on Ubuntu 19.10 Desktop
First of all, what kind of OS you are working on? If you are working on unix based systems, a service (like nginx) could produce this error. If so, try stopping it.
Afterwards I would try to run your application from vue ui.
Type in your terminal:
vue ui
This starts the web based graphical user interface of vue cli. You can handle your app development from there by starting your service and run your build command.
ATTENTION: you must add (import, NOT create) your project (root folder) to the UI.
If you get the same error inside your browser console, set up a vagrant box. First steps are explained here:
https://www.vagrantup.com/intro/getting-started/
Follow instructions for project setup.
Simplest way would be running
vagrant init
inside your project folder. Therefore you don't have to setup a new project.
After running the init command, try running
npm run serve
or use vue UI instead (as explained above), if you prefer it.
If the problem still exists, more infos about your OS would be helpful.

Error when migrating to macOS: TypeError: Cannot read property 'apply' of undefined

I am building a web app using React and Redux on the front end and Node on the back end with Express and MongoDB.
My app runs fine on my Windows machine. Today, I cloned the repository onto my macOS device and ran npm install inside the client and the root directory and then I tried running the application to find this error message pop up:
I'm not sure what this error message means and stack trace displays that the error originates from Redux inside the node_modules folder, which is code I did not write or touch. Here is the repo: https://github.com/furtivepygmy/devconnector
I'm new here, so please go easy on me. I always face issues when moving my workspace between macOS and Windows, however I can't seem to fix this one. Is there something I need to do when migrating between operating systems?

Meteor server crashes very frequently without any error

I am working with the Meteor application and I deployed the same over EC2 instance. It was working fine till a few days back.
But now the server process kill automatically without any error log or
console
I tried to get the error but unfortunately, as there are not any logs I am unable to find out why the server is crashing again and again.
I have a medium EC2 machine on which the application is running.
I am using nohup for running the application in the background.
Below is the command I used to start the server:-
nohup meteor --settings SETTINGS-PRODUCTION.JSON &
I am wondering to know about server crashes due to nohup or some other reason is there.
Please let me know how we can console uncaught exception in the meteor-like we do in express.
What should I use to auto restart the server if the process is killed
by any error or exception?
Any help would be much appreciated!
Thanks
Using nohup is quite a low-tech solution. Things like Phusion Passenger, PM2, or forever do a better job.
Also your docker container can be configured to automatically restart the process.
Even better is a tool called Meteor Up, which makes it really simple to deploy Meteor apps to EC2.
EASILY DEPLOY YOUR APP Meteor Up is a production quality Meteor app
deployment tool.
Install with one command:
$ npm install --global mup
http://meteor-up.com/

How to solve "Access-Control-Allow-Origin"-Issue in vue.js?

Im new to vue.js and webpack. I currently have a very big trouble to archive the next step: communicate with real-world-apis in a dev env.
what i currently do is:
npm run dev
my application calls an remote api to which i have no access.
then i run into the Access-Control-Allow-Origin-Issue.
If i build my application and run it with xampp everything works fine.
What can i do, to simply develope my application instead to hassle with that security thing?
I have tried to create a proxy, so i have already looked at:
npm cors (node-cors-client and node-cors-server) - but how does that apply to my vue app?
socket.io - but it seems to be overkill
http-server - but i got the same issues here
nuxt - could work, but then i need to refactor my vue.js app to nuxt and i dont know if this works then
any suggestions? Thanks!
Solved:
I ended up with a PHP-API
The PHP-API runs with xampp under port 80
The Vue.js-App runs with npm dev server under port 8080
The CORS-Hassle must solved then in the PHP-Script with:
https://stackoverflow.com/a/9866124/3918455

MONGO_URL for running multiple Meteor apps on one server

I have one Meteor application running on my Ubuntu server (Digital Ocean). I use Meteor Up (MUP) to deploy and keep the app running. Everything works fine.
However, when I try to deploy a second app on the same server, something goes wrong in connecting to the MongoDB. I get a long and unreadable error message that starts "Invoking deployment process: FAILED" and then ends with
Waiting for MongoDB to initialize. (5 minutes)
connected
myapp start/running, process 25053
Waiting for 15 seconds while app is booting up
Checking is app booted or not?
myapp stop/waiting
myapp start/running, process 25114
And the app refuses to run. I have tried a number of things to fix this and will edit this post if more info is requested, but I'm not sure what's relevant. Essentially I don't understand the Error message, so I need to know what the heck is going on?
EDIT:
I want to add that my app runs fine if I go into the project folder and use the "meteor" command. Everything runs as expected. It is only when I try to deploy it for long-term production mode with MUP that I get this error.
EDIT:
I moved on to trying mupx instead of mup. This time I can't even get past the installation process, I get the following error message:
[Neal] x Installing MongoDB: FAILED
-----------------------------------STDERR-----------------------------------
Error response from daemon: no such id: mongodb
Error: failed to remove containers: [mongodb]
Error response from daemon: Cannot start container c2c538d34c15103d1d07bcc60b56a54bd3d23e50ae7a8e4f9f7831df0d77dc56: failed to create endpoint mongodb on network bridge: Error starting userland proxy: listen tcp 127.0.0.1:27017: bind: address already in use
But I don't understand why! Mongod is clearly already running on port 27017 and a second application should just add a new database to that instance, correct? I don't know what I'm missing here, why MUP can't access MongoDB.
It's tricky without your mup.json to see what's going on here. Given what you said, it looks like your 2nd app deployment tries to override/boot mongodb over the 1st one which is locked, the mongodb environment fails to boot, causing then the fail. You should tackle this different ways:
If your objective is to share your mongoDB, point the MONGO_URL from your 2nd mup.jon on your first mongodb instance. It's generally something along the 2701X ports. As it's a shared DB, changes in one database could affect the other.
meteor-up oversees the deployment of your app from a meteor-nice-to-test thing to a node+mongodb environment. You can spawn another mongod instance with :
mongod --port 2701X --dbpath /your/dbpath --fork --logpath /log/path on your DO server and then point MONGO_URL there.
Last but not least, mupx having docker under the hood. Using mupx for your deployments should isolate both apps from each other.

Categories