#ts

What Should I Do Here?

I’m at a point in my career where I’m seriously considering making a switch to a field I’m genuinely passionate about. The problem is it’s not the most financially secure or socially validated option. On the other hand, my current job is stable and pays well, but I don’t feel fulfilled or excited about what I’m doing. I’ve been reading stories about people who took the leap into something they love and ended up thriving, but I also know that not everyone lands on their feet. That makes me hesitate. I have responsibilities and can’t afford to make a reckless decision. So I’m curious how have you personally approached this kind of decision? Have you prioritized your passion or stuck with a practical choice? Or did you find a way to do both? What factors helped you make your decision, and what do you wish you knew earlier? I’d really appreciate any honest insights, lessons learned, or even regrets. I think hearing real experiences from others in the community would help me (and maybe others here too) gain perspective. Thanks in advance!

react, rn 리스트 엔트리 구현시 원본 리스트를 수정하는 함수 최적화가 고민됩니다..

리스트 A 엔트리 컴포넌트 B A를 수정하는 함수 C 이렇게 있을 때 B에서 A를 수정해야 하는 상황입니다. 모바일 환경이라 최대한 엔트리 B를 최적화 하고 싶은데 memo를 해야할 때 함수C는 어떻게 최적화 해야할까요 A에 선언하면 A의 최신 값을 얻기 위해 C가 변경될 때 마다 B또한 C의 변경에 의해 재렌더링 될 것이니 기존에는 이런 재렌더링을 막기위해 setA( (prevA) => { ... } ) 와 같은식으로 setA 내부의 callback으로 A의 최신값을 사용해서 A를 C의 의존성 배열에 추가하는 것을 피해왔는데 수정시 api의 res data를 사용할 일이 생기니 setState내에서는 async await 사용이 불가능해서 질문드립니다... 바보같은 저에게 단비 같은 가르침을 내려주세요..

이건 어떻게 구현해야할까요?

https://text.tsherpa.co.kr/mid/index.html 랜딩페이지입니다. css 3d 속성들 사용해야할 것 같은데, 드래그도 그렇고 저한텐 어려운게 많네요..ㅠ 인사이트 공유 가능할까요?

프론트엔드 코딩 테스트, 자바스크립트로 준비해야 할까요?

프론트엔드 개발자를 목표로 코딩 테스트를 준비하고 있는데, 현재는 파이썬으로 문제를 풀고 있습니다. 자료구조나 알고리즘에 익숙하고, 구현 속도도 파이썬이 더 편하다고 느껴서 계속 활용해왔어요. 그런데 프론트엔드 직무 특성상, 코딩 테스트도 자바스크립트로 푸는 게 더 나은 선택일지 고민이 됩니다. 실무에서는 JS/TS를 주로 다루게 될 텐데, 코테에서도 관련 언어를 쓰는 게 좋을까요? 현업 기준에서 어떤 방향이 더 효과적일지 조언 부탁드립니다!

리액트 프로젝트에 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) 읽어주셔서 감사합니다!

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 와 송수신 로드를 줄이기 위해서 아이디로만 반환한다던지)

MacBook에서 Windows Docker 서버 접속 시 sudo가 필요한데 원인이 뭘까요?

문제 현재 Windows 데스크톱과 MacBook을 사용 중이며, 두 기기는 동일한 로컬 네트워크에 연결되어 있습니다. - 데스크톱(Windows): 유선 랜(Ethernet)으로 연결 - MacBook: Wi-Fi로 연결 Windows 데스크톱에서 Docker를 이용해 로컬 웹 서버(포트 9000)를 실행 중입니다. 컨테이너는 -p 9000:9000 옵션으로 실행되었으며, 0.0.0.0:9000에서 요청을 받을 수 있도록 설정되어 있습니다. 데스크톱에서는 Chrome를 통해 정상적으로 웹 인터페이스에 접속할 수 있습니다. 그러나 MacBook의 Chrome에서 접속하면 페이지를 찾을 수 없다고 합니다. 이상하게도,,, Chrome을 sudo로 실행하면 페이지가 정상적으로 로드됩니다. 추가 정보 - 데스크톱(Windows)과 MacBook은 같은 서브넷에 속해 있습니다. - 웹 서버는 0.0.0.0:9000에서 요청을 받을 수 있도록 설정되어 있어, 다른 기기에서도 접근 가능해야 합니다. - MacBook에서 nc -zv <데스크톱-IP> 9000을 실행하면 포트가 열려 있음을 확인했습니다. - Python 코드에서 requests.get("http://<데스크톱-IP>:9000")을 실행하면, 일반 실행 시 실패하지만 sudo로 실행하면 정상적으로 작동합니다. - MacBook에는 단 하나의 사용자 계정만 존재하며, 해당 계정은 관리자(Admin) 권한을 가지고 있습니다. - macOS 방화벽은 비활성화되어 있으며 (/usr/libexec/ApplicationFirewall/socketfilterfw --getglobalstate로 확인), sudo pfctl -d로 pf 방화벽을 꺼도 문제가 해결되지 않았습니다. 현재까지 파악한 내용 sudo로 실행하면 정상적으로 동작하기 때문에, 현재 문제는 네트워크 연결 자체의 문제가 아니라 macOS의 보안 정책 또는 네트워크 제한과 관련된 것이 아닐까,, 생각하고 있습니다. 해결하고 싶은 질문 - 왜 Chrome을 sudo로 실행해야만 웹 서버에 접속할 수 있을까요? - 왜 일반 사용자 권한으로 실행한 Python의 requests.get() 요청이 차단되고, sudo를 사용해야만 정상적으로 동작할까요? - macOS에서 일반 사용자 프로세스의 네트워크 접근을 제한하는 정책이 있는 걸까요? 있다면 어떻게 해결할 수 있을까요? 스크립트에 모두 sudo를 붙이면 문제가 해결되긴 합니다만,, 명확한 원인이 궁금합니다. 혹시 비슷한 경험을 하신 적이 있는 분이 계시다면 조언 부탁드립니다! 혹은 힌트 키워드라도 던져주시면 감사하겠습니다!

하루 5분 간편 IT 학습·정보 플랫폼을 기획 중입니다.

안녕하십니까! 1분 1초가 소중한 현대인을 위한 간편 "IT 학습·정보 플랫폼, So - ITsy" 기획 중입니다. 포지션 간 원활한 소통을 돕고, 최신 기술 트렌드를 빠르게 습득하여 업무에 적용할 수 있도록 설계된 서비스입니다. 현재 사용자 피드백을 받고 있으니, 관심 있는 분들은 랜딩페이지를 확인해 주세요. 여러분의 의견이 더 나은 서비스를 만드는 데 큰 도움이 됩니다. 감사합니다 :) https://soitsy.softr.app/

프론트엔드 이직 준비로 어떤 것들을 하는게 좋을까요?

