diff --git a/content/community/conferences.md b/content/community/conferences.md index 89ed871d0..e138b119a 100644 --- a/content/community/conferences.md +++ b/content/community/conferences.md @@ -76,6 +76,11 @@ September 26-28, 2019 in Goa, India [Website](https://www.reactindia.io/) - [Twitter](https://twitter.com/react_india) - [Facebook](https://www.facebook.com/ReactJSIndia) +### React Alicante 2019 {#react-alicante-2019} +September 26-28, 2019 in Alicante, Spain + +[Website](http://reactalicante.es/) - [Twitter](https://twitter.com/reactalicante) - [Facebook](https://www.facebook.com/ReactAlicante) + ## Past Conferences {#past-conferences} ### React.js Conf 2015 {#reactjs-conf-2015} diff --git a/content/docs/hooks-faq.md b/content/docs/hooks-faq.md index 6145b968d..9016fa7f4 100644 --- a/content/docs/hooks-faq.md +++ b/content/docs/hooks-faq.md @@ -210,7 +210,7 @@ There are a few more heuristics, and they might change over time as we fine-tune ### How can I do data fetching with Hooks? -Check out [this article](https://www.robinwieruch.de/react-hooks-fetch-data/) to learn more about data fetching with Hooks. +Here is a [small demo](https://codesandbox.io/s/jvvkoo8pq3) to get you started. To learn more, check out [this article](https://www.robinwieruch.de/react-hooks-fetch-data/) about data fetching with Hooks. ### Is there something like instance variables? {#is-there-something-like-instance-variables} @@ -467,7 +467,7 @@ Yes. See [conditionally firing an effect](/docs/hooks-reference.html#conditional Generally speaking, no. ```js{3,8} -function Example() { +function Example({ someProp }) { function doSomething() { console.log(someProp); } @@ -481,7 +481,7 @@ function Example() { It's difficult to remember which props or state are used by functions outside of the effect. This is why **usually you'll want to declare functions needed by an effect *inside* of it.** Then it's easy to see what values from the component scope that effect depends on: ```js{4,8} -function Example() { +function Example({ someProp }) { useEffect(() => { function doSomething() { console.log(someProp); @@ -571,7 +571,7 @@ We moved the function inside the effect so it doesn't need to be in its dependen >Tip > ->Check out [this article](https://www.robinwieruch.de/react-hooks-fetch-data/) to learn more about data fetching with Hooks. +>Check out [this small demo](https://codesandbox.io/s/jvvkoo8pq3) and [this article](https://www.robinwieruch.de/react-hooks-fetch-data/) to learn more about data fetching with Hooks. **If for some reason you _can't_ move a function inside an effect, there are a few more options:** diff --git a/content/docs/hooks-reference.md b/content/docs/hooks-reference.md index 4466bc83b..4daf0f191 100644 --- a/content/docs/hooks-reference.md +++ b/content/docs/hooks-reference.md @@ -320,7 +320,7 @@ Pass a "create" function and an array of dependencies. `useMemo` will only recom Remember that the function passed to `useMemo` runs during rendering. Don't do anything there that you wouldn't normally do while rendering. For example, side effects belong in `useEffect`, not `useMemo`. -If no array is provided, a new value will be computed whenever a new function instance is passed as the first argument. (With an inline function, on every render.) +If no array is provided, a new value will be computed on every render. **You may rely on `useMemo` as a performance optimization, not as a semantic guarantee.** In the future, React may choose to "forget" some previously memoized values and recalculate them on next render, e.g. to free memory for offscreen components. Write your code so that it still works without `useMemo` — and then add it to optimize performance. diff --git a/content/docs/hooks-rules.md b/content/docs/hooks-rules.md index 8c332578c..dbac9cffd 100644 --- a/content/docs/hooks-rules.md +++ b/content/docs/hooks-rules.md @@ -41,7 +41,7 @@ npm install eslint-plugin-react-hooks "rules": { // ... "react-hooks/rules-of-hooks": "error", // Checks rules of Hooks - "react-hooks/exhaustive-deps": "warning" // Checks effect dependencies + "react-hooks/exhaustive-deps": "warn" // Checks effect dependencies } } ``` diff --git a/src/theme.js b/src/theme.js index 9f440d56d..a4d445206 100644 --- a/src/theme.js +++ b/src/theme.js @@ -89,6 +89,11 @@ const fonts = { lineHeight: '65px', fontWeight: 700, + [media.lessThan('small')]: { + overflowWrap: 'break-word', + wordBreak: 'break-word', + }, + [media.lessThan('medium')]: { fontSize: 40, lineHeight: '45px',