Deep Dive

A quick glance on JS and technical React interviews.

A very short reminder on how the operators and expressions work and how to use them.

Learn how the control flow works in JavaScript and its application in React projects. It's a crucial piece of the puzzle that shouldn't be missed!

Strings are a very fundametal concept that every web developer should be aware of. They have many applications and use cases, you're probably not aware of all of them.

Probably not as important as strings, but also very fundamental concept that every dev should have mastered.

Booleans are a data type in JavaScript that represent binary values, either true or false. In this article, common operations performed on booleans are explored, including creating booleans, negating booleans, comparing booleans, converting booleans to strings, and the use of the ternary operator in the React framework.

Objects are a fundamental data type in JavaScript, and they are widely used in many different contexts. Make sure not to skip this one as you will regret it...

Arrays are a powerful data structure in JavaScript that allow you to store and manipulate collections of data. Quite similar to the object's article, please don't skip it!

Understanding how to work with functions is an important skill for any JavaScript developer, and it is likely to be a topic that comes up in a job interview. They allow you to define and invoke blocks of code, pass arguments, return values, and manage scope.

null and undefined are two special values in JavaScript that represent the absence of a value. While they have some similarities, there are also important differences between them.

React Router is a popular library for creating multi-page applications in React. It allows you to define the routes and components of your application, and to navigate between them using declarative links.

JSX is a syntax extension for JavaScript used in React for defining and rendering UI components.

API (Application Programming Interface) is a set of protocols, routines, and tools for building software applications. It specifies how software components should interact with each other, making it easier to develop applications by providing building blocks that developers can use to build their programs.

Reusable components are an important part of building scalable and maintainable applications in React.

The useMemo hook is a useful tool in React for optimising the performance of a functional component by caching the result of expensive computations.

HOCs are also useful for adding additional functionality to a component, such as adding props or adding lifecycle methods. They are useful for abstracting common functionality into a separate component, which can then be shared across multiple components in your application.

The useCallback hook is a useful tool for optimizing the performance of functional components in React. It allows you to create callback functions that are only re-created and re-attached to DOM elements when certain dependencies change, rather than being re-created and re-attached every time the component re-renders

The virtual DOM, used in React, is a lightweight in-memory representation of the actual DOM that optimises the rendering of a React application by reducing the number of DOM manipulation operations required to reflect changes in a component's state or props.

Overall, the useState hook is a powerful tool that can help you manage state in your functional components more concisely and easily. By understanding how to use the useState hook and avoiding common pitfalls, you can create more maintainable and performant React applications.

State is an important concept in React that allows components to store and manage data that affects their behaviour and rendering. In this article, we will explore the different ways to use state in a React application and how to manage it effectively.

Props (short for properties) are a way to pass data from a parent component to a child component in React. They are used to customise and configure the behaviour of a child component, allowing you to reuse the same component in different contexts with different data.

Lifting state up in React refers to the process of moving shared state from a child component to a common ancestor component. This can be done through various methods.

Here, we will discuss the components of React and how they work together to make web applications.

Styled components is a popular npm package for styling React components using a CSS-in-JS approach, allowing for writing CSS code within JavaScript file and making code more modular and easier to maintain. Very useful in React interviews.

IndexedDB is a feature of web browsers that allows you to store and retrieve data locally within the user's browser.

Hooks are a powerful feature in React that allow developers to use state and other features in functional components. They make it possible to write all of the components in a React application as functional components, making the code more concise and easier to understand.

Let's be honest, it doesn't matter what we say you still won't read this :)

PropTypes enhance the development experience by providing a way to ensure that components are being used correctly.

Control flow but in React apps.

Local storage is a useful feature for storing data locally in a web browser. It can be used to persist data across page refreshes and browser sessions, and is particularly useful for storing small amounts of data that does not need to be synced with a server

Basically a Local Storage with a slight twist to it.

Reconciliation is an important concept in React that allows the library to efficiently update the DOM when a component's state or props change. By understanding how reconciliation works, you can create more efficient and performant React applications (and pass interviews...).

Not much else to add here.

Understanding the lifecycle of a component is an important part of being a proficient React developer, and knowing when to use the various lifecycle methods can help you build more efficient and effective applications.

Fragments can be useful for reducing the number of wrapper elements in code, making it easier to read and debug. Sooner or later you will fall in love with them.

A quick glance at how component libraries can help us.

A portal in React is a way to render a component outside of its parent component's hierarchy while still keeping it within the React component tree.

There isn't much you're going to learn from this. Just a quick recap.

A quick dive into different approaches to structuring your projects.