JSK Weekly - October 10, 2019

It's never a bad time for self assessment, especially if you're continually hitting the same obstacles and/or find yourself being repetitive in your research. One of the angles to questioning approach is tackled this week by Harry Ghazni on gitconnected in "A tutorial addiction can kill your learning" and Ignas Poška shows us how React has evolved over the years in "3 React concepts which can be forgotten", another possible approach shift.

Honing skills to expert level will never be a waste of time and Shaumik Daityari helps us improve our Git skills and save time this week in "Become a Git Ninja: 7 Productivity Tips" on the Bits and Pieces blog while Paul Ryan makes delving into the world of animations on the web a great journey in "Animations using React Hooks and GreenSock" on the LogRocket blog.

Lastly, a small group of engineers who wanted to make React state debugging simple have created a state debugger for React. Check it out in "Reactime: Time Travel State Debugger."


How to Build a Blog with Gatsby and Boostrap

A complete guide to building a static website with Gatsby If you want to build a static website or a blog and you know web development, you have many static website generators to choose from. If you want to use React to build your static website, Gatsby can be a choice that suits your needs.

Authored by: Bit

Building a photo gallery app from scratch with Chakra UI Blog

React is now one of the most battle-tested and mature front-end frameworks in the world, and Express.js is its counterpart among back-end/server frameworks. If you're building an app today, you can't pick a better duo than this. In this post, I will walk you through building a complete app using these two frameworks, plus Chakra UI for component styling.

Authored by: LogRocket

A tutorial addiction can kill your learning

When you're anxiously speeding through your 5th video tutorial on [insert-new-framework] you're trying to learn and come to the stark realisation... this tutorial isn't going to help you create the app you wanted. You have to question, is my approach the right one? The short answer is no.

Authored by: Harry Ghazni


Building a Platform Game in JavaScript with PixiJS - Part 3

In the previous parts, we have created game assets, setup game components and introduced state management. In this part we will develop collision detection, an essential part of most games. Since our game objects can be approximated with rectangles (bounding boxes) of edges parallel to the Cartesian coordinate axes (they are axis-aligned), therefore we can use AABB (axis-aligned bounding box) checks.

Authored by: JavaScript in Plain English

Implementing Heaps in JavaScript

Most of the programming languages support some specific data types, for example, int, string, boolean, etc. We can define our custom data type for storing groups of data and this data type can also...

Authored by: Bit

Secrets of Logical ️ Operators in Javascript 🤷‍

Learn how logical operators in Javascript is different from other programming languages (&& || !) Logical operations allow us to make decisions (either true or false ), based on conditions. In most programming languages, the logical operation returns either true or false. In Javascript, logical operations return the value of one of the operands used in the operation.

Authored by: jagathish

Become a Git Ninja: 7 Productivity Tips

Improve your Git skills and save time with this list of tips and tricks Over the past decade, there has been an increase in the popularity of version control systems and Git, in particular. A large number of organizations over the world have reaped the benefits of adopting version control in their projects.

Authored by: Bit


Agnostic components in Angular

Let's see what Angular has to offer in terms of customization: 1 The most basic instrument is string interpolation. If you pass a string to the menu component, it won't be suitable for options display. Static string lacks context. But it could work fine as "Nothing is found" text in case the list is empty.

Authored by: Angular In Depth

Overriding Angular Schematics

In this blog post, we will learn how we can override some default options in Angular Schematics. Last week I was working on an Angular Library, and in all the components we wanted to have encapsulation set to None and changeDetection to OnPush.

Authored by: Santosh Yadav

How to make your Angular 8 forms reactive Blog

To be able to follow through in this article's demonstration you should have: // run the command in a terminal ng version Confirm that you are using version 8, and update to 8 if you are not.

Authored by: LogRocket


Reactime: Time Travel State Debugger

Small group of engineers who wanted to make React state debugging simple. Our DevTool tracks, visualizes, and reverts state updated via prop drilling, useState hooks, context API, and most conditional state rendering using React Router!

Authored by: reactime

Debug React applications with the new React DevTools Blog

