Browse all Tools lessons.

showing All 198 lessons...

Practical Git: Resolve merge conflicts with git status

Practical Git: Save uncommitted changes with git stash

Practical Git: Sync branches with git merge

Practical Git: Isolate feature development with git branch

Practical Git: Sync local and remote repos with git pull

Practical Git: Document repos with README files

Import a non-ES6 module with Webpack

P

Ensure all source files are included in test coverage reports with Webpack

P

Use Karma for Unit Testing with Webpack

P

Use Chai assertions for tests in a Karma project

P

Polyfill Promises for Webpack 2

P

Initialize a Webpack Project with Karma for Testing

P

Expose modules to dependencies with Webpack

P

Add Code Coverage to tests in a Webpack project

P

Optimize React size and performance with Webpack production plugins

P

Grouping vendor files with the Webpack CommonsChunkPlugin

P

Chunking common modules from multiple apps with the Webpack CommonsChunkPlugin

P

Tree shaking with Webpack 2

P

Validate your Webpack config with webpack-validator

P

Hashing with Webpack for long term caching

P

Intro to the Production Webpack Course

Maintain sane file sizes with webpack code splitting

P

Introduction to Vim Plugins

P

Configuring AWS Elastic Load Balancers

P

Scheduling Events with AWS Lambda (a.k.a. Lambda cron jobs)

P

Installing the AWS CLI on OS X and Linux

P

Git: How to change the most recent commit with `--amend`

P

The Vim Config file

P

Configure VIM

P

Copy and Paste inside of Vim

P

Vim's built-in commands

P

Combining Vim commands

P

Saving Files in Vim

P

Vim's different modes

P

Moving around in Vim

P

Intro to Vim

Speed Up Your Website by Using AWS CloudFront

P

Using jq to parse the Star Wars API

P

WebStorm - Sharing a Gist

P

Permission denied (publickey) when SSH Access to Amazon EC2 instance

P

Hosting a Static Website on Amazon S3

P

WebStorm - Managing Imports

P

WebStorm - Customizing the Built-in Terminal

P

WebStorm - Installing Custom Color Schemes (dayleress/colour-schemes)

P

Tips & Tricks

P

Introduction to RequireJS

P

Introduction to Karma

P

Introduction to Bower

P
otherjs tutorial about Practical Git: Resolve merge conflicts with git status

Practical Git: Resolve merge conflicts with git status

4:36 otherjs

Sometimes when you run git merge (also during a git pull which runs a git merge) you get a merge "conflict"; this means that the same line(s) of code were changed locally as in new changes in the remote (most likely from another developer working on a related feature); git merge can automatically merge all other changes but when the same line is modified in two places, you have to fix the conflict manually. In this lesson, we show how a conflict happening from a git pull, and then how to fix it using git status to update the conflict markers in our file(s) with conflicts. You can use a graphical app for this, but this lesson will show you how to resolve conflicts directly from the command line and your code editor.

otherjs tutorial about Practical Git: Save uncommitted changes with git stash

Practical Git: Save uncommitted changes with git stash

2:51 otherjs

Sometimes when we are working we need a way to pause and switch gears to deal with something more critical; often when this happens we aren't ready to create a git commit; instead, we can use git stash to save our uncommitted changes locally, switch branches and fix the critical issue, switch back to our incomplete feature, and finally run git stash apply to get our unfinished changes back into our branch without affecting the rest of the codebase. In this lesson, we show a real world example of doing this with a critical bug.

otherjs tutorial about Practical Git: Sync branches with git merge

Practical Git: Sync branches with git merge

2:27 otherjs

Once a feature has been created inside of a branch, we can combine it back into the main master branch by using git merge. In this lesson, we go through a complete workflow of creating a feature branch and merging it back into the master branch.

otherjs tutorial about Practical Git: Isolate feature development with git branch

Practical Git: Isolate feature development with git branch

2:19 otherjs

When working on a project, it is much easier to work on features and bugs in isolation of the rest of the project. We can do this with git branches; a branch is a copy of the working directory, staging area, and project history; we create a branch, then check it out, then add commits. After our feature has been built, we can then merge it back into the main stable branch - which is master by default. In this lesson we go over how to create a branch with git branch {branch-name}, viewing all branches with git branch, switching branches with git checkout plus a few helper commands.

otherjs tutorial about Practical Git: Sync local and remote repos with git pull

Practical Git: Sync local and remote repos with git pull

1:38 otherjs

git pull lets us get the latest changes from our project's remote repo (most likely from co-workers or other developers working on our project) and merge (combine) them with our local code. It's kind of like Dropbox for code, but you tell git when you want it to get the latest changes from the remote when it is most convenient for you. In this lesson, we use git pull and discuss how it is a shortcut for running git fetch and git merge.

