mazipan/SampleSPA-SwapiApi

Sample for creating SPA Page Using Swapi API

SampleSPA-SwapiApi

Sample for creating SPA Page Using Swapi API http://swapi.co/

Preview

Using technology

• NodeJS and Expressjs for server routing
• Jade for server templating
• Angularjs framework
• Bootstrap for CSS template
• Grunt for Task Runner
• API from http://swapi.co/

Installation

• Install grunt-cli, read : http://gruntjs.com/getting-started

sudo npm install -g grunt-cli

• Install depedency

sudo npm install

• Run Task

grunt --verbose

• Run project

npm start

• Open in Browser

http://localhost:3000

Folder Structure

• all code in src folder
• app.js is main server js
• folder routes is server side routing, provided by expressjs
• folder views is html template with jade
• all frontend code in folder public
• folder public/angularjs is angularjs code
• folder public/pages is angularjs view templating

Here you will learn about

• Create server route using ExpressJS, read more : https://expressjs.com/en/guide/routing.html
• Using server side templating using Jade Templating, read more : http://jade-lang.com/tutorial/
• Create SPA routing using AngularJS, read more : https://docs.angularjs.org/tutorial/step_07
• Create AngularJS Services for wrapping all request to server using Angular Resources, read more : https://docs.angularjs.org/api/ngResource/service/$resource
• How to sharing an object between controllers
• AngularJS Watch for watching some method calling
• Using HTML5 storage API, read more : http://www.w3schools.com/html/html5_webstorage.asp

Hope will usefull for you all.

Contact Me :