All libraries have subtle rules that you have to follow for them to work well. Often these are implied and undocumented rules that you have to learn as you go. This is an attempt to document the rules of React renders. Ideally a type system could enforce it.
A number of methods in React are assumed to be "pure".
On classes that's the constructor, getDerivedStateFromProps, shouldComponentUpdate and render.
This is now an actual repo:
Just migrated it from Codepen.io to markdown. Credit goes to David Conner.
| Working with DOM | Working with JS | Working With Functions |
|---|---|---|
| Accessing Dom Elements | Add/Remove Array Item | Add Default Arguments to Function |
| Grab Children/Parent Node(s) | Add/Remove Object Properties | Throttle/Debounce Functions |
| Create DOM Elements | Conditionals |
| <html> | |
| <head> | |
| <title>U.S. ELECTION MAP</title> | |
| <link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700|Montserrat:400,700' rel='stylesheet' type='text/css'> | |
| <link href="https://fonts.googleapis.com/css?family=Bitter" rel="stylesheet"> | |
| <link rel="stylesheet" type="text/css" href="style.css"> | |
| <script type="text/javascript" src="https://s3.amazonaws.com/media.skillcrush.com/skillcrush/wp-content/uploads/2016/09/map.js"></script> |
| <html> | |
| <head> | |
| <title>U.S. ELECTION MAP</title> | |
| <link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700|Montserrat:400,700' rel='stylesheet' type='text/css'> | |
| <link href="https://fonts.googleapis.com/css?family=Bitter" rel="stylesheet"> | |
| <link rel="stylesheet" type="text/css" href="style.css"> | |
| <script type="text/javascript" src="https://s3.amazonaws.com/media.skillcrush.com/skillcrush/wp-content/uploads/2016/09/map.js"></script> |