• Routing : 어떤 기능을 경로에 따라 분리하는 것

  • PC에서 파일의 수가 늘어나면 폴더로 분류해 관리하듯, API 함수의 수가 많아지면 기능의 종류에 따라 경로를 나누어 구현하는 것이 적합

  getPostData, getPostList, getProfileData, getProfileList 등 4개의 함수가 존재할 때, Post와 Profile의 두가지 종류로 나눌 수 있다 ex) /post/getData /post/getList /profile/getData /profile/getList

  // index.ts
  import express from "express";
  import postRouter from "./Router/PostAPI";
  import profileRouter from "./Router/ProfileAPI";
  
  const app = express();
  
  ...
  
  app.use("/post", postRouter);
  app.use("/profile", profileRouter);
  
  ...
  
  app.listen(8080, () => {
  	console.log("Server is Running!");
  });
  

  // Router/PostAPI.ts
  import express from "express";
  
  const postRouter = express.Router();
  
  postRouter.post("/getPostData", (req, res) => {
      res.send("Get Post Data");
  });
  
  postRouter.post("/getPostList", (req, res) => {
      res.send("Get Post List");
  });
  
  export default postRouter;
  

• 데이터의 입력과 반환

  • Get API 함수에 대해서, URL의 뒤에 입력된 Query String의 값은 Request 객체의 Query 요소/를 통해 전달받을 수 있다.

    // localhost:8080/getMemberData?MEMBER_ID=ASDF
    
    app.get("/getMemberData", (req, res) => {
        const MEMBER_ID: string = req.query.MEMBER_ID;
    
    		...
    		const MEMBER_DATA = {
    				"name": MEMBER_ID
    		}
    
        res.send(MEMBER_DATA);
    });
    

  • Post API 함수에 대해서, 어떤 입력된 Parameter 값은 Request 객체를 통해 전달받을 수 있다.

    app.post("/getMemberData", (req, res) => {
        const MEMBER_ID: string = req.body.MEMBER_ID;
    
    		...
    		const MEMBER_DATA = {
    				"name": MEMBER_ID
    		}
    
        res.send(MEMBER_DATA);
    });
    

• Firebase와 연동해 Firestore Database 활용한 Back-End 개발해보기 ((풀악셀 ON))

  • Firebase : 데이터베이스, 계정 로그인, 사용자 통계 및 분석 등 다양한 프로젝트 관리 기능을 제공해주는 플랫폼
  • Firebase에서 제공하는 데이터베이스 기능으로는 Realtime Database와 Firestore가 있다
    • 두 기능 모두 고전적인 RDB와는 차이가 있는 NoSQL 기반이나, 그나마 Realtime Database가 여러 테이블로 구성할 수 있는 등 RDB에 가깝다
    • 하지만 대용량 데이터를 다루기에 효율적이고, 개발자에게 직관적인 데이터베이스는 FIrestore

  yong@ubuntu:~$ npm install --save firebase
  (JS에서는 생략) yong@ubuntu:~$ npm install --save @types/firebase
  

  • Node 프로젝트에 Firebase 라이브러리를 설치했다면, Firebase 서버의 프로젝트와 연동을 해주어야 한다.

    • Firebase 프로젝트 설정 >> 일반 >> 앱 추가 >> Web >> Config 값 확인

      {
      	apiKey: "asdfasdfasdfasdfasdfasf",
        authDomain: "blog-lr-b18ce.firebaseapp.com",
        projectId: "blog-lr-b18ce",
        appId: "1:247226604455:web:asdfasdfasdfasdfawsdf"
      }
      

    • 다만, 이 값을 그대로 Project 코드에 입력할 경우, 보안 문제가 발생할 수 있어, 일반적으로는 dotenv의 방식으로 Key 값을 관리한다

      yong@ubuntu:~$ npm install --save dotenv
      (JS에서는 생략) yong@ubuntu:~$ npm install --save @types/dotenv
      

      .env 파일 생성 후 다음과 같은 형식으로 Key 값을 입력해준 뒤, Gitignore 처리를 통해 Commit에 포함되지 않도록 한다

      FB_API_KEY=asdfasdfasdfasdf
      FB_AUTH_DOMAIN=defcon-bfb10.firebaseapp.com
      FB_PROJECT_ID=defcon-bfb10
      FB_APP_ID=1:968114873237:web:asdfasdfasdfasdf
      

      이후 Key 값을 불러올 코드에서 dotenv 라이브러리를 이용해 Key 값에 접근한다

      import { initializeApp } from "firebase/app";
      import { getFirestore } from "firebase/firestore";
      import dotenv from "dotenv";
      
      dotenv.config();
      const firebaseConfig = {
          apiKey: process.env.FB_API_KEY,
          authDomain: process.env.FB_AUTH_DOMAIN,
          projectId: process.env.FB_PROJECT_ID,
          appId: process.env.FB_APP_ID
      };
      
      let firebaseApp;
      let firebaseDB;
      
      export const initFirebase = () => {
          firebaseApp = initializeApp(firebaseConfig);
      		firebaseDB = getFirestore();
      };
      

      Firebase App 객체의 initializeApp() 함수를 이용해 Firebase 서비스를 시작한다. 이후, Firestore 등의 서비스에 접근할 때에는 이 Firebase App 객체를 이용한다.

