I’m good at jQuery but I’m new to modern js frameworks introduced over the last couple of years. I understand how index.html works in the following example and I can infer that server.js serves the request made from index.html. However, I’m not clear on how server.js gets initialized.
http://codeforgeek.com/2014/07/send-e-mail-node-js/#comment-18703
There does not appear to be a src ref from index.html to server.js which appears to indicate that server.js gets initialized in some other way although that's all I'm able to infer. This is a knowledge gap on my end but can you explain how to initialize server.js so that it can be called by index.html?
Node.js is a platform built on top of javascript. Non blocking threads due to its asynchronous behaviour, still event driven.
Node.js provision many use cases. You can refer this & this.
Coming to your point is required to create a webserver on top of node.js http/https modules. Once this server started by nodejs, it is ready to serve http clients.
Open source dev communities built some of great web app framework like express which are easy to learn. github, npmjs are full of great node modules / packages which are ready to plug into your app.
Related
I have been using webpack hot reload in development and it is awesome. It saves me a lot of time. I have been searching over the web today to get a good grasp of how it actually works and have not found any good explanation about the internal working of it. So, I am asking here to get a good understanding of how it actually works.
I have come a bit in my mini hot reload project. For now, I have set up a node server and a simple client side Javascript code. The client is connected to the server via websocket and the server fires change events to client based on fs.watch function from node.jsthat watched my code folder for every file change.
I am stuck at how I can patch the update I recieve from server in client code. Right now, I have just index.js file in index.html. So I am wondering how bundling tools like webpack achieves hot reload, specifically how they patch the update.
I've read from webpack docs that they have a thin hrm runtime in client code that update the patch, but I could not seem to find any detailed info on how they achieve this feat. Do they open the client index.js file using FileReader, read the file and write(?) back? Again, I do not have a clear understanding of how this works. So, if you guys could give me some direction, I could dig deeper into it.
So my question is, how do they patch(insert) the new code into the already existing client code which resides in index.js?
I have recently finished the book: Node Beginner Book and I want to build static websites and real time web apps. I have a project idea that is basically just an eCommerce website. From what iv'e heard, node.js is very good at real time data transfer between the client and the server but is it possible to make general websites instead of real time single page apps in node.js?
If so, could you please point me in the right direction.
Thanks!
Using the ExpressJS framework and express.static() you can serve a directory hierarchy of static files with a single line of code.
For example:
app.use(express.static('public'));
Tell express to look in the 'public' sub-directory for any requested file and serve it statically from there if a match is found.
Other route handlers you configure with Express also have a crack at serving the file so you can freely mix static files and dynamic files.
There are several good frameworks available in node.js for serving static resources.
I've personally used Harp.js in several projects with success. It not only lets you easily serve static content, but aldo supports several template for languages for abstraction and dynamic behavior. It can also works nicely with other frameworks like express.
Revised
Meteor.js, sails.js or similar framework seems to be what you're looking for.
I'm writing Java Web application and want to use AngularJS on frontend.
But I don't want to delegate routing and security to angular, but handle it with spring. My file hierarchy in the project looks like that:
I wrote Angular controllers, services etc. And just apply it on the jsp page with some init parameters. All jsp are loaded by Spring controllers, I have some security rules for that pages. Angular also consumes REST API from this application.
The question is about efficiency of such approach. In fact I have a few SPA in here. Every time i load a page, Angular initializes from the beginning (there is about 10 pages).
The reasons I want to stay on this version are:
It's already set (Routing, Security)
It seems like I don't need to load all the scripts on the page, but only required ones
But also I have feeling I'm doing it wrong way...
Should I separate Spring and Angular and use Angular also for routing and security handling, not only for DOM manipulation.
What do you think? Do you have any suggestion?
Angular is not another jQuery, its Single page application framework.
You can look on SPAs like on ordinary external application which communicates with your backend. So there is no view or prezentation layer on server, just REST API.
Angular app should have its own routing, it doesn't make sense to combine it with spring MVC. Security lays mostly on REST, and you can use spring security on it as ussual.
Best practice is to create Angular app as separate javascript application. You can use a lot of tools from angular ecosystem which makes your work very comfortable.
During development you have your backend running, and develop Angular part separately using javascript devstack. After that you can pack the both parts to single war.
I have nice small example of Spring and Angular integration here:
https://github.com/Angular-cz/java-devstack
Unluckilly the readme is written in Czech (beautifull language :) But if you are experienced in Java and maven you will probably get it from code, I will also try to describe it here.
The bigger app with a nice module structure and jwt autentication can bee seen here:
https://bitbucket.org/angular_cz/beerapp
Both of them has similar architecture:
separate maven module for frontend and separate for backend.
javascript part use npm as package manager
developer is using gulp task runner for javascript development (it is run inside module, where gulpfile.js resides).
there is karma runner configured and several unit tests
the app connects to the backend during development using proxy running on /api for the app can have same configuration on production)
when building war, frontend module uses frontend-maven-plugin which run gulp build task same as javascript developer would
then the built minified assets are put to resources
the next part is just ordinary maven way how to put assets to /static
one more nice thing - there is also integrated e2e test under integration-test profile.
Feel free to ask if you are interested in this kind of architecture.
as a total JavaScript beginner, how do I actually develop for it?
I mean, I've seen https://azure.microsoft.com/en-us/documentation/articles/documentdb-programming/ but there was no mentioning of a development environment.
Is there something like a visual studio project template for server-side javascript?
I use node.js so your mileage may vary if you are developing from .NET, but here's what I do:
First of all, I created an npm package documentdb-utils. It is a wrapper for the DocumentDB node.js package that makes it easier to do a bunch of things.
Then, I created npm package documentdb-mock to write tests for my stored procedures. The source code for documentdb-mock includes 4 example stored procedures along with a test suite for each using nodeunit. You can start with these as they exercise most of the server-side API.
After I have them passing my local unit tests, I write integration tests that exercise my system end-to-end including creating any necessary data for each test run. The only problems that I've found here with sprocs that I didn't see in my mocked testing had to do with reaching certain limits... although, documentdb-mock has been upgraded to simulate many of these now also.
I haven't open sourced this yet, but I have also written a parser/rewriter that will embed any require(d) packages into my sprocs before sending them to DocumentDB. This allows me to write and test in a nicely factored way on node.js even using downloaded packages from within my sprocs, but when they get pushed to DocumentDB any dependencies are automatically embedded inside of the function. I'll open source that at some point (probably adding it to documentdb-utils) but I can share it with you now if you desire.
Here are a few tools that I found helpful for development (especially server-side [by which we mean database-side] scripting):
DocumentDB Studio - https://github.com/mingaliu/DocumentDBStudio/releases
Sample Code - https://github.com/Azure/azure-documentdb-js-server/tree/master/samples/stored-procedures
Here is another nice open source tool for exploring data in documentdb:
documentdb.a7pl.us
I have the following setup:
Backend web application built in Node.js
Frontend web application build in Backbone.js that does Ajax calls to the backend
Frontend is using SASS to build CSS that contains images
Now the issue:
Is there anything "out there" in the internet that can version my images and css files, that can be used by / from node.js or express, like there is Sprockets for Ruby?
Details:
By versioning I refer to "image_name"_"sha1_of_the_file".png or something similar, so that every time I change an existing image I would run the "magic script" that will modify the image, and update the css file with it.
PS: I would like to use something already built and not reinvent the wheel if possible, otherwise I could write my own thing
Thanks
I think what you are looking for is called cache-busting :
https://github.com/hollandben/grunt-cache-bust
https://stackoverflow.com/questions/24683229/cachebusting-using-grunt-for-multiple-js-files
https://github.com/PaulTondeur/grunt-cache-busting