티스토리 뷰

이 프로젝트에서 DB를 따로 사용하지 않고 json형태의 로컬파일을 만들어 사용할 것이다.

const posts =[
  {
    id : '1',
    title : 'first'
  },
  {
    id : '2',
    title : 'second'
  },
  {
    id : '3',
    title : 'third'
  }
]

따라서 위와 같은 posts를 만들었다.

만약 실제 서비스였다면, DB로 부터 posts의 정보를 받아와야 할 것이다.

/posts

이제 이것을 이용하여 api를 구축해보자.

먼저 /posts 로 접근했을 때 post의 목록을 제공해주는 api를 만들어보자.

제공하는 데이터는 전체 post의 리스트와, 총 개수이다.

const result = {
      posts: posts.map((post) => ({
        id: post.id,
        title: post.title,
      })),
      totalLength: posts.length,
    }

map함수를 이용하여 post에서 id와 title을 뽑아 posts에 저장하고 총 개수를 계산했다.

이제 이 데이터를 json형태로 제공해주기 위해 res.end(JSON.stringify(result)) 와 같이 작성하자.

이제 /posts 로 접근하게 되면 아래와 같은 결과를 볼 수 있다.

앞서 작성했던 DB의 결과가 제대로 나오는 것을 확인할 수 있다.

이렇게 /posts 의 API작성을 완료했다.

/posts/:id

다음은 /posts/:id 를 구현해 보자.

find() 함수를 통해 posts에 url에 해당하는 id가 있는지 조회하면 된다.

const post = posts.find((_post) => _post.id === postId)
    if (post) {
      req.statusCode = 200
      res.end(JSON.stringify(post))
    } else {
      res.statusCode = 404
      res.end('Not found')
    }

이렇게 구현하여 http localhost:3000/posts/3 으로 접속하면 만약 id에 해당 하는 post가 있다면

이러한 결과를 얻을 수 있다.

이렇게 /posts/:id 의 api도 완성을 했다.

그리고 api를 작성할때 헤더를 작성하여 우리가 제공해주는 값이 어떠한 형태인지 명시해주는 것이 좋다.

res.setHeader('Content-Type', 'application/json; charset=utf-8') 이 코드를 추가하면 된다.

/posts (POST)

다음은 이제 GET 이 아닌 POST 요청을 처리해보자.

POST요청과 함께 값이 넘어오면, 해당하는 값을 통해 새로운 post를 생성하여 저장해야 한다.

일단 앞서 생성하였던 DB역할을 하는 리스트를 다음과 같이 수정했다.

const posts = [
  {
    id: '1',
    title: 'first',
    content : 'first content'
  },
  {
    id: '2',
    title: 'second',
    content : 'second content'
  },
  {
    id: '3',
    title: 'third',
    content : 'third content'
  },
]

폼을 사용하여 사용자로부터 입력을 받지 않으므로 httpie를 이용하여 POST요청을 받을 것이다.

http POST localhost:3000/posts title='new' content='new content'

이렇게 하여 서버로 POST요청을 보냈을때 새로운 post를 생성하여 저장해야 한다.

먼저 POST요청으로 들어온 데이터를 확인하기 위하여 아래 코드를 추가해주자.

req.setEncoding('utf-8')
req.on('data', (data) => {
console.log(data)
})

인코딩 설정을하고, data가 들어오면 해당 data를 콘솔로 찍어줬다.

다시한번 요청을 보내면 POST의 데이터가 출력되는것을 확인할 수 있을 것이다.

이제 이 데이터를 이용하여 DB에 데이터를 추가 해보자.

req.on('data', (data) => {
      const reqBody = JSON.parse(data)
      posts.push({
        id: reqBody.title,
        title: reqBody.title,
        content: reqBody.content,
      })
    })

먼저 json형태의 데이터를 parsing하여 객체형태로 받는다.

이후에 기존에 존재했던 posts에 새로운 값을 push해주면 된다.

id값은 일단 임시적으로 title과 같게 하였다.

이제 다시 POST요청을 보내고 http localhost:3000/posts 를 사용하면 새로운 데이터가 추가된 결과를 확인할 수 있다.


일단 이렇게 하여 기초적인 api를 완성해보았다.
그러나 이 프로그램은 절대로 잘 짜여진 프로그램이라고 할 수 없다.
가독성도 엉망이고, 중복된 코드역시 매우 많다.
실제 프로젝트를 진행할때는 중복된 코드를 최소화하여, main과 api를 분리하는 게 좋을 것 같다.
또한 라우터역시 따로 구현하여 런타임에 발생할 수 있는 오류를 최소화 하는것이 좋겠다.

댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2025/02   »
1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28
글 보관함