Industry News

#390 — June 15, 2018

Read on the Web

JavaScript Weekly

JavaScript Engine Fundamentals — A fantastic writeup (with video, if preferred) looking at the key parts of major JavaScript VMs/engines and how they interact with the code you write.

Mathias Bynens

Polly.js: Record, Replay, and Stub HTTP Interactions — A library from Netflix for recording, replaying and stubbing HTTP interactions via native browser APIs. GitHub repo.

Netflix

💻 New Course: A Practical Guide to Algorithms with JavaScript — Bored by the academic approach of most data structures and algorithms courses? This is for you. Solve algorithms and analyze space and time complexity in both an interview setting and in your day-to-day development.

Frontend Masters sponsor

Office 365 Is Being Rewritten in JavaScript — Joining Skype, Microsoft Teams, and VS Code. React Native Windows is the approach used, making it possible to build seamless Windows 10 and Xbox One apps with React.

Sean Thomas Larkin on Twitter

Vue Native: Build Native Mobile Apps with Vue.js — React has React Native, and now if you’re a Vue.js developer, you could give this a try. Unlike React Native this isn’t an official project from the same team and is essentially a Vue wrapper around React Native itself. Introductory article.

GeekyAnts

How V8's Concurrent Marking Frees Up The Main Thread — ‘Marking’ is a key step in V8 6.4’s garbage collection process and now this process takes place on separate worker threads meaning more time for your code on Chrome 64+ and Node 10+.

Mathias Bynens

Introducing 'The GraphQL Guide' — John Resig, the creator of jQuery, has co-written a book aiming to show you why GraphQL APIs are “the true successor to REST APIs”.

John Resig and Loren Sands-Ramshaw

Vue.js Passes React in Terms of GitHub Star Count — A vanity metric for sure, but an interesting one nonetheless. React still has significantly more downloads each day but Vue’s community is particularly vibrant and eager.

Dan Abramov on Twitter

The Biggest Lead Developer Conference Yet Is Coming to London in 2 Weeks

The Lead Developer London sponsor

💻 Jobs

React/Full-Stack Engineer (Remote) — Join our small, distributed team as we build the world’s largest open library of freely usable visuals. Open to all, regardless of experience and background.

Unsplash

Have You Tried Vettery? — Vettery matches top tech talent with fast-growing companies. Take a few minutes to join our platform.

Vettery

📘 Tutorials

Understanding the Almighty Reducer — A beginner-friendly walkthrough of using JavaScript’s reduce method.

Sarah Drasner

What's New in ES2018 — Including async iteration, Promise.finally(), and rest/spread properties.

Craig Buckler

▶  Look, No Hands! — Brain Controlled JavaScript — Fun with thought processed interactions using a brain sensor with JavaScript.

Charlie Gerard

▶  Learn to Build a Slack Integration — A demo of Slack’s new developer features, with an introduction to Actions, showing what it enables for developers, and some possible use cases.

Slack sponsor

Submitting HTML Forms using Vue, React, or Hyperapp

Ogundipe Samuel

An Introduction to Sails.js — A Rails-esque MVC framework for Node webapps.

Ahmed Bouchefra

▶  How to Set Up A Windows Dev Environment That Feels Like $HOME — This isn’t JS specific but we’re always hearing of developers trying out Windows lately so this could be helpful.

Sarah Cooley and Tara Raj

▶  How to Code Your Own Discord Bot with Discord.js

Dapper Dino

🔧 Code and Tools

Parcel 1.9 Released with Tree Shaking and 2x Faster Watcher — If you want a fast, easy, zero-config bundler.

Devon Govett

A Much Faster Way to Debug Code Than with Breakpoints or Console.log — Wallaby catches errors in your tests and displays the results of expressions right in your editor as you type.

Wallaby.js sponsor

Licensed: A CLI for Adding a LICENSE File to Your Projects

Mihir Chaturvedi

collect.js: 91 Convenience Methods for Arrays and Objects — A similar API to Laravel Collections: chunk, flatten, shuffle, firstWhere, etc.

Daniel Eckermann

Pickr: A Flat, Simple, Dependency-Free Color Picker — Live demo. It’s nice.

Simon Wep

Math.js: An Extensive Math Library for JavaScript and Node — There’s a CoffeeScript-oriented intro too, if that’s your bag.

Jos de Jong

jeelizWeboji: Realtime JS Face Tracking and Facial Expression Detection

Bourry Xavier

HyperMD: A WYSIWYG Markdown Editor for Browsers — Written in TypeScript. Demo here.

Lv Yang

Vuesax: A Frontend Vue.js Components Framework

