React

Glossary

Name
Definition
React components created with a function()

Create React App

    TypeScript support
Cons:
    No SEO

Default

    Change public/index.html: <title>
    Change public/mainfest.json

Relay

Difficult and heavy
    Requires relay-compiler
      Requires exporting a schema from your graphql endpoint

SEO

TypeScript

Creating

1
yarn create react-app my-app --typescript
Copied!

Adding

Does Not Support

    No const enum

Directory Structure

1
src/components
2
src/containers
3
src/routes/EntriesRoute.tsx
Copied!

useEffect with async/await

await-useEffect.tsx
1
function Render() {
2
const [data, setData] = useState(null);
3
const fetchData = async() => {
4
const response = await fetch(`https://www.example.com/`);
5
const json = await response.json();
6
setData(json);
7
};
8
useEffect(() => { fetchData() });
9
return <div>Test</div>
10
}
Copied!

useRef(null)

Error:
1
Type error: Cannot assign to 'current' because it is a read-only property. TS2540
Copied!
By default if you create a ref with a null default value and specify its generic parameter you're signaling your intent to have React "own" the reference. If you want to be able to mutate a ref that you own you should declare it like so:
Solution:
    Change useRef<T | null>(null) to useRef<T>()

Bootstrap

Use reactstrap
Last modified 2yr ago