ReactCommand Line Applications Using React - Snake Game TutorialJuly 24, 2019ReactAbsolutely CRAZY combo! In this tutorial we'll learn how to build a CLI Snake game using React and Javascript. One of the most powerful features of React is that it supports different renderers. That means you aren't limRender HUGE Lists In React - React Window TutorialJuly 17, 2019ReactWatch the video on YouTube This is a tutorial on react window, at the end of the article there is a link to a Github repo with code examples. Rendering lists in React is simple, I would say trivial. You just map through Basic Webpack React SetupJune 22, 2019ReactOpen the Glitch example Usually create react app is enough to create new React applications, and if you need to have some specific settings you can always eject and alter its webpack configuration. But sometimes you justReact PropTypesApril 2, 2019ReactJavascrpt is dynamic language, it doesn't have static typechecking. You can't syntactically specify that you function works only with strings, or only with numbers. Same applies to React components. You can pass a prop tReact Context APIMarch 29, 2019ReactIn React application data and event handlers are passed down to children components through props. But sometimes you need to make some data available on several levels at once. Passing data through props manually can be Handling Errors In ReactMarch 10, 2019ReactOne of the problems you might face when working on your React application is that some error happens in one of your components it breaks the whole app. To solve this problem React has error boundaries . What Is An Error Controlled And Uncontrolled Forms In ReactMarch 10, 2019ReactThere are two ways of working with forms in React. Controlled and uncontrolled . Let's see when should you use each of them. Uncontrolled Forms The easiest way to handle forms in react is to use uncontrolled inputs. In uReact Synthetic EventsMarch 10, 2019ReactThe events that you get when your event handlers get triggered are actually SyntheticEvents an abstraction around browser events provided by React. It has the same interface as the browser’s native event, including stopPReact Pure ComponentsMarch 10, 2019ReactBy default, a plain React.Component has shouldComponentUpdate set to return true. You can write your own implementation of this method to avoid unnecessady re renders. What Is PureComponent? React provides React.PureCompReact Functional ComponentsMarch 10, 2019ReactThe simplest way to define a component in React is to use function. You just declare a function that receives props and returns some JSX layout. Here is an example: You can use object destructuring to get specific props:React Lifecycle MethodsMarch 10, 2019ReactReactJS provides a bunch of methods that are executed during different stages of components life. Those are called lifecycle methods . Lifecycle methods are only available for class based components. For functional compoReact Concept - Virtual DOMMarch 8, 2019ReactUnlike many other frameworks React doesn't update DOM directly on every change and uses VirtualDOM to to optimize re renders. What Is DOM DOM (Document Object Model) is a programming api for your HTML (or XML) documents.How To Localize React Application Using `react-intl`February 28, 2019ReactIn this tutorial we'll localize React application from start to finish using react intl made by Yahoo. We'll use create react app to generate a new application and then we'll go through the whole set of steps needed to lReact Dev ToolsFebruary 27, 2019ReactTo develop React applications effectively you'll need to use React DevTools browser extension. It's available for both Chrome and Firefox. It has two main features: view of a component tree and the current state and propHandling Events In ReactJSFebruary 25, 2019ReactHandling events in ReactJS is very similar to how it's done on DOM elements. There are a few differences though. Event names are camelCased, so instead of onclick you have to use onClick: Also as you can see event handleReact PropsFebruary 24, 2019ReactIn ReactJS props is how components get data from their parent. When you add a tag to your JSX code and pass it some attributes the components referenced by this tag will receive them as a props object. In this example naReact ComponentsFebruary 21, 2019ReactIntroduction to ReactJS Components. What Is Component A component is an isolated piece of interface. It contains some piece of layout describing what should appear on the screen. It can also have some bound state and conLists And Keys In ReactFebruary 20, 2019ReactHow to display lists of elements in React? You can use map method to loop through an array of items and then use curly braces to insert it into your JSX code: Here we mapped through the array of strings array using the aConditional Rendering In JSXFebruary 18, 2019ReactThere are many ways to have conditional expressions in your JSX code. Let's look at them. If Statement The easiest way to have condition in your render code is to use if statement in render() method of your component. YoStarting With JSXFebruary 17, 2019ReactWatch the video on YouTube Today we continue to learn ReactJS. In this React tutorial for beginners you'll get familiar with JSX syntax used in React applications to describe the layout of your components. At this momentHow To Install ReactJSFebruary 16, 2019ReactWatch the video on YouTube How to install React? ReactJS is a Javascript library so by asking how to install it you most likely mean "How to setup a React project?". Use A Sandbox If you just want to tackle with React anIntroduction To ReactJSFebruary 15, 2019ReactWatch the video on YouTube An introduction to ReactJS for beginners. What Is ReactJS? ReactJS is a Javascript Library for building User Interfaces. It was initially created by Jordan Walke in Facebook. First time it was React App Video Course, Parts 6-10August 10, 2018ReactI'm super proud of myself, managed to deliver an episode daily so far. And the best part is that it's getting easier with each one. 6 Watch the video on YouTube 7 Watch the video on YouTube 8 Watch the video on YouTube 9React App Video Course, Parts 1-5August 5, 2018ReactInitially I was going to just use this app as an example in my basicreact.com course. But then I decided to make a separate series on YouTube to practice making videos. My biggest mistake when doing tutorial videos was sHow To Comment React JSX CodeMay 13, 2018ReactSometimes you need to comment out some JSX code or just add some informative comment to your layout. How to do it? First problem is that JSX is not HTML and HTML comments wont work: Even though JSX will be compiled to JaWhat Is React?May 6, 2018ReactThis article is part of react course I'm currently working on. It will be free beginners course published on Udemy. This is an introduction, where I tell what is React, what are React key features and give a quick app exReact 16 Course - Managing StateMarch 22, 2018Reactstate in react is a plain Javascript object used to manage data specific to some component. Keep in mind that only data that is going to be needed for rendering should belong to the state. Contents What Is State DifferenReact 16 Course - Component Lifecycle MethodsMarch 11, 2018ReactLike everything in existence – react components follow their natural cycle of creation, existence and destruction. This article is part of WIP React 2018 course for beginners. React Lifecycle Methods Let's see what happeFirebase React Authentication TutorialMarch 4, 2018ReactWatch the video on YouTube Sometimes you just need to make a fast prototype and you don't want to mess with back end, authentication, authorization and all of that. Here is where Google's firebase can help you. In this tPopup With ReactJS For Jekyll BlogNovember 23, 2017ReactOnce upon a time (yesterday) I decided that my blog lacks a good old pop up. You know, the one that unannoyingly asks to join the mailing list. So if you have Jekyll blog and you want to know how to create a pop up using