목차
- CSS에 대한 솔직한 감정과 업무 분담 이야기
- 카카오 로그인 리다이렉트 문제 해결
- 층간소음과 스트레스 대처 방법
- React에서 CSS 모듈과 스타일링 방식
- TailwindCSS 적용 시 발생하는 React Native 오류
- 개발자들의 일상과 소소한 대화
- React 스크롤 위치 문제와 개선 팁
- CUDA 병렬화 알고리즘에 대한 감상
- 퍼블리셔와 프론트엔드 개발 역할 구분
- 초보자를 위한 Docker 및 웹 문서 참고 자료
1. CSS에 대한 솔직한 감정과 업무 분담 이야기
- CSS를 싫어하는 개발자가 많음.
- CSS 작업은 종종 후임자나 퍼블리셔에게 미뤄지는 경우가 많음.
- 업무 분담이 필요하며, CSS에 흥미를 갖지 못하는 경우가 적지 않음.
- 하지만 유지보수와 일관된 UI를 위해서는 CSS 관리가 중요함.
CSS란?
웹페이지 디자인을 담당하는 스타일 시트 언어로, 글자 크기, 색상, 레이아웃 등을 정의함.
초보에게 헷갈릴 수 있는 선택자, 우선순위 개념이 있음.
2. 카카오 로그인 리다이렉트 문제 해결
- 카카오 로그인을 구현 중 인가코드 콜백 페이지 리다이렉트 이슈 발생함.
- 로컬호스트(localhost)에 https 프로토콜을 붙여서 등록하면 오류가 날 수 있음.
- 카카오 개발자 사이트 내 Redirect URI에 정확한 주소를 HTTP로 등록하는 게 중요함.
- 특히 로컬 개발 시에는 http://localhost:3000/kakao/user 형태로 등록해보는 것이 추천됨.
- 도메인, 프로토콜, 경로가 하나라도 다르면 에러가 발생하니 주의 필요.
3. 층간소음과 스트레스 대처 방법
- 밤이나 이른 아침 소음으로 인해 스트레스가 심각한 상황.
- 법적 조치보다는 상황에 따라 부드럽게 말하는 것도 방법.
- 새벽 소음 문제는 특히 출장이 있는 날에 피유저에게 큰 부담이 됨.
- 심할 경우 정당한 절차를 통해 관리사무소나 경찰에 신고하는 것도 한 방법.
4. React에서 CSS 모듈과 스타일링 방식
- 컴포넌트마다 별도의 CSS 파일을 두는 경우 클래스 네임 충돌 문제가 발생.
- 이를 방지하기 위해 CSS 모듈(module.css)을 사용하며, 클래스명이 유니크하게 변환됨.
- CSS 모듈은 각 컴포넌트 내에 한정된 스타일을 적용하는 방식으로 유지보수에 강점 있음.
- 색상 등 공통 스타일 요소는 common.css 또는 공통 모듈에 관리하는 것이 좋음.
- BEM(Block Element Modifier) 방식과 같이 네이밍 규칙을 적용해 관리하는 사례도 많음.
5. TailwindCSS 적용 시 발생하는 React Native 오류
- React Native 프로젝트에서 TailwindCSS 스타일을 className으로 지정 시 에러 발생함.
- 에러 메시지는 Property 'className' does not exist on type 'TextProps' 임.
- React Native는 웹과 다르게 기본 컴포넌트가 className 프로퍼티를 사용하지 않음.
- 이를 해결하려면 NativeWind 같은 Tailwind 스타일링 라이브러리를 설치하고 설정을 따라야 함.
- babel과 tailwind.config.js 설정을 정확히 해야 하며, 공식 문서 및 예제 참고 권장.
6. 개발자들의 일상과 소소한 대화
- 출근 전 기대감과 동료 응원, 휴일의 여유와 피로감 공유.
- 취미로 봉사활동 시작, 개인 프로젝트, 장비 셋팅 등을 함께 이야기함.
- 개발 외 사소한 일상 이야기로 동료들 간 친밀감 형성.
7. React 스크롤 위치 문제와 개선 팁
- React에서 리스트 스크롤이 처음부터 시작하지 않고 중간 위치에서 시작하는 현상 발생.
- 이는 스크롤 이벤트 핸들러 내부 계산 잘못 혹은 초기 상태 설정 문제로 발생할 수 있음.
- 스크롤 위치 조정 시 element.scrollTop 값을 지정하거나, 활성화 클래스(active) 관리 검토 필요.
- 스크롤 위치 관련 이벤트를 useEffect에서 정확히 등록하고 해제하기 권장.
8. CUDA 병렬화 알고리즘에 대한 감상
- NVIDIA CUDA는 GPU를 활용해 복잡한 알고리즘을 병렬로 빠르게 처리함.
- 병렬 처리는 여러 작업을 동시에 처리해 속도를 극대화하는 기법임.
- CUDA 프로그래밍은 난이도가 높으며, C언어 위에서 돌아가는 GPU 확장 언어임.
- 병렬 알고리즘 자체가 복잡해 학습에 많은 시간과 노력이 필요함.
9. 퍼블리셔와 프론트엔드 개발 역할 구분
- 퍼블리셔는 주로 HTML, CSS 작업 중심으로 UI를 구현함.
- 프론트엔드는 UI뿐 아니라 React 등으로 동적인 기능을 만드는 역할도 담당.
- 회사마다 역할 분담이 다르고 프로젝트 성격에 따라 프론트엔드가 퍼블리싱까지 하는 경우도 있음.
- 디자이너, 퍼블리셔, 프론트엔드 개발자 간 협업이 원활해야 효율적 프로젝트 가능.
10. 초보자를 위한 Docker 및 웹 문서 참고 자료
- Docker는 리눅스 컨테이너 기반 도구로, 애플리케이션과 라이브러리를 묶어 환경을 표준화함.
- 링크 참고: MDN Web Docs - Mozilla는 웹 기술 학습에 매우 훌륭한 자료임.
- 초보자가 기술 용어와 개발환경 익히는데 추천하는 기본 학습 사이트.
면접팁⚡
- 카카오 로그인 구현: OAuth 인증 흐름과 Redirect URI 설정 방법을 명확히 이해하고 설명할 수 있을 것.
- CSS 모듈 장점: CSS 클래스 충돌 방지와 유지보수 측면을 논리적으로 설명하기.
- React Native 스타일링 오류: React와 React Native 스타일링 차이, NativeWind 같은 라이브러리 필요성 이해.
- CUDA 병렬 처리: 기본 개념과 개발 난이도, 병렬 프로그래밍 개념 간단히 정리하면 좋음.
링크🔗
#React#CSS#카카오로그인#ReactNative#TailwindCSS#병렬처리#CUDA#퍼블리셔#프론트엔드#개발일상