본문 바로가기

Blazor/ASP.NET 구글 인증 로그인 만들기 - 2. 구글 클라우드 API 프로젝트 세팅 목차 1. 프로젝트 세팅 2. 구글 클라우드 API 프로젝트 세팅 3. 구글 인증 처리 코드 작성 4. 구글 계정 정보 페이지에 띄우기 구글 클라우드 콘솔에서 API 프로젝트 만들기 구글 클라우드에 접속합니다. https://console.cloud.google.com/apis Google 클라우드 플랫폼 로그인 Google 클라우드 플랫폼으로 이동 accounts.google.com My First Project 와 같은 형태의 버튼을 눌러 새 프로젝트를 생성합니다. 상단 새 프로젝트 선택 프로젝트 이름은 Blazor 프로젝트와 동일하게 GoogleOAuthSample 라고 작성하겠습니다. (반드시 이름이 동일할 필요는 없습니다.) 프로젝트 만들기가 끝나면 해당 프로젝트로 선택하여야 합니다. Googl..
Blazor/ASP.NET 구글 인증 로그인 만들기 - 1. 프로젝트 세팅 소셜 인증을 통한 로그인은 많은 편리함을 주고 있습니다. 가장 큰 장점으로 유저 입장에서 여러 사이트의 아이디, 패스워드를 기억하지 않아도 된다는 것 입니다. 여기서는 구글 인증을 통해 얻어온 이메일 정보를 페이지에 띄어볼 것입니다. 목차 1. 프로젝트 세팅 2. 구글 클라우드 API 프로젝트 세팅 3. 구글 인증 처리 코드 작성 4. 구글 계정 정보 페이지에 띄우기 Blazor 에서 구글 인증 로그인을 하고 DB 연동을 통하여 회원가입하는 기능 구현 방법에 대해 설명드리겠습니다. 새 프로젝트 만들기 블레이저 서버 앱 템플릿 기준입니다. 프로젝트 이름은 GoogleOAuthSample 라고 할게요. 프레임워크는 .NET 6.0 기준이나 7.0 또는 8.0에서도 큰 차이는 없을 것으로 예상됩니다. 프로젝트..
구글 확장프로그램 개발하기 - 현재 페이지에 있는 이미지 다운로드 구글 확장프로그램으로 현재 페이지에 있는 이미지들을 다운로드하는 기능을 만들고 싶어, 서칭을 해보았지만 웹 기술의 고급용어들이 난무하던 것을 본 나는 쓰러질뻔 하였으나.. 간신히 정신을 부여잡고 개발을 하였습니다. 요구하는 기술 HTML, JavaScript 1. 요구사항 살피기 2. 로직 구상하기 3. 구현 4. 프로그램 업로드 5. 완성! 요구사항 살피기 현재 열려있는 페이지에 있는 이미지들을 빠르고 쉽게 다운로드 해버리기 로직 구상하기 다운로드 모듈 1. 일반적으로 웹페이지에서 이미지는 HTML 태그인 로 표현되고, 이미지의 저장 위치는 이런 형태로 작성되므로 img 태그의 src 속성 값(url)들을 얻어온다. 2. 얻어온 src 값(url)에 다운로드 요청을 날린다. 구글 확장프로그램 UI 모듈..
Blazor 실행 시 HTTPS가 아닌 HTTP 프로토콜로 시작하는 방법 Blazor server app 기준입니다. 일반적으로 Blazor 프로젝트를 생성 시 HTTPS 프로토콜로 실행됩니다. HTTP 프로토콜로 실행해야 하는 경우 설정을 바꿔야 합니다. 프로젝트 탐색기에서 Properties/launchSettings.json 파일을 엽니다. applicationUrl 필드에서 https로 시작하는 값을 지웁니다. 그리고 나서 서버를 실행합니다.
Blazor 에서 구글 차트를 사용하는 방법 조직도 | Charts | Google for Developers 이 페이지는 Cloud Translation API를 통해 번역되었습니다. Switch to English 의견 보내기 조직도 컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요. 개요 조직 차트는 조 developers.google.com 구글 차트에서 제공하는 형태 중 사용하는 방법입니다. 차트 중 조직도를 사용한 예시입니다. 목차 1. 프로젝트 생성 2. graph.js 작성 3. _Layout.cshtml 작성 4. Index.razor 작성 5. 완성 1. 프로젝트 생성 Blazor server를 새 프로젝트로 생성했을 때 세팅 되어있는 기본 웹페이지 환경에서 작업을 하겠습니다. 2. graph.js 작성..
유니티 모바일 레이싱휠 조이스틱 만들기 레이싱 게임은 모바일 환경에서 위와 같은 조이스틱을 마련해두고 있습니다. 페달은 유니티에서 기본적으로 제공하는 UIButton을 사용하면 쉽게 구현이 가능하지만 스티어링 휠처럼 원 형태의 입력방식은 기본 제공하지 않기 때문에 직접 구현하여야 합니다. 일반적으로 알려진 스티어링을 조작하는 방법은 잡고 돌리는 것으로 원 운동(회전)임을 알 수 있고, 2차원 평면에서의 회전은 아크탄젠트를 활용하면 어렵지 않게 다룰 수 있습니다. 목차 1. UI 디자인 2. 터치 좌표 가져오기 3. 터치 좌표로부터 회전 값 구하기 4. 스티어링 휠 완성 1. UI 디자인 Canvas를 추가하고 UI 오브젝트를 위와 같은 계층으로 구성합니다. SteeringWheel은 터치 좌표를 입력 받기위해 필요합니다. wheelImg는 스..
이득우의 게임 수학 리뷰 현 시점에서는 게임엔진의 지원으로 원리나 복잡한 수식없이 생각하는 기능들을 쉽게 구현이 가능한 상황입니다. 그러나 최근 반년 사이에 수학의 필요성이 느껴졌습니다. 여러 개의 부모와 자식 사이의 트랜스폼 관계에서 원하는 결과의 값을 계산하여 출력해야하는 상황이 있었습니다. 다행히 유니티에서 다양한 편의 함수들을 제공하기 때문에 그 것을 이용하여 해결할 수도 있습니다. 하지만 게임엔진은 범용적이지 못합니다. 엔진 또는 라이브러리마다 편의 함수들의 사용법과 이름이 다를 수도 있기 때문입니다. '심지어 해당 기능을 하는 함수가 없을 수도 있습니다! 반대로 유니티에 없을 수도 있습니다!' 유니티를 사용하는 사람들끼리만 소통하면 괜찮지만 아닌 경우 문제가 발생합니다. 따라서 해당 기능들을 수식으로 소통을 할 수 있..
제우스랩 Z16p pro max 포터블 모니터 리뷰 제우스랩 Z16p pro max 포터블 모니터를 구입하였습니다. 15만원에 구매하였으며 해외배송으로 배송기간은 3주정도 걸렸습니다. 구성품은 모니터, 모니터 케이스, HDMI 케이블, C-Type 케이블 2개, C-Type 충전기입니다. 전원은 C-Type으로 공급하고 스마트폰 단일로 모니터 전원 공급은 어렵습니다. 모니터의 움직임이 적은 환경에서 꽤 추천할 수 있으나 움직임이 잦은 태블릿과 같은 용도를 원한다면 비추천합니다. (최소 케이블 2개를 매달고 있어야 합니다..) 개인적으로 피아노 악보 뷰어 용도로 구매를 하였습니다. 태블릿을 두고 고민을 하였으나 악보를 보기에는 일반적인 태블릿의 화면 사이즈는 작습니다. 가격 대비 사이즈가 큰 포터블 모니터로 결정하였습니다.