Inject JS into a live site from localhost - javascript

I'm working with Monetate, a testing tool which injects JS into our clients sites once the targeted page has loaded. Although Monetate is great for tests it is not good for developing and there is no community for it. I'm looking for a way to have a dev setup (express server, gulp task runner, sass etc) and to dynamically inject the JS and CSS files into our clients sites, simulating Monetate. I've been trying browser-sync but I can't seem to inject files from my local server into a live site. Any ideas would be most welcome!

Related

Building SPA frontend without node/npm

I'm a back-end java developer (spring boot) and currently I'm interested in building a single page application.
What I like about SPA frameworks (mostly Vue):
Model-binding (saves boilerplate code)
Components and templates (separating code in multiple files is always good, but I don't like single file components as I feel they mix the view and logic)
Routers
However, unless you are using Node there seems to be poor integration
What I don't like:
Node (I develop backend in Java so I don't want to install node just as a prerequisite for NPM)
NPM (I already have dependency management in Maven/Gradle. I actually don't mind it as much, I just don't want to install it and manage it seperately)
I understand why stuff like Node, Npm, Webpack is necessary, it's just that I've already have Java/Spring/Eclipse doing all that for me. I have no desire to have basically two separate build processes.
TLDR: I like the direction and architecture of modern frontend, I just don't want to deal with the tools that are used.
Specific Question: How can I develop a modern SPA using Spring Boot, Gradle/Maven and Vue.js and not have to install Node/Npm/Vue cli etc. What are the best tools if there are any?
Thank you.
You can use maven frontend plugin hosted from here.
It is maven plugin that is leveraging downloading nodejs, webpack, gulp, grunt and running it on your codebase.
You will be able to run maven build and nodejs will be downloaded automatically. It will run your frontend build as well and in resulting jar you will have only necessary minified files.
However, you have to be aware that if you want to debug your frontend application it is a good idea to have those things installed and being able to run the app locally without minification of html and js files.
If you don`t want to download tools you can use helper scripts provided by authors of this plugin to use tools downloaded by this plugin.

Meteor integrating bought theme/js freezes meteor server

I have a bought One ui theme that I'm trying to integrate into Meteor.
I have browsed stack overflow for the solution for hours and I'm stuck.
I have copied the complete assets folder into a newly made imports directory on the client side and tried to use import on the client main.js to import the modules I need. The problem with this is that when I run the server with meteor --port xxxx it hangs up on building web application and just freezes.
I have also tried putting it in a client/compatibility folder for the javascript and it doesn't seem to work.
Does anyone have any insight into this?
For the static html I just created a new template with the html and that worked.
Client/lib is where you put your JS libraries.
rootproject/public is where you put your static assets(images/fonts).
Look for packages on atmosphere.js and check if they are compatible with what you're trying to do. This is the most confusing step because the package names will not exactly be the same as the third party js libs. Trial and error.
Any third party js files you can't find on atmosphere.js you dump the js files in client/lib.

How autocopy (on each save action) file in Intellij Idea to other directory?

I have java project with html/js files. These files are packaged by maven and deployed to Java EE application server.
To modify one symbol I (theoretically) need to recompile, repackage and redeploy whole project. In practice change html/js in Intellij Idea project and copy them directly to application server manually.
May be Idea support automatically coping files on save action?
If you use IDEA Ultimate (paid) edition, it supports creating Run/Debug configurations for application servers.
This allows you to create, deploy your application and test/debug within IDEA, without building with Maven.
For example, if you use Tomcat:
Once you launch this configuration, you'll get a convenient redeploy button.

hooking into Google App Engine's deploy

The Google App Engine Launcher has a nice little "Deploy" button that will push my changes to prod. However, I'd like to be able to minify/obfuscate my JavaScript before deploying.
I've read about several tools that can do this: Google Closure Compiler, Uglify.js, YUI Compressor. Of course, I could do this manually before deploying, but I'd much rather be able to have this run automatically.
Is there a way to hook into App Engine's deploy process, and run a minification/obfuscation task on my JavaScript? If not, any suggestions on other approaches?
As already mentioned minifying and obfuscating the code depends on the specific setup of your app and has to be done before deploying on App Engine.
That was one of the main reasons that I started the gae-init project. Among other things it has a custom script that combines and minifies all the static files (JS/CSS) before deploying, while when running locally keeping them as they are.
Not sure if there's a way to hook to "App Engine Launcher" but all it does is run a appcfg.py update myapp/ command where myapp/ is your app directory. You could simply create your own shell/batch file where you first minify the files and then deploy them by running the command above.
Also, take a look at Google's Pagespeed service that comes with paid App Engine projects where css/js/etc is minified automatically on Google's servers.

How to use New Relic with ember-cli?

right now I'm running an ember-cli application on heroku by serving it with the ember server command (not sure if this is the best method) and I'd like to integrate it with New Relic, but I have no idea how to do it.
Careful, ember server starts a live-reload server for development purposes — you edit a file, save it, and the application gets rebuild in an instant — you should not use it to serve an Ember app in production, it's a potential security risk. Normally you run ember server only on your local computer where you develop the code.
For production, build your app with ember build --environment=production, that will create a set of static files in your project's dist/ directory. You can upload these as you would upload any HTML/CSS/Javascript.
Keep in mind that Ember (and other frameworks of this kind like Angular and Backbone) is a single page application (SPA) framework; there is no server-side code at all, it all runs in the browser. Usually you would provide some sort of API (like a REST-API) on the server to provide and process data from a database or to provide other server-side services. That way you can develop the front and back-end separately.
I'm not too familiar with New Relic, but as far as I can tell it is analytics software that runs on the back-end, so it has nothing to do with your browser-side framework.
At the server folder, just find the index.js file and add require('newrelic'); at the beginning of the file. Of course you should also follow the instructions when you setup New Relic at you Heroku App, setting your application as a node.js app, which means you'll have to run npm install --save newrelic, go to your node_modules folder, find newrelic, copy newrelic.js file to the root of your application and edit the file with your app_name and license_key.
I recently removed my code from <meta ... in app/index.html and started to use this addon Ember-new-relic.
Get the JavaScript snippet.
And add it below <meta http-equiv="X-UA-Compatible"... in app/index.html.

Categories

Resources