React

React is a framework that helps me build views. It came from the people at Facebook.

https://reactjs.org/

IDE

This week I am using Atom and found this to be helpful. https://fullstackengine.net/recommended-atom-packages-react-js/

So far I have installed

• atom-ternjs (javascript code intelligence)
• atom-wrap-in-tag (Alt-Shift-W)
• autocomplete-modules (autocomplete require and import)
• color-picker (alt-ctl-C) THIS IS COOL!
• language-babel (autocomplete jsx and more)
• sync-settings (uses github gist, ctl-shift-p Sync Settings:Backup or :Restore)

sync-settings

After putting in the token under settings,

Might want to look at Emmet

react-test = React with routing

To test React + Parcel I created https://github.com/brian32768/react-test

It used to be super simple but I wanted to test React routing so now it's a little more complex. One of the best pages to learn version 4 is https://css-tricks.com/react-router-4/

react-bootstrap = React + Bootstrap

See "React and React Native", Chapter 11: Mobile-First React Components.

You can't simply load the separate Node packages for React and Bootstrap because bootstrap normally uses jquery and jquery directly modifies the DOM. That breaks the React model, which uses a "virtual DOM" to speed up rendering-- sort of the whole point of React.

But really I hope I never have to see jquery again. I never learned it so it just annoys me having code I don't understand in projects.

So, install "npm react-bootstrap"

Here is my sandbox where I test and learn: http://github.com/brian32768/react-bootstrap-test

Initial impressions

The code with React components is so clean compared to conventional Bootstrap.

More books and links and things

"Building Enterprise JavaScript Applications", see chapter 14