Gain insights into JavaScript ES6+, ternary operators, 'this' object, built-in functions, and core concepts like composability and immutability to ease your React learning journey.

esprima.tar.gz

test

After teaching React extensively (33.000+ students), be it online for a larger audience or on-site for companies transitioning to web development and React, I always come to the conclusion that React is all about JavaScript. Most of it boils down to JavaScript ES6 and beyond features and syntax, but also ternary operators, shorthand versions in the language, the 'this' object, JavaScript built-in functions (map, reduce, filter) or more general concepts such as composability, reusability, immutability or higher-order functions. While you don’t need necessarily to master all of these before starting with React, they will come up while practicing it and so to learn them will put you at a great advantage. 

This course is my attempt to give you comprehensive JavaScript skills that will make your React journey smooth and straight-forward.

JavaScript Fundamentals Before Learning React

## What are Modules?

It is always recommended to define only one class per file to make it strongly cohesive. These files are basically *modules*.  So, if there are two classes Person and Student defined in the same file, you can split them into two modules and name them as `Person.js` and `Student.js`. Note that you must place these files inside your `App` directory. 

>**Did you know?** The classes defined in modules are private by default and can not be accessed by other files that exist inside your project. You can make them public by using import/export statements.

Fortunately, the JavaScript community settled on one way to import and export functionalities from files with JavaScript ES6 with [import](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import) and [export](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export) statements.

However, being new to React and JavaScript ES6, these import and export statements are just another topic which requires explanation when getting started with your first React application. Pretty early you will have your first imports for CSS, SVG or other JavaScript files. The create-react-app project already starts with those import statements:

# What are Modules?

It is always recommended to define only one class per file to make it strongly cohesive. These files are basically *modules*.  So, if there are two classes Person and Student defined in the same file, you can split them into two modules and name them as `Person.js` and `Student.js`. Note that you must place these files inside your `App` directory. 

>**Did you know?** The classes defined in modules are private by default and can not be accessed by other files that exist inside your project. You can make them public by using import/export statements.

Fortunately, the JavaScript community settled on one way to import and export functionalities from files with JavaScript ES6 with [import](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import) and [export](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export) statements.

However, being new to React and JavaScript ES6, these import and export statements are just another topic which requires explanation when getting started with your first React application. Pretty early you will have your first imports for CSS, SVG or other JavaScript files. The create-react-app project already starts with those import statements:

This lesson explains how modules are created and accessed in JavaScript. 

Modularity & Import/Export in React

This lesson explains how modules are created and accessed in JavaScript.

Getting Started

Variables, Operators & Expressions

Functions

Classes

Modules

React

Appendix

Conclusion

Modularity & Import/Export in React

What are Modules?