![[ERR!]](https://pbs.twimg.com/profile_images/828593972029317120/4UXq5Hmj_normal.jpg)
This week brings us a lot of great content, especially for JavaScript frameworks.
One of the greatest frameworks around, Vue.js recently introduced new CLI version 3. If you like an overview of the latest and greatest features it offers, don't miss out "So What’s New in Vue CLI 3.0?" by Nwose Lotanna.
React hooks are still a big topic. Aayush Jaiswal is recommending "10 React Hooks you Should Have in Your Toolbox".
Angular developers would find a lot of useful information in "Ngx-restangular: RESTful API Angular solution".
Finally, don't miss out to check the newest release notes for our favorite framework, Aurelia, on the official blog.
General
What Are Progressive Web Application Push Notifications?
Have you tried push notifications as a communication channel with your customers? No? Maybe it is because you do not have a mobile app, which for the longest time was how consumers could subscribe to push notifications. Progressive Web Applications make native push notifications available to any website using a service worker on just about every platform and browser.
Authored by: Chris Love
From front-end developer to a DevOps: An intro to CI/CD
2019 is a truly amazing time for all aspiring front-end developers. There's plenty of educational materials, courses, and tutorials. Every day, endless blog posts and articles sprout like mushrooms after rain. Anyone who wants to become a homegrown pro has access to everything they need - usually for free.
Authored by: LogRocket
Web Development Nuts And Bolts: How to Publish a Website
It's a great time to be a web developer. There's so many options, so many frameworks, so many places to learn. But for a new developer, it can be tricky to see how it all fits together. How do you actually get from the thing you've been learning to something on the web that real people can use?
Authored by: Kevin Ball
The shortest way to conditional insert properties into an object literal
What am I ranting about? I'm talking about this: Trust me, this is perfectly acceptable and executable JavaScript. Surprised? Shaken up? Aghast? Maybe just intrigued? Bear with me for few lines, I'll try to explain what's going on thanks to the ECMAScript Language Specification. It won't be so boring, I new Promise().
Authored by: JFieldEffectT
JavaScript
What is `this`? The Inner Workings of JavaScript Objects
JavaScript is a multi-paradigm language that supports object-oriented programming and dynamic binding. Dynamic binding is a powerful concept which allows the structure of your JavaScript code to...
Authored by: Eric Elliott
JavaScript Frameworks - Know it's Lifecylces
I started my Web development journey a little over five years ago. My first JavaScript framework was BackboneJs, and I am so glad it happened that way. The reason is that although BackboneJs is a framework it didn't feel like it.
Authored by: Omar Duarte
The first shall be last with JavaScript arrays
So the last shall be [0], and the first [length - 1]. - Adapted from Matthew 20:16 I'll skip the Malthusian Catastrophe and get to it: arrays are one of the simplest and most important data structures.
Authored by: freeCodeCamp.org
Responsible JavaScript: Part I
by Published in Jeremy Wagner Code , Application Development , JavaScript By the numbers, JavaScript is a performance liability. If the trend persists, the median page will be shipping at least 400 KB of it before too long, and that's merely what's transferred.
Authored by: A List Apart
JavaScript for Machine Learning using TensorFlow.js
We will load the "house" data-set, which can be found here. It contains many different features for a given house. For this tutorial, we only want data about average area number of rooms and the price of each house. Add the following code to your script.js file.
Authored by: Bit
TypeScript
Node.js TypeScript #8. Implementing HTTPS with OpenSSL certificate
1. Node.js TypeScript #1. Modules, process arguments, basics of the File System2. Node.js TypeScript #2. The synchronous nature of the EventEmitter3. Node.js TypeScript #3. Explaining the Buffer4. Node.js TypeScript #4. Paused and flowing modes of a readable stream5. Node.js TypeScript #5. Writable streams, pipes, and the process streams6. Node.js TypeScript #6.
Authored by: Marcin Wanago
Getting creative with the Console API!
Debugging in JavaScript has always been inseparably connected with the Console API , which is most of the time used only through console.log(). But, did you know that it doesn't have to be this way? Hasn't console.log() already bored you with its monolithic output? Do you want to make your logs better, to make them prettier?
Authored by: areknawo
Angular
Ngx-restangular: RESTful API Angular solution
To write your own models, interceptors, modules for handling errors, methods for writing needed headers and lots of other stuff - that's rather exciting only if you aren't doing it a third time in 2 months, right? Actually, that's the reason why we've decided to port a Martin Gontovnikas' "Restangular" on an Angular/TypeScript.
Authored by: 2muchcoffee
Reporting The User's Timezone Offset To The Server Using An API Client In Angular 7.2.10
Ben Nadel explores the use of a specialized HttpClient in order to report the user's local Timezone Offset as a custom HTTP Header, "X-Timezone-Offset". This is just one of the many reasons that you should be creating custom HttpClient instances in an Angular 7.2.10 application.
Authored by: Ben Nadel
"Trick or Unsubscribe" in RxJS: a Custom Angular Decorator
Background A brief introduction to Observable's world What are the advanced options to unsubscribe? Why have I come to a custom solution? My custom @DestroySubscribers() decorator Conclusion Why Observables might be dangerous for your application? What are the options to reduce the risks?
Authored by: Logvin Oleg
Using Angular Elements - Why and How? - Part 1
Let's start by creating a new Angular Project in our system. For this, make sure that you have the latest version of Angular CLI installed.
Authored by: Bit
A Deep Dive into Angular's NgOnDestroy
Wes Grimes Mar 29 ・6 min read This article is a continuation of an Angular Hot Tip tweet that I sent out earlier this week. It became widely popular and generated quite a discussion. The concepts explored in this article reflect that discussion, so you should probably take some time and go check it out here: 📣🌟Angular Hot Tip Counting on ngOnDestroy to always fire?
Authored by: Wes Grimes
Uploading Files With HttpClient In Angular 7.2.11
Ben Nadel demonstrates that the HttpClient service in Angular 7.2.11 supports File uploads right out of the box. This allows File Blobs to be selected and POST'ed to a remote server in exactly the same way any other POST would be performed in an Angular application.
Authored by: Ben Nadel
React
10 Custom React Hooks you Should Have in Your Toolbox
The custom hooks you should probably have in your arsenal. Hooks came and conquered React and shook the whole developer community. Scrolling down your twitter feed without noticing the word hooks is a rare occasion these days. And by this day, I hope you have accepted your fate and have adopted them in your codebase.
Authored by: Bit
Practical React Hooks: How to refactor your app to use Hooks
A good number of people are excited about the addition of Hooks to React - I happen to be one of those people! Once you get past the tutorials on how to get started with Hooks, your next concern becomes obvious: How do you actually refactor your existing application or components to use Hooks?
Authored by: Ohans Emmanuel
Customizing Chart.JS in React
ChartJS should be a top contender for any data visualization endeavor in React (and in other frameworks). While D3 is a power house of possibilities, and other worthwhile options exist - ChartJS solves most data visualization needs. If you are a React developer exploring ChartJS - chances are you've found the really friendly and easy to use wrapper.
Authored by: Bit
React Styled Components Tutorial
Thank you Yomi Eluwande for submitting this guest blog post to teach others about your skills and learnings as a developer. If you want to submit a guest blog post too, I am keen to get a message from you. There is only one requirement: You must have written a quality technical article before.
Authored by: Robin Wieruch
Build a Reusable Timer Component With React and Bit
So, we are going to develop our own countdown timer React component and use Bit to easily make it available for my whole team to use in their apps. When done, you will have your own components like this: More than that, you will learn how to easily share components from your different into a shared collection, and use them anywhere to build faster.
Authored by: Bit
React Prerequisites and 4 ES6 Things to Know ― React Starter
These are the things you need to know to learn React. 4 main ES6 features and a few things about working with React.
Authored by: Scotch Development
Aurelia
Aurelia Release Notes - April 2019
Today, we're excited to announce the beta of Aurelia's Web Components plugin, enabling you to use your Aurelia custom elements as Web Component standard custom elements, easily inter-operating with other frameworks. Aurelia has always valued strong web standards usage.
Authored by: Aurelia
Vue
So What's New in Vue CLI 3.0?
A few months ago, Evan You and the team at Vue released the latest and most exciting version of Vue CLI, version 3. This version was a re-write of the prototyping and scaffolding tool, going back to...
Authored by: Bit
Node.js
Node.js vs Python for a Beginner's Web App
Learning to build webapps is an exciting process, but it comes with its own set of challenges. As a newer developer, deciding what programming language will bring your big idea to life is a common challenge. There are lots of terrific choices for building webapps on the market.
Authored by: Stackify
Build a Cron-Job in Nodejs
setTimeout is the best bet of all Nodejs APIs to use in scheduling execution time of code snippets because it used to defer execution of a function to until a particular time. The setTimeout API takes two parameters: setTimeout(fn, ms) The fn parameter is the callback function that is executed when the time ms has elapsed.
Authored by: Bit
Pro Node.js tips
Starting with a new programming language can be a daunting task. In the case of Node.js, it can be difficult even if you come from a front-end background and use JavaScript. Starting in Node.js involves learning the entire npm ecosystem, getting used to the quirks of JavaScript and getting to know and love asynchronous logic.
Authored by: Fernando Doglio
Should you log the Express req object and external API responses?
Logging as much information as you need to be able to troubleshoot, understand what happened during a session, and even for analytics purposes is something all apps need to have in place before going to production. You've likely got some logging in place - things like errors and successful transactions (if you're looking at logs for analytics/metrics).
Authored by: Corey Cleary
Libraries and Tools
Webpack upgrade from 3 to 4
Before starting with an upgrade to v4, let's discuss the high-level definition of webpack. I promise this won't take much time. " Webpack is a tool. Helps in creating browser readable bundle.js* file. " For React component lovers, a simple analogical explanation is given in the diagram.
Authored by: Sujaan Singh
Deploy from CodeSandbox to Netlify in Seconds
In my previous article, Creating a Social Follow Component in React, I used CodeSandbox to create and edit a brand new React application... ALL IN THE BROWSER! CodeSandbox allows you to create, edit, and deploy applications all in the browser! CodeSandbox really is incredible. Using CodeSandbox, you can...
Authored by: Scotch Development
Streamline Code Reviews with ESLint + Prettier
A Shotgun Video Episode In the latest episode of Shotgun with Eric Elliott, a video series for members of EricElliottJS.com, we walked through the process of setting up ESLint and Prettier to automate the process of syntax checking and code style management for JavaScript projects. Why are Automated Lint and Code Style Important?
Authored by: Eric Elliott
Why GraphQL?
What does the perfect API look like? It should be efficient, fast and easy to use for our users and it should be equally efficient, fast and easy for us to develop. To be fast and efficient we need to carefully choose the data that we return from our API.
Authored by: Johannes Kling
Awesome Automation and Integration with Buddy
One of my favorite services for years has been IFTTT (If this then that). Having a service that allows me to trigger a host of functionalities with one simple action is amazing! Posting a picture to Instagram can trigger IFTTT to send a tweet, post to Facebook, email to friends, etc.
Authored by: David Walsh
Javascript validators comparison using Joi vs express validator
The world is a dangerous place, which is why you need data validation Imagine you have an e-commerce website and you're allowing users to create accounts using their name and email and you want to make sure they sign up with real names, not something like cool_dud3 That's where we use validation to validate inputs ...
Authored by: Shailesh Shekhawat
Testing
Refactoring legacy code with Jest snapshots
Snapshot testing is immensely popular for testing React apps or other component-based UIs. However, it's not exactly drama-free-many people looooove snapshots for their ease of use and ability to quickly bootstrap a testing portfolio, while others feel that the long-term effects of snapshots might be more harmful than they are helpful.
Authored by: LogRocket
Readable Cypress.io tests
How to write readable tests using custom commands and custom Chai assertions. The tests should be simple to read and understand. The tests are already a layer on top the production code that is complex, so they should not add their own quirks or gotchas.
Authored by: Gleb Bahmutov
Who has the fastest website in F1?
I was trying to make my predictions for the new Formula One season by studying the aerodynamics of the cars, their cornering speeds, their ability to run with different amounts of fuel. Then it hit me: I have no idea what I'm doing.
Authored by: CSS-Tricks
Other
The 10 Things We Built on Twitch in March
This year feels like it's on moving too fast! March is done and it was an eventful month for us here at Scotch. We've gotten the following done: Twitch streams have been quite the learning experience for me. Between video and audio gear and learning how to read chat/code/stream at the same time while keep it interesting.
Authored by: Scotch Development
