-
[Vue.js] 카카오 소셜로그인 구현하기 (feat.Express)
개요 서비스를 이용하려면, 사용자의 정보를 바탕으로 사용자 인증을 구현해야 할 때가 있다. 대표적인 예로 google 로그인이 있을것이며, 각종 소셜 로그인이 있을테지만 이번 포스팅 에서는 카카오플랫폼을 활용한 소셜 로그인을 Client 에서 구현하고, Server 측 에서 다시 Client 측으로 보내주는 간단한 로직을 구현하여 기록하고자 한다. 카카오 Process 아래의 Process 는 Kakao Developer 에서 제공하는 Docs 이다. 해당 로직을 내가 이해한 대로 간단히 요약하자면, 클라이언트에서 카카오서버에 요청을 보내어 요청을 보낸 사용자가 카카오 서버에 있는 사...
-
[Vue.js] Vue.js 와 Express 서버 연결 시 포트 충돌 해결하기(feat. Port 란?)
개요 Vue.js 는 기본적으로 8080 포트를 사용한다. 하지만, Node.js의 Express 프레임워크에는 기본 포트번호가 없다. 즉, Express 애플리케이션을 실행할 때 포트번호를 직접 지정해주어야한다. Port 개발자들 사이에는 특정 포트번호를 사용하는 일종의 관행이 있다. 로컬 개발 환경에서는 주로 3000, 8000, 8080 포트를 사용한다. 이는, 단순한 관행일뿐 실제 서비스 환경에서는 이런 번호로 설정하지 않는다. 그렇다면, 포트(Port) 번호는 원하는 숫자를 임의로 넣어도 무관한가 ? 원하는 포트번호를 자유롭게 사용해도 되지만, 아래 유의사항이 있으니 참고하자 ...
-
[React-Native] image 라이브러리를 사용하여 다른 사용자들의 프로필 이미지 관리하기 🌁
개요 다음과 같이 구현된 컴포넌트에 등록된 사용자 프로필 이미지를 보여주려고 하는데, 내 정보가 아닌, FlatList 로 구현된 다른 유저들의 정보에 프로필 이미지를 관리하는 컴포넌트를 구현하고, 프로필 이미지가 없는 경우 파란 박스 안에 사용자 이름의 첫 글자를 가져와 이미지 대신 넣어주는 기능을 구현하고자 한다. 이미지 컴포넌트 구현 등록된 이미지를 크게, 확대하여 볼 수 있도록 react-native-image-viewing 라이브러리를 설치하여 적용하려고 한다. https://github.com/jobtoday/react-native-image-viewing Installat...