안녕하세요. 경력 2년차 프론트엔드 개발자입니다. 이전에 두 개의 회사에서 프론트엔드 개발자로 일했는데 불행하게도 두 회사 모두 임금체불로 인해 퇴사를 하게 되었습니다. 그래서 이번에는 50인 이상의 규모를 가진 회사로 이직하는 것을 목표로 이직을 준비하고 있습니다. Next.js, React, Typescript @tanstack/react-query, Context API, Recoil Vanilla-extract, emotion, styled-components, tailwind-css, Sass 위와 같은 스킬들을 공부 및 경험해보았고, Vanilla-extract, tailwind-css를 제외한 스킬들은 실제 업무에서도 활용하였습니다. 현재 저는 [1. 코딩테스트, 2. 기술블로그, 3. 개인프로젝트] 를 매일 반복하며 이직을 준비하고 있습니다. 이대로 계속 이직을 준비하면 될지, 아니면 다른 무언가를 더 준비해야할 지, 앞으로의 이직 준비 방향에 대해 알려주시면 감사하겠습니다. 추가로 혹시 이력서 피드백 해주실 수 있는 분 계시면 말씀 부탁드립니다... 서류에서 계속 떨어지다보니 개발자 입장에서 피드백을 꼭 받아보고 싶습니다...!

php + NestJS(Express) 백엔드 개발자를 찾습니다.

안녕하세요  저희 회사에서 php + NestJS(Express) 개발자를 찾고 있는데 적합자를 찾아내기가 쉽지 않아 가입하게 되었습니다. 관심 있으시다면 공고 한 번 봐주셨음 좋겠어요!!!!!! 그리고 저희 기술스택에 맞는 개발자를 찾을 수 있는 팁?이 있으신분들 댓글 남겨주시면 감사하겠습니다 ㅠㅠㅠㅠ https://www.saramin.co.kr/zf_user/jobs/relay/view?isMypage=no&rec_idx=49757484&recommend_ids=eJxVjrkNAzEMBKtxTi6%2FZexCrv8uTPuAowxFg5FG610dTr%2Bo%2Bqq3d8NK7WrBDxltsMeWQSMG87bmEnwwlfBamzTqk6rpav5ZOy3C9yNOGDIoN3YYYmekw0%2FsOXvZINabIqC1mDpDD%2FQk9q2GlxxlkN9V%2BQGdzkCp&view_type=search&searchword=%EB%B9%84%ED%81%AC%EC%BD%94%ED%8D%BC%EB%A0%88%EC%9D%B4%EC%85%98&searchType=search&gz=1&t_ref_content=generic&t_ref=search&relayNonce=4558130b90d1e71342c4&paid_fl=n&search_uuid=c2ac4cf3-f5ad-42fb-9011-3bf856e40282&immediately_apply_layer_open=n#seq=0

현실적인 취업 가능성 조언 부탁드립니다

안녕하세요 지방 사립대 졸업예정인 전공자입니다 우선 제 상황에 대해 말씀 드리겠습니다 학점 평범하고 포폴도 프론트(RN + TS) 하나 백(Java + Springboot) 있는데 둘 다 평범한 CRUD 수준으로 있습니다 자격증은 정처기 sqld 있고 대외활동은 아이디어+구현방안 발표하는 경진대회에서 장려상 받은 것 있습니다 목표는 최대한 빨리 취직해서 경력 쌓는 것입니다 뭔가를 바랄 수준은 아니지만 가능하면 사원 두 자릿수의 수도권 쪽으로요.. 취직이 된 이후에 사이드 프로젝트와 공부하고 싶었던 것들, 어학 등을 준비할 계획입니다 현실적으로 이정도 수준에 취업이 가능한걸까요.. 하려던 것들을 모두 끝내고 하기엔 시간이 너무 오래 걸릴 것 같고 경제적으로도 부담이 되어서 빠르게 취직하려고 합니다 제가 봐도 힘들어보여서 여쭤봅니다 현실적인 조언 부탁드립니다

리눅스에서 많이쓰는 명령어

명령어에 대한 글을 쓰려고 하는데 다들 뭐 많이 쓰는지 궁금합니다! 물론 ssh 이런..거 말구요! 실제로 많이하는 것 궁금합니다 트러블 슈팅이 아무래도 많겠죠? 전 아래 많이 씁니다 devops 네트워크 환경 체크 netstat ss ps 위에처럼 직무 명령어로 한 일 명령어 써주시면 감사하겠습니다!! 여러개도 상관 없어요!

취업 도와주세요 웹 퍼블리셔

현재 웹 퍼브리셔로 구직 중인데 php, google apps script, 그누보드, 카페 24, 리액트, sacss, bootstrap 등을 학습하려고 하는데 뭐 부터 공부 하는게 좋을까요?? 도와주세요 선배님들

개인 프로젝트 피드백 부탁드립니다!! (Next.js + firebase)

안녕하세요! 휴학 중에 개인 프로젝트 한번 만들어봤습니다! 아직 감이 잘 안 잡히다보니 chatGPT에 꽤나 의존했던 것 같습니다. 폴더 구조와 ssr, csr 사용 부분에서 피드백을 받고자 합니다! 또, containers 폴더 안 create 폴더에 있는 RouteChangeListener.tsx를 사용하여 퀴즈를 만들거나 푸는 도중에 현재 페이지를 벗어나려는 움직임을 감지하면 alert 창이 나오도록 설정하였습니다. 제가 생각해봤을 때 페이지가 이동했다가 다시 돌아오는 부분이 비효율적이라고 생각이 들어서 미들웨어나 다른 방법을 통해 해결할 수 있는지 여쭤보고 싶습니다. 감사합니다! 프로젝트 설명 : 퀴즈를 만들고 풀 수 있는 웹페이지 만들어봤습니다! vercel로 배포하였고, PWA 사용하여 모바일에서도 다운로드 가능하게 했습니다! 웹 앱 둘다 가능하지만 웹으로 봐주시는 것을 권장드립니다~!! 프로젝트 기술 스택: Next.js, react-query, zustand, firebase 테스트 아이디: 123@naver.com 테스트 비밀번호: 123123 GitHub 주소 : https://github.com/kmj0973/donquiz Vercel 배포 주소 : https://donquiz.vercel.app/ 따끔한 피드백 주시면 감사드리겠습니다!! 감사합니다!!

Nextjs with tailwind기반 ui라이브러리 질문

프론트엔드 취업전인 학생입니다. Rollup으로 라이브러리 번들 관련하여 질문입니다. 제작 현시점은 사용자가 컴포넌트를 import 하였을때 사용자가 tailwind.config.ts에 node_module경로의 제 라이브러리를 경로를 설정해야 스타일이 적용이 되는상황입니다. 개발자도구 element에는 텍스트상 적용이돼있는데 해당 방법말고는 못찾았습니다. 개발자분들의 좋은의견 부탁드립니다. 아래는 현재 rollup.config.js입니다.

RAG 를 짜는 중에 도무지 어떤 부분이 문제인지 모르겠습니다.

