Articles listed under JavaScript
Create Your Own React Modal Component
Modals are very much a staple of the web. They are a handy way to use the screen’s available real estate to display content on-top-of content. Creating your own modal component in React is straightforward enough. This makes it a suitable task for React beginners to sink their teeth into, and it’s a good way […]
Build A React Autocomplete Component
Autocomplete is a useful feature that’s also pretty fun to build in React. If your website or application has a search facility, it may be a good idea to include some sort of autocomplete functionality to assist your users and help them find what they are looking for more easily. To briefly summarize the functionality: […]
9 Useful JavaScript Utility Functions
JavaScript utility functions are efficient, reusable snippets that are generic in nature and can be utilized across many different projects. To this end, the overall purpose of the utility function in JavaScript is to help increase your productivity as well as the consistency of your code. In this article, we’ll go through some handy functionalities […]
What To Learn After JavaScript
If you’re new to the web development realm, there’s a good chance that your path may be starting to look something like this: Learn HTML & CSS Learn JavaScript But what comes next? It can of course be a little bewildering to figure this next step out, there are so many languages, frameworks & tools […]
Implement Node/Express Sessions With Postgres
In this tutorial or guide, we’ll be implementing a Node/Express API as well as utilizing a Postgres database. Alongside this, we’ll create a single-page React app to consume this new API. The user will be able to authenticate with the app and have their session persisted. After following along with this article, you’ll have the […]
What Is A Shallow Copy (Or Clone) In JavaScript?
There is often a degree of confusion when first beginning to copy (or clone) objects in JavaScript. We can attribute a significant portion of this confusion to a misunderstanding with regards to the types of clone: shallow clones and deep clones. There are fundamental behavioural differences between these two concepts, and it’s very important to […]
How To Split A String In JavaScript
You may be wondering how to split a string in JavaScript. This is a fairly simple operation, with two main approaches used to achieve this goal. In this article, we’ll look at using split as well as slice. These functions each have different use-cases and different return types, we’ll step through them in turn. So […]
React Quiz App Example – A Tutorial
This article covers the creation of a simple React quiz app that should prove useful to entry-level React developers. You can view the quiz app here in JSFiddle. The quiz app is about as basic as it can get in terms of functionality, but it provides a solid foundation on which to experiment or to […]
10 Common React Mistakes And How To Avoid Them
When first starting out with a new language, framework or tool — it’s generally considered a good idea to look at some of the more common pitfalls that other developers are experiencing. You can then try to actively avoid making these same mistakes for yourself. Here’s a list of 10 of the more common React […]
21 Common JavaScript Mistakes To Avoid
JavaScript is a fairly quirky language, and as such, there are many pitfalls to be avoided when working with it. This is especially true when first starting out. We’ve compiled a list of 21 of the most common JavaScript mistakes. In this article, mistake refers to: something done incorrectly that almost certainly can (or will) […]
Show And Hide Elements And Components In React
Showing and hiding elements and components in React is straightforward enough. However, there are some caveats and some gotchas to consider in some scenarios. Let’s dive right in! Setting up a flag or indicator in state to track visibility The mechanism to show and hide elements in React should work in conjunction with the component’s […]
Build A React Carousel Component With Infinite Scroll
The carousel is a classic piece of functionality. It’s a mechanism that the user can utilize to scroll through slides of content, image-based or otherwise. Here’s the accompanying infinitely-scrolling React carousel example (accessible directly in JSFiddle). This carousel example provided is very much a “bare-bones” implementation. I’ve tried to capture the core functionalities in the […]
A Simple React Accordion Component Example
This article will walk through some of the key points and aspects of an accordion build within React. You can find the accompanying JSFiddle component over here: React accordion component example. This is a small and relatively simple component. But that’s why it’s a good example for React beginners to look at. Alongside the accompanying […]
React Calendar Component Example (With Events)
In this article, we’ll go over the build of a React calendar component. This calendar can also display events. You can view the React calendar component example in question directly in JSFiddle. If you’re fairly new to React, don’t worry — building a React calendar component is fairly straightforward. It is, in fact, much easier […]
8 Simple JavaScript Games For Beginners
Here’s a list of 8 simple JavaScript games for beginners to create. When first starting out with JavaScript, it’s helpful to have an interesting project to focus on. Something that’s not too difficult or too time-consuming, but also not too straightforward. This selection of simple JavaScript games is ideal for beginners because the games are […]
Loop Through An Object With JavaScript
In this article, we’ll go over a few of the more common ways to loop through an object in JavaScript. Or more specifically — how to loop through object properties in JavaScript. When starting out, most developers will at one point or another iterate over an array. With objects in particular, it can be a […]
React With TypeScript: Typing Components
This article is focussed on using React with TypeScript. More specifically, we’ll be looking at typing React components in general: their state, their props, their return types and so on. So if you’re new to using React with TypeScript, or if you just need a refresher — this short guide should (hopefully) be of some […]
23 Entry Level React Interview Questions
Here’s a selection of 23 entry level React interview questions. When preparing for any interview, it’s clearly important to have a good grasp on the fundamentals of the topic at hand. This selection of questions touches upon many of the fundamental aspects of React, from JSX to the virtual DOM to hooks. Difficulty wise, I’d […]
27 Entry Level JavaScript Interview Questions
Here’s a selection of 27 different JavaScript interview questions for beginners. The answers have also been provided in each case. The intention of this article is to cover some of the typical questions you could expect to receive when preparing for an entry level JavaScript developer interview. As such, the questions and answers provided here […]
JavaScript ||, Or The “Or” Operator – A Guide
In this guide, we’ll go over what the JavaScript || operator actually is, and what exactly it does. As is common when working in JavaScript in general, there are some quirks and pitfalls to be aware of when using this operator. We’ll cover each of those cases during this explanation.re Let’s get right into it! […]
5 Ways To Get The Last Element Of An Array In JavaScript
We’ve all been there. “How do I get the last element of an array in JavaScript?” It’s a fairly simple JavaScript problem, with a fairly simple solution. Nowadays, with the advent of ES6 and the like, there are numerous other solutions to this problem outside of the “classic” approach. I thought it’d be a good […]
JavaScript Error Handling – A Brief Overview
In this article, we’ll go over how to handle errors in JavaScript. JavaScript error handling in general is fairly straightforward, it’s somewhat consistent with other languages in that regard. There are some quirks to be aware of, however. Let’s get into it! What is a JavaScript error? It’s easiest to think of JavaScript errors simply […]
JavaScript Dates – Working With The Date Object
Working with JavaScript dates is something that most web developers will do at one time or another. That’s because working with dates and times is very much a standard operation in web development in general. Both on the frontend and on the backend. We’ll often need to access, display or manipulate dates and times as […]
How Do I Get Better At JavaScript? (18 Tips)
If you find yourself asking the question – “how do I get better at JavaScript?“, we’ve compiled some useful tips, advice and best practices for your consideration. This article is aimed at beginners. The focus is not only on actual JavaScript technical fundamentals, but there are also some practical pieces of advice included too. The […]
Building A WordPress Theme With React
WordPress is a fantastic platform. It’s user-friendly and extremely powerful — it’s also particularly accessible to those just starting out with web development. For those of us just starting out with with WordPress theme development in particular, however, it’s worth noting that there are numerous ways to go about developing your very own theme. You […]
8 React Project Ideas For Your Portfolio
Looking for some React project ideas to present within your portfolio? You’ve come to the right place! Effectively demonstrating your abilities is a crucial part of obtaining employment within the web development world. For React developers, having a fully functioning single page app that interacts with an external API could be an excellent place to […]
JavaScript Closures and Lexical Scoping – Basic Examples
If you have no idea what closures are or what you can do with them, fear not, we’ll demystify them in this article! We’ll also tackle lexical scoping in JavaScript — a closely related concept. Some familiarity with JavaScript in general is assumed, here. We won’t be going into tremendous depth on this topic, the […]
Using Apollo Client with React to make GraphQL queries
This article will walk through the initial setup of a React SPA (single page application). The app will communicate with a GraphQL endpoint using the Apollo Client. We’ll use React Router within our project to help demonstrate some important fundamentals. The article will cover some of the basic concepts of GraphQL (what it is, why […]
JavaScript Exercises for Beginners, Part 3: Timing Functions
Welcome to Part 3 of the JavaScript exercises for beginners series. In Part 1, we looked at exercises that revolved around the use of strings. In Part 2, it was arrays. This time — we’re going to look at JavaScript’s timing functions: setInterval and setTimeout. As with the previous instalments, there are no prior requirements […]
JavaScript Exercises for Beginners, Part 2: Arrays
In Part 1 of the JavaScript exercises for beginners series – we looked at problems revolving around strings. This time, we’ll shift our focus to arrays. Before beginning these JavaScript array exercises… Much like with the first instalment, there are a series of problems to solve. Throughout these exercises, you’ll need to utilize a lot […]
JavaScript Exercises for Beginners, Part 1: Strings
These JavaScript exercises are aimed specifically at beginners. So if you’re just starting out on your JavaScript journey, why not give them a go? Alongside this article, feel free to check out the other instalments in the series. Just like this article, the other instalments are specifically written to help you practice JavaScript via short, […]
Caching API Data In Your React Native Android App Using AsyncStorage
If you’re planning an app that will consume data from an external API, chances are you’ll want to cache some of that data on the user’s device – at least temporarily. One of the main reasons to do this is to cut down on extra network requests to your API and to provide a degree […]
5 JavaScript Project Ideas For Beginners
“What shall I build?” is a question commonly asked within the web development community, particularly among beginners or those just starting out on their journey. Having an interesting project to focus on that is not too time-consuming and not too daunting can be an ideal way to sustain your motivation and to hone your skills. […]