otherjs tutorial about Practical Git: Document repos with README files

Practical Git: Document repos with README files

1:26 otherjs

A Git repo is much more useful when you know what it is; it has become a convention to add a README markdown file to the root of your repos which explains what the project is as well as anything else you want to add. In this lesson we create a README.md file and push it to our remote repo for others to see.

otherjs tutorial about Import a non-ES6 module with Webpack

Import a non-ES6 module with Webpack

4:20 otherjs PRO

When you have a dependency that does not export itself properly, you can use the exports-loader to force it to export the pieces of the file that you need.

otherjs tutorial about Ensure all source files are included in test coverage reports with Webpack

Ensure all source files are included in test coverage reports with Webpack

4:59 otherjs PRO

If you’re only instrumenting the files in your project that are under test then your code coverage report will be misleading and it will be difficult for you to track or enforce improvements to application coverage over time. In this lesson we’ll learn how to ensure all source files are included in coverage reports and how to enforce a specific threshold so you can work toward improving application code coverage.

otherjs tutorial about Use Karma for Unit Testing with Webpack

Use Karma for Unit Testing with Webpack

4:53 otherjs PRO

When writing tests run by Karma for an application that’s bundled with webpack, it’s easiest to integrate webpack and Karma directly together. In this lesson we’ll see how to utilize the karma-webpack plugin and reuse our existing webpack configuration to preprocess our test files with webpack.

otherjs tutorial about Use Chai assertions for tests in a Karma project

Use Chai assertions for tests in a Karma project

1:17 otherjs PRO

Chai assertions work great with the Mocha testing framework. In this lesson we'll walk through out to install Chai and karma-chai so you can use the expect assertions in your tests.

otherjs tutorial about Polyfill Promises for Webpack 2

Polyfill Promises for Webpack 2

1:59 otherjs PRO

If you're going to use code splitting with Webpack 2, you'll need to make sure the browser has support for the ES6 Promise API. This means that if you are required to support an old browser, you need to provide a polyfill. Polyfilling is relatively trivial to do with Webpack, but because Webpack itself depends on this particular polyfill, you have to come up with another way of doing so. In this lesson, we'll see how we can use the polyfill.io service to automatically polyfill this API (and others) for us.

otherjs tutorial about Initialize a Webpack Project with Karma for Testing

Initialize a Webpack Project with Karma for Testing

5:22 otherjs PRO

There are several steps involved with setting up Karma to work on your webpack project. In this first step we'll initialize our karma configuration and setup our package.json scripts.

otherjs tutorial about Expose modules to dependencies with Webpack

Expose modules to dependencies with Webpack

3:20 otherjs PRO

When you have a dependency that has dependencies on global variables (like jQuery or lodash) or assumes that this is bound to window, you can use the imports-loader to provide those dependencies explicitly.

otherjs tutorial about Add Code Coverage to tests in a Webpack project

Add Code Coverage to tests in a Webpack project

6:30 otherjs PRO

How much of your code runs during unit testing is an extremely valuable metric to track. Utilizing code the karma-coverage plugin and babel-plugin-__coverage__ plugin, we can get an accurate measure of how well we’re covering the files that we are testing.

otherjs tutorial about Optimize React size and performance with Webpack production plugins

Optimize React size and performance with Webpack production plugins

5:45 otherjs PRO

You can fine tune several webpack plugins to make your bundle as small as it can be for your specific application. However there are a few things you can do for pretty much every application to make it smaller and run faster. In this lesson we’ll combine several webpack plugins to optimize things for a React application (this is also applicable for non-React applications as well).

otherjs tutorial about Grouping vendor files with the Webpack CommonsChunkPlugin

Grouping vendor files with the Webpack CommonsChunkPlugin

5:36 otherjs PRO

Often, you have dependencies which you rarely change. In these cases, you can leverage the CommonsChunkPlugin to automatically put these modules in a separate bundled file so they can be cached and loaded separately from the rest of your code (leveraging the browser cache much more effectively).

otherjs tutorial about Chunking common modules from multiple apps with the Webpack CommonsChunkPlugin

Chunking common modules from multiple apps with the Webpack CommonsChunkPlugin

4:11 otherjs PRO

If you have a multi-page application (as opposed to a single page app), you’re likely sharing modules between these pages. By chunking these common modules into a single common bundle, you can leverage the browser cache much more powerfully. In this lesson we’ll use webpack’s CommonsChunkPlugin to easily share common modules between apps.

otherjs tutorial about Tree shaking with Webpack 2

Tree shaking with Webpack 2

3:23 otherjs PRO