# JSON 파일에서 FAQ 데이터를 로드하는 함수 def load_faq_data_from_json(file_path): with open(file_path, 'r', encoding='utf-8') as f: faq_data = json.load(f) return faq_data # FAQ 데이터 로드 json_file_path = '' faq_data = load_faq_data_from_json(json_file_path) # ChromaDB 클라이언트 및 Embedding 설정 chroma_client = chromadb.Client() # ChromaDB 클라이언트 생성 # 고유한 컬렉션 이름 생성 collection_name = "faq_data_" + datetime.datetime.now().strftime("%Y%m%d_%H%M%S") collection = chroma_client.create_collection(collection_name) # LangChain의 Text Splitter 설정 text_splitter = RecursiveCharacterTextSplitter( chunk_size=512, chunk_overlap=50 ) # OpenAI 임베딩 설정 openai_api_key = '' embedding_function = OpenAIEmbeddings( model="text-embedding-ada-002", openai_api_key=openai_api_key ) # 텍스트 스플리팅 및 임베딩 생성 함수 def split_and_embed_text(text): splitted_texts = text_splitter.split_text(text) print(f"Splitted texts: {splitted_texts}") try: # OpenAIEmbeddings는 embed_documents를 사용합니다. embeddings = embedding_function.embed_documents(splitted_texts) except Exception as e: print(f"임베딩 생성 중 오류 발생: {e}") return None # 임베딩이 제대로 생성되었는지 확인합니다. if embeddings is None or len(embeddings) == 0: print("임베딩 생성 실패") return None # 임베딩을 numpy 배열로 변환 embeddings = np.array(embeddings) print(f"Embeddings shape: {embeddings.shape}") # 임베딩 벡터의 차원을 확인하고 처리합니다. if embeddings.ndim == 1 and embeddings.shape[0] == 1536: # 임베딩이 1차원 배열이고 길이가 1536인 경우 final_embedding = embeddings elif embeddings.ndim == 2 and embeddings.shape[1] == 1536: # 임베딩이 2차원 배열이고 두 번째 차원이 1536인 경우 final_embedding = np.mean(embeddings, axis=0) else: print("임베딩 벡터의 차원이 예상과 다릅니다.") return None print(f"Final embedding shape: {final_embedding.shape}") return final_embedding # FAQ 데이터를 Vector DB에 저장 def store_faq_data_in_vector_db(faq_data, collection): for faq in faq_data: # 'question'과 'answer'가 있는지 확인하고, 'answer'가 None이 아닌지 확인 if 'question' not in faq or 'answer' not in faq or faq['answer'] is None: print(f"누락된 'question' 또는 'answer'로 인해 항목을 건너뜁니다: {faq}") continue # 다음 항목으로 넘어감 # 텍스트 스플리팅 및 임베딩 생성 question_embedding = split_and_embed_text(faq['question']) if question_embedding is None: print(f"Embedding generation failed for question: {faq['question']}") continue # 임베딩이 없으면 다음 질문으로 넘어감 print(f"Generated embedding for question '{faq['question']}': {question_embedding}") # 각 질문에 고유한 ID 생성 faq_id = str(uuid.uuid4()) # 메타데이터에서 None 값을 제거 metadata = {k: v for k, v in {"answer": faq['answer']}.items() if v is not None} # Vector DB에 저장 collection.add( documents=[faq['question']], metadatas=[metadata], ids=[faq_id], embeddings=[question_embedding] ) # 추가 후 임베딩 확인 (저장된 후 곧바로 확인) stored_results = collection.get(ids=[faq_id], include=["embeddings"]) if stored_results['embeddings'] is not None and len(stored_results['embeddings']) > 0: print(f"Embedding for question '{faq['question']}' successfully stored.") else: print(f"Failed to store embedding for question '{faq['question']}'") # FAQ 데이터를 JSON에서 로드하고 저장 store_faq_data_in_vector_db(faq_data, collection) 이렇게 데이터를 저장하고 # 환경 변수에서 API 키 로드 openai_api_key = os.getenv("OPENAI_API_KEY") if not openai_api_key: raise ValueError("OpenAI API 키가 설정되지 않았습니다. 환경 변수 OPENAI_API_KEY를 설정하세요.") # OpenAI 임베딩 설정 embedding_function = OpenAIEmbeddings( model="text-embedding-ada-002", openai_api_key=openai_api_key ) # LangChain의 Text Splitter 설정 (일관성 유지) text_splitter = RecursiveCharacterTextSplitter( chunk_size=512, chunk_overlap=50 ) # ChromaDB 클라이언트 및 컬렉션 설정 chroma_client = chromadb.Client() collection_name = "faq_data_collection" try: # 이미 존재하는 컬렉션인지 확인하고, 있으면 가져옴 collection = chroma_client.get_collection(name=collection_name) except chromadb.errors.CollectionNotFoundError: # 컬렉션이 존재하지 않을 경우에만 생성 collection = chroma_client.create_collection(name=collection_name) # Vector DB에서 유사 질문 검색 (ChromaDB) def find_similar_question_in_vector_db(new_question_embedding, collection, k=5): results = collection.query(query_embeddings=[new_question_embedding], n_results=k, include=['documents', 'metadatas', 'embeddings']) best_similarity = 0 best_question = None best_answer = None # 검색 결과에서 각 질문의 유사도와 답변을 처리합니다. if 'documents' in results and 'metadatas' in results: documents = results['documents'][0] metadatas = results['metadatas'][0] embeddings = results['embeddings'][0] for i in range(len(documents)): stored_embedding = embeddings[i] metadata = metadatas[i] if stored_embedding is not None: # 코사인 유사도를 통해 유사도를 계산합니다. similarity = cosine_similarity([new_question_embedding], [stored_embedding])[0][0] print(f"유사도: {similarity} for {documents[i]}") # 유사도가 가장 높은 결과를 선택하며, 임계값 이상일 경우에만 선택 if similarity > best_similarity and similarity >= SIMILARITY_THRESHOLD: best_similarity = similarity best_question = documents[i] if isinstance(metadata, list): metadata = metadata[0] best_answer = metadata.get('answer') if isinstance(metadata, dict) else None return best_question, best_answer # Fine-tuned GPT를 사용해 새로운 답변 생성 def gpt_generate_response_from_finetuned_gpt(question, style="의사 A 말투"): prompt = f"다음은 환자의 질문입니다: \"{question}\". 아래 말투를 사용하여 질문에 대해 성실하고 정확한 답변을 작성해주세요.\n\ 말투: {style}" response = client.chat.completions.create( model="", # Fine-tuned된 GPT 모델 ID messages=[ {"role": "system", "content": "You are a helpful medical assistant."}, {"role": "user", "content": prompt}, ], max_tokens=300, temperature=0.7, # 답변의 다양성을 조절합니다. ) return response.choices[0].message.content.strip() # 새로운 질문 처리 및 최종 응답 생성 def generate_final_response(new_question, collection): # 텍스트 스플리팅 및 임베딩 생성 splitted_texts = text_splitter.split_text(new_question) new_question_embedding = np.mean(embedding_function.embed_documents(splitted_texts), axis=0) # ChromaDB에서 유사 질문 검색 similar_question, answer = find_similar_question_in_vector_db(new_question_embedding, collection) if similar_question and answer: final_response = f"질문: {new_question}\n유사 질문: {similar_question}\n기본 답변: {answer}" else: generated_answer = gpt_generate_response_from_finetuned_gpt(new_question) final_response = f"질문: {new_question}\nGPT로 생성된 답변: {generated_answer}\n(이 답변은 벡터데이터에서 유사한 답변을 찾을 수 없어 GPT에 의해 생성되었습니다.)" return final_response # 사용자로부터 새로운 질문 입력 받기 new_question = input("새로운 질문을 입력하세요: ") # 최종 응답 생성 response = generate_final_response(new_question, collection) print(response) 로 데이터베이스에서 유사한 질문-답변 쌍을 끌어오려는데 정확히 같은 질문을 넣어도 (이러면 유사도가 1인데) 저장되어있는 답변이 끌어와지질 않네요...

