React Conditional Rendering Techniques & Best Practices

Posted by & React Components React Fundamentals

2 minutes read Rendering React components is very important since it can make your app behave faster or slower, depending on your approach for rendering components, re-rendering components based on condition or state/props change. Here are a few methods you can use to render React components: If Else conditional operator import React from ‘react’; import ReactDOM from ‘react-dom’;… Read more »

React Components Explained

Posted by & React Components React Fundamentals

1 minute read Components are JavaScript functions or classes that let you split the UI in reusable pieces. Components accept arbitrary input named props and return React elements which describe what should appear on the screen. React component types Function components The simplest way to define a component is by writing a function that accepts a single props… Read more »

How to use npx: the npm package runner?

Posted by & NodeJS Fundamentals

2 minutes read NPX is a NPM package runner, which means it makes it easy to use command line (CLI) and other executable tools from the npm registry. What’s the difference between npm and npx? npm installs the packages from the registry. npx helps with executing the node package. How to install npx? npx is included in npm… Read more »

How to use JSX in React Components?

Posted by & JSX React Advanced

3 minutes read For a basic JSX introduction you can check our previous article, Introduction to JSX. JSX is actually syntactic sugar for defining components using the React.createElement(component, props, …children) function and positioning them inside the markup. This is how you write a simple component in JSX and how Babel compiles it: JSX code: <div className=”container”> Hello World!… Read more »

What is JSX?

Posted by & JSX React Advanced

2 minutes read JSX is JavaScript with XML, still just JavaScript but with some extra functionality. The code written with JSX is looks very similar to HTML or XML, but the power comes from easily mixing JavaScript methods and properties with your HTML look-alike code. Note React can work fine without JSX, however writing React components with JSX,… Read more »