scrimba
Learn React for free
React Inline Styles with the Style Property
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

React Inline Styles with the Style Property
AboutCommentsNotes
React Inline Styles with the Style Property
Expand for more info
index.js
run
preview
console
import React from "react"
import ReactDOM from "react-dom"

function App() {
const date = new Date()
const hours = date.getHours()
let timeOfDay

if (hours < 12) {
timeOfDay = "morning"
} else if (hours >= 12 && hours < 17) {
timeOfDay = "afternoon"
} else {
timeOfDay = "night"
}

return (
<h1>Good {timeOfDay}!</h1>
)
}

ReactDOM.render(<App />, document.getElementById("root"))
Console
index.html
-7:05