[사이드 프로젝트] 패션 이커머스 플랫폼 '푸츠(PUTS)' 앱 개발팀 모집

프로젝트 소개: ‘푸츠(PUTS)_Pick Up The Style!’서비스는 패션 디자이너 브랜드를 중심으로 BM특허까지 보유한 혁신적인 패션 커머스 플랫폼서비스 입니다. 데모버전까지 외주개발을 통해 개발이 완료되었지만 현시점에서 리뉴얼하여 새롭게 런칭버전을 개발하고자 역량있는 팀원을 모집합니다. <참고> 본 서비스의 시장성은 2024년 약 19조 5천억원(캐주얼) 정도의 시장성을 예상하고 있으며 연간 약 3.5%씩 지속적으로 성장 중에 있습니다. 3-5년이내 시장의 10%이상 점유를 목표하고 있으며 시장을 장악 가능한 비즈니스 모델과 마케팅 능력을 보유하고 있습니다. (참조: https://global.fashionseoul.com/2023-11-10/Korean-Fashion-Market-Size-Anticipated-Highest-Growth-Ever) 우리는 패션과 기술을 접목해 사용자와 소비자에게 최상의 쇼핑 경험과 정보 공유, 소득을 제공하는 서비스로 패션산업의 큰 파도를 함께 일으킬 분들을 모집합니다. 사이드 프로젝트 형태로 진행되며, 유연한 근무 환경에서 협업을 지향합니다. 3-5년이내 엑싯을 목표로 진행됨으로 임금지급 방식이 아닌 지분분배 방식으로 진행됩니다. 프로젝트 완료시 파트별 기여도에 따라 지분설정이 되며 관련 내용은 프로젝트 진행 전 협의를 통해 산정하여 계약진행 예정.(급여를 제공 받고자 하시는 분은 정중히 사양합니다.) 모집 직군: 1. 프론트엔드 개발자 (1~2명) o 주요 업무: 모바일 앱 UI/UX 구현, 웹 랜딩페이지, 사용자 인터페이스, 어드민 프론트엔드 개발 o 기술 스택: React Native 또는 Flutter, JavaScript/TypeScript, HTML/CSS o 우대 사항: 모바일 퍼포먼스 최적화 경험, 패션 커머스 개발 경험 2. 백엔드 개발자 (1~2명) o 주요 업무: 서버 및 데이터베이스 설계, API 개발, 어드민 백엔드 개발 o 기술 스택: Node.js, Django, AWS, PostgreSQL, RESTful API o 우대 사항: 대용량 트래픽 처리 경험, 보안 및 결제 시스템 개발, 이커머스 어드민개발 경험, 포인트관리 및 쿠폰설정 관리 등 3. UI/UX 디자이너 (1명) / 대표자와 함께 진행 또는 대표자가 진행 o 주요 업무: 모바일 앱 디자인, 사용자 경험 설계 o 필수 스킬: Figma 또는 Photoshop, Illustrator o 우대 사항: 패션 브랜드 디자인 경험, 사용성 테스트 및 피드백 반영 경험 근무 형태: • 프로젝트 기반 협업 (파트타임 가능) • 원격 근무 가능 (주 1회 온라인 미팅) • 유연한 일정과 주도적인 업무 환경 우대 사항: • 사이드 프로젝트 경험 • 패션, 커머스에 대한 관심과 열정 • 스타트업 문화에 익숙한 분 • 책임감 강하신 분 지원 방법: • 이력서와 포트폴리오를 [dcode00@naver.com]로 제출 • 지원 시 사이드 프로젝트 경험 및 참여 가능 시간을 명시해 주세요. 문의: • 이메일: [dcode00@naver.com] • 카카오톡/오픈채팅방: [https://open.kakao.com/o/gi5ixgVe] • 회사주소: 경기도 안산시 상록구 한양대학로55 제2과학기술관 지하2층 B210호 (한양대학교 에리카캠퍼스 소재) 지원 마감일: [채용 완료시까지] 로켓펀치 참여링크 https://www.rocketpunch.com/jobs/139647 문의: • 이메일: [dcode00@naver.com] • 카카오톡/오픈채팅방: [https://open.kakao.com/o/gi5ixgVe]

자바 SMS 일본어 포멧팅문제 질문드립니다.

일본어로 SMS발송을 테스트중입니다. 발송할 내용 템플릿을 작성해놓고, SMS를 발송하고 있습니다. 근데 로그상으로는 문자가 깨지지않는데 발송된 문자를 폰에서 확인하면 중간중간 한자가 ?로 나오는 문자들이 있습니다. 코드는 대략 아래와 같고 message를 그대로 전송합니다. 검색도 해보고 다양하게 테스트 해봤습니다. message = new String(message.getBytes(StandardCharsets.UTF_8), StandardCharsets.UTF_8); 와 같은 식으로도 이것저것 테스트해봤는데 안되네요. 혹시 해결방법이 있을까요?

ReactNative ios build 에러 3일째 해결을 못했습니다.

시뮬레이션을 실행하려고 해도 스크립트 문제, iPhone 버전 범위 문제, 시뮬레이터 문제가 계속 발생합니다. 어떤 도움이라도 감사합니다. ReactNative를 처음 접했습니다. 저희 팀에서 저를 도울 수 있는 사람이 없습니다. #프로젝트 환경 mac M2 ruby -v ruby 2.6.10p210 (2022-04-12 revision 67958) [universal.arm64e-darwin23] node -v v20.10.0 pod --version 1.15.2 package.json { "name": "labts", "version": "0.0.1", "private": true, "scripts": { "android": "react-native run-android", "ios": "react-native run-ios", "lint": "eslint .", "start": "react-native start", "test": "jest" }, "dependencies": { "@react-native-community/async-storage": "^1.12.1", "@react-native-community/cli": "13.6.9", "@react-navigation/bottom-tabs": "^6.6.0", "@react-navigation/native": "^6.1.17", "@react-navigation/native-stack": "^6.10.0", "@tanstack/react-query": "^5.51.5", "@types/react-native-vector-icons": "^6.4.18", "axios": "^1.7.2", "date-fns": "^3.6.0", "immer": "^10.1.1", "react": "18.2.0", "react-native": "0.74.3", "react-native-calendars": "^1.1305.0", "react-native-date-picker": "^5.0.4", "react-native-dotenv": "^3.4.11", "react-native-get-random-values": "^1.11.0", "react-native-image-crop-picker": "^0.41.2", "react-native-image-zoom-viewer": "^3.0.1", "react-native-paper": "^5.12.3", "react-native-permissions": "^4.1.5", "react-native-safe-area-context": "^4.10.8", "react-native-screens": "^3.32.0", "react-native-splash-screen": "^3.3.0", "react-native-tab-view": "^3.5.2", "react-native-vector-icons": "^10.1.0", "react-native-vision-camera": "^4.5.1", "uuid": "^10.0.0", "yarn": "^1.22.22" }, "devDependencies": { "@babel/core": "^7.20.0", "@babel/preset-env": "^7.20.0", "@babel/runtime": "^7.20.0", "@react-native/babel-preset": "0.74.85", "@react-native/eslint-config": "0.74.85", "@react-native/metro-config": "0.74.85", "@react-native/typescript-config": "0.74.85", "@types/react": "^18.2.6", "@types/react-native-dotenv": "^0.2.2", "@types/react-test-renderer": "^18.0.0", "babel-jest": "^29.6.3", "babel-plugin-module-resolver": "^5.0.2", "eslint": "^8.19.0", "jest": "^29.6.3", "prettier": "2.8.8", "react-test-renderer": "18.2.0", "typescript": "5.0.4" }, "engines": { "node": ">=18" } } PodFile require Pod::Executable.execute_command('node', ['-p', 'require.resolve( "react-native/scripts/react_native_pods.rb", {paths: [process.argv[1]]}, )', __dir__]).strip platform :ios, '12.0' use_frameworks! #use_modular_headers! prepare_react_native_project! linkage = ENV['USE_FRAMEWORKS'] if linkage != nil Pod::UI.puts "Configuring Pod with #{linkage}ally linked Frameworks".green use_frameworks! :linkage => linkage.to_sym end target 'nexlabts' do config = use_native_modules! use_react_native!( :path => config[:reactNativePath], # An absolute path to your application root. :app_path => "#{Pod::Config.instance.installation_root}/.." ) target 'nexlabtsTests' do inherit! :complete # Pods for testing end post_install do |installer| # https://github.com/facebook/react-native/blob/main/packages/react-native/scripts/react_native_pods.rb#L197-L202 react_native_post_install( installer, config[:reactNativePath], :mac_catalyst_enabled => false, # :ccache_enabled => true ) end end 제가 아래 에러 3가지에 대해 제가 해본 방법들입니다. 1. node 재설치 node_module 폴더 삭제, package-rock.json 삭제 후 재설치 npm install --legacy-peer-deps yarn install 2. Xcode가 node 읽을 수 있도록 설정 sudo ln -s "$(which node)" /usr/local/bin/node 3. Podfile 내 platform 설정 수정 platform :ios, '12.0' or platform :ios, '14.0' 4. Pods 재설치 rm -rf ~/Library/Developer/Xcode/DerivedData or rm -rf ~/Library/Developer/Xcode/DerivedData/* rm -rf Pods rm Podfile.lock pod install --repo-update Xcode \> Product \> Clean Build Folder. cd ./ios pod cache clean -all pod install --repo-update cd ../ npx react-native run-ios --no-packager --simulator="iPhone 15" or npx react-native run-ios --simulator="iPhone 15" or yarn start > i(run ios) Err 1. cocoaPods 설치할 때 [!] CocoaPods could not find compatible versions for pod "React-RuntimeHermes": In Podfile: React-RuntimeHermes (from ../node_modules/react-native/ReactCommon/react/runtime) Specs satisfying the React-RuntimeHermes (from ../node_modules/react-native/ReactCommon/react/runtime) dependency were found, but they required a higher minimum deployment target. Err2. iOS 실행할때 run-ios --no-packager --simulator="iPhone 15" Build description signature: fc1341421f84b87c5245d346c2c17b66 Build description path: /Users/nowonjae/Library/Developer/Xcode/DerivedData/nexlabts-argvodqcybjfcybstpulfpghnzvm/Build/Intermediates.noindex/XCBuildData/fc1341421f84b87c5245d346c2c17b66.xcbuilddata /Users/nowonjae/Desktop/project/NeXLabRN/ios/nexlabts.xcodeproj:1:1: error: Unable to open base configuration reference file '/Users/nowonjae/Desktop/project/NeXLabRN/ios/Pods/Target Support Files/Pods-nexlabts/Pods-nexlabts.release.xcconfig'. (in target 'nexlabts' from project 'nexlabts') warning: Unable to read contents of XCFileList '/Target Support Files/Pods-nexlabts/Pods-nexlabts-resources-Release-output-files.xcfilelist' (in target 'nexlabts' from project 'nexlabts') warning: Unable to read contents of XCFileList '/Target Support Files/Pods-nexlabts/Pods-nexlabts-frameworks-Release-output-files.xcfilelist' (in target 'nexlabts' from project 'nexlabts') error: Unable to load contents of file list: '/Target Support Files/Pods-nexlabts/Pods-nexlabts-frameworks-Release-input-files.xcfilelist' (in target 'nexlabts' from project 'nexlabts') error: Unable to load contents of file list: '/Target Support Files/Pods-nexlabts/Pods-nexlabts-frameworks-Release-output-files.xcfilelist' (in target 'nexlabts' from project 'nexlabts') warning: Run script build phase 'Bundle React Native code and images' will be run during every build because it does not specify any outputs. To address this warning, either add output dependencies to the script phase, or configure it to run in every build by unchecking "Based on dependency analysis" in the script phase. (in target 'nexlabts' from project 'nexlabts') warning: Run script build phase '[CP] Embed Pods Frameworks' will be run during every build because it does not specify any outputs. To address this warning, either add output dependencies to the script phase, or configure it to run in every build by unchecking "Based on dependency analysis" in the script phase. (in target 'nexlabts' from project 'nexlabts') error: Unable to load contents of file list: '/Target Support Files/Pods-nexlabts/Pods-nexlabts-resources-Release-input-files.xcfilelist' (in target 'nexlabts' from project 'nexlabts') error: Unable to load contents of file list: '/Target Support Files/Pods-nexlabts/Pods-nexlabts-resources-Release-output-files.xcfilelist' (in target 'nexlabts' from project 'nexlabts') warning: Run script build phase '[CP] Copy Pods Resources' will be run during every build because it does not specify any outputs. To address this warning, either add output dependencies to the script phase, or configure it to run in every build by unchecking "Based on dependency analysis" in the script phase. (in target 'nexlabts' from project 'nexlabts') --- xcodebuild: WARNING: Using the first of multiple matching destinations: { platform:iOS Simulator, id:B5AA2E84-4F83-4749-A986-A1FCE5E398A3, OS:17.5, name:iPhone 15 } { platform:iOS Simulator, id:B5AA2E84-4F83-4749-A986-A1FCE5E398A3, OS:17.5, name:iPhone 15 } ** BUILD FAILED ** ] Err3. Xcode 로 Build 할때 (Any iOS Simulator Device (arm64, x86_64)) Command PhaseScriptExecution failed with a nonzero exit code

투두 앱 기획중인데

OKR 이라는 프레임을 적용해본 앱입니다. 이런 앱에 대한 수요가 얼마나 있는지 궁금해서 올려봅니다. 읽어보시고 어떤지 의견 주시면 감사하겠습니다! 추가로 있으면 좋겠다고 생각되는 기능을 말씀해주셔도 됩니다. 간략하게 기능을 적어보자면 아래와 같습니다! 1. OKR Objective(목표)와 Key Results(핵심 결과)를 정하고 하위 항목을 정함으로써 큰 목표를 세분화 할 수 있습니다. ex. Objective: 독서 습관 기르기, Key Result 1: 한 달에 2권씩 책 읽기, Key Result 2: 책을 읽고 독서 노트 작성하기, 하위항목: ​하루에 책 10장 읽기 2.시각화 1번의 목표와 핵심결과를 얼마나 달성했는지 그래프로 보여줍니다. 3. 알림 ToDo 알림 정해진 시간에 오늘 해야할 일을 알림을 통해 보여줍니다.

안녕하세요 github-page관련 질문인데용

제가 gatsby로 GitHub-page에 블로그 및 이력서를 올렸는데요 혹시 용량제한이 있다고 하는데 블로그를 작성도중 추후에 용량이 부족해서 못쓰는 경우는 어떤방법으로 처리하는게 좋을까요? 무료로 어떻게 추가하는방법은 없을까요?

Spring boot 네이버페이 연동하기

스프링 부트 프로젝트를 개발 중인데 네이버 페이를 붙이려고 합니다. 카카오페이는 WebClient 방법으로 완료 하였구요 네이퍼 페이도 같은 방법으로 구현 하려고 하는데 등록된 파트너가 없습니다로만 나옵니다. 네이버페이 개발자센터에서는 SDK를 제공한다고 되어있어서 이게 프론트단에서 진행 되야하는건지 잘 모르겠습니다. 결제서버를 구축중이라 서버쪽에서만 하려고 하는데 블로그글도 많이없어 찾기가 어렵더라구요ㅠㅠ https://dev.apis.naver.com/{partnerId}/naverpay/payments/v2/payment_ready 경로를 이렇게 보내고 있는데요 {error_code=052, message=?? : Partner does not exists. (등록된 파트너가 없습니다.)} 이런 결과가 반환되고 있습니다.. 무슨 문제인지 해결방법을 알고 계신다면 조언 부탁드릴께요 네이버페이 샌드박스 가맹점의 가맹점 Id를 사용하는데 안되는게 이상합니다...

제가 코딩에 빨리 발을 빼는게 맞겠죠?

안녕하세요. 24살 코딩에 입문한 사람입니다. 본론을 들어가자면 이제 막 개발자 과정 학원이 끝나가는데 솔직히 기본도 모르는거 같고 sts로 Maven 프로젝트 기반으로 만들었다?만 알고 초기 세팅을 선생님이 잡아주셔서 집에서 다시 해볼려고 해도 이미 노션에는 띄염띄염 적어놔서 제대로 세팅도 못하고 팀 프로젝트때는 gpt만 주구장창 돌려서 ajax랑 sql문만 복붙해서 넣고.. 학원에서는 면접 대비 문제를 내줬는데 제대로 답변 할 수 있는게 하나도 없고 코딩테스트 사이트 들어가서 보면 쉬운것도 맞추지 못합니다. 잡코리아나 사람인 같은 곳에선 리액트랑 Vue.js도 많이 요구하는데 리액트는 맛만 봤고 Git 올리는건 할 줄도 모릅니다. 제가 개발자쪽 길을 걷는게 맞을까요? 지금이라도 알바를 하면서 유튜브 영상을 보며 다시 공부를 할려고 하는데 그냥 빠르게 발을 빼야될지 고민입니다.

Next.js Dynamic Routing 관련 질문

현재 ./pages 폴더에서 page router로 라우팅 관리 중에 있습니다! id별 post 상세창 조회를 위해 ./pages/post-detail/[id].tsx 와 같이 작성했으나 Whitelabel Error Page This application has no configured error view, so you are seeing this as a fallback. Fri Aug 30 21:08:21 KST 2024 [67199a4f-4509] There was an unexpected error (type=Not Found, status=404) 만 발생합니다 참고로 ./pages/post-write.tsx 와 같은 파일은 정상 작동합니다 혹시 무엇이 문제일까요? 추가+) 혹시 Next.js 14에서 page router 방식을 사용하는것이 문제일지 궁금합니다

