front-end

1.Single Page Application

2.Responsive web design

Responsive Web Design is the approach that suggests that design and development should respond to the user's behavior and environment based on screen size, platform and orientation.

A site designed with RWD adapts the layout to the viewing environment by using fluid, proportion-based grids, CSS3flexible images,media queries[4][12][13][14]and,an extension of the@mediarule, in the following ways:

• The fluid grid concept calls for page element sizing to be in relative units like percentages, rather than absolute units like

  pixels or points.

• Flexible images are also sized in relative units, so as to prevent them from displaying outside their containing element.

• Media queries allow the page to use different CSS style rules based on characteristics of the device the site is being displayed on, most commonly the width of the browser.

3.Scope in AngularJS and in JavaScript

In JavaScript there are two types of scope:

• Local scope

• Global scope

JavaScript has function scope: Each function creates a new scope.

Scope determines the accessibility (visibility) of these variables.

Variable defined inside a function are not accessible (visible) from outside the function.

Local JavaScript Variables

Variables declared within a JavaScript function, becomeLOCALto the function.

Local variables have local scope: They can only be accessed within the function.

eg:

// code here can not use carName

function myFunction(){

    var carName = "Volvo";

//code here can use carName

}

Global JavaScript Variables

A variable declared outside a function, becomesGLOBAL.

A global variable hasglobal scope: All scripts and functions on a web page can access it.

eg:

var carName = "Volvo";

//code here can use carName

function myFunction(){

//code here can use carName

}

scope in AngularJS

The scope is the binding part between the HTML (view) and the JavaScript (controller).

The scope is an object with the available properties and methods.

The scope is available for both the view and the controller.

How to Use the Scope?

When you make a controller in AngularJS, you pass the$scopeobject as an argument:

eg:

<script>

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope){

    $scope.carName = "Volvo";

});

When adding properties to the$scopeobject in the controller, the view (HTML) gets access to these properties.

In the view, you do not use the prefix$scope, you just refer to a propertyname, like{{carName}}.