Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update Mobile Developer/React.md #58

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
50 changes: 26 additions & 24 deletions Technical Stack/Mobile Developer/React.md
Original file line number Diff line number Diff line change
@@ -1,50 +1,52 @@
React
=====

* [ ] You know how to write a function component. [:books:](https://www.robinwieruch.de/react-function-component#react-function-component-example)
* [ ] You know how to write a function component. [:books:](https://reactjs.org/docs/components-and-props.html#function-and-class-components)
* [ ] You know the difference between function and class components. [:books:](https://medium.com/@Zwenza/functional-vs-class-components-in-react-231e3fbd7108#:~:text=The%20most%20obvious%20one%20difference,which%20returns%20a%20React%20element.)
* [ ] You know how to define and modify local component's state. [:books:](https://reactjs.org/docs/faq-state.html)
* [ ] You know what Virtual DOM is and how React uses it to render components. [:books:](https://www.youtube.com/watch?v=RquK3TImY9U)
* [ ] You know how to use element events and how to incorporate them in React lifecycle [:books:](https://stackoverflow.com/questions/29303456/reactjs-onclick-change-element/29304703#29304703)
* [ ] You know component's lifecycle and know how to use each of the phases. [:books:](https://www.youtube.com/watch?v=m_mtV4YaI8c)
* [ ] You know and can use Context API [:books:](https://reactjs.org/docs/context.html#reactcreatecontext)
* [ ] You can use refs to bind to a native DOM element and interact with it in component lifecycle [:books:](https://css-tricks.com/working-with-refs-in-react/)
* [ ] You understand concepts of higher order components and render functions, as well as their differences, pros and cons. [:books:](https://reactjs.org/docs/higher-order-components.html)
* [ ] You know how to prevent components from re-rendering. [:books:](https://hackernoon.com/redux-saga-tutorial-for-beginners-and-dog-lovers-aa69a17db645)
* [ ] You know how to reconcile global state with local component's state
* [ ] You know how and when to use portals. [:books:](https://blog.logrocket.com/learn-react-portals-by-example/)
* [ ] You know how to define and modify local component's state. [:books:](https://react.dev/learn/state-a-components-memory)
* [ ] You know what Virtual DOM is and how React uses it to render components. [:books:](https://www.geeksforgeeks.org/reactjs-virtual-dom/)
* [ ] You know how to use element events and how to incorporate them in React lifecycle [:books:](https://react.dev/learn/responding-to-events)
* [ ] You know component's lifecycle and know how to use each of the phases. [:books:](https://react.dev/learn/lifecycle-of-reactive-effects)
* [ ] You know and can use Context API [:books:](https://react.dev/reference/react/hooks#context-hooks)
* [ ] You can use refs to bind to a native DOM element and interact with it in component lifecycle [:books:](https://react.dev/reference/react/useRef#manipulating-the-dom-with-a-ref)
* [ ] You know how to prevent components from re-rendering. [:books:](https://blog.bitsrc.io/5-ways-to-avoid-react-component-re-renderings-90241e775b8c)
* [ ] You know how to reconcile global state with local component's state [:books:](https://redux.js.org/introduction/getting-started)
* [ ] You know how and when to use portals. [:books:](https://react.dev/reference/react-dom/createPortal)

[Hooks](/Technical%20Stack/Mobile%20Developer/React.md#hooks)
-------------------------------------------------------------

* [ ] You can use <code>useState</code> and <code>useEffect</code> hooks. [:books:](https://www.valentinog.com/blog/hooks/)
* [ ] You know how hook dependency array works. [:books:](https://medium.com/better-programming/understanding-the-useeffect-dependency-array-2913da504c44)
* [ ] You know how to write a custom React hook. [:books:](https://reactjs.org/docs/hooks-custom.html)
* [ ] You can use <code>useState</code> and <code>useEffect</code> hooks. [:books:](https://react.dev/reference/react/hooks)
* [ ] You know how hook dependency array works. [:books:](https://react.dev/reference/react/useEffect#specifying-reactive-dependencies)
* [ ] You know how to write a custom React hook. [:books:](https://react.dev/learn/reusing-logic-with-custom-hooks)
* [ ] You understand pros and cons of using <code>useCallback</code> hook. [:books:](https://kentcdodds.com/blog/usememo-and-usecallback/)
* [ ] You know how to use <code>react-hook</code> form [:books:](https://www.react-hook-form.com/get-started/)
* [ ] You are familiar with <code>react-infinite-scroll-hook</code> [:books:](https://www.npmjs.com/package/react-infinite-scroll-hook/)

### [react-use](/Technical%20Stack/Mobile%20Developer/React.md#react-use)

* [ ] You know how to incorporate react-use hooks in your component [:books:](https://github.com/streamich/react-use/blob/master/docs/useLocalStorage.md)
* [ ] You know how to incorporate react-use hooks in your component [:books:](https://github.com/streamich/react-use)
* [ ] You understand the advantages/disadvantages of the API compared to Lodash

[react-dom](/Technical%20Stack/Mobile%20Developer/React.md#react-dom)
---------------------------------------------------------------------

* [ ] You can explain how React.render function works. [:books:](https://reactjs.org/docs/rendering-elements.html)
* [ ] You can explain React.createPortal works. [:books:](https://blog.logrocket.com/learn-react-portals-by-example/)
* [ ] You can explain how React.hydrate function works. [:books:](https://medium.com/@akakankur81/a-quick-overview-on-react-dom-render-and-hydrate-6d0ec6c1b234)

[Components](/Technical%20Stack/Mobile%20Developer/React.md#components)
-----------------------------------------------------------------------

### [downshift](/Technical%20Stack/Mobile%20Developer/React.md#downshift)

* [ ] You used it in a project [:books:](https://codesandbox.io/s/github/kentcdodds/downshift-examples/tree/master/?module=%2Fsrc%2Fordered-examples%2F01-basic-autocomplete.js&moduleview=1)
* [ ] You used it in a project [:books:](https://github.com/downshift-js/downshift)

### [react-day-picker](/Technical%20Stack/Mobile%20Developer/React.md#react-day-picker)

* [ ] You used it in a project

### [react-loading-skeleton](/Technical%20Stack/Mobile%20Developer/React.md#react-loading-skeleton)

* [ ] You used it in a project [:books:](https://www.npmjs.com/package/react-loading-skeleton)

### [react-dropzone](/Technical%20Stack/Mobile%20Developer/React.md#react-dropzone)

* [ ] You used it in a project [:books:](https://react-dropzone.js.org/)

* * *

Contribution
Expand Down Expand Up @@ -74,4 +76,4 @@ Permission is hereby granted, free of charge, to any person obtaining a copy of

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.