php + 그누보드5 관련 웹사이트 질문입니다

안녕하세요. 저는 React + TS 기반 프론트엔드 개발자 신입입니다. 회사에서 제작했던 사이트 중 하나가 php + 그누보드5로 제작 되었는데 해당 사이트를 리뉴얼 해야합니다. 그나마 수정 할 부분은 이미지 하나로 이루어진 랜딩페이지여서 목업은 php를 몰라도 진행이 가능하다 생각되는데 JS 라이브러리를 사용할 수 있는건지 몰라서 질문드립니다. 예를들어 AOS를 사용한다 치면 CDN SOURCES를 이용해서 라이브러리를 사용하면 되는걸까요? php와 그누보드를 하나도 모르다보니 간단한 페이지 수정은 가능하지만 기능 구현에 있어서는 기존 JS 개발하듯이 하면 되는지 모르겠네요.

퍼블리셔, 개발업무에서 무엇을 더 할 수 있다면(can) 매력적일까요?!

디자인 말고, 개발협업 능력으로 무엇을 할 줄 알면, 회사에게나, (프론트/백엔드)개발자가 협업하기 좋을까요? 아니 매력적일까요? JS인터렉션 능력(혹은 GSAP)은 기본적으로 요구하는 걸 느끼겠는데 혹시 다른 무엇이 있을까요 리액트나 TS는 배워둬도 회사에서 많이 쓰질 않으면, 경험해볼 기회가 없어 교양?으로 만지작 중입니다 다양한 의견 궁금합니다!