Lusaxweb

#389 — June 8, 2018

Read on the Web

JavaScript Weekly

▶  Introducing MapKitJS: Bring Apple Maps To Your Sites — Although still in beta, you can now integrate Apple Maps directly on your own site. This video session from WWDC runs through how you could use it. Related docs here.

Apple

Puppeteer 1.5 Released: Control Headless Chrome from Node — As well as a new homepage, Browser Contexts can be used to isolate cookies and other data usually shared between pages, and you can now interact with Web Workers.

Google Chrome Team

APIs and Infrastructure for Next-Gen JavaScript Apps — Build and scale interactive, immersive apps with PubNub - chat, collaboration, geolocation, device control and gaming.

PubNub sponsor

ml5.js: Friendly Machine Learning for the Web — Builds on top of TensorFlow.js to make things like Web-based image classification easier to create.

NYU ITP

Meteor 1.7 Released — The latest version of the Node-based isomorphic framework automatically creates two sets of client-side assets, for both modern and ‘legacy’ browsers.

Ben Newman

Building Serverless Mobile Apps with React Native and AWS — A look at what’s involved with building a ‘backendless’ mobile app using React Native along with AWS’s Mobile CLI, Cognito (for auth), and Amplify.

Nader Dabit

▶  10 Things Node's Inventor Regrets About Node — Original Node.js inventor Ryan Dahl reflects on what he considers to be some early design mistakes with Node.

JSConf EU

Overscripted: Digging Into JavaScript Execution at Scale — A writeup of work taking place at Mozilla and UCOSP to “explore the unseen or otherwise not obvious series of JavaScript execution events that are triggered once a user visits a webpage” across a million Web pages.

Mozilla Hacks

Free, Online Talk with Liz Fong-Jones of Google — Join us June 21 for our discussion around “Improving Reliability with Error Budgets and Site Reliability Engineering”, hosted by Big Nerd Ranch.

Big Nerd Ranch sponsor

Yarn's 'import' Can Now Use npm's package-lock.json — As of 1.7.0, Yarn is able to import its dependency tree from npm’s package-lock.json natively, without external tools or clunky processes.

Aram Drevekenin (Yarn)

💻 Jobs

Sr. Fullstack Engineer (Remote) — Sticker Mule is looking for passionate developers to join our remote team. Come help us become the Internet’s best place to shop and work.

Sticker Mule

Remote Front End Developer (React) — Join us, work remotely from North America, and help build software that matters.

Aha!

JavaScript Expert? Sign Up for Vettery — Vettery matches top tech talent with fast-growing companies. Take a few minutes to join our platform.

Vettery

📘 Tutorials and Opinions

Debugging JS Projects with VS Code and Chrome Debugger — Michael shows how to ditch console.log() and start debugging JavaScript more elegantly.

Michael Wanyoike

How to Deploy a Node App to AWS Lambda using Serverless — Entry level but that might be what you need right now :-)

Adnan Rahić

Replacing jQuery with Vue — Takes a shot at convincing you that using Vue.js doesn’t have to be a headache and will help even on basic projects.

Nilson Jacques

Understanding Variables, Scope, and Hoisting in JavaScript — A thorough (re)introductory guide.

Tania Rascia

Getting Started with the Node-Influx Client Library

InfluxData sponsor

The React is 'Just JavaScript' Myth — “React is just JavaScript.” — Dave affirms that this adage is good marketing, but also false.

Dave Rupert

How Learning C++ Can Make You A Better JS Developer

Pawel Grzybek

Live Session: Learn to Build a Slack Integration — Join us June 12 for a live demo of Slack’s new developer features. Tune in from anywhere, and bring questions.

Slack sponsor

Thoughts on JSConf.eu 2018 and Takeaways from the Conference — It took place last weekend in Berlin.

Kevin Simper

🔧 Code and Tools

JSUI: A Powerful UI Toolkit for Managing JavaScript Apps

Kristjian Ristovski

LuminJS: Progressively Highlight Any Text on a Page — For drawing attention to text or, perhaps, showing progress.

Preet Shihn

Short and Sweet: Accessible Character Counter for Input Elements — Demo here.

Rik Schennink

Paper.js: A 'Swiss Army Knife' for Vector Graphics Scripting

Juerg Lehni and Jonathan Puckey

#388 — June 1, 2018

Read on the Web

JavaScript Weekly

I'm in San Francisco next week exhibiting and speaking at DevXCon about JavaScript Weekly :-) It's a developer relations conference, so if you know any DevRel people located near SF, let them know as I believe some tickets are still available.