The less code you can send to the browser, the better. The concept of tree shaking basically says that if you’re not using some piece of code, then exclude it from the final bundle, even when that piece of code is exported from a module. Because ES6 modules are statically analyzable, Webpack can determine which of your dependencies are used and which are not. In this lesson, see how to take advantage of this awesome feature in Webpack 2.

otherjs tutorial about Validate your Webpack config with webpack-validator

Validate your Webpack config with webpack-validator

4:06 otherjs PRO

It’s quite common to make a mistake while developing your webpack configuration. A simple typo can cost you hours of development time. With webpack-validator, you can save yourself a ton of time by validating that your webpack configuration is free of common mistakes.

Note: Webpack 2 now has validation baked in.

otherjs tutorial about Hashing with Webpack for long term caching

Hashing with Webpack for long term caching

3:46 otherjs PRO

Leveraging the browser cache is an important part of page load performance. A great way to utilize this cache is by versioning your resources. In this lesson, learn how to use Webpack’s hashing feature so you can take advantage of long term caching of your assets.

otherjs tutorial about Intro to the Production Webpack Course

Intro to the Production Webpack Course

2:14 otherjs

There are several lessons that will build on top of this project. It is a fairly standard, small webpack bundled project. In this lesson we’ll explore the project a bit so you’re familiar with how things are set up for future lessons.

otherjs tutorial about Maintain sane file sizes with webpack code splitting

Maintain sane file sizes with webpack code splitting

2:38 otherjs PRO

As a Single Page Application grows in size, the size of the payload can become a real problem for performance. In this lesson, learn how to leverage code splitting to easily implement lazy loading for your application to load only the code necessary for a particular feature or functionality.

otherjs tutorial about Introduction to Vim Plugins

Introduction to Vim Plugins

2:14 otherjs PRO

Vim has the ability to extend its functionality through plugins that can be installed either manually or through plugin managers. We'll setup the vim-plug manager to install plugins for our .vimrc

otherjs tutorial about Configuring AWS Elastic Load Balancers

Configuring AWS Elastic Load Balancers

5:47 otherjs PRO

In this lesson, you will learn how to setup an Elastic Load Balancer for your nodejs servers. You will also learn how to configure the load balancer with servers in different availability zones, using nodejs servers that do not require root access to bind to port 80 or 443, and are not publicly accessible via the internet. You will learn how to use health checks to ensure your servers are removed from service when not responding properly and be automatically added back to the load balancer when functional again. Finally, I show you how to understand the metrics provided by the ELB to troubleshoot problems with both your backend servers and the ELB itself.

otherjs tutorial about Scheduling Events with AWS Lambda (a.k.a. Lambda cron jobs)

Scheduling Events with AWS Lambda (a.k.a. Lambda cron jobs)

5:35 otherjs PRO

Learn how to create AWS Lambda functions that execute on a scheduled interval, much like a cron job would. In this lesson we will create a Lambda function that checks for a string of text on a website to verify the website is up and operational. The lambda function logs to CloudWatch Metrics and sends a notification email using an SNS queue if the check fails.

otherjs tutorial about Installing the AWS CLI on OS X and Linux

Installing the AWS CLI on OS X and Linux

4:00 otherjs PRO

Installing the AWS CLI on your local workstation may be one of the biggest boosts to productivity you can make if you use AWS often. Almost all AWS features are available via the CLI allowing you to script, schedule and automate many AWS related tasks.
In this lesson, I’ll show you how to setup and verify the AWS CLI.

otherjs tutorial about Git: How to change the most recent commit with `--amend`

Git: How to change the most recent commit with `--amend`

1:49 otherjs PRO

If you make a mistake with a commit and need to make changes or you'd like to update the commit message of the most recent comment, you can do this with the git commit --amend command.

otherjs tutorial about The Vim Config file

The Vim Config file

1:34 otherjs PRO

Now that you know how to enable features in Vim, let's store all of them in one place so we don't need to constantly set them all the time.

otherjs tutorial about Configure VIM

Configure VIM

1:16 otherjs PRO

Vim's defaults leave the editor in a pretty minimal state. Let's look at some of options we can configure to make Vim feel more like a traditional editor

otherjs tutorial about Copy and Paste inside of Vim

Copy and Paste inside of Vim

0:55 otherjs PRO

Sometimes you just need to copy some code from one file to another. Vim allows you to do this, in a quick and efficient way.

otherjs tutorial about Vim's built-in commands

Vim's built-in commands

1:19 otherjs PRO

Vim likes to keep you in normal mode at all times. But this can be difficult when trying to delete or change some text in a file. Thankfully Vim has build commands to make this a breeze

otherjs tutorial about Combining Vim commands

Combining Vim commands

1:31 otherjs PRO

