ApolloClient – How to use (1)
How to create Apollo client for multiple graphQL endpoints? Create HttpLink to each endpoint Configure Apollo client Finally, you can call a query or mutation […]
React JS
React – How to interact with DOM?
How to interact with a HTML element in React? Use useRef Embed HTML content Focus an editable div element How to render a React component […]
React – How to use css in React project?
Basic How to import css as module? Create css with name as “Button.module.css” Then, you can import css into jsx as below How to import […]
React Test – How to write Unit test and e2e test (1)?
Unit test Setup Install ts-jest for testing TypeScript files Run yarn test or yarn jest Test Problems How to ignore a specific file type “e2e.test.js”? Edit package.json […]
npm – How to create a private npm?
Use case: You have your own React UI library project and you want to use UI components from this lib across other projects React Native: […]
React – How to manage state by Redux (2)?
Redux Toolkit Setup Install packages Create Slice API Create redux store Get/ set state from/ to store
eslint, husky, audit-ci – Configuration
Setup eslint React Native Setup eslint-plugin-react-native Create .eslintrc.json Basic How to completely uninstall eslint? How to resolve path to module ‘@components/some-module’.(import/no-unresolved) eslint-import-resolver-typescript Install packages Fix […]
Web layout – How to use Grid?
How to create a page with header, content and footer? header – main – footer How to create a table? 14 columns with different size, […]
React – How to create a custom hook?
Example 1 Example 2
Web layout – How to create a sticky sidebar menu?
Use “react-stickynode” Use cases How to fix issue where sidebar overlaps footer area? Add id node before Footer component Set bottomBoundary property How to scroll […]