Front-end Infrastructure Basics Flashcards
What is a “module bundler”?
A module bundler will parse through our code, mapping out dependencies as it comes across them, to bundle our application together in a way that the browser can understand, while still allowing developers to maintain modularity and separation in the codebase.
Give examples of popular “module bundlers” tools
- Webpack
- Browserify
What is a “module loader”?
A module loader interprets and loads a module written in a certain module format.
What are the steps a module loader usually performs when you load it in your browser?
- you load the module loader in the browser
- you tell the module loader which main app file to load
- the module loader downloads and interprets the main app file
- the module loader downloads files as needed
What is “CommonJS”?
It is a specification for a module loading API in Javascript. Node.js implements that specification for module loading.
Which specification does Node.js follows for module loading?
CommonJS
How do you import a class “Foo” from foo.js file using CommonJS?
const Foo = require(“./foo.js”)
How do you export a class “Foo” from module foo.js file using CommonJS?
In foo.js:
module.exports = class Foo { … }
How do you import a class “Foo” from foo.js file using ES6 native module spec?
import { Foo } from ‘./foo’
import { Foo as FooRenamed} from ‘./foo’
How do you export a class “Foo” from module foo.js file using ES6 native module spec?
export class Foo {…}
What are linters?
linters allow developers to set rules for how code should be written within the scope of their application, and will throw errors or warnings when those rules/guidelines aren’t being followed.
What is a “polyfill”?
Polyfill is a code that implements a feature on web browsers that do not support the feature. It is a “shim” for web browsers APIs.
What is a “shim”?
shim is a small library that transparently intercepts API calls and changes the arguments passed, handles the operation itself, or redirects the operation elsewhere.
Where will “npm install “ install the module?
In the current directory ./node_modules directory. It will recursively download transitive dependencies in its “node_modules” directories as well.
What are well-know CSS frameworks?
- Bootstrap 4.0
- Bulma
- Materialize (Material Design in React)
- Skeleton (very raw CSS framework)
