개발 [Network] HTTP 상태(응답) 코드 정리하기 1. 서론 백엔드 개발자로서 HTTP 기반 서버를 생성할 때 가장 중요한 점 중 하나는 HTTP 상태 코드를 알맞게 사용하는 것이다. HTTP 상태 코드는 매우 잘 정리된 형식으로, 이 상태 코드만 확인하더라도 클라이언트가 서버로 보낸 요청에 대한 응답이 성공인지 실패인지 또한, 구체적으로 어떤 성공인지 어떤 실패인지를 자세히 알 수 있다. 이는 백엔드 개발자와 프런트엔드 개발자 모두에게 장점으로 작용한다. 물론, 더 자세한 정보들을 추가적으로 보내는 경우도 있지만, 상태 코드를 맞춰둔다면 코드 리뷰는 물론, 프런트 엔드 개발자들이 API 호출 결과에 따른 예외처리를 진행하는 게 훨씬 수월할 것이다. 그럼 HTTP 상태 코드의 종류와 쓰임새에 대해 알아보도록 하자. 2. HTTP 상태 코드의 좋은 예시/.. 더보기 [Python] Ubuntu:18.04 에서 jupyter notebook 사용하기 1. 서론 빠른 개발을 원하는 환경에서는 jupyter notebook을 사용하는 경우가 많다. 워낙 편리하기도 하고 직접 AWS 같은 서비스를 사용할 때도 콘솔로 접속하지 않아도 사용할 수 있기 때문이다. 물론, 개발 단계에서는 이렇게 사용하지만 운영 단계에서는 jupyter notebook은 이용하지 않는 게 좋다. 보안에 취약점이 될 수 있기 때문인데, 물론 보안에 그만큼 신경을 쓴다면 써도 괜찮지 않을까 하는 생각이 든다. 그럼 Ubuntu:18.04 환경에서 jupyter notebook을 설치하는 방법에 대해 알아보자. 2. jupyter notebook 설치 # 주피터 노트북 설치 sudo apt-get update sudo apt-get install python3-pip -y sudo p.. 더보기 [Node.js] Socket.io 간단한 채팅 구현하기 1. 서론 오늘은 socket.io를 통한 웹소켓 연결을 진행해보도록 하자. 이번에는 간단하게 html 클라이언트와 연결해서 간단한 채팅을 구현해볼 예정이다. 크게 어려운 부분은 없으므로 잘 따라오면 socket.io가 이런 거구나 정도는 이해할 수 있을 것이다. 2. 결과 화면 UI는... 말을 아끼자... 일단 아래의 코드를 작성 후 실행하면 이렇게 채팅이 최종적으로 구현된다. 3. 환경 설정 개발 환경은 특별한 점은 없고 아래와 같이 코드를 작성할 폴더와 필수적인 모듈을 설치해보자. socket.io는 반드시 2.3.0 버전을 아래와 같이 설치해야한다. # 폴더 생성 및 열기 mkdir socketio-practice cd socketio-practice # package.json 생성 npm in.. 더보기 [React Native] 커스텀 로딩 애니메이션 스크린 구현하기 1. 서론 배달의 민족 등과 같은 어플을 보면 로딩 중 커스터마이징 한 로딩 화면을 볼 수 있다. 이런 화면을 만드려면 어떻게 해야 할까 생각을 하다가 직접 setInterval 함수를 사용해서 구현해봤다. 2. 결과 화면 5초 짜리 GIF 파일이어서 다소 끊기는 느낌이 나지만 실제 동작 과정은 훨씬 자연스럽다. 3. 환경 설정 react native 0.62.2 버전을 typescript와 함께 설치한다. 또한, 아래와 같은 파일 경로를 생성한다. 필요한 이미지 파일은 이 파일을 설치해서 압축을 풀어 사용하면 된다. 📦src ┣ 📂Assets ┃ ┗ 📂Images ┃ ┃ ┣ 📜0.png ┃ ┃ ┣ 📜1.png ┃ ┃ ┣ 📜10.png ┃ ┃ ┣ 📜11.png ┃ ┃ ┣ 📜12.png ┃ ┃ ┣ 📜13... 더보기 [React Native] 배경 이미지 크기 자동으로 맞추기 1. 서론 출시 준비중인 어플리케이션의 백그라운드 이미지를 설정하다가 width, height를 각각 100%로 지정했음에도 기기 해상도 별로 크기가 제각각으로 깨지는 현상이 발생했다. 이에 방법을 찾아보니 생각보다 간단하게 해결되어 이 포스팅을 작성한다. 2. 해결방법 아래의 예시 코드처럼 resizeMode="stretch" 를 적용하면 지정한 크기에 꽉 차게 배경 이미지가 생성되고 해상도에 상관 없이 깨지지 않고 유지된다. 만약, 다른 방식을 원하는 사람들은 아래의 stackoverflow 주소를 들어가면 여러 가지 해결 방법들을 볼 수 있다. import React from 'react'; import Styled from 'styled-components/native'; const Contain.. 더보기 [Node.js] passport Google OAuth 2.0 로그인 사용하기 인증 방식 정리하기 1. Session 기반 인증 방식 2. JWT 기반 인증 방식 3. OAuth 2.0 기반 인증 방식 인증 방식 구현하기 [Node.js] express session 사용하기 [Node.js] passport session 사용하기 [Node.js] JWT 사용하기 [Node.js] passport Google OAuth 2.0 로그인 사용하기 1. 서론 지난 포스팅에서 OAuth 2.0이 무엇이고 종류에 따른 인증 방식에 대해 알아봤다. 그럼 실제로 node.js에서 OAuth 2.0을 통한 구글 로그인을 구현해보도록 하자. 이 포스팅에서 구글 로그인을 구현할 때 사용할 모듈은 passport로 passport로 session을 관리하는 부분이 포함되기 때문에 만약 잘 모르는 부.. 더보기 3. OAuth 2.0 기반 인증 방식 인증 방식 정리하기 1. Session 기반 인증 방식 2. JWT 기반 인증 방식 3. OAuth 2.0 기반 인증 방식 인증 방식 구현하기 [Node.js] express session 사용하기 [Node.js] passport session 사용하기 [Node.js] JWT 사용하기 [Node.js] passport Google OAuth 2.0 로그인 사용하기 1. 서론 지난 포스팅까지 Session과 JWT 기반 인증 방식에 대해 알아봤다. Session과 JWT 기반 인증 방식은 모두 자신의 사이트에서 인증을 진행하기 위한 방식이다. 이 방식들로는 내가 만든 사이트의 유저가 google 또는 facebook 등에 접근할 수 있는 권한을 가질 수 없다. 생각해보면 당연한 것이다. 해당 사이트들이.. 더보기 [Node.js] passport session 사용하기 인증 방식 정리하기 1. Session 기반 인증 방식 2. JWT 기반 인증 방식 3. OAuth 2.0 기반 인증 방식 인증 방식 구현하기 [Node.js] express session 사용하기 [Node.js] passport session 사용하기 [Node.js] JWT 사용하기 [Node.js] passport Google OAuth 2.0 로그인 사용하기 1. 서론 지난 포스팅까지 express-session, jwt에 대한 이론과 실제 모듈 사용까지 진행해봤다. 지난 포스팅까지는 login, logout에 별다른 모듈을 쓰지 않고 구현했지만 오늘은 passport.js를 사용해서 구현해보려 한다. passport.js는 OAuth 2.0을 지원하는 모듈로써 로컬에서 동작하는 로그인도 당연히.. 더보기 이전 1 2 3 4 5 6 7 다음