Debugging is one of the most useful skills a developer can possess. It allows you to properly navigate and spot errors in your code quickly and efficiently. In the modern web, this is made possible by leveraging various tools and techniques. React is one of the fastest-growing front-end frameworks.

Authored by: LogRocket

How to Build a Note-Taking App with GraphQL and React - Part 1 of 2

Learn and practice GraphQL by building a React note-taking app GraphQL is an open-source query and manipulation language for APIs, and a runtime for fulfilling those queries with your existing data. It enables front-end developers to write queries that return the exact data you want.

Authored by: Bit

Airbnb Home Screen UI Clone with React Native - Setting Up the UI

This tutorial series was inspired by a React Native real estate template which helps us build some amazing ready to deploy applications that anyone can use to build startups or sell the application templates. This tutorial replicates the coding implementations and designs from the Youtube video tutorial by Unsure programmer for the Airbnb clone.

Authored by: TheBestDevlist

Animations using React Hooks and GreenSock Blog

Delving into the world of animations on the web can either be a great journey or a tiresome one. My goal is to make it a great journey, while also using the power of React Hooks to further entice your learning experience. This article should not be treated as a primer on JavaScript or React.

Authored by: LogRocket

3 React concepts which can be forgotten 🤯

React has evolved over the years and some concepts were replaced by better ones Every time we wanted to use state or take advantage of lifecycle methods we had to compose a Javascript class to create a React component.

Authored by: Ignas Poška


Vue + Firebase authentication Blog

Firebase authentication provides backend services to help authenticate users to your application. They provide support for different auth providers such as passwords, phone numbers, identity providers such as Google, Twitter, Facebook, etc.

Authored by: LogRocket

Announcing Bit for Vue Public Beta

Build, share and collaborate on Vue components as a team. Special thanks to Evan You for his help and all the wonderful things happening in the Vue community 🙏 Today, we are very happy to announce the public Beta release of Bit support for Vue.js components!

Authored by: Bit


Use cases for Node workers Blog

In the past, Node.js was often not an option when building applications that require CPU intensive computation. This is due to its non-blocking, event-driven I/O architecture. With the advent of thread workers in Node.js, it is possible to use it for CPU intensive applications.

Authored by: LogRocket

Design patterns in Node.js Blog

Welcome back to another installment of design patterns in Node.js, this is part two but if you want to review part one, where I covered the IIFE, Factory Method, Singleton, Observer and the Chain of Responsibility patterns, feel free to check it out, I'll be here waiting.

Authored by: LogRocket

An amazing open source group messaging app build with flutter

An amazing open source group messaging app build with flutter. Multiple groups (similar to Teams in Slack). Multiple open or private channels within groups. Sharing of photos and photo collections. React to messages with emoji. Push-notifications for message and channel updates. Specific channels for events (e.g. containing date, venue).

Authored by: Frank He

Libraries and Tools

Popular React Hook libraries Blog

The journey of the React ecosystem has really been an interesting one. Since the advent of features like time slicing and suspense in React 16.3, we've had a series of interesting concepts from the awesome React team but none have been as eye-catching as React Hooks which got its first stable release in React 16.8.

Authored by: LogRocket

Writing an RPC library in Node.js

Understand Remote Procedure Calls better by implementing one yourself. In case you didn't know, GraphQL and REST aren't the only client-server interaction patterns in history. Yes, they are the most popular ones at the moment and with good reason!

Authored by: Bit

Intro to GraphQL with Prisma Blog

In this post, we will learn some basics about GraphQL, and also how to use the powerful tool Prisma. We'll build a query and a mutation of a GraphQL server.

Authored by: LogRocket


Why Progressive Web Apps Are The Future of Mobile Web

Further, while Android allows the web site to send the user a prompt to install the app on their home screen, no such ability currently exists on iOS. Instead, the user must manually open the system share functionality and find the "add to home screen" button.

Authored by: YML

Get Total Address Information with Geocode API

Getting address information is vitally important. Whether shipping a package, tailoring a user experience to location, or using that data to help localize language on a website, getting location information wrong can lose a sale or brake feature. Let's take a look at an API I recently found which helps me get all the detailed ...

Authored by: David Walsh