scrimba
JS Deep Dive
Essential concepts
Understand State and State Management
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Understand State and State Management
AboutCommentsNotes
Understand State and State Management
Expand for more info
index.js
run
preview
console
class App {
constructor() {
this.render();
this.$userMessage = document.getElementById("user-message");
this.checkAuth();
}

checkAuth() {
const user = true;
if (user) {
this.$userMessage.textContent = "Welcome back!";
} else {
this.$userMessage.textContent = "You must sign in!";
this.$userMessage.style.color = "red";
}
}

render() {
document.getElementById("root").innerHTML = `
<div>
<span id="user-message"></span>
</div>
`;
}
}

new App();
Console
/index.html
-13:57