리액트 네이티브 릴리즈로 배포 시 build.gradle 설정대로 동작 안하는 이유가 뭔지 궁긍합니다.

안녕하세요. 현재 리액트 네이티브로 프로젝트를 진행하고 있습니다. 막바지 단계에 거의 도달해서 이제 배포 준비를 하려고 하는데요, 마지막으로 테스트를 하기 위해 stagingRelease 로 apk 를 만들어서 테스트를 하려고 하니, .env.staging 을 읽지를 못하고 있네요. 이상한건 stagingDebug 로 할 때에는 이런 문제가 없었습니다. 지금 환경변수는 루트 디렉토리에 env 폴더가 있고, 해당 폴더 내에는 3개의 환경변수 파일이 존재합니다. .env.development .env.staging .env.production 이렇게 3개 입니다. project.ext.envConfigFiles = [ productiondebug: "env/.env.production", productionrelease: "env/.env.production", developmentrelease: "env/.env.development", developmentdebug: "env/.env.development", stagingrelease: "env/.env.staging", stagingdebug: "env/.env.staging" ] 위의 코드는 제가 설정한 환경변수 매핑하는 부분입니다. 실제로 stagingrelease 로 빌드 시에 flavor 값이 stagingrelease 로 뜨는 걸 확인했습니다. node_modules 에서 react-native-config 폴더를 찾아서 dotenv.gradle 에서 찍으니까 확인이 가능하더라고요. 제가 궁금한 점은 왜 루트에서 .env 파일만을 읽어서 BuildConfig.java 에서 사용하려고 하는걸까요? .env.staging 을 참조하지 않는 이유가 궁금합니다. 아래는 dotenv.gradle 파일입니다. import java.util.regex.Matcher import java.util.regex.Pattern def getCurrentFlavor() { Gradle gradle = getGradle() def pattern = Pattern.compile("(?:.*:)*[a-z]+([A-Z][A-Za-z0-9]+)") def flavor = "" gradle.getStartParameter().getTaskNames().any { name -> Matcher matcher = pattern.matcher(name) if (matcher.find()) { flavor = matcher.group(1).toLowerCase() return true } } println "Current flavor: $flavor" return flavor } def loadDotEnv(flavor = getCurrentFlavor()) { def envFile = project.hasProperty("defaultEnvFile") ? project.defaultEnvFile : ".env" if (System.env['ENVFILE']) { envFile = System.env['ENVFILE'] } else if (System.getProperty('ENVFILE')) { envFile = System.getProperty('ENVFILE') } else if (project.hasProperty("envConfigFiles")) { project.ext.envConfigFiles.any { pair -> if (flavor.startsWith(pair.key.toLowerCase())) { envFile = pair.value return true } } } println "Reading env from: $envFile" def env = [:] File f = new File("$project.rootDir/../$envFile"); if (!f.exists()) { f = new File("$envFile"); } if (f.exists()) { println "Found env file: $f" f.eachLine { line -> def matcher = (line =~ /^\s*(?:export\s+|)([\w\d\.\-_]+)\s*=\s*['"]?(.*?)?['"]?\s*$/) if (matcher.getCount() == 1 && matcher[0].size() == 3) { env.put(matcher[0][1], matcher[0][2].replace('"', '\\"')) // 각 환경 변수 키-값 쌍 출력 println "Loaded env variable: ${matcher[0][1]} = ${matcher[0][2]}" } } } else { println("**************************") println("*** Missing .env file ****") println("**************************") } project.ext.set("env", env) } loadDotEnv() android { defaultConfig { project.env.each { k, v -> def escaped = v.replaceAll("%","\\\\u0025") buildConfigField "String", k, "\"$v\"" resValue "string", k, "\"$escaped\"" println "Set buildConfigField and resValue: $k = $v" } } } 안드로이드 스튜디오 터미널에서 ./gradlew assembleStagingRelease 명령어를 치게 될 경우, Current flavor: stagingrelease Reading env from: .env.staging ************************** *** Missing .env file **** ************************** 이런 로그가 뜨고 있습니다.

환경변수 주입 및 빌드(모노레포)

모노레포 프로젝트 환경 및 요구사항 - 프로젝트는 front(React), back(Node), common 패키지로 구성되어 있으며, 모노레포로 되어있음 - Dockerfile 스크립트에서는 build → run 순서로 실행되도록 구현되어 있음 - 서버 배포 시에는 하나의 포트만 사용해야 하므로 back(Node)에서 front의 정적 파일(index.html)을 실행해야 함 - Docker 빌드 시, front(webpack 빌드)와 back 둘 다 build 스크립트를 실행하고, 이미지 실행 시에는 back만 run 스크립트를 실행하여 back에서 front의 정적 파일을 실행해야 함 - 환경변수는 이미지 실행 시 docker-compose.yml의 env_file 속성을 사용해 외부에서 주입해야 함(환경변수가 바뀌는 상황이 있다면 .env 파일을 수정한 후 다시 빌드해야 합니다.) 예외 상황 Docker 빌드할 때 .env 파일을 포함하지 않고 run 스크립트를 실행(이미지 실행) 시 주입하는데, front 패키지에는 run 스크립트가 존재하지 않습니다. (back에서 front의 정적 파일을 실행) 즉, 환경변수가 주입되지 않고 있음 해결 방법 첫번째는 back에서 front의 dist 파일 호출 시 환경변수 객체를 만들어 value 값을 key 값으로 치환해서 함께 넘기고, index.html의 head에서 window 객체를 활용해 값을 받는 방법 하지만 이 방법은 개발자 도구에서 환경변수 값이 노출되고, window 객체를 활용하기 때문에 새로운 브라우저를 생성할 때마다 사이드 이펙트가 발생할 수 있음 두번째는 모노레포 root 패키지에서 prerun 스크립트로 front의 build 스크립트를 실행하는 방법 스크립트 -> "prerun": "lerna run build --parallel --scope @projectname/front --stream", 이 방법은 빌드를 두 번 실행하므로 자원을 많이 소모하지만, 예외 상황이 없는 것으로 보임 질문 받은 내용 Q. 환경변수를 바꾸는 상황이 존재할까요? A. 회사의 인프라 환경에 따라 다르지만, 포트나 IP가 변경될 수 있는 상황이 있음 예를 들어, 외부 서버에 요청을 보낼 경우 그 서버의 정보가 바뀌면 설정을 변경해야 하며, 다른 서버에 요청할 때 인증 정보를 입력해야 하는데, 토큰이나 사용자 패스워드 값이 변경될 경우에도 수정이 필요함 고민되는 부분 다른 해결 방법이나 비슷한 상황이 있다면 함께 논의하고 싶습니다. ㅎㅎ *프로젝트 구조 root ├── packages │ ├── back │ │ ├── package.json │ │ ├── index.ts │ │ ├── .babelrc │ │ └── ... │ ├── common │ ├── front │ │ ├── public │ │ │ └── index.html │ │ ├── package.json │ │ ├── src │ │ │ └── index.js │ │ ├── src │ │ ├── webpack.config.js │ │ └── ... ├── package.json ├── lerna.json ├── docker-compose.yml ├── Dockerfile * 프로젝트의 중요 정보는 제외했습니다.

Next.js 코드 가독성..

안녕하세요 프론트앤드 1년차에 다가가고 있는 신입 개발자입니다. 현재 Next14를 사용하고 있으며 코드의 가독성, 효율성을 많이 고려하면서 코드를 짜려고하는데 너무 고민이 되네요 저보다 앞서서 달려가고 있는 개발자 선배님의 생각을 듣고싶습니다 ㅠㅠ... 2가지가 궁금합니다. 먼저 첫번째 이미지처럼 Version에 관련된 파일을 저렇게 분리했을 때 저는 Version의 최상위 Layout.tsx에서 모든 것을 선언하기가.. 너무 오히려 가독성이 안좋다고 생각을 하고 있습니다 즉, 변수나 함수를 모두 최상위 Layout.tsx에서 선언 및 정의를 해두고 props로 내려주는게 이상하다고 생각을 합니다. 변수, 함수, useEffect 모두 직접 해당 변수나 함수를 컨트롤하는 부분에서 선언 및 가공을 하는게 맞다고 생각을 합니다. 최상위 Layout.tsx가 너무 무거우면 오히려 나는 VersionDataTable에 관련된 변수나 함수만 보려고 하였으나 최상위 Layout.tsx를 보고 아 이게 VersionDataTable에 필요하구나 뭐가 필요없구나, useEffect의 의존성 배열까지 고려하는것이 불필요하다고 생각을 하고 있습니다.. 근데 같이 프론트 앤드 개발하시는 분께서는 '단기적으로 절대 코드가 변하지 않는다고 생각하면 그 말씀이 맞는데 그건 아니잖아요? 우리는 계속 유지보수를 할거고 그러면 결과적으로 A에서만 사용하던 변수나 함수들을 A,B,C에서 같이 사용할 수 있게 변경하게 되면 그때 변경하면 유지보수 측면에서 너무 안좋습니다. 최상위에 모두 선언이나 정의를 해두고 props로 내려주는게 맞다 이런 형식으로 코드를 작성하면 몇개월 뒤에 코드를 수정할 때 A가서 수정했다가 C가서 수정했다가 D가서 수정하실 거에요? 바로 알아보실 수 있겠어요?' 라고 말씀을 하시더라구요.. 물론 몇개월 뒤에 코드를 보거나 하면 제가 작성한 코드인데도 저는 헷갈리는 경우가 많습니다. 그러나 최상위에 모두 선언 및 정의해둬도 마찬가지 아닌가..? 유지보수 측면에서 뭐가 안좋은거지..? 라고 생각되게 됩니다.. 선배님의 말씀을 따라가고는 싶은데 이해가 안돼서요 제가 아직 기본기가 많이 부족한 상황이라 이 상황에서 말씀드리면 이론부터 말하며 설득시키기가 부족하다고 생각하기 때문에 말씀드리면 오히려 '저는 이렇게 생각해요 틀렸는데요?' 라고 말하는 것 같아 말다툼이 될 것 같습니다. 2. 밑 사진을 보면 modalTemplate라는 폴더, ConfirmTemplate이라는 폴더가 존재하는데요 이것에 대해서 저는 사용하는 용도에 따라서 Create면 Create Create와 Update를 동시에 할 수 있는거면 BundleCreateAndUpdate 이런 형식으로 각각의 파일을 생성을 하고 문법상 공유되는 부분은 중복이 되어서 실제로 보여주는 부분을 영역으로 나눠서 BasicOptions, SelectList, VersionDetail, VersionOptions로 나누고 각각의 파일에서 사용하는 부분만 불러와서 쓰는 형식으로 코드를 작성했습니다. 그러나 이렇게 용도에 따라 구분하지 않고 최상위 Layout.tsx파일 하나만 만들고 ModalType이라는 props를 받아서 ModalType이 create, update, create&update, delete ... 등 JSX에서 삼항 연산자를 써서 처리를 할수도 있습니다. 저는 ModalType으로 처음에 구분하다보니 나는 'create' 속성일 때 어떤 형식으로 되는지 코드로 보고싶은데.. 그러면 너무 뜯어서 봐야하더라구요 그래서 용도에 맞게 파일을 만들고 거기서 form을 불러오기만해서 중복 코드를 줄이는 방식을 택했습니다.. (더 나은 코드라고 생각했습니다.) 그랬지만 선배님께서 'ModalType으로 나누는게 더 좋아요 저렇게 지으면 가독성이 너무 떨어지고 파일의 이름이 너무 길어지잖아요 이상하지 않나요?' 라고 말씀을 하시더라구요... 물론 가독성은 사람마다 다른거 알고있습니다. 그러나 ModalType으로 나누기 시작하면 한도 끝도없이 나누고 ModalType이 delete일 때만 사용하는 함수, create일 때만 사용하는 함수 등 필요없는 함수도 너무 많아져서 용도에 맞게 파일을 구분하고 거기서 중복 코드만 최대한 줄이자! 라고 생각하여 코드를 작성했는데 이 내용도 말씀드려 봤지만 '가독성' 이라는 이유 하나만으로 너무 안좋다고 합니다.. 진짜 안좋은건가요..? Next 도 그렇고 프론트 앤드 너무 어렵습니다..

NextJs 확장 fetch로 서버 컴포넌트에서 동적으로 api를 받는 방법

안녕하세요. 선배 개발자 선생님들. 오늘도 한 단계 성장하기 위해 질문을 남겨봅니다. 저는 NextJs, App router 방식으로 코드를 구현중이며, 서버 상태는 React-Query로 상태값을 관리하고 있었습니다. 왜 리액트 쿼리를 사용했는가? why? 1. Optimistic update, 무한스크롤에 대해 공부하고 적용해보고 싶었습니다. 2. 클라이언트 상태, 서버 상태를 나눈다는 개념이 너무 좋아서 서버 상태는 React-Query로 다뤘습니다. 3. statleTime, gcTime을 조정하여 캐싱기능이 좋았습니다. 갑자기 문득 나는 NextJS를 잘 쓰고 있는건가? 리액트랑 폴더 구조 말고는 다른게 없는거 아닌가? 라는 생각이 들었고, NextJs의 기능을 최대한 활용하고 나머지 불편한 부분이 생긴다면 외부 라이브러리를 사용하자! 라는 생각이 들었습니다. 그래서 저는 React-Query로 상태를 관리하던걸 NextJs의 확장 fetch로 바꿀려고 합니다. Optimistic update, 무한스크롤 기능을 제외하고 나머지 모든 서버 상태는 확장 fetch로 바꿀려고 합니다. 페이지네이션 페이지네이션 처럼 사용자와 상호 작용하는 부분, 즉 동적으로 데이터를 받아오게 하기 위해 url을 변경한 뒤, [id]/page.tsx에서 param로 받던지 혹은 header()를 통해 params를 받아서 처리를 할 수 있다고 생각하고, 저는 header()로 params를 받아서 처리를 했습니다. 모달에서의 페이지네이션 그런데 문제는 모달을 띄우고, 모달 내부에서 페이지네이션이 있는 경우 어떻게 데이터를 동적으로 받아오는지 고민을 해봐도 방법이 없는 것 같습니다. 1. 모달에서 다음 페이지 클릭시 url을 변경한다. -> 안해봤지만 동작을 할 수 있더라도 뭔가 느낌적으로 아닌 것 같습니다. 2. 클라이언트 컴포넌트에서 상태값을 서버 컴포넌트로 전달한다 -> 불가능 궁금한 점 1. 모달 내부에서 페이지네이션을 처리할때 url을 변경해서 서버 컴포넌트에서 확장 fetch로 데이터를 관리하는 게 적절할까요? 2. 모달 내부에서는 페이지네이션을 처리할 때는 react-query로 데이터를 관리하는 걸 확장 fetch로 바꿀 수 없는 건가요?? 바꿀 필요가 없는 건가요? 3. 더 좋은 방법이 있는 건가요?