JavaScript

JavaScript (JS) is a dynamic computer programming language. It is most commonly used as part of web browsers, whose implementations allow client-side scripts to interact with the user, control the browser, communicate asynchronously, and alter the document content that is displayed. It is also being used in server-side network programming (with Node.js), game development, and the creation of desktop and mobile applications. 1

Related Topics

• ReactJS : React – A JavaScript library for building user interfaces
  • Gatsby : Gatsby is a React-based open-source framework for creating websites and apps.
• React Native : React Native lets you build mobile apps using only JavaScript. It uses the same design as React, letting you compose a rich mobile UI from declarative components.
  • Expo : Expo is a framework and a platform for universal React applications.
  • Xcode : Xcode is a complete developer toolset for creating apps for Mac, iPhone, iPad, Apple Watch, and Apple TV.
• jQuery : jQuery is a fast, small, and feature-rich JavaScript library.

Resources

• Tracing, debugging and profiling JavaScript code with spy-js in PhpStorm

Books

• javascript: The Definitive Guide: Master the World's Most-Used Programming Language - Provides a rapid and thorough exposition of the JavaScript programming language, as well as an in-depth reference section covering each JavaScript function, object, method, and event handler. Experienced programmers will quickly find the information they need to start writing JavaScript programs.
• Eloquent Javascript, 3rd edition - This much anticipated and thoroughly revised third edition of Eloquent JavaScript dives deep into the JavaScript language to show you how to write beautiful, effective code. It has been updated to reflect the current state of Java¬Script and web browsers and includes brand-new material on features like class notation, arrow functions, iterators, async functions, template strings, and block scope. A host of new exercises have also been added to test your skills and keep you on track.
• Maintainable JavaScript - When you're writing code alone, you have a lot of leeway. But when you start writing code as part of a team, you need to think harder about the decisions you make. This book will help you do that.

Javascript Coding Standards and Best Practices

• Google JavaScript Style Guide - This document serves as the complete definition of Google’s coding standards for source code in the JavaScript programming language. A JavaScript source file is described as being in Google Style if and only if it adheres to the rules herein. Like other programming style guides, the issues covered span not only aesthetic issues of formatting but other types of conventions or coding standards as well. However, this document focuses primarily on the hard-and-fast rules that we follow universally and avoids giving advice that isn't clearly enforceable (whether by human or tool).
  • JavaScript Style Guide: Key takeaways from Google’s Style Guide
• Principles of Writing Consistent, Idiomatic JavaScript - This is a living document and new ideas for improving the code around us are always welcome. Contribute: fork, clone, branch, commit, push, pull request.
• Airbnb React/JSX Style Guide - This style guide is mostly based on the standards that are currently prevalent in JavaScript, although some conventions (i.e async/await or static class fields) may still be included or prohibited on a case-by-case basis. Currently, anything prior to stage 3 is not included nor recommended in this guide.
• Pragmatic Standards: JavaScript Coding Standards and Best Practices - This is a coding standard and best practices guide for JavaScript, and to a lesser extent, jQuery.
• JavaScript Best Practices
• JavaScript Style Guide and Coding Conventions
• 24 JavaScript Best Practices for Beginners

JavaScritp Documentor

• JSDoc - JSDoc 3 is an API documentation generator for JavaScript, similar to Javadoc or phpDocumentor. You add documentation comments directly to your source code, right alongside the code itself. The JSDoc tool will scan your source code and generate an HTML documentation website for you.

Node.js

Node.js is an open-source cross-platform JavaScript (JS) runtime environment. It is used for building fast and scalable network applications. In addition to offering various JS modules, it is also lightweight, efficient and supports consistent and integrated development. 2

Node Package Manager (NPM) is Node’s official package manager, used for installing and managing package dependencies. 3

Node Installation

• How To Install Node.js & NPM on Ubuntu 18.04 and 20.04
• How To Install Node.js on Ubuntu 22.04

Video

In this crash course, we will explore Node.js fundamentals including modules such as path, URL, fs, events, and we will create an HTTP server from scratch without Express and deploy it to Heroku.

Unit Testing

Jest - JavaScript Unit Testing is a delightful JavaScript Testing Framework with a focus on simplicity. 4

Linting

Linting is the act or process of checking your code for errors of any kind. ... When it comes to JavaScript linting, there are a handful of tools that stand apart. - https://blog.logrocket.com/four-options-to-help-you-get-started-linting-your-javascript-b4b829828648/

JSHint

JSHint is a program that flags suspicious usage in programs written in JavaScript. - https://jshint.com/docs/

• Enable JSHint and configure its behavior in WebStorm
• Enable JSHint and configure its behavior in PhpStorm
• VS Code JSHint extension

ESLint

ESLint is a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code, with the goal of making code more consistent and avoiding bugs. - https://eslint.org/docs/user-guide/getting-started

• Activate and configure ESLint in WebStorm
• Activate and configure ESLint in PhpStorm
• VS Code ESLint extension

JavaScript IDE

WebStorm - The Smart JavaScript IDE by JetBrains, a powerful IDE for modern JavaScript development with code completion and refactoring for JavaScript, TypeScript, and the most popular web frameworks.5

PhpStorm integrates with ESLint which brings a wide range of linting rules that can also be extended with plugins. PhpStorm shows warnings and errors reported by ESLint right in the editor, as you type. With ESLint, you can also use JavaScript Standard Style. - https://www.jetbrains.com/help/phpstorm/eslint.html

Frameworks and Libraries

• ReactJS – A JavaScript library for building user interfaces
  • Gatsby is a React-based open-source framework for creating websites and apps.
• jQuery is a cross-platform JavaScript library designed to simplify the client-side scripting of HTML. It is free, open-source software using the permissive MIT License. Web analysis indicates that it is the most widely deployed JavaScript library by a large margin.6

JavaScript

• Understanding Events and Event Handlers - An event is something that happens when user interact with the web page, such as when he clicked a link or button, entered text into an input box or textarea, made selection in a select box, pressed key on the keyboard, moved the mouse pointer, submits a form, etc. In some cases, the Browser itself can trigger the events, such as the page load and unload events.
• Understanding Event Listeners - The event listeners are just like event handlers, except that you can assign as many event listeners as you like to a particular event on particular element.

Debugging

• Get Started with Debugging JavaScript in Chrome DevTools - This tutorial teaches you the basic workflow for debugging any JavaScript issue in DevTools.
• The best JavaScript debugging tools for 2020 and beyond - Improve the quality of your code with these JavaScript debugging tools.