Dockerized Create React App doesn't open a new tab - reactjs

I noticed a strange behavior when running my app with Docker - it doesn't open a new tab.
If I run my app manually with npm/yarn start, tab opens fine.
I don't have "BROWSER=none" in .env

It's because the create-react-app start script tries to open the local browser. Here's one of the relevant parts of the start script:
/**
* Attempts to open the browser with a given URL.
*
* On Mac OS X, attempts to reuse an existing Chrome tab via AppleScript.
*
* Otherwise, falls back to [open](https://github.com/sindresorhus/open) behavior.
*/
declare function openBrowser(url: string): boolean;
export = openBrowser;
However, if your application is running in a docker container, it's like it is running on a separate machine, or VM. Which doesn't have a browser installed.
And the way Docker containers work, they can't just invoke programs of the host machine (without rather complex workarounds).

Related

modifying dotnetify react js to use in cordova application (change path of dotnetify.react.connect)

I am using React app that wraps DotNetify around Cordova to build iOS and Android app.
Dotnetify connects to a WebSocket Server at given URL, we need to define based on build web or Cordova what is the host URL to connect to the Socket/SignalR server, current line is:
dotnetify.react.connect('Login', this);
the definition of Login is actually relative and I need to pre-pend the host URL somehow to tell build where is the WebSocket to connect to.
My assumption is it should be defined somewhere in Package.json to make it look like below:
dotnetify.react.connect('WSS://DEV.DOMAIN.COM/'+'Login', this);
What's the best solution to address this issue for development/debug mode locally or development on a server with public static IP or production server.
I have found base_url that needs to be passed in info object: node_modules/socksjs-client/lib/main.js:183
// allow server to override url used for the actual transport
this._transUrl = info.base_url ? info.base_url : this.url;
So based on above I tried to pass argument, but donetify is not passing this argument to the socksjs. how do we fix this actually?
this.vm = dotnetify.react.connect('Login', this, {"base_url":"wss://dev.domain.com"});
You can use below to set below in your index.js to set the host right before connecting line.
dotnetify.hubServerUrl = 'domain.example.com';

Detaching React js project on Ubuntu

I have created two React projects using React Js. The both of them are for different purposes. One is successfully running on 1.2.3.4:3000 here the port is default (3000) But I have another react project with port 4000. Now how can I run or deploy the second React js(client) on port 4000?
Folder structure
/
|-- adminReact (port 3000)
|
|--clientReact (port 4000)
Thankyou all
I managed this problem with the hekp of linux screen.
I created two screens with meaningful name. Then O run the react projects on different port.
screen -R adminReact
Then go inside the adminRea t directory then start the adminReact project. After successful running, I pressed ctrl + a + d to detach from the screen.
Then type exit will close the screen.
Then takea new putty session. After that create a new screen screen -R clientReact for the clien react projects.Then go inside the folder then start the project, after successful running press ctrl + a + d to detach the screen.
That's it

HTML/JS directory disappears on production server

So, I have a full-stack web application generated with JHipster, I have recently needed to change the name of one of the entities in the webapp area and the template/js files because it was clashing (had the term api in it)
Now it all works just fine in local, but when uploading the application to jenkins for production it just won't want to find the new files
I have tried:
Hard reload / Ctrl + Shift + Del / and opening in a different browser
Erasing the target folder.
Wiping the whole workspace from jenkins.
I created a new item in jenkins.
Changing the href manually in the developer tools
All unsuccesful and result in the same error message
The most annoying thing is that it works like a charm when deploying in local, with both dev and prod profiles.
This is the error message I get on the console, obviously it never reaches the back-end so remote debugging was useless for this:
GET [long url here]/app/entities/trade-drug-capi/trade-drug-capis.html?cacheBuster=1488389348167 404 (Not Found)

Local GAE Datastore is empty after restart on OSX

