Digimon project : 백엔드 프로젝트 - 게시글에 이미지 삽입 설계

 

프로젝트를 하다가 문득 고민이 생겨서 적는 글이다.

게시글에 이미지 삽입을 어떤 식으로 해야할까?

 

일단, AWS S3를 사용해서 이미지 파일을 불러오는 형식으로 사용할 예정이다.

 

백엔드에서 게시글 자체를 html파일로 만들어서 넘겨주자. 이미지는 <img src="`${img.url}`" style="width, height"/> 로 넘기자. -> 하지만 css같은 스타일은 어떻게 할건데?

그러면 다른 글들도 글자색, 밑줄, 크기 이런건 어떻게 할거지? 그냥 마크다운 형식 쓰도록 패키지 다운받아서 써야하나?

 

결론 : 프론트에서 html파일 자체를 텍스트 형식으로 백엔드로 넘겨서 DB에 저장시키고, 백엔드에서는 DB에 저장된 html형식의 텍스트를 전달하면 된다.

 

스벨트에는 @html을 사용해서 html구문을 삽입할 수 있다고 한다. 이것을 이용하면 될 것 같다.

 

그러면 일단 백엔드에서는 게시글 내용을 text형식으로 받아서 통째로 DB에 저장하도록 하면 되므로, 게시글 내용에 관해서는 따로 처리를 할 필요는 없다. 대신, 이미지를 S3에 업로드하여 해당 url을 받아오는 api를 추가적으로 작성을 해주어야한다. 사용자가 사진 추가 버튼을 눌러서 사진을 추가한다면, 해당 api가 동작되어 클라이언트가 작성 중인 게시글에 <img/> 태그를 걸면서 보여줄 수 있도록 만들어야 할 것이다.

 

다만 이렇게 통째로 html을 텍스트로 박아버리면, css파일을 사용할 경우 클래스명이나 id를 함부로 바꾸지 못한다는 점이 단점이 될 것 같다. 프론트에서 클래스명을 바꿔버리면 DB에 저장되어 있는 html파일에는 변경 전 클래스명이 들어가있기 때문에 적용을 못 받을 것이다.

 

일단, 이렇게 하기로 정하고 프로젝트를 진행해보도록 하겠다.

 

++ 지금 티스토리 게시글을 작성하면서 보니까, 따로 class나 id는 사용하지 않고 바로 style로 적용해서 html이 작성되고 있다 ㅋㅋ 나도 이런식으로 해야겠다!