JSFiddle - React, Tailwind, and code Playground

HTML

<h2>註冊</h2>
<lable for="account">電子郵件</lable>
<input id="account" type="text">
<lable for="pwd">密碼</lable>
<input id="pwd" type="password">
<lable for="name">姓名</lable>
<input id="name" type="text">
<lable for="age">年齡</lable>
<input id="age" type="number">
<button type="submit" id="registerSmtBtn">Signup</button>

<h2>登入</h2>
<lable for="accountL"></lable>
<input id="accountL" type="text">
<lable for="pwdL"></lable>
<input id="pwdL" type="password">
<button type="submit" id="loginSmtBtn">Login</button>

<h2>登出</h2>
<button id="signoutSmtBtn">Signout</button>

<h2>上傳照片</h2>
<input id="uploadFileInput" type="file" accept="image/*">

<h2>取得照片</h2>
<button id="getPicBtn">Get</button>
<img id="downloadedImg">

<h2>取得照片資料</h2>
<button id="getImgMetaBtn">Get</button>

<h2>更新照片資料</h2>
<button id="setImgMetaBtn">Get</button>

<h2>刪除照片</h2>
<button id="deletePicBtn">Get</button>

<script src="https://www.gstatic.com/firebasejs/3.5.2/firebase.js"></script>

JavaScript

// Initialize Firebase
  var config = {
    apiKey: "AIzaSyASwAnakbaqQB578LGHHbPCht7I_FqjNHs",
    authDomain: "test-35b46.firebaseapp.com",
    databaseURL: "https://test-35b46.firebaseio.com",
    storageBucket: "test-35b46.appspot.com",
    messagingSenderId: "558722894017"
  };
firebase.initializeApp(config);
var storageRef = firebase.storage().ref();

//Email/Pwd註冊
var loginUser;
var account = document.getElementById("account");
var pwd = document.getElementById("pwd");
var registerSmtBtn = document.getElementById("registerSmtBtn");
var age = document.getElementById("age");
var name = document.getElementById("name");
registerSmtBtn.addEventListener("click", function(){
		console.log(account.value);
    firebase.auth().createUserWithEmailAndPassword(account.value, pwd.value).then(function(){
    }).catch(function(error) {
    // Handle Errors here.
    var errorCode = error.code;
    var errorMsg = error.message;
    console.log(errorMsg);
  });
},false);

//登入
var accountL = document.getElementById("accountL");
var pwdL = document.getElementById("pwdL");
var loginSmtBtn = document.getElementById("loginSmtBtn");
loginSmtBtn.addEventListener("click",function(){
	firebase.auth().signInWithEmailAndPassword(accountL.value, pwdL.value).catch(function(error) {
  	// Handle Errors here.
  	var errorCode = error.code;
  	var errorMessage = error.message;
  	console.log(errorMessage);
  })
},false);

var loginUser;
firebase.auth().onAuthStateChanged(function(user) {
  if (user) {
  	loginUser = user;
    console.log("User is logined", user)
  } else {
  	loginUser = null;
    console.log("User is not logined yet.");
  }
});

var signoutSmtBtn = document.getElementById("signoutSmtBtn");
signoutSmtBtn.addEventListener("click",function(){
	firebase.auth().signOut().then(function() {
		console.log("User sign out!");
	}, function(error) {
  	console.log("User sign out error!");
	})
},false);

var uploadFileInput =...