running a Development server on NextJS (on the network) - javascript

While using ReactJS, when we use the command npm start, It starts the development server on localhost:3000 and also on the network, 192.168.1.2:3000
This was super easy, I could test my app on all the devices by going into that address.
Recently I started learning NextJS and when I run the command npm run dev, I only see that it starts the development server on the local machine, not on the network. Is there a way to make it work just like it did with pure reactjs?

It also listens on your local IP, just find out your local ip and do "192.168.1.x:3000" -- this would be your IP , you will see the server running on that port.
To find local IP:
Open your terminal and run the command ipconfig for windows or ifconfig for MacBook. You'll see the network you're currently connected to, the IPv4 address being the current local IP address.

As #Deepinder Singh mentioned, Next.js dev server already listens on your local network.
To get your local network IP address run the following command. (tested only on mac)
ipconfig getifaddr en0

Mac/Linux
To find your local IP easily, you can use:
ifconfig | grep 'inet '
Then if you're on the same network, just navigate to http://YOUR_LOCAL_IP:3000

I can see you may be confused by the addres "0.0.0.0" you're seeing. But kindly go to your terminal and check your local ip address using the following command
ipconfig
then check the IPV4 address you see and use it instead of "0.0.0.0" and you're good to go.. for instance "192.168.43.131:3000"

Related

Connecting to Mosquitto broker with username and password using mqtt.js

I am using JavaScript / mqtt.js to connect to a Mosquitto broker.
I had everything working, and then I upgraded to the Mosquitto version 2.0.15, and now I cannot connect to the broker.
Could you read the following, and see if you have any suggestions, plase.
Thanks
Garrett
OLD SET UP
I had v1.6.9 Mosquitto installed and running on Ubuntu (in Google Cloud).
I was able to communicate with the broker using:
desktop web client
MQTT Explorer
JavaScript using mqtt.js
NEW SETUP
I upgraded to latest Mosquitto version 2.0.15.
I had to create a username and password, so I used the instructions here:
https://mosquitto.org/documentation/authentication-methods/
I edited the mosquito.conf file, so it knows about the password file.
I restarted the VM and then started Mosquitto.
WHAT STILL WORKS
Now, I am able to communicate with the broker (with username/password) using:
desktop web client
MQTT Explorer
But not
JavaScript using mqtt.js
mqtt.js connect options
In JavaScript, my connect options used to be of the form (for v1.6.9):
const connection_options = {
port: 1883,
host: host,
clientId: client_id,
clean: true,
keepalive: false,
reconnectPeriod: 5000
};
where host is the IP address of the machine
And are now of the form (for v2.0.15):
const connection_options = {
port: 1883,
host: host,
username: ‘user’,
password: ‘password’,
clientId: client_id,
clean: true,
keepalive: false,
reconnectPeriod: 5000
};
I have double checked the username / password values etc.
UPDATE
Here are the contents of my mosquitto.conf file:
listener 1883
password_file /etc/mosquitto/mypasswordfile
pid_file /var/run/mosquitto.pid
persistence true
persistence_location /var/lib/mosquitto/
log_dest file /var/log/mosquitto/mosquitto.log
include_dir /etc/mosquitto/conf.d
Note: I also tried adding the following line to the .conf file:
allow_anonymous true
But that didn't solve anything.
Here’s another thing – possibly a distraction, or maybe there’s a clue in here:
In the past, if I stated Mosquitto with the following command
mosquitto -v
the communications would be outputted to the console (I could see all the PUBLISH and PUBACKS etc.). But if I started the broker with this command
sudo systemctl start mosquitto
I wouldn’t get any output to the console. Which makes sense. But now that I have upgraded to the latest Mosquitto, when I run the command
mosquitto -v
it says it is only starting in local only mode.
Even though I have a username/password file defined.
And when I start the broker this way I CANNOT connect to it with the web client or MQTT explorer. But when I start it with this command
sudo systemctl start mosquitto
the web client and mqtt explorer CAN connect to the broker, it's just the mqtt.js code that can't. So I don't really understand the difference. However, the fact remains that when starting with
sudo systemctl start mosquitto
my web client and mqtt explorer have no problem on that port etc., but something is still missing from the mqtt.js code.
So, in summary:
After updating to the latest Mosquitto version (and restarting VM and Mosquitto), my mqtt.js code does NOT connect with the broker anymore, but the web client and MQTT Explorer do.
All 3 of these (mqtt.js, web client, mqtt explorer) use the SAME port, the SAME ip address, the SAME user name and password.
The only change I made to the Javascript was to add the username and password.
So obviously this is not enough - although I cannot find any documentation about any other changes I need to make.
Any help / suggestions greatly appreciated
I solved the issue.
Once I turned logging on, I got some very helpful information
Note 1: I hadn't turned logging on because I am new to mosquitto, linux, mqtt - and I hadn't worked out how to do it!
Note 2: Thank you hardlib for prodding me a few times to get the logs.
What I saw, when I tried to connect with mqtt.js was:
Bad socket read/write on client my_publisher: Invalid arguments provided.
I found this on the github forum:
https://github.com/eclipse/mosquitto/issues/2462
I have only skimmed through it – I will re-read the full thing later.
The issue is the keep alive (seconds) value.
If it is set 0 or false, I couldn’t connect.
Once I set it to a non-zero value, I can connect.
I think there is a different way to get around this, a setting to allow keep alive to be zero, but I will look into this later.
I think it only affects certain versions of Mosquitto (and obviously the latest version).

