React Basics

Here is a place were I will put some of the basic building block for React.js

The most basic React.js App

Basic App + Stateless Component

Class Components:

Basic CSS Stailing:

The following code will render:

Code:

REACT STYLING

In the previous Styling exmple use use a external file and is ok under the “Separation of Concers” but in React if you want to create a real independent COMPONENTS, all the code should be inside the component that included the CSS. Using this technique we should get the following results:

And here is the code:

That is how you do it.

Complex Components Practice

In this exercise I create the following design:

To create this I use the Create-React-App Bare-Bones. Then create the following File Tree:

And here is the code:

For More details see the GigHub Repo: LINK



Copyright 2017. All rights reserved.

Posted August 23, 2017 by Edmundo in category "React