Advanced Tools

Question 1

Many IDEs have their own ________ and ________ for these tools and functionality may also be available via build _____ and task _______.

Answer 1

Many IDEs have their own integrations and plugins for these tools and functionality may also be available via build tools and task runners.

Question 2

TinyPNG uses smart ________ ___________ techniques to reduce the file size of your PNG files. By selectively decreasing the number of _______ in the image, fewer bytes are required to store the data.

Answer 2

TinyPNG uses smart lossy compression techniques to reduce the file size of your PNG files. By selectively decreasing the number of colours in the image, fewer bytes are required to store the data. The effect is nearly invisible but it makes a very large difference in file size! https://tinypng.com

Question 3

Minifiers are used to reduce ______ size. At the very least, extra ______ and ________ are removed. However, depending in the minifier, other optimizations to code may occur. Such optimizations include the shortening of _______ names to single characters, consecutive _______ declarations, removal of __________ and so on. Minification usually renders the code _________ to the human eye.

Answer 3

Minifiers are used to reduce file size. At the very least, extra spaces and linebreaks are removed. However, depending in the minifier, other optimizations to code may occur. Such optimizations include the shortening of variable names to single characters, consecutive variable declarations, removal of comments and so on. Minification usually renders the code unreadable to the human eye. http://jscompress.com/ is a website that will minify your JavaScript.

Question 4

Some minifiers will also pack ________ files together in _____ file. The end result may not be notably different than the sum of the individually compressed file sizes but it will reduce the number of _______ _________ that the application must make.

Answer 4

Some minifiers will also pack multiple files together in one file. The end result may not be notably different than the sum of the individually compressed file sizes but it will reduce the number of HTTP requests that the application must make.

Question 5

On the other side of the spectrum are ___________ aka ________ which basically make minified JavaScript readable.

Answer 5

On the other side of the spectrum are un-minifiers aka beautifiers which basically make minified JavaScript readable. http://jsbeautifier.org/

Question 6

Google Chrome has a built-in _______ called ______-______.

Answer 6

Google Chrome has a built-in beautifier called pretty-print.

Question 7

CSS Cleaners not only _______ your CSS but ________ your CSS as well. Cleaners may also ________ your CSS.

Answer 7

CSS Cleaners not only compresses your CSS but optimizes your CSS as well. Cleaners may also validate your CSS.

See http://cleancss.com/. CSSLint is another option

Question 8

Obfuscators, sometimes called “uglifiers”, try to make JavaScript ________ and ________. They are used to prevent viewers from looking at the code and trying to reuse, repurpose, execute, or simply make sense of it. However, wherever JavaScript can be encoded, it can also be ________.

Answer 8

Obfuscators, sometimes called “uglifiers”, try to make JavaScript unreadable and unusable. They are used to prevent viewers from looking at the code and trying to reuse, repurpose, execute, or simply make sense of it. However, wherever JavaScript can be encoded, it can also be decoded.

https://javascriptobfuscator.com

Question 9

JSLint and ESLint checks your JavaScript and suggests ____________. JSHint evolved as a _________ ________ option.

Answer 9

JSLint and ESLint checks your JavaScript and suggests improvements. JSHint evolved as a community driven option.

Question 10

A package is a ______ piece of software which can be downloaded from a _____ registry into a developer’s ____ environment.

Answer 10

A package is a reusable piece of software which can be downloaded from a global registry into a developer’s local environment.

Question 11

Each package may or may not depend on other _______.

Answer 11

Each package may or may not depend on other packages.

Question 12

Package managers ____ and keep _____ of _____ and _________ that you use in your application.

Answer 12

Package managers add and keep track of packages and dependencies that you use in your application.

Question 13

When packages are installed, they, and their dependencies, are ______ and _______. This makes it easy for another developer to gets started with contributing to your application.

Answer 13

When packages are installed, they, and their dependencies, are downloaded and tracked. This makes it easy for another developer to gets started with contributing to your application.

Question 14

Web developers perform ______ functions regularly. For example, minifying JavaScript and CSS or running a tinypng process that reduces filesize of images.

Answer 14

Web developers perform repetitive functions regularly. For example, minifying JavaScript and CSS or running a tinypng process that reduces filesize of images.

Question 15

Task runners automate ________ processes.

Answer 15

Task runners automate repetitive processes.

Question 16

Explain what task runners do:

Answer 16

So, let’s say that a developer makes a changes to a script file or a few CSS files. In order to make the application production-ready, the developer would need to minify his updated files after every change. Quite an onerous experience. A task runner can listen for changes in the development files and automatically create a minified version of the updated code automatically. This is just one example of how automation systems make our lives easier. However, many automation scripts and plugins exist and you can write your own if necessary.

Question 17

The development (also known as source or “_____”) files for complex applications usually differs from the production (also known as distribution or “___”) files.

Answer 17

The development (also known as source or “src”) files for complex applications usually differs from the production (also known as distribution or “dist”) files.

Question 18

Many of the files used in development may not be necessary or may need to be transformed into _______-ready code.

Answer 18

Many of the files used in development may not be necessary or may need to be transformed into production-ready code.

Question 19

The process of converting development code to production-ready code is called “__________”. Package managers and Task runners assist in creating “_____”.

Answer 19

The process of converting development code to production-ready code is called “building”. Package managers and Task runners assist in creating “builds”.

Question 20

____, ____ and ____ are package management tools.

Answer 20

Bower, npm and yarn are package management tools. They

Question 21

_____, _____ and _____ are task runners.

Answer 21

Grunt, Gulp and node.js are task runners.

Question 22

___ and ______ bundle (puts together) your application files and dependencies in an easy-to-manage, non-conflicting manner.

Answer 22

Webpack and Browserify bundle (puts together) your application files and dependencies in an easy-to-manage, non-conflicting manner.

Question 23

______ is a robust and opinionated set of tools, libraries, and a workflow that can help developers quickly build beautiful, compelling web apps.

Answer 23

Yeoman is a robust and opinionated set of tools, libraries, and a workflow that can help developers quickly build beautiful, compelling web apps.