I'm trying to programm a Chat Web-Application with Firebase. I am using HTML as a return method in Javascript. I tried to include my DB Firebase but I'm getting an error, that the DB is not defined. Can someone solve my Problem?
function Chats() {
const username = prompt("What's your name?");
document.getElementById("send-message").addEventListener("submit", postChat);
function postChat(e) {
e.preventDefault();
const timestamp = Date.now();
const chatTxt = document.getElementById("chat-txt");
const message = chatTxt.value;
chatTxt.value = "";
db.ref("messages/" + timestamp).set({
usr: username,
msg: message,
});
}
return (
<div id="chat">
<ul id = "messages"></ul>
<form id="send-messages">
<input id="chat-txt" type= "text"></input>
<button id="chat-btn">Submit</button>
</form>
<script src="https://www.gstatic.com/firebasejs/9.8.1/firebase-app.js"></script>
<script src="https://united-parents-default-rtdb.europe-west1.firebasedatabase.app"></script>
</div>
);
}
declare DB variable at start of your script
var db = firebase.database();
first you have to initialize the firebase
<script src="https://www.gstatic.com/firebasejs/6.6.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/6.6.1/firebase-storage.js"></script>
<script src="https://www.gstatic.com/firebasejs/6.6.1/firebase-database.js"></script>
<script src="https://www.gstatic.com/firebasejs/6.6.1/firebase-functions.js"></script>
<script>
var firebaseConfig = {
apiKey: "api_key",
authDomain: "authDomain",
databaseURL: "databaseURL",
projectId: "projectId",
storageBucket: "storageBucket",
messagingSenderId: "messagingSenderId",
appId: "appId"
};
firebase.initializeApp(firebaseConfig);
</script>
you can get this from firebase console as well