Modern JavaScript Flashcards
What was the ‘old-school’ way of adding JavaScript libraries to a website?
Manually downloading library files and linking them with script tags in the HTML.
What problem did JavaScript package managers solve?
They automated the process of downloading and upgrading libraries from a central repository.
Which package manager eventually became the standard for frontend JavaScript around 2015?
npm (Node Package Manager)
What is the purpose of package.json?
It’s a configuration file that npm uses to save project information, including dependencies.
What command creates a new package.json file?
npm init
What is the significance of the node_modules folder?
It contains all the code from installed packages (dependencies).
Why was JavaScript originally designed without a module system?
JavaScript was initially designed to only run in the browser with no access to the client’s file system.
What is a JavaScript module bundler?
A tool that finds all module dependencies during a build step and combines them into browser-compatible output files.
What was the first popular module bundler mentioned in the article?
Browserify (released in 2011)
Which module bundler eventually became more widely used around 2015?
webpack
What does the ‘require()’ function do in Node.js?
It imports code from another module or file.
What is the ES2015 (ES6) alternative to ‘require()’?
The import statement
What file is typically used to configure webpack?
webpack.config.js
What does ‘transpiling’ mean in the context of JavaScript?
Converting code from one language to code in a similar language (e.g., modern JavaScript to older, more compatible JavaScript)
What is Babel used for?
Transpiling next-generation JavaScript features to older, more browser-compatible JavaScript.
What was CoffeeScript?
An early JavaScript transpiler/language that focused on improving JavaScript by changing the syntax significantly.
What is TypeScript?
A language similar to next-generation JavaScript that adds optional static typing.
What is babel-loader?
A package that enables Babel to work with webpack.
What is a task runner in frontend development?
A tool that automates different parts of the build process (minifying code, optimizing images, running tests, etc.)
What were the two popular task runners mentioned from around 2013?
Grunt and Gulp
What is the modern alternative to dedicated task runners mentioned in the article?
npm scripts (using the scripting capabilities built into the npm package manager)
What does the ‘–watch’ option do in webpack?
It automatically re-runs webpack each time any JavaScript file changes.
What is webpack-dev-server?
A development server that provides a simple web server with live reloading capabilities.
What framework-specific CLI tools were mentioned that help simplify JavaScript tooling?
ember-cli, angular-cli, create-react-app, and vue-cli.
What is an example of an ES2015 feature mentioned in the article?
Template strings (using backticks with ${variable} syntax)
What is the ‘–mode=production’ option in webpack used for?
Minifying code for production
