반응형
<!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.29 |
| Firebase API 만들기 (0) | 2021.07.27 |
| Vivaldi Browser 사용기 (0) | 2021.07.02 |
