목차
- React 컴파일러 RC 출시 소식
- 로그 수집 관련 Q&A
- 웹3 지갑 연결 및 NFT 구매 구현
- Next.js 스타일링 라이브러리 비교
- '뱀파이어 서바이벌' 스타일 게임 개발 명세서 공유
- 크롬 최신 CSS 애니메이션 기능 소개
- SI 프로젝트 포트폴리오 활용 관련 문의
- 직장 내 어려움과 이직 고민
- 개발 관련 잡담과 팀 분위기
- 유용한 블록체인 및 도커 자료 공유
1. React 컴파일러 RC 출시 소식 🎉
- React 공식 블로그에서 컴파일러 RC(Release Candidate) 버전이 나왔다고 공유됨
- RC 버전은 정식 출시 전 마지막 베타 단계로, 큰 버그가 없으면 곧 정식 출시됨을 의미
- React 17부터 해당 컴파일러 지원 여부가 궁금한 질문이 있었음
- React 컴파일러는 자바스크립트 코드를 최적화하는 도구로, 새 버전에서는 빌드 시 성능 개선 및 새로운 기능 도입 기대 가능
2. 로그 수집 관련 Q&A 📝
- React를 활용할 때 로그 수집은 보통 어떤 툴을 쓰냐는 질문이 있었음
- 로그 수집은 앱 운영 환경에서 발생하는 에러, 이벤트, 사용자 행동 데이터를 수집하는 기술
- 주로 Sentry, LogRocket, Firebase Crashlytics 같은 툴을 많이 사용
- 질문 내용이 추상적이라 구체적인 요구사항에 맞춰 도구를 선택하는 게 좋음
3. 웹3 지갑 연결 및 NFT 구매 구현 🔗
- 모바일 앱에서 메타마스크 등 가상화폐 지갑 연동 가능 여부 질문과 답변
- NFT 구매 시 지갑 연결 방식은 크게 두 가지:
- 월렛의 인앱 브라우저 내에서 직접 처리
- WalletConnect 같은 커넥터를 통해 원격에서 서명 처리
- ethers.js와 wagmi는 웹3 개발에서 흔히 쓰이는 라이브러리
- ethers.js는 저수준 API 제공으로 유연성 높음
- wagmi는 React 친화적 훅을 지원해 빠른 개발 가능
- 네트워크 스위칭, 큐알 코드 지원, 모바일 사파리 지원 등이 주요 고려 사항
- 특정 체인(예: 카이아) 연결 시 별도 커넥터 설정 필요할 수 있음
웹3 지갑 연결 개념 설명
- 월렛 커넥트(WalletConnect): 지갑 앱과 웹 간 암호화된 연결을 제공하는 프로토콜
- 인앱 브라우저: 월렛 내 내장 브라우저에서 DApp 실행 시 별도 연결 없이 서명 처리
- NFT 민팅: 디지털 자산을 블록체인 상에 생성하는 과정으로 지갑 서명이 필수
4. Next.js 스타일링 라이브러리 비교 🎨
- Tailwind CSS와 Stylex 중 선택 고민 질문이 있었음
- Tailwind CSS
- 유틸리티 퍼스트 CSS 프레임워크
- 클래스명으로 빠르게 스타일 적용 가능
- 큰 커뮤니티와 풍부한 플러그인 존재
- Stylex
- Meta(Facebook)에서 개발한 CSS-in-JS 솔루션
- 컴포넌트 단위 스타일 최적화에 강점
- Next.js와 낮은 러닝 커브는 Tailwind가 더 좋다는 의견 우세
5. '뱀파이어 서바이벌' 스타일 게임 개발 명세서 공유 🕹️
- 로그라이트 장르의 자동 공격 생존 액션 게임 개발 명세서를 상세하게 공유
- 주요 내용
- 게임 컨셉과 핵심 메커닉 (자동 공격, 제한 시간 생존)
- 기술 스택 (Unity + C#, 2D 픽셀 그래픽)
- 캐릭터, 무기, 아이템, 적 시스템 등 각 요소별 상세 설계
- 스테이지, UI/UX, 오디오, 개발 일정 및 마일스톤 포함
- 확장 가능성, 비즈니스 모델, 기술적 도전 과제까지 포괄
- AI를 활용해 명세서를 파일로 저장하고 프롬프트로 읽혀 게임 제작도 가능하다는 팁 공유됨
6. 크롬 최신 CSS 애니메이션 기능 소개 ✨
- height: 0에서 height: auto로 애니메이션 효과를 줄 수 있게 됨 (크롬 129버전 이상, 엣지도 지원)
- 아직 사파리, 파이어폭스, 삼성 인터넷 브라우저는 미지원 상태
- 이는 CSS에서 자동 높이 조절 애니메이션이 가능해 UI 확장/축소 효과 구현이 더 자연스러워짐
- 참고 링크: https://developer.chrome.com/docs/css-ui/animate-to-height-auto?hl=ko
7. SI 프로젝트 포트폴리오 활용 관련 문의 💼
- SI(시스템 통합) 프로젝트 결과물을 스크린샷으로 찍어 블러 처리 후 포트폴리오에 넣어도 되냐는 질문
- 답변
- 회사 정책이 가장 중요하므로 사전에 반드시 허락 받아야 함
- 법적, 보안 이슈가 민감한 경우 사용 불가할 수 있음
- 포트폴리오 용도로 활용 시 정보 노출 최소화 필요
- 사람마다 판단이 달라 회사와 협의하는 게 가장 안전
8. 직장 내 어려움과 이직 고민 😓
- 사수가 이직 준비 중이고 반복해서 업무를 넘기면서 업무량 증가
- 이직 준비자의 태도 문제와 이에 따른 팀 내 갈등 언급됨
- 직장 내 감정 관리와 커뮤니케이션 중요성 강조
- 분위기를 풀기 위한 유머와 응원 메시지, 스트레스 케어 대화도 오감
9. 개발 관련 잡담과 팀 분위기 😄
- 다양한 가벼운 농담과 팀원들끼리의 호칭 놀이가 이어짐
- 팀원 생일 축하, 일상 대화, 게임 이야기 포함
- 이런 잡담이 전체적인 팀 분위기와 결속력을 높이는 역할 수행
10. 유용한 블록체인 및 도커 자료 공유 📚
- 웹3와 블록체인 개발 관련 심화 노션 자료 링크 공유
- 도커 컨테이너에 대해 초등학생도 이해할 정도로 쉽게 정리된 자료 소개
- 개발자들이 참고하기 좋은 실무 중심 문서
- 주요 링크:
면접팁⚡
- React 컴파일러 RC 이해: RC 버전은 출시 전 마지막 테스트 버전임을 아는 것이 중요
- 웹3 구현 시 핵심 키워드 이해 필요
- WalletConnect, 인앱 브라우저, 스마트 컨트랙트, 네트워크 스위칭
- 스타일링 라이브러리 비교 설명 시 용도와 특징을 명확히 말할 것
- 포트폴리오 제출 시 기업 정책과 보안 관련 윤리적 고려 강조하기
링크🔗
- React 컴파일러 RC 공식 블로그: https://react.dev/blog/2025/04/21/react-compiler-rc
- 뱀파이어 서바이벌 스타일 게임 제작 예시: https://pjt3591oo.github.io/vampire-survival-game-by-ai/
- CSS 애니메이션 - height auto 지원 안내: https://developer.chrome.com/docs/css-ui/animate-to-height-auto?hl=ko
- 웹3 및 블록체인 노션 자료:
- 뱀파이어 서바이벌 게임 관련 블로그: https://blog.naver.com/pjt3591oo/222648640726
#React#웹3#NFT#Nextjs#스타일링#게임개발#CSS애니메이션#포트폴리오#직장생활#도커