![[ERR!]](https://pbs.twimg.com/profile_images/828593972029317120/4UXq5Hmj_normal.jpg)
If you're struggling with inspiration to get you kickstarted into 2021, then perhaps Madza's "20 Famous Quotes for your DEV Inspiration" will be just what you need to start those engines but if you're already in your planning phase, then check out Reed Barger's "The React Roadmap: 10 Steps to Become a React Developer in 2021" instead. For those who already climbed in head first, Fernando Doglio takes "A Deep Dive Into JavaScript Modules" on Bits and Pieces.
General
Auto-Deploy React & Vue Apps with Heroku
This article assumes you have basic knowledge of React or Vue.js. All the procedures here works for both React and Vue.js applications. Deploying Frontend JavaScript applications with Heroku is a breeze, to say the least. This is mostly because Heroku takes away all of the hassles involved in the setup and just lets you deploy.
Authored by: this.OnuohaSef 🚀
Top 5 Powerful Features of AWS Amplify Web Hosting
A Continuous Deployment Pipeline is essential for modern application development. It helps you automate the delivery of your application as soon as the developers commit code. That will, in turn, help your team focus on building features that matter to the business, and not worrying about time-consuming deployment.
Authored by: Bit
Goodbye submit buttons
tl;dr: The goal here was to save input values on the fly, in order for the web page to be used as a real-time collaboration tool. And I'll explain the problems I ran into. I was asked to code a...
Authored by: Cedric Nicoloso
How to Manipulate the DOM - the Ultimate Beginner's Guide
Okay, so I assume you have heard of the almighty DOM - that's why you are here, right? If you are finding it difficult, I can assure you that after reading this article, you will feel comfortable enough with the whole DOM manipulation thing.
Authored by: Master👑💻
20 Famous Quotes for DEV Inspiration ✨🧙♂️
Before investing in material things, invest in knowledge. It will be persistent and let you achieve your career goals. Make use of online sandboxes or create small pet-projects on every skill you learn. Practical skills are what matters the most. Pick your tech-stack and become an expert in it.
Authored by: Madza
JavaScript
A Deep Dive Into JavaScript Modules
All JavaScript developers know how to import a module, if you haven't done it before, then you've not gone past the basic "hello world" example. Modules are the cornerstone of the JavaScript ecosystem. But did you know there are different module systems in JavaScript though?
Authored by: Bit
State of JS 2020
As crappy as 2020 was, JavaScript as a whole still managed to somehow move forward. As the language itself keeps improving thanks to new features like Optional Chaining and Nullish Coalescing, TypeScript's widespread adoption is taking things to a whole other level by popularizing static typing.
Authored by: StateOfJS
The JavaScript Skills You Need For React (+ Practical Examples)
One of the most important things to understand about React is that it is fundamentally JavaScript. This means that the better you are at JavaScript, the more successful you will be with React. Let's break down the 7 essential concepts that you should know about JavaScript to master React.
Authored by: freeCodeCamp.org
First Unique Character in a String JavaScript
This is not just common, but a very tricky exercise to solve. At first, it seems simple and with the right approach, we can make it a win. In my last article with the title How to Reverse an Integer...
Authored by: JavaScript In Plain English
Storing Unique Values with Set Object in JavaScript
While working on a side project recently, I found myself in a situation which, surprisingly, I hadn't been in before. In my quest to collect user feedback, I found that I needed a way to collect and...
Authored by: JavaScript In Plain English
I Recreated the 'Flying Windows' Screensaver with JavaScript
I am going to show you how to create a 3D effect on canvas using a library called p5.js. I watched some videos demonstrating the usage of this library and I found also this coding challenge (creating starfield) in Processing. I decided to rewrite it in JavaScript and then improve it slightly.
Authored by: Miroslav Slapka
React
The React Roadmap: 10 Steps to Become a React Developer in 2021
Learning how to become a confident React developer takes hard work. But not knowing the right way to become one can make it much harder. Learning React doesn't have to be a chore. Let's break down the 10 steps that will make the time and effort you put into becoming a React developer easier and more fun.
Authored by: freeCodeCamp.org
Are React class components going away?
React Hooks were introduced to React to make state and side-effects available in React Function Components. Before it was only possible to have these in React Class Components; but since React's way...
Authored by: Robin Wieruch
3 Approaches to Integrate React with Custom Elements
In my role as a web developer who sits at the intersection of design and code, I am drawn to Web Components because of their portability. It makes sense: custom elements are fully-functional HTML elements that work in all modern browsers, and the shadow DOM encapsulates the right styles with a decent surface area for customization.
Authored by: CSS-Tricks
Profiling Performance of React Apps using React Profiler
Usually, React works in two phases: the render phase and the commit phase. While the render phase determines what changes need to be done to the DOM, the commit phase is where the actual difference is applied to the DOM. The React profiler collects information in the commit phase and groups the performance info by a commit.
Authored by: Bit
Using Grommet In React Applications
In this tutorial, we're going to learn how to use Grommet as a UI library for React applications. We'll use Grommet as a UI library of choice to create a pricing component, this would help us have a better understanding of how to use Grommet.
Authored by: Smashing Magazine
Build a News App with the NYTimes API & React JS
There are several news APIs to choose from when building a news app with React and I decided to check out the New York Times API because NYT is one of my favorites news sources and also because the documentation was quite detailed.
Authored by: Isabel Hong
Create Redux-like Middleware for useReducer in React
If you have used Redux before, you would be aware of the concept of middlewares. Now that useReducer has become a commonly used react hook, we might want to replicate the idea of middleware for the useReducer hook as well.
Authored by: saransh kataria
Vue
Scaling Performance in Vue.js Applications
Performance optimizing of vue applications plays an important role in the application architecture. A higher performance application will ensure an increase in user retention, improved user experience and higher conversion rates. According to research by Google, 53% of the mobile users leave a site if it takes more than 3 seconds to load?
Authored by: John Philip
Node.js
15 Commonly Asked NodeJS Interview Questions
Preparation is as important as your knowledge for a successful programming interview. It'll give you the confidence to attend the interview without the nerves of uncertainty. This is especially true if you are facing a programming interview for the first time in your life.
Authored by: livecodestream
Creating a Financial App with the Plaid API, Node.js/Express, and React
My final project for Flatiron was a budgeting tool, where users can create budgets by category and month and analyze them against their expenses. I'd have preferred to have done this with live transactions using the Plaid API, but unfortunately there wasn't a ton of documentation for Ruby on Rails, which is the backend I was using.
Authored by: JavaScript In Plain English
Functional Programming
Random Numbers in JavaScript: From Math.random() to the Quantum Fluctuations of a Vacuum
All you perfectionists out there might start wondering now; how on earth do you get a perfect random number. Well, the truth is that you can never get a real random number with an algorithmic approach. When math and formulae are used to create a random number, however random it might seem, the pattern will eventually repeat itself after the end of the period.
Authored by: Bit
What Are Callback Functions In JavaScript?
A callback is a function that is passed into another function as an argument which can be invoked later inside the function. Synchronous means the code statements execute immediately after one another in a sequential manner. function print(number, result) {function checkEvenOrOdd(number, callback) {checkEvenOrOdd(56, print); console.log(`${number} is ${result}`); const result = (number % 2 === 0) ?
Authored by: JavaScript In Plain English
JavaScript Debounce Example - How to Delay a Function in JS (ES6)
In JavaScript, a debounce function makes sure that your code is only triggered once per user input. Search box suggestions, text-field auto-saves, and eliminating double-button clicks are all use cases for debounce. In this tutorial, we'll learn how to create a debounce function in JavaScript. What is debounce?The term
Authored by: Ondrabus
How to Solve the Infinite Loop of React.useEffect()
useEffect() React hook manages the side-effects like fetching over the network, manipulating DOM directly, starting and ending timers. While the useEffect() is, alongside with useState() (the one that manages state), is one of the most used hooks, it requires some time to familiarize and use correctly.
Authored by: Dmitri Pavlutin
