React: Difference between revisions

From Wildsong
Jump to navigationJump to search
Brian Wilson (talk | contribs)
Brian Wilson (talk | contribs)
Line 8: Line 8:
To test React + Parcel I created https://github.com/brian32768/react-test
To test React + Parcel I created https://github.com/brian32768/react-test


===Now, with ROUTING!!===
This is the site from the react-routing creators: https://reacttraining.com/react-router/web/guides/quick-start


Learn React Router version 4 is https://css-tricks.com/react-router-4/
Learn React Router version 4 here too https://css-tricks.com/react-router-4/


== react-bootstrap-test = React + Bootstrap ==
== react-bootstrap-test = React + Bootstrap ==

Revision as of 19:40, 5 February 2019

React is a framework that helps me build views. It came from the people at Facebook but it's not there anymore. Its homepage is https://reactjs.org/

Maybe this is a good introduction: https://www.fullstackreact.com/30-days-of-react/day-1/

react-test = React with routing

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

This is the site from the react-routing creators: https://reacttraining.com/react-router/web/guides/quick-start

Learn React Router version 4 here too https://css-tricks.com/react-router-4/

react-bootstrap-test = React + Bootstrap

Here is the sandbox: http://github.com/brian32768/react-bootstrap-test

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

Be warned they are talking about Bootstrap 3 in that book, which is what (the official) react-bootstrap supports.

I wanted to use Bootstrap 4 so I am working with (the unofficial) "reactstap", eventually the support will be updated in react-bootsrap and I will revise this. 11-20-18

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-- the whole point of React.

You still have to load the Bootstrap package (that is, "npm install bootstrap") to get bootstrap.css

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

React + Bootstrap 4 = Reactstrap

Install "npm reactstrap"

Learn reactstrap https://www.techiediaries.com/react-bootstrap/

See the official docs https://reactstrap.github.io/

Additional React Bootstrap components

https://github.com/react-component calendar, slider, select, tooltip

More books and links and things

Go back to the JavaScript page