Learn Jq, Radium and Webstorm

jq is a lightweight and flexible command-line JSON processor.

jq can help you quickly filter massive amounts of JSON data, but how can you turn it into a CSV, so you can process it quickly with a database or spreadsheet application?

This lesson shows how to select the data you want for your CSV with jq, and uses the helper utility linked below to output as CSV.

https://github.com/joelpurra/jq-hopkok/tree/master/src/tabular

Convert JSON to CSV with jq

React is one of the web’s most popular frameworks for building JavaScript applications. 

If you know what you’re doing, React can drastically simplify how you build, use, and maintain code.

Whether you’re a React newbie or you’re ready for advanced techniques, you can level-up with egghead. Explore our in-depth courses, lessons, and community resources to build more powerful applications and crack open your career.

react

When exploring a new framework or technology, it is nice to have a seed project or sandbox so you can just get in and start playing. Let's build our React playground using npm, browserify, 6to5, and more within WebStorm!

Setting up a React Playground Dev Environment

In a CSS library like Bootstrap we can set a button's style to be "primary" or "secondary" by appending classes. For React components we want to be able to do this via props. Radium enables this by composing styles via an array. This mimicks the cascade of CSS.  

Radium: Updating Button Styles via Props

Lightweight yet powerful IDE, perfectly equipped for complex client-side development and server-side development with Node.js.

webstorm

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. 

Tips & Tricks

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

WebStorm - Sharing a Gist

React's inline styles allow components to stand on their own by not requiring any external CSS. However HTML's style attributes don't support pseudo selectors like `:hover` and `:active`. By using Radium to listen to mouse events we can restore `:hover` and `:active` selectors to inline styles.

Styling a React button component with Radium

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.

WebStorm - Managing Imports

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

Introduction to Karma

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.

Using jq to parse the Star Wars API

AngularJS is an open-source JavaScript framework, maintained by Google, that assists with running single-page applications. Its goal is to augment web-based applications with model–view–controller (MVC) capability, in an effort to make both development and testing easier.

angularjs

In this lesson John shows some tricks for speeding up your test suite. He digs into some handy features of WebStorm, including the *ddescriber* plugin, as well as some alternative methods for Jasmine for selectively running your tests.

Speed Testing with WebStorm and Jasmine

In this lesson, we'll walk through installing a custom color scheme into our [WebStorm](https://www.jetbrains.com/webstorm/) IDE. Dayle Rees's [daylerees/colour-schemes](https://github.com/daylerees/colour-schemes/blob/master/jetbrains/peacocks-in-space.icls) 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](https://github.com/daylerees/colour-schemes/blob/master/jetbrains/peacocks-in-space.icls) theme into an OS X [WebStorm 11 EAP](https://confluence.jetbrains.com/display/WI/WebStorm+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](https://www.jetbrains.com/)._

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

WebStorm can easily help you set up a new Angular 2 project with never even touching a terminal. This lesson shows you all the neat GUI tricks you need to know to get up and running.

WebStorm - Setting Up Angular 2

grunt

In this lesson you will install GruntJS and get up and running with your first task, initial configuration, and how to get Grunt methods auto-completing in WebStorm.

Introduction to Grunt

JetBrains IDEs have a very good code completion for JavaScript code but you can do it even better by adding TypeScript typings, even if you don’t use TypeScript in your project. Should work in WebStorm, PhpStorm, RubyMine, PyCharm and others.

Improve JavaScript Code Completion in WebStorm with TypeScript Typings

Bash, unfortunately, doesn’t ship with a command that can work with JSON natively. In this lesson, we’ll learn how to read and do basic queries on JSON with `jq`, an installable command line tool that makes working with JSON in bash really easy. We'll pipe the JSON output of the Github API to jq to extract values. 

Note: jq has to be installed. On macOS, the easiest way to do this is to run `brew install jq`.  To view install instructions for all platforms, see https://stedolan.github.io/jq/download/. 

Read and Use JSON in Bash with jq

In this lesson, we'll apply our `jq` skills and write a script that gets a list of dependencies from package.json and greps for usages of every package. If a package is unused, it's marked for removal. 

Topics

Instructors

Content Type