localhost:3000 is not working in the browser

Backend: Express server, with npx create-express-api backend
Frontend: Next.js, with npx create-react-app frontend
I have implemented these command in my root folder and trying to run npm start xxx to check if they are still working or not. But they are not working in my http://localhost:3000
Though they are working in this link http://172.27.178.192:3000 (on my network)
This is the image showing the problem
I have changed browsers and still the same problem is appearing. On the browser it says
Unable to connect
Firefox can’t establish a connection to the server at localhost:3000.
netstat -ano | findstr :8080
Then the PID will appear at the right which you can kill with taskkill.
The last number the pid.
then:
taskkill/pid 11704 /F
How to close TCP and UDP ports via windows command line
I think some other application occupied your 3000 port. try find which one is. If you have found then closed and try again.
For instance you want to free the port 3000 Then, follow these commands.
netstat -ano
taskkill /f /im [PID of the port 3000 got from previous command]
How to close TCP and UDP ports via windows command line
in browser history search for localhost:3000 and delete all of them.
make sure you closed all terminalls(check vscode too) and all tabs in your browsers.
in new widnows terminal npx kill-port 3000 do it in WSL2 terminall too.
make sure your firewall is turn of.
restart you computer.
It worked for me
Delete the .next folder ( if your working on nextjs ) and try npm run dev command OR
Move the project to another folder location OR
Take back up of the code and delete the project and then run the same project again
You can try all of the above also

sending console JS commands to an Electron app

I'm looking to automate an existing Electron app. It gives access to the Developer Tools, so I could just paste Javascript code into the console, but there must be a way to do this remotely, ideally using Node or from the Terminal?
I've seen this option for running Chrome : --remote-debugging-port=9222 ... that hints at a solution but I can't seem to get closer.
If you launch your Electron app with --remote-debugging-port=9222 then you will enable remote debugging via Chrome DevTools protocol. You can use a Chrome developer tools instance as a client, or use one of the clients here: https://github.com/ChromeDevTools/awesome-chrome-devtools#chrome-devtools-protocol
The debuggable Chrome instance will be running on localhost:9222. Which means as long as you are trying to debug from the same machine you are fine. However if you want to debug from a remote machine you need some additional setup.
Setup an SSH tunnel on the source machine:
ssh -L 0.0.0.0:9223:localhost:9222 localhost -N
This will accept incoming traffic on the 9223 port and route it to Chrome remote debugging.
Then on your client machine use the address: source-machine-ip:9223 to access the remote debugging.
Note: This may not work on Windows without additional SSH setup as SSH is not prepackaged with Windows.

React native running on the device error

my react native app wont run when the device is connected on my laptop.. but the app will run successfully on genymotion. I dont know what the problem is. Can anyone suggest me some solutions to this problem. Thank you
This is problem i get on my device, but no problem when running on genymotion
check this out, probably you not set up your dev server
https://facebook.github.io/react-native/docs/running-on-device-android.html#configure-your-app-to-connect-to-the-local-dev-server-via-wi-fi
Make sure your laptop and your phone are on the same Wi-Fi network.
Open your React Native app on your device. You can do this the same way you'd open any other app.
You'll see a red screen with an error. This is OK. The following steps will fix that.
Open the Developer menu by shaking the device or running adb shell input keyevent 82 from the command line.
Go to Dev Settings.
Go to Debug server host for device.
Type in your machine's IP address and the port of the local dev server (e.g. 10.0.1.1:8081). On Mac, you can find the IP address in System Preferences / Network. On Windows, open the command prompt and type ipconfig to find your machine's IP address (more info).
Go back to the Developer menu and select Reload JS.
what your android version device ?
the first think should you do after your plugg in your device via usb, check that your device is properly connecting to ADB by running adb devices.
Open your cmd find your adb directory path example : C:\Users\your_name\AppData\Local\Android\sdk\platform-tools
Run $ adb devices and see list devices attached. U must have one devices only one device connected at a time.
After check devices are connected and then run your app $ react-native run-android.
If your android version 5.0 lollipop running the following in your cmd $ adb reverse tcp:8081 tcp:8081 and you can reload your aplication, but if still error you can run via wi-fi, you can use this tutorial if you run via wi-fi, but you'll first need to install the app on your device using a USB cable.

Setting for open application(consist of Node.js and Redis) to the public

There are some problems about Scrumblr(GPL Web Application).
Scrumblr consist of Node.js and Redis.
This is Github url : https://github.com/aliasaria/scrumblr .
I run "scrumblr" at localhost:8080 on Ubuntu 11.10.
I configured global IP address on my Ubuntu.
However, I can't access Scrumblr when I accessed "http://global IP address:8080/".
(Error message: Can't establish a connection to the server )
How should I modify scrumblr's source code?
So, please tell me place(directory, file)where I should modify to access Scrumblr via "http://global IP address:8080/".
What I usually do is open up the port 8080 in my firewall so I CAN access it externally, then server the app with localhost:8080 -- sometimes you may have to bind that to an ip, but I'm not sure. I use express which basically takes care of that for me.
Then I edit my /etc/hosts file and map foo.myapp to my public ip address...then I can browse to http://foo.myapp:8080 from anywhere.

Categories

Resources