Im trying to make a plugin for require.js that allows me to call an external api, convert the json response and save it to a file.
Problems:
Im not sure if I am writing the plugin correctly
I cant seem to use node filesystem - though i am using r.js
I am hoping to do this on build, so that the file is ready before concat method happens (putting all files into one)
Is this even possible? Should I use a grunt task instead?
Any pointers or examples or tutorials or anything would be really useful.
In the end I used, https://npmjs.org/package/grunt-curl.
Was alot easier, and just modified the file a bit to wrap the response in define();
It allows the files to be downloaded on build and required later in the app
Related
I've just started my IT degree and I'm a beginner to the use of APIs (and forums like this) so I am truly sorry if my question is to vaguely explained or if it is just plain stupid :), on top of that I'm not a native English speaker :P. Okay, so I'm trying to use Google trends' api which I installed in my server with putty by using sudo npm install google-trends-api. (it can be found here https://www.npmjs.com/package/google-trends-api#installation) As I undestand it, this is a server side api so the scripts that I write with the methods provided for this api will not run on an explorer as normal js files do. There is an example that makes use of the API that I found on the page which is as follows
var googleTrends = requite('google-trends-api');
googleTrends.hotTrends('US')
.then(function(results){
console.log(results);
})
.catch(function(err){
console.log(err);
});
this outputs a list of 20 items on the console when I use it on node.
I would like to know if there is a way to assign those results to a variable and then use that variable in a normal javascript script inside a html file. I do not know anything about node.js and the like, and I would like to actually do some research instead of asking here but I was going to use a different approach to acquire such information but now I've had to change my plans and do not have enough time and given I consider this is a fairly easy problem to resolve (maybe?) I would really appreciate it if someone could walk me through the basics of each step. THanks :) and have a nice day.
Your question is quite broad. Node.js is Chrome's V8 engine bundled with some libraries to do I/O and networking. This enables us to JavaScript outside of the browser and to create backend services or servers in general (in your case). I hope that you are aware of this difference :)
The first thing that you have to do, is to have a look at express.js and to create a simple server. It will not be more than 20 lines of code. Then you have to enrich this with more stuff like a template engine (handlebars.js, jade etc). You have to enable the server to serve static files that will be finally your js, css and image files. Creating this simple server you will be able to serve simple html page in the first place. On top of that you should have the client side javascript that you have to write and now you can use the module above. Unfortunately, you are not able to use this module directly on a javascript file that you will write. To be able to use this module you have to transcompile this thing into javascript that browser understand*. Remember that browser does not understand the require statement and some old browsers possibly will have issues with the promises that this module is using. These are the things that should be compiled. You have to use a tool like browserify for this and the compiled file that this will extract it must be included in the scripts of your html page.
Maybe there are quite a lot of concepts that you are not aware of or you don't understand them but spend a bit of time to understand them.
P.S.: I' ve replied under the assumption that google-trends-api module does not use things that are specific to node.js like the file-system for example.
Are there any existing solutions for run-time bundling of ES6 modules?
I'm looking to simplify JavaScript code development in a MVC5 web app. We're having issues with large, unwieldy JS files, so I'm hoping to get a module loader system in place. So far, I'm not finding any existing bundle transformers for ES6 or another module loader format. I'd be fine with using TypeScript or nodejs require style. I prefer not to use require.js style, though.
Perhaps there's a good reason this solution doesn't exist already. Maybe the dependency resolution processing is too much for a run-time bundling solution. But, I figure it's worth a shot to ask.
Solutions Considered
Prebuilt Web Client
Ultimately, this is where I want to be, but I need a stop-gap solution for now. I know how to put together a build system for an HTML client using grunt/gulp/webpack. But I don't want to have to tell developers to run webpack -w or something similar during development. Nor do I want to tell them to rebuild a solution for every JS change. They should be able to modify the file, refresh the browser, and see the change.
Directory Structure
This is the route I'll probably end up going with. Basically, this JS codebase consists of jQuery widgets and plain JS (helpers/common functions). So, if I structure the code in this directory structure and include the js dir, it should get me most of the way there:
js (DIR)
app-start.js
helpers (DIR)
widgets (DIR)
Widgets should be fine. Helpers, I can see issues where one function/class depends on another. Though, since a function call should never start with a helper (only a widget), this should work fine, assuming no globals are used (or maybe one global like 'App').
I'm building an app that will contain many js (jquery) modules (files) using the following setup;
The build is run using Grunt task runner.
I use handlebars templates, then generate the html from *.hbs files.
During the build, I uglify all the js files into one minified file.
I call the minified file in my application <script src="assets/js/app.min.js"></script>
Now, I want to use requirejs to organize my code and adhere to the AMD specifications..
But I got 3 problems with this approach:
I need to have 1 single minified file for all the js; this keeps my code harder to "decode" thus to copy (since it is mixed with other dependencies; jquery, modernizer..) and also helps avoid extra http requests if scripts are called individually.. However, requirejs needs a main file to initialize the app and inside that main file It calls the other required files.. I don't have such configuration.
Many of the dependencies I'm using are in a bower package (that I don't include in the distribution); this makes it not possible to call those files using the suggested requirejs method.
I'm using jquery on this with some 3rd party plugins that don't call define(); to make them work I have to use shim config which again rises the problem #2!
So how am I supposed to take advantage of requirejs while keeping my code in modules and well organized?
Sorry for the long question and thanks for reading :)
ps: Feel free to change the title of the question as I couldn't find a better one!
I finally opted for AngularJS as it adheres to my setup above and allows me to split my app into manageable small modules.
I have also the possibility to use the ease of jQuery (even though it is not a best practice among angular community) and much more.
I am trying to build a sort of plugin manager that can reload external source files on the fly without actually shutting down the node app. Just as a quick proof of concept is just eval'd my plugin files that simply are just functions being prototyped to a class. Everything seemed to work great, except that I cant seem to get the scoping right. The functions get evaluated and prototyped, but im not sure why the functions cant grab global vars. Does anyone have any advice on this?
Rather than manually loading the file, you could just rely on require.
Now, the only problem is that require has an internal cache and will only load modules once. However, you can force it to unload with this quick workaround:
delete require.cache[require.resolve(myPlugin)];
require(myPlugin);
So, I'm developing a node.js app that will show some markers in google maps according to the locations it finds in the database, which will then be converted and saved to a .txt file. Everything works great up until that point.
If i do a console.log() of the converted latitudes and longitudes it will show them perfectly.
However, in the .html file with the maps api i have to import the file that will return the coordinates.
Since this file is written in html with script tags to import the script, it interprets those scripts as javascript, and because of that, it stops working.
Firebug shows me that the file is found and shows me the content of it, but in the .js script file i have to do stuff like this to use node.js modules, that are necessary for my functions to work.
var fs = require('node-fs');
or like this to use functions in the file from other modules.
exports.someFunction = someFunction;
So, when the browser loads the map and tries to find the coordinates that i'm passing from the script that reads the .txt file where they're saved, it finds any of those two things and can't process them, because they're node.js, not plain javascript.
So my question is, how do i get javascript to recognize require() and exports when they're node.js commands?
If I understand you correctly and you're trying to use Node.js module system in browsers, that won't work. Browsers doesn't implement such features natively. Script files can only be included to the page with script tags or some kind of ajax system that fetches the files from the server. There are few such a libraries that provide such a functionalities.
RequireJS might be what you're looking for the client side though.
RequireJS is a JavaScript file and module loader. It is optimized for in-browser use, but it can be used in other JavaScript environments, like Rhino and Node. Using a modular script loader like RequireJS will improve the speed and quality of your code.
Also note that some of the Node.js features are not possible in the browsers. For example the direct file system access is not possible in the browsers, it would be a huge security risk.
Most javascript modules that provide both server and client side functionalities explicitly mentions it and provide separate script files for both sides.
Also if you only want to send coordinate data from the server to the client, then it might be good to use Ajax or WebSocket to send the data in a JSON format.