목차
- 아침 인사와 출근 관련 팁
- 파일 저장과 서버 액션 관련 Q&A
- React Native와 Tailwind CSS 동향
- 월급 지연과 파이어족(FIRE) 이야기
- UI 스케일링 문제 (RN & Figma 디자인)
- Next.js와 데이터베이스 선택 고민
- 웹 캐싱 문제와 무효화 방법
- AI를 활용한 개발과 퍼블리싱 전략
- 통신사 개인정보 유출 및 유심 보호 서비스 논란
- Next.js 라우트 API와 백엔드 대체 가능성
1. 아침 인사와 출근 관련 팁 ☀️
- 개발자들 간에 아침 인사와 출근 이야기로 가볍게 시작.
- 버스 이용 시 동쪽에서 서쪽으로 이동할 때 버스 오른쪽 좌석에 앉으면 햇빛을 덜 받는다는 꿀팁 공유.
- 출근 첫 3일은 특히 정신없으니 일단 자리를 잡는 게 성공이라고 느끼는 사람이 많음.
2. 파일 저장과 서버 액션 관련 Q&A 📁
- 도면 같은 큰 파일은 일반적으로 DB에 직접 저장하지 않음.
- AWS S3 같은 오브젝트 스토리지를 활용해 파일을 저장하고, 경로나 메타데이터만 DB에 관리하는 방식 추천.
- 서버 액션으로 PDF 같은 파일을 GET 할 수 있는지 물음.
→ 서버 액션은 서버에서 처리하는 동작을 의미하며, 일반적으로 REST API 혹은 서버 함수로 파일을 클라이언트에 전달 가능함. - 즉, 파일 다운로드 경로나 API를 통해 간편하게 PDF를 제공할 수 있음.
3. React Native와 Tailwind CSS 동향 🌬️
- React Native에서도 Tailwind CSS를 사용할 수 있느냐는 질문에 "nativewind"라는 라이브러리가 떠오르고 있음.
- Tailwind CSS는 유틸리티 퍼스트(Utillity-first) CSS 프레임워크로서, 빠른 스타일링과 생산성 향상을 위해 널리 사용 중.
- 'nativewind'는 React Native 환경에 맞춰 최적화된 Tailwind 스타일링 방법을 제공하며, 모바일 앱에도 적용 가능함.
- Tailwind CSS의 인기는 계속 확산되고 있고, TypeScript와도 자연스럽게 연동할 수 있는 새로운 스타일링 라이브러리들도 관심 대상.
4. 월급 지연과 파이어족(FIRE) 이야기 💸
- 월급이 밀리면 자연스럽게 출근과 업무도 미루게 되는 상황 공감대 형성.
- 파이어족(FIRE: Financial Independence, Retire Early)은 경제적 자립을 통해 조기 은퇴를 꿈꾸는 사람들을 의미함.
- 참여자 중 가진 돈이 적어 힘들어하는 현실 이야기와 웃음 섞인 대화가 오감.
- 경제적 여유와 안정에 대한 고민은 개발자 커뮤니티에서도 흔한 주제임.
5. UI 스케일링 문제 (RN & Figma 디자인) 📏
- React Native 개발 시, Figma 기반 디자인을 적용하는데 폰 크기 기준과 실제 디바이스 비율 차이로 인해 UI가 눌린 형태로 표시되는 문제 발생.
- 예: 피그마에서 정사각형 90x90 크기지만, 세로로 눌린 폰(아이폰7 등)에서는 직사각형으로 나옴.
- 해결 팁:
- 단순 픽셀 기반 크기보다는 상대적 비율과 오토레이아웃(유연한 레이아웃 방식)을 활용해야 함.
- 디바이스의 실제 해상도와 비율(aspect ratio)을 계산하여 비율에 맞게 크기를 조정.
- RN에서 Dimensions API를 활용해 화면 가로세로 크기를 얻고, 이를 기반으로 UI 요소를 스케일링하는 방법이 효과적임.
6. Next.js와 데이터베이스 선택 고민 🗄️
- Next.js 사용 시 MariaDB와 PostgreSQL(PgSQL) 중 어떤 걸 선택할지 문의.
- PostgreSQL은 Next.js와 타입스크립트 환경에서 기본 지원과 생태계가 활발하며, 견고한 기능을 자랑함.
- MariaDB는 MySQL 기반으로 익숙한 사용자에게 적합하나, 일부 최신 기능은 PostgreSQL이 더 앞서는 경향.
- 실무에서는 팀 경험, 기존 인프라, 확장성, 필요 기능 등을 고려해 선택 권장.
7. 웹 캐싱 문제와 무효화 방법 🔄
- 리액트 + Vite로 웹 서비스 배포 후 변경 사항이 브라우저에 반영되지 않고, 강력 새로고침해야 적용되는 문제 발생.
- 이는 브라우저 캐싱으로 인한 일반적인 현상. 캐싱은 웹 페이지나 리소스의 빠른 로딩을 위해 저장해두는 기능이다.
- 해결 방법:
- 배포 시 서버에서 Cache-Control 헤더 설정하여 무효화 정책 적용. 예) no-cache, max-age=0 등.
- 파일명에 해시값을 추가하여 변경 시마다 새로운 리소스로 인식되게 함(해시 네이밍).
- CDN 사용 시 캐시 무효화(invalidation)를 명시적으로 수행.
- 캐싱 설정은 사용자 경험과 성능을 고려해 적절히 조정되어야 함.
8. AI를 활용한 개발과 퍼블리싱 전략 🤖
- AI 도구를 활용해 퍼블리싱과 기본 구조 셋업에 효율성을 크게 높이고 있음.
- AI에게 개발 계획서 작성, 특정 서비스 특징 이해시키기, 컨텍스트 전달 방법을 고민 중.
- “토스같은 느낌으로 만들어줘” 같은 추상적인 요구는 AI가 기대한 결과를 내기 어려우며, 구체적이고 단계별 지시가 필요함.
- 프로젝트 셋업은 직접 작성하는 편이 더 편리할 수 있지만, 반복작업이나 단순한 퍼블리싱 작업은 AI가 큰 도움.
- 앞으로 AI 활용 능력이 개발자 역량 중 중요한 평가 요인이 될 것이라는 기대.
9. 통신사 개인정보 유출 및 유심 보호 서비스 논란 🔐
- 최근 대규모 통신사 개인정보 유출 이슈와 관련된 걱정과 논의 활발.
- 유심(USIM) 보호 서비스는 유심 일련번호를 복제하는 해킹 시도를 막고, 복제 시도를 차단하는 기능.
- 유심 교체가 2차 피해를 예방하는 중요한 조치로 부각됨.
- 통신사 사태 시 정부 감사, 배상 책임, 기업 존폐 문제에 대한 의견 교환.
- 스타링크(Starlink) 등 대체 통신 수단까지 논의되면서 기술과 정책의 복합적인 문제로 확장됨.
10. Next.js 라우트 API와 백엔드 대체 가능성 🔧
- Next.js의 Route API 기능은 간단한 API 서버 역할을 할 수 있어, 작은 백엔드 요구사항을 충족 가능.
- 하지만 전통적인 Express나 NestJS와 같은 백엔드 프레임워크와는 목적과 기능성에 차이가 있음.
- Next.js API 라우트는 프론트엔드 중심 개발자에게 간편하지만, 복잡한 비즈니스 로직이나 서버 관리에는 적합하지 않을 수 있음.
- 서버리스 환경과 비교하며 각자의 장단점을 고려한 선택 필요.
면접팁⚡
-
Next.js의 철학과 구조 이해하기
Next.js는 ‘configuration by convention’을 지향하여, 폴더 구조와 파일명으로 기능을 자동화함. 이를 설명할 때는 스프링 프레임워크의 ‘제어의 역전(IoC)’ 개념과 비교하며 발전된 개념이라고 말할 수 있음. -
웹 캐싱과 CDN 무효화 경험
대규모 서비스 배포 시 캐싱 문제는 흔함. 캐시 무효화를 위한 Cache-Control 헤더, 해시 네이밍, CDN 인밸리데이션 경험을 구체적으로 이야기하면 좋음. -
React Native UI 적응형 설계
비표준 해상도(비율) 문제에 대한 대응법을 명확히 아는지 묻는 경우가 있음. 디바이스별 해상도와 DPI 차이를 고려한 UI 설계 중요성 강조. -
AI 도구 활용 경험
현대 개발 환경에서 AI 도구를 어떻게 효율적으로 활용하는지가 경쟁력임. AI에게 단계적 명령을 줘야 원하는 결과가 나온다는 점 설명 가능하면 유리.
링크🔗
#Nextjs#ReactNative#TailwindCSS#웹캐싱#AI활용#파일저장#통신사유출#FIRE#멘토링#UI스케일링