Thursday 30 March 2017

LESS

By,
Karishma


What is LESS?
LESS is a CSS pre-processor that enables customizable, manageable and reusable style sheet for web site. LESS is a dynamic style sheet language that extends the capability of CSS. LESS is also cross browser friendly.






CSS Pre-processor is a scripting language that extends CSS and gets compiled into regular CSS syntax, so that it can be read by your web browser.It provides functionalities like variables, functions, mixins and operations that allow you to build dynamic CSS.
Why to use LESS? 
1.LESS supports creating cleaner, cross-browser friendly CSS faster and easier.

2.LESS is designed in JavaScript and also created to be used in live, which compiles faster than other CSS pre-processors.

3.LESS keeps your code in modular way which is really important by making it readable and easily changeable.

4.Faster maintenance can be achieved by the use of LESS variables.


Features:

1.Cleaner and more readable code can be written in an organized way.

2.We can define styles and it can be reused throughout the code.

3.LESS is based on JavaScript and is super set of CSS.

4.LESS is an agile tool that sorts out the problem of code redundancy.


Advantages: 

1.LESS easily generates CSS that works across the browsers.

2.LESS enables you to write cleaner and well organized code by using nesting.

3.Maintenance can be achieved faster by the use of variables.

4.LESS enables you to reuse the whole classes easily by referencing them in your rule sets.

5.LESS provides the use of operations that makes coding faster and saves time.
 

System Requirements for LESS:
1.Operating System : Cross-platform

2.Browser Support: IE (Internet Explorer 8+), Firefox, Google Chrome, Safari.


Installation of LESS: 

Step1:We need NodeJs to run LESS code. To download NodeJs, open the link https://nodejs.org/en/, you will see a page as shown below:


Download the Latest Features version:  
Step2:Now, run the setup to install the Node.js on your system.
Step3:Now, install LESS on the server via Node package manager(NPM). Run the following command into the command prompt.
npm install -g less
Step4: After successful installation of LESS, you will see following result on the command prompt

`-- less@2.6.1
  +-- errno@0.1.4
  | `-- prr@0.0.0
  +-- graceful-fs@4.1.3
  +-- image-size@0.4.0
  +-- mime@1.3.4
  +-- mkdirp@0.5.1
  | `-- minimist@0.0.8
  +-- promise@7.1.1
  | `-- asap@2.0.3
  +-- request@2.69.0
  | +-- aws-sign2@0.6.0
  | +-- aws4@1.3.2
  | | `-- lru-cache@4.0.0
  | |   +-- pseudomap@1.0.2
  | |   `-- yallist@2.0.0
  | +-- bl@1.0.3
  | | `-- readable-stream@2.0.6
  | |   +-- core-util-is@1.0.2
  | |   +-- inherits@2.0.1
  | |   +-- isarray@1.0.0
  | |   +-- process-nextick-args@1.0.6
  | |   +-- string_decoder@0.10.31
  | |   `-- util-deprecate@1.0.2
  | +-- caseless@0.11.0
  | +-- combined-stream@1.0.5
  | | `-- delayed-stream@1.0.0
  | +-- extend@3.0.0
  | +-- forever-agent@0.6.1
  | +-- form-data@1.0.0-rc4
  | | `-- async@1.5.2
  | +-- har-validator@2.0.6
  | | +-- chalk@1.1.1
  | | | +-- ansi-styles@2.2.0
  | | | | `-- color-convert@1.0.0
  | | | +-- escape-string-regexp@1.0.5
  | | | +-- has-ansi@2.0.0
  | | | | `-- ansi-regex@2.0.0
  | | | +-- strip-ansi@3.0.1
  | | | `-- supports-color@2.0.0
  | | +-- commander@2.9.0
  | | | `-- graceful-readlink@1.0.1
  | | +-- is-my-json-valid@2.13.1
  | | | +-- generate-function@2.0.0
  | | | +-- generate-object-property@1.2.0
  | | | | `-- is-property@1.0.2
  | | | +-- jsonpointer@2.0.0
  | | | `-- xtend@4.0.1
  | | `-- pinkie-promise@2.0.0
  | |   `-- pinkie@2.0.4
  | +-- hawk@3.1.3
  | | +-- boom@2.10.1
  | | +-- cryptiles@2.0.5
  | | +-- hoek@2.16.3
  | | `-- sntp@1.0.9
  | +-- http-signature@1.1.1
  | | +-- assert-plus@0.2.0
  | | +-- jsprim@1.2.2
  | | | +-- extsprintf@1.0.2
  | | | +-- json-schema@0.2.2
  | | | `-- verror@1.3.6
  | | `-- sshpk@1.7.4
  | |   +-- asn1@0.2.3
  | |   +-- dashdash@1.13.0
  | |   | `-- assert-plus@1.0.0
  | |   +-- ecc-jsbn@0.1.1
  | |   +-- jodid25519@1.0.2
  | |   +-- jsbn@0.1.0
  | |   `-- tweetnacl@0.14.1
  | +-- is-typedarray@1.0.0
  | +-- isstream@0.1.2
  | +-- json-stringify-safe@5.0.1
  | +-- mime-types@2.1.10
  | | `-- mime-db@1.22.0
  | +-- node-uuid@1.4.7
  | +-- oauth-sign@0.8.1
  | +-- qs@6.0.2
  | +-- stringstream@0.0.5
  | +-- tough-cookie@2.2.2
  | `-- tunnel-agent@0.4.2
  `-- source-map@0.5.3

No comments:

Post a Comment