본문 바로가기
ETC

Firebase 데이터 저장하기

by Wilkyway 2021. 7. 30.
<!DOCTYPE html>
<html>
<head>
	<!-- jQuery  -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
	<link rel="stylesheet" href="style.css" />
</head>
<body>
파이어베이스 웹서버 입니다.

<div class="container mt-3">

</div>


<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/8.8.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.8.0/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.8.0/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.8.0/firebase-storage.js"></script>

<script>
  // Your web app's Firebase configuration
  // For Firebase JS SDK v7.20.0 and later, measurementId is optional
  var firebaseConfig = {
    apiKey: "AIzaSyCnowLA3wkZzoSX9kFHdq615-ZhUvdNj60",
    authDomain: "wjdb-647dc.firebaseapp.com",
    databaseURL: "https://wjdb-647dc-default-rtdb.firebaseio.com",
    projectId: "wjdb-647dc",
    storageBucket: "wjdb-647dc.appspot.com",
    messagingSenderId: "241186966612",
    appId: "1:241186966612:web:9843c62bd2c76613ae71c1",
    measurementId: "G-8HX4QXCKBQ"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
</script>

<!-- <script src="app.js"></script> -->
<script>
  const db = firebase.firestore();

  // 읽기
  db.collection('product').get().then((res)=>{
    res.forEach((doc) => {
      console.log(doc.data())
      var template = `<div class="product">
            <div class="thumbnail" style="background-image: url('https://via.placeholder.com/350')"></div>
            <div class="flex-grow-1 p-4">
              <h5 class="title">${doc.data().제목}</h5>
              <p class="date">${Date()}</p>
              <p class="price">${doc.data().가격}</p>
              <p class="float-end">🤍0</p>
            </div>
          </div>`;
      $('.container').append(template);
    })
  })
</script>
</body>
</html>

'ETC' 카테고리의 다른 글

NSSM을 이용하여 Windows 에 Node 서비스 추가하기  (0) 2021.08.10
Firebase 이미지 저장하기(storage)  (1) 2021.07.30
Firebase 데이터 저장하기  (0) 2021.07.30
Firebase 구글 인증하기  (0) 2021.07.29
Firebase API 만들기  (0) 2021.07.27
Vivaldi Browser 사용기  (0) 2021.07.02

댓글0