We've gone over some of the basic Vim key commands, but what else can you do with them? We'll go over how you can compose them and to create more powerful commands

otherjs tutorial about Saving Files in Vim

Saving Files in Vim

1:01 otherjs PRO

We've learned how to add text in Vim using insert mode, now what about saving that file? We'll go over how to use Vim's write command.

otherjs tutorial about Vim's different modes

Vim's different modes

1:52 otherjs PRO

One of Vim's most unique features are it's different modes. Learn how to use these modes and speed up your editing

otherjs tutorial about Moving around in Vim

Moving around in Vim

1:01 otherjs PRO

Learn how to efficiently move around Vim and stop reaching for your mouse

otherjs tutorial about Intro to Vim

Intro to Vim

0:32 otherjs

The Vim editor is a text editor that lives inside of your terminal. Learn how to start Vim, and more importantly how to exit out of the editor!

otherjs tutorial about Speed Up Your Website by Using AWS CloudFront

Speed Up Your Website by Using AWS CloudFront

4:08 otherjs PRO

In this lesson, you will learn how to improve your website performance by using the AWS CloudFront service. I show you how to setup CloudFront, properly configure the S3 settings, enable logging, and verify operation.

otherjs tutorial about Using jq to parse the Star Wars API

Using jq to parse the Star Wars API

2:57 otherjs PRO

jq is a lightweight and flexible command-line JSON processor. It is extremely useful for processing data from APIs to better understand the data your code will be consuming, before you write the code. In this lesson I introduce you to jq and show you the basic features it provides using the Star Wars API (http://swapi.co) as our data source. Topics covered include filtering, piping, object construction and data manipulation.

otherjs tutorial about WebStorm - Sharing a Gist

WebStorm - Sharing a Gist

1:28 otherjs PRO

You can easily share your code from WebStorm with others using the "Create Gist" feature. This lesson walks you through how to create a gist from a single or multiples files and also how to use gist.run to share a running version of your code

otherjs tutorial about Permission denied (publickey) when SSH Access to Amazon EC2 instance

Permission denied (publickey) when SSH Access to Amazon EC2 instance

2:53 otherjs PRO

There are two likely causes to the "Permission denied (public key)" error encountered with AWS EC2 instances: incorrect ssh keys and incorrect usernames. In this lesson, I'll address both and show you how to overcome them.

otherjs tutorial about Hosting a Static Website on Amazon S3

Hosting a Static Website on Amazon S3

4:19 otherjs PRO

In this lesson, you will learn how to host a static website on Amazon S3. I will show you how to create the buckets, create the bucket policy to allow public access and point your own custom DNS name to the website.

otherjs tutorial about WebStorm - Managing Imports

WebStorm - Managing Imports

2:27 otherjs PRO

WebStorm can save you tons of time by managing your imports for you. John walks you through a few key WebStorm importing tips to help speed up your importing workflow.

otherjs tutorial about WebStorm - Customizing the Built-in Terminal

WebStorm - Customizing the Built-in Terminal

3:29 otherjs PRO

WebStorm has a convenient built-in terminal which you can launch with a simple keyboard shortcut and customize to your heart's content. This video shows how to set up the terminal to launch Cygwin (a very popular Windows shell alternative), but the concepts hold true for launching zsh, fish, or any shell of your choice.

otherjs tutorial about WebStorm - Installing Custom Color Schemes (dayleress/colour-schemes)

WebStorm - Installing Custom Color Schemes (dayleress/colour-schemes)

2:12 otherjs PRO

In this lesson, we'll walk through installing a custom color scheme into our WebStorm IDE. Dayle Rees's daylerees/colour-schemes has a great collection of themes ready to install in different formats for various editors.

For this example, we will install the Peacocks In Space theme into an OS X WebStorm 11 EAP installation. Note: This process will be very similar (or identical) for previous versions of WebStorm and other editors in the JetBrain's family of editors.

otherjs tutorial about Tips & Tricks

Tips & Tricks

7:16 otherjs PRO

John Lindquist is a WebStorm wizard. In this lesson, he'll show you some of the tips & tricks he uses to squeeze maximum productivity out of his tool of choice.

otherjs tutorial about Introduction to RequireJS

Introduction to RequireJS

4:48 otherjs PRO

RequireJS provides a clean way to load and manage dependencies for your Javascript applications. This video examines the first steps towards using RequireJS.

Introduction to Karma

2:45 otherjs PRO

A quick tutorial covering installing Karma and running tests from the command line and Webstorm.

otherjs tutorial about Introduction to Bower

Introduction to Bower

2:49 otherjs PRO

Bower is a package manager for Javascript libraries that allows you to define, version, and retrieve your dependencies. In this tutorial, John gives a quick introduction to Bower and will show you how to get started.

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?