- update the below config ins firebase.util.js
const config = {
apiKey: "AIzaSyDouYv9znYuedlBDK8CrfiGnRM9HVOBse0",
authDomain: "app-grpql.firebaseapp.com",
projectId: "app-grpql",
storageBucket: "app-grpql.appspot.com",
messagingSenderId: "448271751409",
appId: "1:448271751409:web:0f3b07e8525fbe12a33150"
}
- create a new user using signup and login
- use email [email protected] / password:[email protected]
nvm use 14 yarn install yarn start https://devcenter.heroku.com/articles/heroku-cli#download-and-install
const hooksExample = () => {
const [user, setUser] = useState(null); // initial state
const [searchQuery, setSearchQuery] = useState('Bret');
useEffect({
},[]);
}
- useEffect called after every render
- useEffect groups simillar lifecycle methods better handling
- componentDidMount -> useEffect for the first time
- componentDidUpdate -> useEffect only , pass the state attribute in the array 2nd parameter to look for change
- componentWillUnmount -> is same as the return method of useEffect
- restrict multiple execution of useEffect -> use second paramenter array and pass the state attributes on change of which the method should be called useEffect(()={}, [])
- useState -> state object with a setter
- hooks not relying on this keywords lots of pitfalls with this.
- useState -> to get previous state just use the object in the setter method argumnet
- we cant do "export default with arrow function" has to use a function keyword only export default function(){}
- Updating an array object in reducer : use map and return the same object if not updated and merge the sate with the updated array
- Removing an array item in reducer: use array.filter , filter out the non matching items
- state.todos.push(newObj) ==> [...state.todos, newObj] return { ...state, todos: newTodosArray }