4달 전 · 박준서 님의 새로운 댓글
리액트 프로젝트에 FSD 아키텍처 적용. 이 구성이 맞을까요?
안녕하세요. 현재 진행 중인 리액트 프로젝트에서 유지보수성과 확장성에 어려움을 느껴 폴더 구조를 Feature-Sliced Design(FSD) 아키텍처 기반으로 전면 리팩토링했습니다. 기존에는 `components/`, `pages/`, `apis/` 등 기능과 역할이 섞인 구조로 되어 있어, 코드의 위치가 불분명하고 협업에 어려움이 있었습니다. 이를 해결하고자 다양한 아키텍처를 조사한 끝에, FSD의 레이어 개념(Layers)에 맞춰 다음과 같은 방식으로 구조를 정리했습니다. - `app/`: `App.js`, `index.js` 등 프로젝트 진입점과 글로벌 설정 파일을 포함 - ` entities/`: `User`, `Article`, `CodingZone` 등 주요 도메인의 데이터 모델과 API 연동 담당 - `features/`: 로그인, 게시글 작성, 코딩존 출석 등 각 기능별로 모듈화하고, 필요한 경우 `hooks/` 등의 내부 디렉토리로 세분화 - `pages/`: 라우팅과 연결된 실제 페이지 컴포넌트 관리 (예: `CreatePage`, `EditPage` 등) - `widgets/`: 재사용 가능한 독립 UI 요소들 (예: `Footer`, `Navbar`, `Pagination` 등) - `shared/`: 공통 API, 유틸, 모달 컴포넌트 등 여러 기능에서 공유되는 요소들을 배치 기능 중심의 구조로 바꾸면서, 각 요소의 역할이 명확해지고 코드 탐색 및 유지보수가 훨씬 쉬워졌습니다. 현재는 복잡한 비즈니스 로직이 없어 `processes/` 레이어는 생략했지만, 추후 워크플로우가 필요한 기능이 생긴다면 도입할 계획입니다. 제가 구성한 이 폴더 구조와 레이어 분리가 실제 FSD 아키텍처 가이드에 부합하는 방향인지, 혹시 보완하거나 개선할 부분이 있다면 조언을 구하고 싶습니다. 자세한 내용은 블로그에 정리해 두었습니다. 👉 [https://juncci.tistory.com/4](https://juncci.tistory.com/4) 읽어주셔서 감사합니다!
개발자
#fsd
#react
#refactory
#프론드엔드
#폴더구조
답변 1
댓글 1
조회 188
5달 전 · 성대규 님의 질문 업데이트
Django serializer 현업에서는 어떻게 설계를 어떻게 하시나요?
안녕하세요 RN 개발을 진행하면서 백엔드로 Django를 사용하고 있고, Django를 공부한지 몇개월 되지 않았습니다. 개발을 진행하면서 아래의 문제가 생겼는데, 혹시 애초에 serializer와 model을 잘못 설계한 것은 아닌지, 또한 현업자 분들은 어떻게 시리얼라이저를 사용하시는지 궁금합니다. [문제 설명] 프로젝트의 모델에는 하위 게시글 모델이 여러 개 올 수 있습니다. 모델 구조는 아래와 같습니다. Project { id: number, posts: Post[], } Post { id: number, project: number, <- 무한 참조를 방지하기 위해 id } 앱 개발을 하다가 Post 데이터에서 Project까지 UI를 그려야하는 상황에서 또 프로젝트를 불러오는 API를 사용하니까 (프로젝트 id에서 프로젝트 오브젝트 불러오기, fetchProjectAPI). UI 지연이 되어서 프로젝트 오브젝트를 불러오고 싶은데, 프로젝트 시리얼라이저 내에서 또 포스트 오브젝트가 나오고 거에서 또 프로젝트가 나오는 문제가 생기더라구요. 이와 같은 경우에는 어떻게 해결하면 좋을까요? posts를 제외한 ProjectSummarySerializer를 새로 생성하면 되겠지만 근본적인 해결책은 아니라고 생각합니다 (제외하고 싶은 필드가 생길때마다 시리얼라이저를 만들어야하니깐요). 혹시 애초에 모델을 잘못 설계한걸까요? 또한 애초에 오브젝트로 반환하는 것을 잘 안하나요? (DB 와 송수신 로드를 줄이기 위해서 아이디로만 반환한다던지)
개발자
#django
#serializer
#model
답변 0
댓글 0
보충이 필요해요 1
조회 82
5달 전 · 성대규 님의 새로운 댓글
모바일 앱 UI를 업데이트 순서
모바일 앱을 개발하다가 랜더링 그러니까 UI를 업데이트하는 순서가 궁금해서 질문을 올려봅니다. 예를 들어 사용자가 게시글에 좋아요를 누른다고 했을 때 다음과 같은 방법 중에서 어떤 방법을 사용해야 하는지 궁금합니다..! 특히 현업에서는 어떤 방법을 사용하는지 왜 그렇게 사용하시는지 궁금합니다😄 1) 디바이스 로컬 UI 업데이트, 동시에 서버 데이터 업데이트. 서버 업데이트가 완료 되면 서버 데이터로 UI 반영. 2) 디바이스 로컬 UI 업데이트, 동시에 서버 데이터 업데이트. 그러나 서버 업데이트 데이터는 UI에 바로 반영하지 않음. 사용자가 앱을 다시 실행하거나 refresh되는 상황에서 나중에 서버 데이터를 반영할 것으로 기대. 3) 서버 데이터를 업데이트, 서버 데이터가 업데이트 되면 해당 데이터로 UI 업데이트. 4) 디바이스 로컬 UI 업데이트, 서버 데이터는 바로 업데이트 하지 않음. 나중에 서버 데이터는 업데이트 하기. 제가 이 고민을 하게 된 이유가, 게시물에 좋아요를 누르는 상황에서 비롯되었습니다. 처음에는 (3)번 방법을 사용했습니다. 하지만, 좋아요를 누르고 서버에 업데이트 되는데 약 0.5~1s 정도 UI가 지연되어서 불편하더군요. 그래서 (1)번 방법으로 변경했습니디. 사용자가 일단 좋아요를 누르면 디바이스에서 좋아요를 토클하고, 나중에 업데이트가 완료된다면 반영하는 방식으로요. 그런데 (1)번 방법도 사용자가 빠르게 좋아요를 2번 누른 상황에서, 좋아요가 표시되고 바로 해제가 안되는 (서버에서 좋아요를 눌렀다는 업데이트로 인해서 나중에 해제가 됩니다) 문제가 있습니다 ㅠㅠ. 다른 분들의 의견이 궁금합니다🔥
개발자
#react-native
#ui
답변 1
댓글 4
조회 78
6달 전 · @SoftyChoco 님의 새로운 답변
게시글 이미지 업로드를 구현하는데 궁금한 점이 있습니다.
velog를 참고하여 Spring + Vue를 이용하여 마크 다운 기반 게시글을 구현하고 있습니다.. 글을 쓰는 도중에 이미지를 올리면 s3에서 url를 반환하여, 이것을 통째로 Post 테이블 Content 필드에 저장하여 순서를 보장하는 식으로 진행하고 있습니다. 로직 흐름은 이렇습니다. 1. 사용자가 이미지를 올린다면, 클라이언트에서 글쓰기 버튼을 눌렀을 때 미리 만들어 놓은 UUID와 이미지를 서버로 보낸다. 2. 서버에서는 s3객체에 임시 저장 여부를 확인하는 isTemp를 태그를 넣어서 서버를 걸쳐서 S3에 쏜다. 3. S3에서 객체를 찾아서 key값과 클라이언트에서 보낸 uuid를 Image 테이블에 저장해서 Post와 간접적으로 연관 관계를 맺는다. 4. 글쓰기를 누른다면 내용과 UUID를 보내서 UUID를 Post의 primary key로 사용하고, UUID 기반으로 Image 테이블에서 key들을 갖고 와서 S3 객체의 isTemp 태그를 false로 바꾼다. 4-1 . 뒤로 가기나 임시 저장을 눌렀을 때는 isTemp를 true로 설정하고 저장한다. 5. 30일이 지날 때마다, Post에 있는 isTemp를 통해 임시 여부를 확인하여 임시 저장된 글을 삭제하고, S3에서는 수명 주기를 설정하여 태그를 기반으로 true인 이미지들을 삭제한다. 객체를 삭제하는 이유는 불필요한 데이터가 공간을 차지하는 것이 별로라고 판단했습니다. UUID는 글을 다 쓰기도 전에 서버로 쏘기 때문에, 어떤 게시글에서 쓰였는지 확인하기 위해서 사용했습니다. 성능이나 용량 면에서 안 좋다고 하지만, 이는 데이터를 넣어 놓고 조회를 하여 성능을 확인하였고 현재 프로젝트 크기를 생각했을 때 접목해도 상관없을 것 같아 넣었습니다. 하지만 이런 식으로 진행하니, 만약 사용자가 중간에 이미지 링크를 삭제한다면? 이라는 시나리오를 생각했을 때 이를 대처할 방도가 떠오르지 않습니다. 다른 분들은 어떤 식으로 처리했는지, 제가 너무 어렵게 생각하고 짜는지 궁금합니다.
개발자
#spring-boot
#s3
#게시글
답변 1
댓글 0
조회 69
7달 전 · An 님의 질문
solr 검색 엔진 설정
solr 설정하는 xml 파일 내에 검색어를 있는 그대로 검색해서 나올 수 있도록 설정하는 방법 아시는 분 계신가요...? 지금까진 이리저리 설정을 해봤지만 원하는 식으로 안 먹히네요... ex) "solr 검색 엔진 설정" => "solr 검색 엔진 설정에 대해서...", "solr 검색 엔진 설정이 잘 안되..." 현 문제: ex) "solr 검색 엔진 설정" => "solr", "검색", "엔진", "설정" 따로따로 포함된 게시글 및 내용 전부 검색
개발자
#검색엔진
#solr
#solr설정
#검색
#검색엔진설정
답변 0
댓글 0
조회 14
9달 전 · Supernova 님의 새로운 답변
커리어리 개발툴은 뭘로 만들어졌을까요, 서버 최적화 방법 질의
커리어리 웹뷰는 뭘로 만들어졌나요 ? 우연히 커리어리를 알게 되어서 사이트를 구경하던중 글 남깁니다. 저는 올해 40세이고 취미로 코딩을 배우면서 현재는 메타의 threads 와 비슷한 웹뷰를 만들고 있습니다. 독학으로 배우다보니 깊이가 없어서 한계에 직면해 있는거 같아요. 커리어리에서 스크롤을 내리다보면 딜레이 없이 페이지들이 거의 무한으로 내릴 수 있던데 기술적으로 그게 참 궁금하고요. 게시글을 포스트 했을때도 거의 딜레이 없이 게시물 업데이트가 되더라구요. 저 같은 경우에는 Next JS 로 웹뷰를 구성했고 database 는 vercel neon (무료버전. 서버는 싱가폴위치) Image 는 uploadthing (100GB 유료걸제 10$. 서버는 한국) 게시글 post 시에 단순 텍스만 입력을 하더라도 업로드 되고 화면에 뿌려지는데 2~3초의 딜레이가 발생합니다. database 가 무료 버전에 싱가폴에 있어서 반응이 느린건지 코드 최적화가 문제인지 모르겠습니다. 제가 테스트중인 사이트 주소는 아래와 같습니다. https://newchat-omega-inky.vercel.app/ 게시글 업로드 속도만 높일 수 있다면 정말 좋을 거 같은데 뭔가 벽에 막힌거 같습니다 ㅜㅜ
개발자
#커리어리-개발툴
#서버최적화
답변 1
댓글 0
조회 95
일 년 전 · 이상래 님의 새로운 답변
사용자 식별을 프론트에서? 백에서?
보통 게시글을 작성하게 되면 수정 삭제 버튼은 게시글 작성자만 보이도록 하는게 일반적인 서비스에서 많이들 보이는 방식인데, 이럴 경우 게시글 작성자인지 식별은 보통 어떻게 하는게 올바른가요? 백엔드에서 식별하고 Response에 담아야할까요? 아니면 백엔드에서 유저 정보를 끌고와서 프론트에서 식별해야할까요?
투표
개발자
#로직
#사용자
#crud
#프론트
#백엔드
답변 2
댓글 0
조회 509
일 년 전 · aigoia 님의 답변 업데이트
클래스가 너무 커질때
클래스를 기능별로 분리한 후 1. Facade 패턴을 이용해서 하나로 합친다. 2. 컨트롤러 단에서 분리된 클래스를 일일이 주입받아 사용한다. 1번 방법은 컨트롤러에서 쓰기 간편하니 좋지만, 하나로 합쳐진 클래스가 여러 책임을 지게 될까봐 걱정되고. 2번 방법은 컨트롤러 메서드 적을 때 이 클래스 저 클래스 다 끌어와야 해서 걱정됩니다. 스프링 공부하면서 간단한 게시판 만들고 있습니다. 조회 방식이 좀 다양해서 조회 관련 메서드만 14개가 나왔는데 등록, 수정, 삭제까지 합치니까 하나의 클래스에 담기에는 너무 무거워보입니다. 조회는 따로 떼어놓으려고 하는데 게시글 관련 클래스가 3개가 돼버려서 그 클래스를 대신 호출해줄 클래스를 두려고 합니다. 뭔가 해결책이 찝찝한데 좋은 방법 없을까요?
개발자
#java
#spring
#web
#design-pattern
답변 1
댓글 0
조회 65
일 년 전 · 박근석 님의 질문
게시글 조회수 증가 방법에 대한 고민
안녕하세요! 커뮤니티 서비스를 개발하면서 조회수 증가에 대한 로직에 대한 고민이 생겨 이렇게 글을 작성하게 되었습니다. 현재 Redis를 활용하여 게시글 조회에 대한 카운팅을 수행하고 이를 일정 주기마다 DB에 반영하도록 했는데 이렇게 되면 조회수를 실시간적으로 사용자에게 보여주지 못하는 구멍이 생겨 이를 보완하고자 다음 두가지 방법을 고려해봤습니다. 1. 현재 설정한 주기보다 더 빠르게 반영하도록 해서 비교적 실시간과 가까운 결과를 반영한다. 2. 게시글 조회수에 대한 정보가 필요할 때 마다 Redis에 저장된 카운팅을 가져와 이를 더한 값을 반환해준다. 입니다. 개인적으론 조회수가 정말 실시간성이 필요한 부분인가에 대한 고민도 있고, 현업에서는 이와 같은 부분들을 어떻게 해결해나가는지 궁금하기도 합니다!! 마지막으로 긴 글 읽어주셔서 감사합니다 😀
개발자
#백엔드
#개발고민
#redis
#db
답변 0
댓글 0
조회 127
일 년 전 · 익명 님의 질문 업데이트
PostLike 테이블에서의 JPA 관계 설정 (Web, Spring, JPA)
Post 테이블 (Long pno, String cotent) UserInfo 테이블 (String uid, String nickname) PostLike 테이블 (Long pno, String uid) Post에 대한 좋아요 정보를 PostLike테이블에서 관리하고 있습니다. 여기서 PostLike 엔티티를 정의할 때 1) UserInfo userInfo, Post post를 @ManyToOne으로 관리할지, 2) 아니면 그낭 Long pno, String uid로 관리할지 고민입니다. 1번 방법) 장점 : Post, UserInfo를 delete 할때 알아서 관련된 좋아요 정보를 찾아서 삭제해준다는 면에서 무결성 관리가 편함. 단점 : JPA는 where pno=(삭제하는 게시글 id)처럼 쿼리 한 번으로 삭제하지 못 한다. 먼저 PostLike 테이블에 pno가 삭제 게시글 id와 같은 것들이 무엇이 있는지 확인하고, 해당 id에 해당하는 row를 deleteById로 하나하나 삭제하기 때문에 쿼리가 N+1 필요해서 성능 이슈가 생긴다. 2번 방법 ) 장점 : 성능 문제가 해결된다. 쿼리 한 번으로 게시글 혹은 유저를 삭제했을 때 관련 좋아요 정보를 삭제할 수 있다. 단점 : 무결성 관리를 직접 해줘야 해서 프로그래머가 신경써서 관리해야 한다. ◼️ 질문 1 1번 방법과 2번 방법 중에서 2번 방법을 선택하려고 합니다. Trade off를 제대로 한 게 맞을까요? Post와 Comment에서는 @ManyToOne을 사용하고, Follow나 PostLike에서는 @ManyToOne을 사용하지 않는 것이 제멋대로인 것 같아서 고민입니다. ◼️ 질문 2 유저를 삭제할 때 해당 유저가 좋아요를 누른 기록을 유지하는 것이 좋을까요, 삭제하는 것이 좋을까요? 요구사항에 따라 달라진다는 것은 알지만 그래도 일반적으로 사용되는 방법이 궁금합니다.
개발자
#spring-boot
#jpa
#backend
#web
답변 0
댓글 0
조회 33
일 년 전 · 익명 님의 새로운 댓글
springboot 테스트코드 작성 방법
테스트코드에 관해 공부하게되었습니다. 정해진 답은 없는 것 같은데 잘못 이해하고 사용하고 있다는 생각이 들어서 질문 글을 올리게 되었습니다. 선배님들의 도움이필요합니다. 유저와 게시글 entity가 있고 게시글을 생성하는 기능을 controller service repository 로 작성했습니다. 1. 단위테스트를 작성할때 mock을 사용하여 Service.save 메서드에 대해 any()와 같이 저장할 객체와 저장된 객체를 제가 직접 지정하다보니 끼워맞춰서 성공을 받아내는 느낌이 강해서 어떻게 사용해야 하는지 궁금합니다. 2. 여러 글들을 읽어보고 고민해보니 Service.duplicate와 같이 이메일 중복체크와 같은 예외가 발생하는 것은 단위테스트로 작성하고 나머지 즉, crud와 같이 DB를 사용해야하는 기능은 controller 통합테스트를 작성해서 확인해야할 것 같은데 맞는 생각인지 궁금합니다. 3. controller 통합테스트에서 update와 같이 의존성이 많이 엮여있을 때 작성방법이 궁금합니다. 제가 생각한 바는 아래와같은데 어디까지 직접생성해주어야 할까요.. - 사용자를 저장하고 게시글도 저장한다. - 게시글을 읽어와 사용자가 게시글의 작성자인지 확인한다 - 게시글을 수정한다 - 수정된 게시글에서 빈 값은 없는지 등 유효성 검사를 하고 게시글을 저장한다 - 다시 게시글을 읽어와서 정상적으로 수정되었는지 확인한다. 아직 부족한것이 많아 단어사용이나 방식이 정말 바보같을 수 있는 부분 양해부탁드립니다. 긴 글 읽어주셔서 감사드립니다. 마지막으로 혹시 참고할 만한 springboot 테스트 코드나 책 또는 강의가 있다면 알려주시면 좋겠습니다. 정말 감사드립니다.
개발자
#spring-boot
#spring
#spring-data
#testcode
#tdd
답변 1
댓글 1
추천해요 19
보충이 필요해요 1
조회 2,419
일 년 전 · 박정환 님의 새로운 답변
비개발 회사에서의 물경력
안녕하세요, 저는 현재 비개발 회사에서 신입 프론트엔드 엔지니어로 근무하고 있습니다. 제가 커리어리에 게시글을 올리게 된건 '물경력' 과 '진로' 에 대한 고민 때문입니다. 현재 직장은 개발로 사업을 이어 나가는 기업이 아닙니다. 그래서인지 이렇다 할 서비스 조차 없습니다. 당연하게도 저에게 주어지는 업무도 없습니다. 일이 적다거나 하는게 아니라 아예 '0' 입니다. 한 달 넘게 출근을 해서 할 일이 없기에 개인적으로 공부를 하고 있습니다만, 아무래도 회사이다 보니 눈치가 보이기 마련이고, 이젠 '내가 여기 앉아서 도대체 뭘 하고있나?' 라는 생각 뿐입니다. 팀장님께서도 일이 없다는건 알고 계십니다. 일이 없을 땐 공부를 해도 괜찮다고 말씀하시지만, 저는 이렇게 공부만 할거면 차라리 퇴사를 하고 마음편히 집에서 하는게 좋을 것 같다는 생각입니다. 벌써 입사한지 5개월 차가 되어가는데, 배우는 것은 없고 시간은 흘러만 가는데 실력은 그대로 입니다. 3월 부터 이직을 위해 이력서를 돌리고 있으나 넣는 족족 떨어지기만 해서 자존감도 점점 바닥을 찍고 있습니다. 서류부터 탈락만 하니 이직을 위해 어떤걸 더 준비해야 하는지도 모르겠습니다. 팀 프로젝트만 5개를 했고, 오픈소스에도 기여하고 있고 .. 프론트엔드 시장에서 언급되는 기술은 한 번 씩 다 써본 것 같습니다 .. 신세 한탄이 너무 길었네요, 결론은 개발 선배님들의 조언을 듣고싶습니다. 저는 앞으로의 진로를 위해 어떤걸 더 준비해야 할까요? 지금 회사에서 시간만 떼우느니 퇴사를 하고 처음부터 시작한다는 마음으로 다시 준비하는게 좋을까요 ..?
개발자
#이직
#물경력
답변 1
댓글 0
조회 207
일 년 전 · 익명 님의 새로운 댓글
nextjs 서버사이드 데이터페칭 질문입니다.
안녕하세요. 다른분들의 고견을 여쭙고자 합니다. next에서 app라우트 방식을 이용해서 개발을 진행하고 있는데요 좋아요한 게시글을 불러오는데. 속도를 위해서 서버사이드에서 불러와서 클라이언트 사이드에 뿌려주는데요. 클라이언트 사이드에서 좋아요 버튼을 누르면 -> 좋아요 데이터를 파이어베이스 서버에 저장 -> 좋아요 페이지에서 확인 -> 업데이트가 안됩니다. 그도 그럴것이 서버사이드는 업데이트가 되지 않기 때문이고 새로고침을 해야만 하기 때문이라고 생각합니다. 초기값을 서버사이드에서 불러온후에 그 후의 데이터들은 recoil로만 관리한다? 이런것도 아닌것 같구요. 이 문제를 해결할려면 초기데이터를 불러오는것 부터 전부다 클라이언트 사이드에서 해야만 하는 것 일까요? 이 문제를 해결할려면 tanstack-query를 사용해야할까요? 모르는점이 많네요. 아시는 내용이있으시면 답변주시면 너무 감사하겠습니다.
개발자
#next.js
#react
#tanstack-query
답변 3
댓글 3
조회 216
일 년 전 · 익명 님의 질문
next.js에서 interceptor 어떻게 사용하고 계신가요?
안녕하세요 page router 형식으로 프로젝트 진행 중 궁금한게 있어 게시글 남깁니다. 현재 프로젝트에서는 두가지 AJAX 요청이 존재하는데요. 한가지는 클라이언트 사이드에서의 요청(좋아요 누르기 기능 등)과 서버 사이드 렌더링을 위한 getserversideprops에서의 요청입니다. 문제는 인증 방식으로 엑세스토큰을 사용중인데 axios interceptor을 사용하려고 보니 하나의 interceptor로 두가지 요청을 커버하기가 어렵겠더라구요. 혹시 비슷한 경험이 있으신분들 어떻게 사용하셨는지 공유해주시면 감사하겠습니다.
개발자
#react
#next.js
답변 0
댓글 0
보충이 필요해요 1
조회 120
일 년 전 · 익명 님의 새로운 댓글
신고 게시글 안 보이도록 하는 기능 질문드립니다
안녕하세요! 현재 진행 중인 사이드 프로젝트에서 게시글 신고 기능을 구현하고 있습니다. 1. 게시글이 누적 신고를 받으면 모든 유저한테 안 보입니다. 2. 유저가 특정 게시글을 신고했을 때 해당 유저한테는 신고한 게시글이 안 보입니다. 1번의 경우에는 신고가 될 때마다 count를 해서 일정 횟수 누적이 되면 해당 게시글을 soft delete를 합니다. 2번의 경우에는 게시글 조회 시 신고 테이블을 outer join 해서 해당 유저가 신고하지 않은 게시글만 조회합니다. 신고 특성상 순간적으로 발생하는 경우가 많을 것 같아서 redis를 사용해볼까 하는 생각도 드는데 조언, 피드백 좀 주시면 정말 감사하겠습니다!
개발자
#spring
#jpa
#mysql
답변 1
댓글 1
조회 125
2년 전 · 이석운 님의 질문
AWS S3 이미지 파일을 삭제하고싶습니다.
안녕하세요. 현재 사이드프로젝트로 개발중인 기능중에서 본문에 이미지(S3 URL)를 HTML 이미지 태그로 삽입하여 작성되는 게시판성 기능이 있습니다. 이런 방식으로 개발하다 보니 게시글 수정 시 실제 사용하지 않는 사진과 사용하는 사진을 구분 짓기가 어렵더라구요. 제가 생각했던 방안은 현재 S3에 이미지를 업로드할때 생성되는 테이블 PK값과 URL주소를 json형태로 프론트에 전달해준후에, 실제 사용하는 이미지 정보만 다시 json형태로 서버로 전달하는 방식인데요. 혹시 현업에서는 이러한 기능을 개발할때 어떤 방식으로 개발되는지 이야기를 듣고싶습니다.
개발자
#spring
#jpa
#aws-s3
답변 0
댓글 0
조회 103
2년 전 · 장성호 님의 답변 업데이트
게시글과 첨부파일의 DB 구조
안녕하세요 궁금한게 있어서 질문을 드립니다. 게시글이랑 첨부파일의 Database 구조에 대해서 궁금한게 있어서요 하면서도 잘 모르겠어서요 -----1번 구조----- 게시판 테이블 게시판 아이디(PK) 파일 아이디(FK) 파일 테이블 파일 아이디(PK) 파일 경로 -----2번 구조----- 게시판 테이블 게시판 아이디(PK) 파일 테이블 파일 아이디(PK) 게시판 아이디(FK) 파일 경로 제 친구는 1번으로 짯는데, 2번으로 해도 되는데 굳이 1번으로 짠 이유가 무엇일까요? 제가 생각하기에는 게시판을 눌러서 PK로 연결되어있는 파일들을 한번에 조회 할 수 있으니까 1번 구조가 유리하다고 생각해서 1번으로 짯나? 했구요. 2번으로 보자면 게시글 1 : 파일 N 이니까 일대다 구조로 각 게시판에 대해서 여러 파일 정보를 가질 수 있고, 보통 한 게시글에는 여러개의 파일이 들어가니까 한 파일이 여러 게시글에 사용되지 않는다는 가정에는 2번이 효율적인것 같거든요 보시는 분들께는 간단한 문제 일수도 있는데 힌트라도 부탁 드립니다 ㅠㅠ
개발자
#database
##mysql
#mariadb
#@oracle
답변 2
댓글 0
조회 518
2년 전 · 김도열 님의 답변 업데이트
웹 백엔드) Bcrypt를 이용하여 암호화 시 비밀번호 검증
사용중인 라이브러리: Express.js bcrypt mongoose 현재 진행중인 사내 웹 프로젝트내에 게시판을 만들려고 하는데 DC인사이드 처럼 게시글마다 비밀번호를 설정하도록 기능구현을 한 상태입니다. 비밀번호는 bcrypt를 이용해서 암호화를 진행했고 수정이나 삭제를 할 땐 비밀번호 검증 후 수정/삭제가 이뤄지도록 구현하고 있습니다. 패스워드가 bcrypt로 암호화되어 있기 때문에 수정의 경우 1. request body에 비밀번호를 보내서 백엔드에서 bcrypt.compare() 2. 비밀번호가 일치할 시 해당 게시글의 데이터를 response 3. response에서 받은 데이터를 기반으로 프론트 수정페이지에 보여준다음 4. 수정페이지 내용을 다시 PUT요청으로 수정하도록 구현되어 있습니다. 이 과정에서 API가 1. 비밀번호 검증용(GET) 2. 게시글 수정용(PUT) 이렇게 두가지가 필요한 상황이 되었는데, 비밀번호 검증 GET에서 질문이 생겼습니다. 기본적으로 GET과 DELETE요청은 request body를 가지지 않는게 규칙이라고 배웠습니다. 하지만 request body를 가지는 POST와 PUT은 그 의미가 생성/수정이라고 이해하고 있습니다. 그렇다고 비밀번호를 URL에 Query Params로 보내자니 보안상 문제가 되지않을까 걱정이 되구요... 1. GET 또는 DELETE요청에 request body를 포함하여 보낸다. - 현재 사용중인 방식이고 앞서 말한 규칙 때문에 수정을 고민중이며 구현, 사용상에 문제는 없었습니다. 2. POST 또는 PUT요청에 request body를 포함하여 보낸다. - 현재 고려중인 방식이고 의미적인 문제가 없다면 이렇게 사용하려고 합니다. 개발 자체를 공부해본지 얼마안된 개발어린이라 제 상식외의 문제가 발생하면 대처하기가 어렵네요..ㅜㅜ 위에 제시한 1, 2번 방법중 어떤게 더 Best Practice에 가까울까요? 더 좋은 방법이 있다면 의견도 제시해주시면 너무 감사하겠습니다. <(__)>
개발자
#express.js
#bcrypt
#node.js
답변 3
댓글 3
조회 101
2년 전 · 문정동개발자 님의 답변 업데이트
nextjs에서 서버 컴포넌트 클라이언트 컴포넌트 분리하는 방법
안녕하세요. 현재 nextjs를 기반으로 커뮤니티 사이트를 만들고 있습니다. SEO를 가장 중요한 요소로 고려하여 개발하려고 하는데 홈, 게시글 리스트, 게시글 상세 페이지, 마이 페이지, 설정 페이지 등 여러 페이지 중에 어떤 것까지 SEO를 신경써야 할까요? SEO가 중요한 페이지는 반드시 서버 컴포넌트 위주로 개발하는 게 유리하다면 관련 기술의 키워드가 있을까요? 요즘 prefetching이나 hydrate 관련된 내용을 찾아보고 있는데 방향성이 맞는지 궁금합니다..!
개발자
#react
#next.js
답변 1
댓글 0
조회 347
2년 전 · 이상선 님의 새로운 답변
요즘 가장 핫한 IT키워드가 무엇일까요?
안녕하세요 SSAFY PT 면접을 준비하고 있는데요! 면접에 주로 요즘 가장 핫한 IT 키워드에 대한 내용들이 나온다고 하더라구요. 혹시 요즘 가장 핫한 IT키워드는 무엇이며, 해당 내용에 관해 참고할만한 기사나 게시글같은것 알려주시면 너무나 감사드리겠습니다
개발자
#it
#pt
#면접
답변 1
댓글 0
조회 144
2년 전 · 김대현 님의 답변 업데이트
스프링부트에서 쿠키를 활용하여 조회수 확인
스프링부트 프로젝트에서 게시글 및 페이지 방문자 카운팅시쿠키를 사용하려고 합니다 질문1: 처음에는 세션을 사용했지만, JWT로 로그인한 경우 세션이 초기화되어 방문한 게시글의 ID를 제대로 불러오지 못하는 문제가 발생하여 쿠키로 전환했습니다. -> 왜 로그인한 경우에 세션을 제대로 못 불러오는지 궁금합니다. 질문2: 방문한 게시글은 3시간 후에 다시 증가할수 있도록 하려고 합니다. 각 게시글의 수만큼 쿠키를 생성하여 maxAge로 확인하는 방법은 비효율적으로 느껴집니다. 그래서 한 쿠키에 여러 게시글의 ID를 배열로 넣어 확인하려고 합니다. 이때는 각 게시글의 시간 확인에 어떤 방법을 사용할 수 있을까요? 감사합니다!
개발자
#springboot
#cookie
#session
#visit-count
답변 1
댓글 0
추천해요 1
보충이 필요해요 1
조회 703
2년 전 · 익명 님의 새로운 댓글
게시글 필터링 백엔드가 낫나요 프론트가 낫나요
안녕하세요 개발중에 게시글 페이지를 만들고 있는데, 필터가 총 3개입니다. 1. 카테고리 (전체, IT, 교육, 문화) 2. 완료여부(전체, 진행중, 완료) 3. 정렬 (최신순, 포인트 순) 이 3개를 구현해야하는데, 방법이 1. 프론트 처리 프론트에서 모든 데이터를 받아온 뒤에, js에서 필터링해서 데이터 넣어주기 2. 백엔드 처리 백엔드에서 데이터 처리한거를 버튼 누를 때마다 axios를 통해서 받아오기 1번은 통신비용은 줄이지만 초기랜더링이 많이 느린 것 같습니다. 2번은 통신비용은 늘지만 초기랜더링은 빠른것 같습니다. 그 외에 장단점도 알려주시면 좋을 것 같습니다 그리고 추가로.. 2번 방법을 했을 때, 클릭시 param을 백엔드에 넘겨서 필터링 처리하고 싶은데 그러면 /board/filter?category='IT' & status='complete' & sort('point') 이런식으로 넘기려는데 뭔가 너무 비효율적인 것 같아서 효율적인 방법이나 일반적으로 많이 사용하는 방법 알려주시면 감사할 것 같습니다
개발자
#필터링
#react
#axios
#통신
답변 2
댓글 7
추천해요 5
조회 2,059
2년 전 · 코딩하는기린 님의 답변 업데이트
백엔드 좋아요 기능 구현 궁금점
안녕하세요 사이드 프로젝트에서 게시글에 대한 좋아요 기능을 논의하던 중 궁금한 점이 생겨서 이렇게 질문을 하게 됐습니다. 제가 고민하고 있는 구현은 두 가지 방식입니다. 첫 번째: 좋아요 API와 좋아요 취소 API를 각각 만들어둡니다. 클라이언트에서 서버에게 게시글 리스트 조회 API를 호출하면 각 게시글 필드에 좋아요 여부를 담아두고, 상황에 맞게 서버에게 좋아요 or 좋아요 취소 API를 호출합니다. 두 번째: 좋아요가 되거나 취소되는 기능이 묶인 API 한 개를 만들고 클라가 해당 API를 호출 했을 때 서버에서 데이터베이스를 확인한 후 이미 좋아요를 한 게시글이면 취소 로직을 실행하고, 좋아요를 한 적이 없으면 좋아요 등록 로직을 수행하는 API를 만듭니다. 개인적으로 생각해 봤을 때 첫 번째 방식이 API 하나 하나의 동작이 명확하고, 무분별한 API 요청에도 더 안전할 것 같다고 생각했으나, 다른 분들의 생각도 궁금해서 이렇게 질문을 올리게 됐습니다.
개발자
#backend
#좋아요
답변 4
댓글 1
추천해요 3
조회 1,563
2년 전 · 사라 님의 새로운 답변
Spring URL에 따라 css가 적용이 되지 않습니다.
게시판 프로젝트를 진행중인데 특정 url로 매핑할때만 css가 적용이 되지않습니다. 게시글을 작성하는 페이지 url를 /articles/new 로 하면 css가 전혀 적용되지않고, /articles-new 로 하면 css가 적용됩니다. 원래 이런가요..? 도대체 뭐가 문제인지 모르겠습니다..
개발자
#spring
#java
#jpa
답변 2
댓글 0
보충이 필요해요 2
조회 80
2년 전 · 김현진 님의 답변 업데이트
[리액트] 코드를 저장하고 웹을 보면 제가 원하는 결과가 안 뜨다가 , 코드를 다시 수정하고 저장하면 그제서야 원하는 결과가 나와요 ㅠㅠ
제목이 좀 어수선한 것 같은데 .. 다시 한 번 설명을 드리자면, 게시글 리스트를 만드는 중입니다. 제가 팔로우한 사람들의 게시글을 불러오기 위해 following API를 사용하여 사람들의 리스트를 불러오고, 그 리스트를 게시글을 불러온느 API를 사용하여 map을 돌렸어요. 그리고 코드를 저장한 후에 웹을 실행 시켜보면 '등록된 상품이 없습니다.' 라고 뜹니다. 하지만 다시 코드를 수정하고 저장하면 (수정의 예는 그냥 세미콜론을 없앤다거나, 주석을 없앤다거나 코드에 영향이 없는 수정입니다!) 제가 원하는 게시글 리스트가 웹에 결과로 나타납니다 ㅠㅠ 도대체 이게 무슨 일일까요..? 렌더링의 문제인가요? 사진에서 const page 부분이 return부분입니다
개발자
#react
답변 1
댓글 0
조회 448
2년 전 · 권혁진 님의 새로운 답변
(react redux) api 데이터 사용 질문
안녕하세요! api를 활용해서 데이터 받아와서 게시판형태로 list로 뿌리고 게시글 누르면 본문보이는 간단한 형태의 게시판을 만들어보는중 입니다. api를 이용해서 가져오는 함수를 재사용하고싶은데 잘안되네요.. list페이지에서 데이터 전부받아오기위해서 axios로 값을 받아와서 뿌리고, 게시글 누르면 넘어오는 id값으로 디테일페이지를 보려고하면. 또 다시 디테일페이지에서 axios로 api에 접근해서 값을 가져와야하나요? 서칭을해봤는데 다들 그냥 페이지마다 비동기로 값을 받아오는거같은거같은데 재사용보다 매번받아오는게 옳은건가요? redux를 학습하고싶어서 해보는데 잘안되네요..
개발자
#react
#redux
#redux-toolkit
답변 2
댓글 0
추천해요 1
조회 86
2년 전 · 익명 님의 질문 업데이트
상품 등록 - 키워드 알림 구현하는 방식에 대한 조언을 부탁드립니다!
안녕하세요! 일단 저는 비개발 직군인 그로스 PM 입니다 :) 저희 앱서비스는 React Native 프레임워크에 Node.js 언어를 사용 중인데요! 유저 간에 서로 상품을 거래할 수 있는 서비스입니다. 유저가 키워드 알림을 등록해 놓으면 -> 해당 키워드가 포함된 제목을 가진 상품 게시글이 등록되었을 때 푸시 알림을 보내고 싶습니다. (User ID - Keyword 테이블 구성 필요) 그런데 문제는 상품 게시글이 등록될 때마다 유저-키워드 테이블을 검사하면 서버에 과부하가 오지 않을까 하는 걱정이 있습니다. 그리고 현재 저희 서비스에는 Elasticsearch 엔진이 적용되어 있지 않습니다. 지금까지 조사한 바로는, 1. 유저가 키워드 알림으로 등록한 텍스트를 '가변 배열' 안에 넣어 둔다. 2. 상품 게시글이 등록될 때, 타이틀 텍스트 정보만 'Notification Center'에 등록한다. 3. 키워드가 들어 있는 가변 배열의 요소를 돌면서, 어떤 키워드가 Notification Center를 통해 받은 텍스트 속에 있는지 확인한다. 4. 해당하는 키워드가 발견된다면 매칭되는 유저에게 푸시 알림을 보낸다. 제가 '가변 배열'과 'Notification Center'에 대한 이해가 부족하다보니, 이렇게 하면 서버 과부하 문제가 좀 덜어지는 게 맞는지 판단이 어렵습니다... 혹은 작업을 백그라운드에서 하는 방법도 있는 것 같은데요, 게시글이 발행되었음을 알리는 이벤트를 생성한 다음, 백그라운드 작업(큐 or 스케줄러)에서 해당 이벤트를 가져와서 처리합니다. 이렇게 하면 서버 부하가 완화되고 알림 전송 시간도 최적화할 수 있다고 합니다. 개발자 분들의 시선에서 납득이 가는 솔루션일까요?! 혹은 더 간단한 방법이 있는지 알려주셔도 좋을 것 같습니다. 긴 글 읽어주셔서 감사합니다 :)
개발자
#react-native
#node.js
#app-dev
답변 0
댓글 0
추천해요 1
조회 385
일 년 전 · 정연준 님의 질문 업데이트
프론트엔드 개발자를 지망하는 취준생인데 이력서에 뭐가 부족한 것일까요?
5월 19일에 국비 부트캠프를 수료한 후 현재까지 5개월 동안 구직 활동을 하고 있는 취준생입니다. 현재까지 100군데 넘게 스타트업, 중소, 중견, 대기업 가리지 않고 다 지원했는데 면접은 커녕 서류 통과가 되는 곳이 한 군데도 없습니다. 취업에 먼저 성공했던 동료 취준생과 디스코드의 개발자 커뮤니티를 통해 이력서를 수정하고 있는데 현재 맞게 진행되고 있는지 긴가민가 합니다. 그래서 여기 계시는 현직자 분들한테 피드백 요청드리고자 합니다. 가감없는 솔직한 평가 부탁 드리겠습니다. 1. 이력서 제목: '이력서 | 안녕하세요, 정연준입니다!' -부족해도 멈추지 않는 개발자 -아는 것과 모르는 것을 구분할 줄 아는 개발자 2. 자기 소개: `안녕하세요, 신입 React 프론트엔드 개발자 정연준입니다. -시행 착오를 통해 성장해나갑니다. -잘하는 것과 부족한 것을 구분하여 잘하는 것을 부각시키고, 부족한 것을 채울려고 노력하는 개발자가 될려고 합니다. -좋은 서비스와 더불어 사용자가 편하게 이용할 수 있는 서비스를 만드는 것을 목표로 하고 있습니다. ` 3. 개발 직무: 프론트엔드 개발자 4. 프로젝트: -기간: 2023.04.17 ~ 2023.05.19 -서비스 제목: One-Line -한 줄 요약: AI모델이 사용자가 작성한 게시글을 한 줄 요약 및 제목 생성 -프로젝트 종류: 팀 프로젝트 -역할: 프론트엔드 파트(메인 페이지 게시글 목록 전체 조회, 인증 페이지 구현) *메인페이지 게시글 목록 전체 조회 1) Trending 섹션 2) Recent Posts 섹션 *메인 헤더(Global Navigation 메뉴) *인증 페이지에 Firebase Authentication 기능 적용 5. 교육 이력: -기간: 2022.11.28 ~ 2023.05.19 -주관 기관: 엘리스 -교육 프로그램 이름: 엘리스 AI트랙 6기 -학습한 기술 스택: React, Express.js, MongoDB, HTML5, CSS3, JavaScript, GitLab, Python, MySQL, TensorFlow, Pandas, Node.js -세부 사항 *JavaScript 1) JavaScript 기초 2) 싱글 스레드, Event, Promise 개념 숙지 *React 1) React 기초 *Express.js 1) Express.js 기초 *MongoDB + Mongoose 1) DBMS 기초 2) MongoDB, Mongoose 기초 *데이터 분석 1) Python, SQL 기초 2) Pandas 기초 *인공지능 1) 데이터 과학 기초 2) 이미지 처리 기초 6. 링크 -프로젝트 링크: https://10team.vercel.app/ -프로젝트 시연 영상: https://drive.google.com/file/d/16Qni0swyC8HbAY2iqnEy5QWze9ianjln/view?usp=sharing -개인 블로그: https://chadolbaegi128.tistory.com/
개발자
#프론트엔드-취준
#react
#javascript
답변 3
댓글 5
추천해요 7
보충이 필요해요 1
조회 2,286
2년 전 · 오승우 님의 질문
React.FC를 사용하지 않는 추세인가요??
평소에 React와 Typescript를 사용하여 개발할 때 React.FC<T> 형식으로 타입을 정의하고 개발합니다 그런데 몇개의 게시글을 보다보니 요즘은 React.FC를 지양하는 추세라고 하더군요.. 개발 특성상 정해진 루트가 없다보니..여러분들은 보통 어떤식으로 작성하시나요??
개발자
#react
#typescript
답변 0
댓글 0
조회 171
2년 전 · 박범수 님의 답변 업데이트
go 역정렬- sort.Sort(sort.Reverse(sort.IntSlice(a))) 빠른이유???
문득 알고리즘 풀다가 아래의 게시글을 보았습니다 https://jusths.tistory.com/217 역정렬 할때 게시글처럼 진행하면 속도가 빠르다고 하는데 왜 그럴까요? 리터럴 함수로 호출하는게 빠르다고 생각했었습니다만....
개발자
#golang
#sort
답변 1
댓글 0
조회 81