본문 바로가기

개발

[Network] URI와 URL의 차이점 1. 서론 최근 네트워크 관련 웹 문서나 도서를 많이 읽는 데 어떤 부분에서는 URL로 칭하고 어떤 부분에서는 URI로 칭하는 게 너무 헷갈려서 한 번 정리하고자 포스팅을 작성한다. 잘 모르는 상태에서 볼 때는 분명 형태도 비슷한 것 같은 데 무슨 차이인가 싶기도 하다. 지금부터 그 차이에 대해 명확히 알아보도록 하자. 2. URI(Uniform Resource Identifier)란? Uniform Resource Identifier (URI) consists of a string of characters used to identify or name a resource on the Internet 네트워크 상에서 자원을 식별하기 위한 문자열의 구성이다. URI는 인터넷에서 요구되는 기본 조건으로써 인터.. 더보기
[Network] HTTP란 무엇인가? 1. 서론 최근 백엔드 개발을 진행하다 보니 데이터 송수신 방식(RPC, gRPC 등)에 대해 공부할 기회가 생겼는 데, 그중 제일 기본적인 방식이 HTTP에 대해 생각보다 자세히 모르고 있다는 생각이 들었다. HTTP는 그저 우리가 웹브라우저를 사용하거나 개발할 때 클라이언트와 서버가 정보를 교환하는 가장 기본적인 프로토콜이라는 정도밖에 알지 못해서 좀 더 자세히 알아보고자 이 포스팅을 작성한다. 2. HTTP(HyperText Transfer Protocol)란? 초기에는 HTML과 같은 하이퍼미디어 문서를 주로 전송했지만, 최근에는 Plain text, JSON, XML 등 다양한 형태의 정보도 전송하는 애플리케이션 레이어 프로토콜이다. 초기에는 웹 브라우저와 웹 서버 간의 커뮤니케이션을 위해 디자.. 더보기
[Node.js] PBKDF2 비밀번호 암호화하기 1. 서론 사용자들의 비밀번호 정보를 DB에 저장할 때는 반드시 암호화가 필요하다. 그러기 위한 가장 일반적인 방식이 바로 PBKDF2 방식이다. 오늘은 이 방식이 무엇인지? 그리고 node.js에서는 어떻게 구현할 수 있는지에 대해 알아보자. 2. PBKDF2(Password-Based Key Derivation Function Version 2)란? PBKDF2는 미국 NIST에서 승인받은 사용자 패스워드를 기반으로 키(Key) 유도를 하기 위한 함수이다. 사용자 패스워드에 해시함수, 솔트(Salt), 반복 횟수 등을 지정하여 패스워드에 대한 다이제스트(Digest)를 생성하는 방식이다. Salt란? 비밀번호를 암호화하기 위한 키 값 (절대 외부로 유출되서는 안됨) Digest란? 비밀번호를 Salt.. 더보기
[React Native] 특정 화면에서 화면 고정하기 1. 서론 지난번과 같이 지인의 스타트업 애플리케이션을 react native로 구현하다가 생긴 일이다. 특정 화면에서만 가로 모드로 고정하고 싶어서 이것저것 오픈 소스를 살펴보다가 발견한 모듈이 바로 react-native-orientation이다. 사용법은 매우 간단하므로 아래에서 코드를 보면 이해할 수 있을 것이다. 2. 개발 환경 react-native @0.62.2 typescript @4.0.3 react-native-orientation @3.1.3 3. 구현 방법 나는 아래와 같이 특정 화면에서 가로 모드로 고정하는 코드를 작성했다. 만약 세로 모드를 고정하고 싶다면 아래의 참고 홈페이지를 방문해서 portrait와 관련된 함수를 찾으면 된다. 반드시 useEffect 내에서 return .. 더보기
[React Native] Bottom tab bar 특정 화면에서 안 보이게 설정하기 1. 서론 지인의 스타트업 애플리케이션을 React Native로 제작해주다가 특정 화면에서만 바텀 탭 바가 사라지게 해야 하는 상황이 왔다. 공식 문서를 뒤져봐도 비슷한 코드는 있어도 내가 원하는 코드는 없고 여러 사이트들을 뒤지다가 해결 방법을 찾았다. 해당 사이트에서도 버전 차이 때문인지 문제가 생겨서 응용만 하고 디버깅하며 다시 코딩을 했다. 2. 개발 환경 react-native @0.62.2 typescript @4.0.3 @react-navigation/native @5.7.4 @react-navigation/stack @5.9.1 @react-navigation/bottom-tabs @5.9.0 3. 구현 방법 내가 원하는 플로우는 stack navigation들로 bottom tab ba.. 더보기
[React Native] Dimensions.get('window')와 Dimensions.get('screen')의 차이점 1. 서론 리액트 네이티브 개발 중 모바일 기기의 해상도를 가져올 수 있는 API인 Dimensions를 사용할 일이 있었는 데, 굳이 왜 window와 screen으로 나뉘어 있는지 모르겠어서 검색하고 알아낸 내용을 적고자 한다. 2. 차이점 사실 IOS에서는 window와 screen 둘 중 어떤 것을 쓰더라도 동일하게 적용된다. 다만, Android에서는 다르다. Dimensions.get('window') 위에 보이는 그림 1의 빨간색으로 표시된 부분을 포함하지 않고 영역을 추출한다. Dimensions.get('screen') 위에 보이는 그림 1의 빨간색으로 표시된 부분을 포함하고 영역을 추출한다. [참고] stackoverflow.com/questions/44978804/whats-the-d.. 더보기
[Node.js] slack 연동하기(알림봇 구현) 1. 서론 요즘 협업에서 가장 핫한 communication tool 중 하나는 slack이다. 회사라는 공적인 공간과 집이라는 사적인 공간이 분리된 것처럼, 의사소통 또한 사적인 공간(카카오톡, 인스타 DM 등)과 공적인 공간(slack)을 나누는 것이다. 또한, 공적인 공간에서도 업무에 따른 채널을 생성하며 순도 높은 대화를 이어갈 수 있다. 이렇게 최근 협업 및 스타트업에서 많이 사용하는 slack을 통해 알림봇을 구현한다면 사용자들의 실시간 구매 알림 등으로 편리하게 사용 및 확인할 수 있다. 2. slack token 발급 전제 조건 당연히 slack 계정은 존재해야 한다. google login 기능도 있으니 사용하길 바란다. 다소 복잡한 감이 있으니 잘 따라오기 바란다. 우선, 채팅을 위한 .. 더보기
[Network] SOAP 정리하기 1. 서론 최근 GO 언어를 공부하다 보니 RPC, gRPC에 대해 새롭게 알게 됐다. 아직 자세히는 모르지만 추후 정리하는 포스팅을 쓸 예정이다. 그러다 보니 자연스레 이전에 사용하던 RESTful API에 대한 포스팅을 먼저 작성하려 했는 데 SOAP 방식이 존재한다는 사실을 알고, 궁금증이 생겨 공부를 하며 이 포스팅을 먼저 작성하게 됐다. SOAP, RPC, gRPC, RESTful API 등은 모두 각기 다른 온라인 데이터 전송 방식이다. 각각의 특성과 장단점이 존재하기 때문에 알아두면 좋을 것 같아 시리즈물로써 포스팅을 작성해보려 한다. 그럼 SOAP 방식에 대한 정리를 시작해보자. 2. SOAP란 무엇인가? SOAP란 Simple Object Access Protocol의 약자로 객체 접근을.. 더보기