I'm quite new to react native and javascript in general, but I'm trying to learn how to make an app with it. I want to be able to display the current hebrew date in my app. The hebrew calendar is a unique lunisolar calendar, so getting the hebrew date cannot be a simple localization of a gregorian date. There seem to be multiple js dependencies that can give me the hebrew date (so far I've tried hebcal and hedate), but none are working. I think hebcal is just inpatible with react native, but with heDate I'm getting an error TypeError: Object is not a constructor (evaluating 'new heDate()'). Can I fix this? If not, how would I pull it from, say, a website?

Here is my code:

import { setStatusBarBackgroundColor } from "expo-status-bar";
import React, { Component } from "react";
import { View, StyleSheet, Text } from "react-native";

var heDate = require("he-date");
var d = new heDate();
var date = d.getDate();

const Zmanim = () => {
  return (
    <View style={styles.container}>
      <Text style={styles.text}>{date}</Text>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
    backgroundColor: "#487dc7",
  },

  text: {
    fontSize: 20,
    fontWeight: "bold",
    color: "#fff",
  },
});

export default Zmanim;

I'm quite new to react native and javascript in general, but I'm trying to learn how to make an app with it. I want to be able to display the current hebrew date in my app. The hebrew calendar is a unique lunisolar calendar, so getting the hebrew date cannot be a simple localization of a gregorian date. There seem to be multiple js dependencies that can give me the hebrew date (so far I've tried hebcal and hedate), but none are working. I think hebcal is just inpatible with react native, but with heDate I'm getting an error TypeError: Object is not a constructor (evaluating 'new heDate()'). Can I fix this? If not, how would I pull it from, say, a website?

Here is my code:

import { setStatusBarBackgroundColor } from "expo-status-bar";
import React, { Component } from "react";
import { View, StyleSheet, Text } from "react-native";

var heDate = require("he-date");
var d = new heDate();
var date = d.getDate();

const Zmanim = () => {
  return (
    <View style={styles.container}>
      <Text style={styles.text}>{date}</Text>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
    backgroundColor: "#487dc7",
  },

  text: {
    fontSize: 20,
    fontWeight: "bold",
    color: "#fff",
  },
});

export default Zmanim;

• javascript
• android
• react-native
• date

• 1 In plain JS you can do new Date().toLocaleString('en-u-ca-hebrew'), which currently returns "6 Sivan 5781, 10:55:53 AM" for me. Or in Hebrew: new Date().toLocaleString('he-u-ca-hebrew'), which is "6 בסיון 5781, 10:57:54". – RobG Commented May 17, 2021 at 0:56
• Oh wow, I didn't know it was included in the Date() class! – Zev Ross Commented May 24, 2021 at 17:42
• Support for different languages and other options is derived from ECMA-402 via Intl.DateTimeFormat and Date.prototype.toLocaleString. Note that "locale" in this context is a misnomer for "language". – RobG Commented May 24, 2021 at 20:30

3 Answers 3

A simple method to get the Hebrew date in javascript is to use the Intl.DateTimeFormat().

Here is an example of getting today's Hebrew date in English and Hebrew:

console.log(new Intl.DateTimeFormat('en-u-ca-hebrew',{dateStyle:"full"}).format(new Date()));

console.log(new Intl.DateTimeFormat('he-u-ca-hebrew',{weekday: 'long', year:'numeric', month:'numeric', day:'numeric'}).format(new Date()));

The library 'hebrew-date' seems to work for calculations. https://www.npmjs./package/hebrew-date

import React from 'react';
import {Text, View} from 'react-native';
import hebrewDate from 'hebrew-date';

export default function App() {

    const date = hebrewDate(new Date())

    return (
        <View>
            <Text>{date.date} {date.month_name} {date.year}</Text>
        </View>
    );
}

Output today (16. May 2021 Gregorian) = 5 Sivan 5781

You can use: https://www.npmjs./package/jewish-date it will work in any Javascript/TypeScript environment and it supports converting Hebrew date to Gregorian date and vice verser.

import { toJewishDate, toGregorianDate, formatJewishDateInHebrew, oHebrewJewishDate, JewishMonth} from "jewish-date";

const date = new Date("2020-01-01");
const jewishDate = toJewishDate(date);
console.log(jewishDate); // { year: 5780, monthName: "Tevet", day: 4 }

const jewishDateInHebrew = toHebrewJewishDate(jewishDate);
console.log(jewishDateInHebrew); // { day: "ד׳", monthName: "טבת", year: "התש״פ" }

const jewishDateInHebrewStr = formatJewishDateInHebrew(jewishDate);
console.log(jewishDateInHebrewStr); // ד׳ טבת התש״פ

const date2 = toGregorianDate({ year: 5780, monthName: JewishMonth.Tevet, day: 4 });
console.log(date2); // Wed Jan 01 2020 00:00:00 GMT+0200 (Israel Standard Time)