Create NodeJS – ExpressJS static file server in a minute

It’s pretty straight-forward tutorial for anybody to understand. Suppose, you want to run your AngularJS static application in your local PC with pretty URLs and other features. You may need to create a stand-alone static file server.

So here you can do that with NodeJS and Express.

– Just create a package.json file in your application root. and write the following json configuration there.

And after that create a JS file name ‘static-server.js’ with the following code where ExpressJS will serve you static files.

Now you are all set. Now install all nodejs dependency libraries by npm install command and then run ‘npm run server’ command to start your static server. After successfully started (can see in console) you can visit your static web server from http://localhost:8081 (you can change port as your wish). I think this will help you and your team.

AngularJS and API Backend via nginx proxy – Sample nginx virtual host

If you want to run your AngularJS front-end web application and run nginx as your API proxy server, then the following nginx virtual host configuration can help you.

This will help you lot to configure your Nginx proxy for your API backend and run your API with AngularJS based web application interface.

Twig and AngularJS curly braces conflict solution

Whoever loves to work with Twig template system for their PHP driven web application may want to implement AngularJS within Twig template. But the main problem will be Twig’s curly braces. AngularJS and Twig both use __ inside their template to output data. So simply, it can cause trouble to work with this two lovely systems together in your application.

But here is the solution. According to AngularJS $interpolateProvider docs I figured out the easy solution. You can change AngularJS __ symbol with any other symbol. Cool! So see how you will override that configuration.

Now you can use {[{ }]} symbol for your AngularJS. And Twig use **. So problem solved. From now on you can use AngularJS within your Twig template system.

AngularJS Resource use for RESTful apps

This example will help you to learn how to interact between your backened RESTful apps and AngularJS. AngularJS has a service factory called ngResource which you can use to do CRUD operation with your RESTful backend application.

Here you just need to define the service factory which will get all notes by calling an ajax request to your http://yourRESTAPIBackendserver.url/notes. Also you can do rest of the CRUD services with that script. This script represents very basic usage of ngResource. So you learn it and try to DYI.

Don’t forget to add the main angularjs library and ng resource service library in your html head tag.