Please enable JavaScript.
Coggle requires JavaScript to display documents.
Full Stack Open 2020 - Coggle Diagram
Full Stack Open 2020
Part1b: JavaScript
Arrow Functions
Variables
Arrays
Objects
Part1a: Introduction to React
Component State
State Hook
e.g. useState() function
Event Handler Functions
Called when event (e.g. mouse click) occurs
const setToZero = () => setCounter(0)
return(
<button onClick={setToZero}>
Props: passing data to components
const Hello = (props) => { return ( <div> <p> {props.name}</div>
Gets props from the App: <Hello name="George" />
Part2: Communicating with Server
json-server ('"fake server")
db.json ("database")
Fetching Data from Server
Alternatives: fetch,
axios
UseEffect-hooks
asynchronous model
Promises
code
execution continues
after calling an IO function,
without waiting for it to return.
(non-blocking IO-operations)
Props: passing data to components
const Hello = (props) => { return ( <div> <p> {props.name}</div>
Gets props from the App: <Hello name="George" />
Part0: Fundamentals of Web Apps