인스타그램 클론코딩 리팩토링

wgnator·2022년 7월 17일
0
post-custom-banner

이번 프로젝트에서 맡은 역할:

  • fetching data module 구현: axios instance를 위한 service 객체 / http 메소드를 모아놓은 DataService 구현
  • 댓글 추가기능 구현
  • 새글 등록기능 및 모달 구현

DataService.js:

import axios from 'axios';
import { getLoginUser, setLoginUser } from '../component/commons/utils/lib';

const http = axios.create({
  baseURL: 'http://localhost:4000/',
  headers: {
    'Content-type': 'application/json',
  },
});

class FeedDataService {
  getFeeds() {
    return http.get('http://localhost:4000/posts');
  }
  getFeed(id) {
    return http.get(`http://localhost:4000/posts/${id}`);
  }
  postFeed(data) {
    return http.post('http://localhost:4000/posts', data);
  }

  async updateFeed(prevFeed, newComment) {
    const commentId =
      prevFeed.reply.sort((a, b) => b.id - a.id)[0]?.id + 1 ?? 1;
    const reply = [{ id: commentId, ...newComment }, ...prevFeed.reply];
    const data = {
      ...prevFeed,
      reply,
    };

    return http.put(`http://localhost:4000/posts/${data.id}`, data);
  }
}

export default new FeedDataService();
profile
A journey in frontend world
post-custom-banner

0개의 댓글