I'm building a Google App Engine application with a Go backend + Polymer frontend. As a result, I'm using a dispatch.yaml file to serve both at the same time.
The problem I'm facing is that the datastore is empty when I restart my computer. I've tested this on both OSX 10.9.5 and 10.10.4. Both exhibit the same response upon a system reboot. Windows 7, however, seems to hold on to the data.
The documentation suggests that data should persist, since I'm not explicitly calling a clear. It's not. I've tried to set the datastore location myself using this:
dev_appserver.py --datastore_path=~/go_apps/data ~/go_apps/my_app
I'm receiving this error:
google.appengine.tools.devappserver2.errors.AppConfigNotFoundError: "/Users/anthony/go_apps/my_app is a directory but does not contain app.yaml or app.yml
Obviously, since I'm using a dispatch.yaml file, it wouldn't. So, since the backend, which handles the data, does have an app.yaml file, I try to set it there. I use this command:
dev_appserver.py --datastore_path=~/go_apps/data ~/go_apps/my_app/backend
That doesn't seem to work either, as I get this error:
sqlite3.OperationalError: unable to open database file
Okay? Well, not sure where to turn now. From what I could gather from other posts, that data is stored temporarily. But, I can't seem to set a custom, non-temporary location for the data. So, now I'm populating a datastore every time I reboot, which seems ridiculous.
* Edit *
I've tried the following, which seems like it tries to launch the app, and creates a datastore.db file at the correct location:
dev_appserver.py --datastore_path ~/go_apps/my_app/data/datastore.db ~/go_apps/my_app/dispatch.yaml ~/go_apps/my_app/backend/app.yaml ~/go_apps/my_app/frontend/app.yaml
However, I'm getting a weird error now:
/var/folders/04/3hxnpxc15wj2k4v40lkdncd00000gn/T/tmpkcQYnFappengine-go-bin/backend.go:13: can't find import: "github.com/gorilla/mux"
Does Go build to that folder temporarily? That import is definitely available, and always builds fine calling goapp serve.
Here is what my imports look like on backend.go
import (
//standard library
"fmt"
"net/http"
"time"
"log"
//third party
"github.com/gorilla/mux"
"github.com/gorilla/securecookie"
"github.com/dgrijalva/jwt-go"
"golang.org/x/crypto/bcrypt"
//my imports
"github.com/section14/go_polymer_comm_pkg/controller"
)
You have to pass the name of the file to be used as the persisted datastore, not a folder.
And next provide the folder of your app (which contains app.yaml). Don't mix the 2. So it should be something like:
dev_appserver.py --datastore_path=~/my_app/my_app.db ~/go_apps/my_app
Details can be found here:
The Go Development Server / Using the Datastore
Notes:
The default datastore file is in the temp folder, and your OS-X most likely clears that on system restart, that's why it is not preserved for you. On the other hand Windows 7 for example does not clear the temp folder on system restarts.
Got it up and running by adding both GOPATH and GOROOT environment variables to my .bash_profile. In total, these three paths (first path was already set) are needed for it to run:
# Add Google AppEngine path
export PATH=/Users/anthony/go_appengine:$PATH
# GOPATH
export GOPATH=/Users/anthony/go_appengine/gopath
export PATH=$PATH:$GOPATH
# GOROOT
export GOROOT=/Users/anthony/go_appengine/goroot
export PATH=$PATH:$GOROOT
This command is called from inside the project folder (mine resides outside of the appengine folder) for it to launch:
dev_appserver.py --datastore_path data/datastore.db dispatch.yaml backend/app.yaml frontend/app.yaml
Notice that the .yaml files are still there. It builds fine with them, and probably builds fine without them if you don't need a dispatch.yaml file.
Thanks #icza for the direction. Wanted to organize the steps in a post for easier reading.

Cannot access Node.js API in my Angular app due to WebStorm's built-in server port mismatch

I am trying to follow the tutorial on creating a MEAN app on scotch.io.
I am using the WebStorm IDE and after completely following through I am stuck with a problem that seems to emerge from WebStorm. If I click on the "Open in Chrome"-Button in the IDE I am referred to:
localhost:63342/scotch_mean_tutorial/views/index.html
However, the actual port that I specified in my server.js is 8080 file:
// listen (start app with node server.js) ======================
app.listen(8080);
console.log("App listening on port 8080");
I have built a node API and it works when I go to:
http://localhost:8080/api/todos
However, clicking on the "Open in Chrome" through my WebStorm IDE uses a different port (i.e. 63342) and thus I am left with the following error:
GET http://localhost:63342/api/todos 404 (Not Found)
I am not sure how to resolve this? Any ideas?
You need to create a javascript debug run configuration with the correct URL (http://localhost:8080/api/todos) and use this configuration to open your URL in browser. Another option: specify this URL in Live Edit/Browser tab of node.js run configuration you use to run your server.js and tick 'after launch' checkbox to automatically start the browser with this URL on server start.
In Webstorm 9, you can configure the port for debugging apps. In Preferences:
Build, Execution, Deployment > Debugger > Built-in Server Port

Resources