分類: Javascript

Server Sent Event

Introduction

Web API provide an interface to receive server-sent events. It would connect to a server over HTTP and receives events in text/event format without closing the connection.

var eventSource = new EventSource("");

Once message is received from the server, the follow-up action would be triggered.

eventSource.onmessage = function(event){
  // the data of the event can be found on event.data
};

Not all browser support Server Sent Event API

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
 Basic support 9 6.0 ? 11 5
由imben1109撰寫

NodeJs Hello World Project

HelloWorld Example 

main.js

/**
* nodeJS is JavaScript-based framework/platform built on Google Chrome V8 Engine.
* It is used to develop I/O intensive web application 
* like video streaming sites, sigle-page application. 
*/
var http = require("http");
http.createServer(function(request, response){
 response.writeHead(200, {'Content-Type': 'text/plain'});
 response.end('Hello World\n');
}).listen(8080);
console.log("Server is running on http://localhost:8080/");

Command to start server

node main.js

 

由imben1109撰寫

NPM Install Proxy

Proxy Configuration NPM Command

Npm Command to set proxy configuration.

npm config set proxy http://login:pass@host:port
npm config set https-proxy http://login:pass@host:port
npm config set http-proxy http://login:pass@host:port
npm config set registry "http://registry.npmjs.org/"
npm config set strict-ssl false

The configuration is stored in <User Folder>/.npmrc

.npmrc

proxy = http://login:pass@host:port
https-proxy = http://login:pass@host:port
strict-ssl = false
http_proxy = http://login:pass@host:port
registry = http://registry.npmjs.org/
由imben1109撰寫

JQuery

Introduction

JQuery provide various libraries for Client-Side Javascript Web Application.

  • JQuery, a Document Object Model (DOM) Manipulation Library
  • JQuery UI, a User Interface Interaction Library
  • JQuery Mobile, a Mobile Touch Library
  • QUnit, a Test Framework

Example List

 

$() Function

It would return  a collection of matched element found in DOM based on passed argument or created by passing HTML String.

The below is a html. The h1 tag is identified with id, example. $() Function would be used to retrieve the DOM element.

<html>
  <body>
    <h1 id='example'>Example</h1>
  </body>
</html>
$("#example")

It would return the element whose id is example.

 

Plugin

It enable new method can be added to Jquery object. The below example show a JQuery Plugin named “plugin".

$.fn.plugin= function() {
  console.log("plugin called")
};

$( "a" ).plugin();

 

Reference:

由imben1109撰寫

Javascript OOP

Introduction

JavaScript is Prototype-baed Programming Language. Prototype-based Programming is a Object-oriented Programming Model which the inheritance is performed through reuse of existing object (prototype).

 

Namespace

Namespace is a container which bundle up functionality. In JavaScirpt, it is just an object containing methods, property and objects.

 

Class

JavaScript uses functions as constructors for classes. Defining a function is to define a class in JavaScript.

var Student = function(){

};

var student1 = new Student();

 

Property

The properties of function is defined through the keyword, this.

var Student = function(name){
  this.name = name;
}

var student1 = new Student("Tester");
console.log(student1.name);

 

Method

Declared method to a class in JavaScript is just to add method to object prototype but not object. There methods would be assigned to prototype property of a function.

var Student = function(name){
  this.name = name;
};

Student.prototype.getName = function(){
  return this.name;
};

var student = new Student("tester");
console.log(student1.getName());

 

Reference

由imben1109撰寫