Due to next week's travel, JavaScript Weekly will lean on submissions more than usual, so if you want to submit stuff for us to consider use this nifty submissions form or just hit reply :-) Thanks!

— Peter Cooper, editor

Jest 23 Released: Even Faster JS Testing — Jest is a popular JavaScript testing tool and when webpack switched from Mocha to the Jest 23 beta, they saw a 6x speed improvement for their test suite.. There’s also a talk about Jest 23 if you prefer a video guide.

Rick Hanlon II

Simplifying Web Worker Code with Comlink — Web Workers help you offload work from the main thread to other threads but they can be tricky to manage. This tutorial presents a solution (from Google, no less): Comlink, a small RPC library.

David East

How to Design Services for Continuous Deployment: 3 Best Practices — The benefits of continuous delivery are well-documented elsewhere. In this post I want to share some of the practices that we use at CircleCI to ensure that our services can safely be deployed continuously.

CircleCI sponsor

A JavaScript String Methods Cheatsheet — A very handy reference covering not quite every string method but certainly the truly useful ones.

Dr. Axel Rauschmayer

TypeScript 2.9 Released — The JavaScript superset that brings optional static types to JS takes another step forward at both the editor support and language level. One new feature is import() types which this article explains. If you’re totally new to TypeScript, this is a good primer.

Microsoft

Sucrase: A Super-Fast Alternative to Babel.. in Certain Situations — Compiles down to modern JS runtimes only (rather than ES5) and focuses on compiling down JSX, TypeScript and Flow which results in a smaller scope with more performance optimizations to be had.

Alan Pierce

UTC is Enough for Everyone, Right? — A really neat article that goes from the history of time itself through to standardization and working with time in both JavaScript and HTML.

Zach Holman

Deno: A Secure TypeScript Runtime on V8 6.8 — An interesting idea from the original creator of Node.js, Ryan Dahl. It’s built with Go, is not Node or npm compatible, and is.. ‘segfaulty’ :-)

Ryan Dahl

💻 Jobs

Sr. Fullstack Engineer (Remote) — Sticker Mule is looking for passionate developers to join our remote team. Come help us become the Internet’s best place to shop and work.

Sticker Mule

JavaScript Expert? Sign Up for Vettery — Top companies use Vettery to find the best tech talent. Take a few minutes to join our platform.

Vettery

🎬 Videos, Screencasts and Talks

On React Suspense — A look at React’s vision for async rendering.

Andrew Clark

Azure Tips and Tricks Video Series — Collection of short videos on using the Azure platform. New videos are released weekly. Subscribe now.

Azure sponsor

Using Async Generators to Stream Data in JavaScript

Fun Fun Function

📘 Tutorials

From Vanilla JS to Vue.js: A Refactoring Tale

Peter Mbanugo

Creating UIs with Angular Material Design Components — How to create a simple Angular app with a UI built from Angular Material components.

Ahmed Bouchefra

Transparent Wrapper Components in Vue

Kevin Ball

Revising Useful JavaScript Array and Object Methods — Write cleaner code by making use of modern array and object methods.

Robert Cooper

Deploy Your Webpack Apps to Heroku in 3 Simple Steps

Rajesh Babu

Live Session: Learn to Build a Slack Integration — Join us June 12 for a live demo of Slack’s new developer features. Tune in from anywhere, & bring questions.

Slack sponsor

GraphQL: Everything You Need to Know — Not directly about JavaScript but this did very well on our @JavaScriptDaily Twitter, so why not?

Weblab Technology

From npm to yarn and Back (to npm) Again — When seeking better performance is a bit like switching lines at the grocery store.

Mixmax Engineering Blog

🔧 Code and Tools

Critters: Webpack Plugin to Inline Critical CSS and Lazy-Load the Rest

Google Chrome Labs

CurrencyFormatter.js: Easy Formatting of Values in 155 Currencies — Contains 155 currency and 715 locale definitions out of the box.

OSREC Financial

Eager Code Evaluation Done Right

Wallaby.js sponsor

jquery-calendar: A Responsive jQuery Calendar Scheduler Built with Bootstrap and Moment.js — It’s not often we get to include something about jQuery these days!

Arrobe

Minipack: A Simplified Example of a Module Bundler Written in JS — The aim is to show how most bundlers work under the hood.

Ronen Amiel

Subliminal: An Opinionated Minimalistic VS Code Theme for JS

Dan Abramov

Mermaid: Generate Diagrams and Flowcharts From Text — Converts text to diagrams and flowcharts (a la Markdown). GitHub repo.

Knut Sveidqvist

