reading-notes

Class 1: React

Reading

• Component Based Architecture
• What is Props and How to Use it in React

References

• React Tutorial through ‘Passing Data Through Props’
• React Docs - Hello world
• React Docs - Introducing JSX
• React Docs - Rendering elements
• React Docs - Components and props

Notes

• For each class based component you must:
  • import React from ‘react’;
  • class <fileName> extends React.Component {}
  • export default <fileName>;
  • NOTE: <fileName> does NOT include the .js ending
• React likes to keep all components inside of one component
  • Can wrap all components inside a <div> to eliminate errors in VS Code
    • NOTE: This can create a series of unwanted <div>’s
  • To avoid having extra or unwanted <div>’s, you can “fool” React by wrapping all components in empty tags <>:
    • <> </>
• React component names should start with an Uppercase, while html elements stay lowercase
• CSS files can be imported like this:
  • import <fileName>;
  • That’s it