Setting build mode flags in angular app - angularjs

I have a scenario in my angular app where I want to set some properties based on whether the app has been built in debug or release mode from a build task in my gulp file.
Basically I have code that should only be run when the app is built in debug mode (some code that uses the $interval service).
All I can think of right now is setting an angular constant to say what mode the app is running in, but it would mean changing it each time I want to build for debug or production\release mode. It would be nice if I can somehow get the build tasks to set some global that the client side angular app can get at.
I'm using Express as well, so I did wonder if maybe an environment variable could somehow be supplied to the client side code?
Has anyone encountered a similar situation and can offer suggestions for a suitable solution?

Related

What is the Runtime Environment for React Application and what is the request-response flow in React application

Till now I worked on Java based web applications and recently started working on ReactJS applications. Below questions are running in my mind and I appreciate your help in providing solutions for below questions:
I came to know that Babel is going to convert the ECMAScript2015+ code and the JSX code to ECMAScript2015 so that the browser will understand it. So does this translation will happen when we compile the React project using "npm"? And if it happens during the compilation, does the Babel will convert the entire code in the whole project at a time (or) will Babel converts the file which is requested by the client?
Once after creating and developing the React code, we are using Node software to install all the required dependent libraries which are used in our React code and also "npm start" command to start the react application. So here I want to know if NodeJS is the server which runs the React applications and without NodeJS we cannot run React application as a standalone?
When we take Java based web application, that Java application will be running in a server computer and Jboss or Websphere Application Server etc... are responsible of running the Java web application EAR project. Then when a client makes a request to any resource in the EAR, then the server will take the request and send the response as an HTML to the client.
In the same way I want to know how this request response cycle works in React Application? For example, if the react application is running in a server computer and NodeJS has started the React Application in the sever computer, then when the client invokes the React application using the URL corresponding to the React Project, then what the server is going to send back to the client/browser? As Babel will convert the React application to the plain JavaScript (which is understandable to the Browser) and so does the server will be returning the Javascript back to the client?
If the server returns the Javascript code to the client/browser, will the server returns back the Javascript code of the entire React project (all files) to the client or will the server returns the Javascript version of ONLY the request file?
React is a front-end library, which runs in the browser. Like any other frontend library (jQuery, etc), it is happy to be served by any old webserver – Apache, NGINX.
The react application will communicate with the backend in the form of REST API calls, which will only produce the dynamic data rather than the HTML.
The HTML is drawn using the JSX on the frontend (https://reactjs.org/docs/introducing-jsx.html)
The compilation happens every time you start your project (say npm start) or, if the project is already running, on any saved changes, it will recomplile every time as well as give you any errors found during compilation.
Yes, the NodeJS will be the one serving content. Technically, you can still use React as standalone. See This tidbit in official ReactJS Documentation
I'm not really great with technicalities behind React inner workings, so anyone competent feel free to correct me on this, but your server will serve JavaScript code to your browser already working and compiled fully so that even if the React server stops running (terminated or any other reason), you will still be able to work with most of the application since the data has been already loaded. There may be libraries/packages that allow lazy loading of components, but that depends on your usecase, I guess.
See my final bits in the previous point.
Hope this helped you in some way

How can I build a Go app with a ReactJS GUI in a single binary?

I would like to develop a Go application with a ReactJS "GUI".
My point is to launch a single binary "app" that launch a server at "localhost:someport" serving a ReactJS app.
I would like my actions in the ReactApp to be taken into account in the Go-side app.
I can do a Websocket-based ReactJS-Go application but I'd like everything to be bundled into a single binary.
I've followed this : https://medium.com/#esslamben/serving-static-sites-with-go-55bfc1ae4495.
This tutorial helped me to serve static files (a React App) with a single file.
But, I don't know how to continue to satisfy my wishes.
The thing I would like to achieve is the behavior like the old "RethinkDB".
When you run "rethinkdb.exe" in command line, it notifies a administration panel is running on 8080 port.
Navigating through localhost:8080 enables to administrate the database with a web-based GUI.
Does someone have advice to help me to obtain such a behavior?
You cant make binary for your React code , it should be copied
Your react built code (I assume static ) and put it in a specific path
Use Go http FileServer handler to serve the app as static one.
This might work or may not , I am not sure what are the bindings which is necessary should alos be copied. (your node modules and additional libraries you use it in your package.json)
Put your *.js binary data inside an HTTP handler to serve the client.
Store your js file as an []byte inside your application.

Running angular app without server - By double clicking the html file

I have developed an Angular assignment using $http.get service calls to get JSON data, routing($routeProvider) among other features.
The problem is that the assignee (the person checking my assignment) does not have Node.js or server installed to run the app on their end.
Is there any work around for this issue so that assignee can make this work on his end?
Can I make an executable batch file like we do with Java programs?
Otherwise what features of Angular do I need to change, to make the application independent?

Angular App to AppGyver- Port to Mobile Solution

I'm beginner to appgyver steroids.
I have angular project. Now I need to make iOS application using AppGyver.
Instead of modify root view and point it to my angular app url (http://www.yourapp.com) can I add my angular app source / angular project build to AppGyver project make it iOS application.
Appreciate your comments
Gayan
You can run steroids create yourApp. This will walk you through the generation of a multi page or single page application. You can then move the structure of your angular application into the /app folder. Check out the example that the steroids create method generates and see the structure there.
You may notice some differences at first. It may take some testing to see what is failing if anything once you port things over. If you used $rootScope for anything it is not as reliable in my experience in an iOS or Android application. There are other methods for passing data between views and broadcasting (publish/subscribe) to other controllers.
You will want to use the iOS simulator or http://localhost:4567/app/moduleName/oneOfYourViewsYouAreTesting.html in your favorite browser while steroids connect is running to debug.
The version of Angular that is coming with this now is AngularJS v1.3.15 installed via bower. You may want to verify things are compatible with your current Angular version.
Ionic is used and Supersonic so you may see conflict with existing CSS or even javascript depending on what you've implemented.
There will be some tricks to learn about preloading views in the structure.coffee file and load times / rootView / initialView. There is lots of support if you come across any issues.
This forum has been really helpful in figuring out any issues I've come across. The Appgyver team is usually pretty responsive to questions directly as well.
They are updating the platform in a few days, and they say big changes are coming. They are hiring a lot of developers right now to take care of GitHub issues as well as build out the rest of their incomplete components.

Is server required to run some CLIENT side DART apps using Polyemer.dart and/or Angular.Dart?

Not sure how to tell my point where, hopei make it as clear as possible.
I tried running some apps that are using Polymer and/or AngularDart, including:
https://www.dartlang.org/docs/tutorials/forms/#about-the-slambook-example
http://bwu-dart.github.io/users
the apps works very fine, one I run them using, "Pub serve" (Aka Ctrl+R from Dart editor), but once I run from the Dartium using the file "URL" things are not working well!!
I got an answer in Dartisans' google+ community the web server is a mus (https://plus.google.com/u/0/110229866977286723923/posts/UAH8ez51S53), is this means neither Polymer nor AngularDarrt are pure client side! by pure client side I mean can run from the file URL, without a web server.
I was thinking to make small app, for learning and testing, and packing it into 2 forms:
1. as Android APK using Android web view, but as server is required
2. as Chrome app
but having both need a web server, and the JavaScript conversion (build) is not acting similar to the output using the file URL, i.e. not completely as required, I got stuck!
Note: I'm using Windows 7, 64x, latest edition of Dart (Dev. 1.6.0), and latest edition of both AngularDart and PolymerDart.
any thought or idea pls
You need a server to serve static content because there are a lot of features with those libraries that are pulling your resources in dynamically. This isn't a Dart or Polymer issue, this is a browser security feature. By default, you can't make AJAX calls to your local machine. Pub serve is handling this for you, but you can chose any server you want to serve your local assets.
Contrary to some of what the other answers are saying, you don't need to build your Dart code when you're in Dartium. Dartium has the Dart VM built in for that very reason.
AFAIK you only need a server, but you need to generate some code, your development code can't directly go to your server, you need to do something like pub build, to make the code ready to be served directly.
You don't need a server, but you do need to build your code. pub serve does this automatically (and keeps on doing it as you change your code, so it's perfect for development), but to be able to use a file:// url, you need to run pub build first, and use the files generated in the build directory.
This is the same issue as discussed here https://stackoverflow.com/a/25248166/217408
and here I tried to reproduce and wasn't able.
After running pub build you can open the build output using a file URL just fine.
Polymer and Angular are definitely pure client side (if you want to use them this way).
That you can't run the Dart code without running pub build first is a bug in DI (used by Angular.dart and bwu_polymer_routing. DI currently requires some code generation that is done only when pub build or pub serve is run.
See also
- https://github.com/angular/angular.dart/issues/1344
- https://github.com/angular/angular.dart/issues/1276
You can try to use the workaround mentioned in issue 1276
Module.DEFAULT_REFLECTOR = new DynamicTypeFactories();

Resources