Proppy: Functional Props Composition for UI Components — Can integrate with React, Vue, Preact, Redux, and RxJS.

Fahad Ibnay Heylaal

#387 — May 25, 2018

Read on the Web

JavaScript Weekly

Wired Elements: UI Elements with a Hand-Drawn Look — Possibly useful for wireframes and mockups, or wherever you want a less formal look. Implemented as Web Components and cover things like checkboxes, cards, input fields, radio buttons, etc. GitHub repo.

Preet Shihn

JavaScript Algorithms and Data Structures — A wide variety of algorithms (e.g. permutations, Levenshtein distance, binary search) and data structures (e.g. linked lists, trees, stacks) implemented in JavaScript with explanations and links to further reading.

Oleksii Trekhleb

Codacy Helps You Improve Your JavaScript Code — An automated code review tool that allows developers to improve code quality. We check your code against the most popular JS static analysis tools, with specific plugins for Vue, Angular and React. Sign up for free and improve your coding.

Codacy sponsor

SmooshGate FAQ: Array.prototype.flatten is now 'flat' — In issue 376 we wrote up reports that the proposed flatten method could get renamed to smoosh to prevent breaking existing MooTools code. Turns out TC39 are now going with ‘flat’ and here’s the full story.

Mathias Bynens

React 16.4 Released — Gains support for Pointer Events on browsers that support them. Also, check out our React newsletter if you want more React news.

Andrew Clark

JavaScript Start-Up Optimization — Keep your network transmission and parse/compile cost for JavaScript low to ensure pages get interactive quickly.

Addy Osmani

npm 6.1 (next.0) Released — npm audit fix uses the results from npm audit feature to upgrade insecure dependencies for you keeping semver in mind.

The npm Blog

An Initial Threading Implementation for Node using 'Workers' — Check out the example code for an idea of how you’d use it.

Node.js Foundation

nanoJS: A Minimal Library for DOM Manipulation — A step closer to native JS than jQuery but with some of the niceties (chainable, short method names).

Vladimir Carrer

💻 Jobs

JavaScript Developer at X-Team (Remote) — We help our developers keep learning and growing every day. Unleash your potential. Work from anywhere. Join X-Team.

x-team

Senior Frontend Developer at Nested.com, a London Based Startup — We're looking for frontend developers to join our growing team. We're using technology to reinvent the broken industry that is UK property.

Nested

JavaScript Expert? Sign Up for Vettery — Top companies use Vettery to find the best tech talent. Take a few minutes to join our platform.

Vettery

📘 Tutorials

One-Directional Data Binding Without Frameworks — Uses an ES6 proxy to detect changes to an underlying variable.

Jack Tarantino

Intermediate to Advanced Tutorials for Developers: 14 Day Trial — The authors and devs you trust offer bite-sized chunks of tutorials, tips and best practices to raise your game.

The Frontier by Big Nerd Ranch sponsor

Parcel: How Simple Is It, Really? — The conclusion is ‘very’ and if you haven’t played with this ‘zero config’ bundler yet, this is as simple an intro as you’ll get.

Tom Vance

Boosting Your Workflow with Angular 5 Snippets and VS Code

Michael Wanyoike

Testing React Apps with Cypress — A brief guide on how to run end-to-end tests on React apps using the testing framework Cypress.

Rajat S

How Twilio Improves 'Mean Time To Discovery'

ROLLBAR sponsor

▶  The Trick to Understanding Scoped Slots in Vue.js

Adam Wathan

🔧 Code and Tools

Saber.js: A Minimalistic Framework for Building Static Sites using Vue

Egoist

LagRadar: Trace Frame Rate Lag with a Performance 'Radar'

Ben Birch

Vuido: Build Native Desktop Apps using Vue.js? — Very much an early prototype/proof of concept.

Michal Mecinski

A Much Faster Way to Debug Code Than with Breakpoints or Console.log — Wallaby catches errors in your tests and displays the results of expressions right in your editor as you type.

Wallaby.js sponsor

BetterPromise: An Experiment in Subclassing Promise and 'Fixing' Some Awkward/Bad Parts — Always great to see what Kyle’s thinking.

Kyle Simpson

Hyphenopoly: A Polyfill for Client-Side Hyphenation — An interesting use of WebAssembly here too.

Mathias Nater

Top Angular Plugins for Sublime Text

Jeff Smith

hybrids: UI Library for Creating Web Components with a Simple and Functional API — Interactive sandbox/demo.

Dominik Lubański

rmodal.js: A Simple 1.2 KB Modal Dialog with No Dependencies

Iskren Slavov