이후의 과정들은 모두 Firebase App 및 Firestore 서비스가 Initialize된 이후에 진행해야 한다

• Firestore에 저장한 값 읽어오기

  • 특정 컬렉션 내 특정 문서의 값 가져오기

    import { doc, getDoc } from "firebase/firestore";
    
    const docRef = doc(firebaseDB, "컬렉션_이름", "문서_이름");
    const docSnap = await getDoc(docRef);
    
    if(docSnap.exists()){
    	  console.log("Document data:", docSnap.data());
    }else{
    	  console.log("No such document!");
    }
    

  • 특정 컬렉션 내 모든 문서의 값 가져오기

    import { collection, getDocs } from "firebase/firestore";
    
    const querySnapshot = await getDocs(collection(firebaseDB, "컬렉션_이름"));
    querySnapshot.forEach((doc) => {
    	  console.log(doc.id, " => ", doc.data());
    });
    

• Firestore에 값 저장하기

  함수	설명
  setDoc()	새로운 문서를 추가함. 문서의 ID를 직접 지정
  addDoc()	새로운 문서를 추가함. 문서의 ID가 자동으로 랜덤 생성
  updateDoc()	기존에 존재하는 문서의 값을 업데이트

  // setDoc()
  import { doc, setDoc } from "firebase/firestore"; 
  
  const NEW_DATA = {
  	"asdf": asdf,
  	"qwer": qwer
  };
  
  await setDoc(doc(firebaseDB, "컬렉션_이름", "생성할_문서_이름"), NEW_DATA);
  

  // addDoc()
  import { doc, addDoc } from "firebase/firestore"; 
  
  const NEW_DATA = {
  	"asdf": asdf,
  	"qwer": qwer
  };
  
  await addDoc(doc(firebaseDB, "컬렉션_이름"), NEW_DATA);
  

  // updateDoc()
  import { doc, updateDoc } from "firebase/firestore"; 
  
  const NEW_DATA = {
  	"asdf": asdf,
  	"qwer": qwer
  };
  
  await updateDoc(doc(firebaseDB, "컬렉션_이름", "문서_이름"), NEW_DATA);
  

  • 값 Update의 경우, 자료형에 따라 더 편리하게 이용할 수 있다.

    • 문서 내 Number 변수를 증가시키는 경우

      import { doc, updateDoc, increment } from "firebase/firestore";
      
      const docRef = doc(firebaseDB, "컬렉션_이름", "문서_이름");
      
      await updateDoc(docRef, {
          varNumber: increment(50)
      });
      

    • 문서 내 Array 변수의 요소를 추가하거나 제거하는 경우

      import { doc, updateDoc, arrayUnion, arrayRemove } from "firebase/firestore";
      
      const docRef = doc(firebaseDB, "컬렉션_이름", "문서_이름");
      
      // Atomically add a new region to the "regions" array field.
      await updateDoc(docRef, {
          regions: arrayUnion("값 추가")
      });
      
      // Atomically remove a region from the "regions" array field.
      await updateDoc(docRef, {
          regions: arrayRemove("값 제거")
      });
      

• 관련 예제 코드

  https://github.com/yymin1022/Blog_LR_Back

  https://github.com/yymin1022/DefCon-BE/

  https://github.com/yymin1022/ECOmunity-BE

  Cloud Firestore 시작하기 | Firebase