Article

Using JS inside JSX

Published: 20 Dec 2021 | Last updated 20 December 2021

To use JavaScript inside JSX territory we can use curly braces like:

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>
    )
  }
  • Techtud Admin
  • @techtud
  • Senior editor at techtud

What to read next

Sounds rather exhausting, right?Well, it was indeed exhausting! Many of the times but when I analyze what all I was able to accomplish in a year's

Here is a time worthy documentation: