전체 글 72

IdentityServer 학습 #2

(1) IdentityServer가 추가되어있는 솔루션에 새로운 API 프로젝트를 추가해 줍니다. dotent new webapi -n {프로젝트명} --no-openapi (2) 해당 프로젝트를 솔루션에 추가해 줍니다. dotnet sln add ./src/{프로젝트폴더} (3) Microsoft.AspNetCore.Authentication.JwtBearer 라이브러리를 Nuget에서 설치해 줍니다. dotnet add ./{프로젝트폴더} package Microsoft.AspNetCore.Authentication.JwtBearer (4) 추가한 프로젝트의 Program.cs 를 다음과 같이 수정합니다. using System.Security.Claims; var builder = WebApplic..

개발이야기 2024.03.07

IdentityServer 학습 #1 - 기본셋팅

본 내용은 다음 원문을 정리한 글입니다. 원문링크 : https://docs.duendesoftware.com/identityserver/v7/quickstarts/1_client_credentials/ 예제 프로젝트 생성 순서 * 본문의 작성 기준은 .net8을 기준으로 작성되었습니다. (1) 다음 명령으로 Duende.IdentityServer.Templates를 설치해 줍니다. dotnet new install Duende.IdentityServer.Templates (2) 빈 솔루션 하나를 생성해 줍니다. dotnet new sln -n {솔루션명칭} (3) 빈 IdentityServer 템플릿을 추가합니다. dotnet new isempty -n IdentityServer (4) 솔루션에 프로젝..

개발이야기 2024.03.07

Blazor + Efcore로 웹사이트 만들기 (2)

이제 Efcore를 설치할 차례인데, 정식 명칭은 EntityFramework Core로, 나름 Microsoft의 철학이 녹아든 ORM입니다. 초기부터 Code First, Db First 등과 같이 다양한 방법으로 DB를 제어하는 기능해왔으며, 현재는 이 Entity framework와 유사한 접근 방식을 Node.js에 TypeORM이나 Sequelize 같은 orm 들이 따라하고 있습니다. Db 테이블을 하나의 Entity와 매칭하여 관리하는 것은 굉장히 큰 메리트를 제공하며, Dotnet의 linq, lambda와 함께 "아름다운 코드"를 생성하는 극한의 매력을 선사합니다. 저는 2014년도에 처음 이 Entity framework를 접했고, 당시에 java 코드가 C# 코드랑 거의 똑같다고 생..

개발이야기 2024.02.06

Blazor + Efcore로 웹사이트 만들기 (1)

Microsoft에서 만든 웹어셈블리 기술이 Blazor 입니다. 웹소켓 기술인 SignalR과 연계되어, 전통적인 서버사이드 방식 외에도 클라이언트 사이드 방식을 제공하여, 프론트엔드 영역으로까지 확장된 기술이라고 볼 수 있습니다. 국내에서는 거의 활용되고 있지 않지만, 가끔씩 만나볼 수 있습니다. 본 프로젝트의 의의는 C# 이라는 언어 하나만 가지고도 온전한 웹사이트를 구성할 수 있다는데 있습니다. 물론 그럼에도 불구하고 웹에 대한 이해는 반드시 필요합니다. (HTML, CSS, Javascript) 웹에 대한 이해를 바탕으로 C#으로 거의 모든 구성이 가능한 웹서비스, 블레이저(Blazor)를 만나봅시다. 먼저 vs2022에서 프로젝트를 생성해 봅시다. Blazor Web App을 선택하고 다음 버..

개발이야기 2024.02.05

Apps로 구성한 nest.js를 한번에 실행시키기

Apps로 구성된 nest.js에 프로젝트는 기본적으로 다음과 같은 명령으로 실행시킵니다. npm run start:dev targetproject 문제는 이런 식으로는 한번에 하나씩만 실행이 가능하니 여러 프로젝트를 동시에 테스트할 생각이라면 다음과 같은 배치 파일을 만들어 놓으면 편할 것입니다. 먼저 pm2를 설치해 줍니다. 동시 실행하여 전체 프로세스를 테스트하기 위함이므로, 일괄 실행을 위해 pm2로 매니징을 할 것입니다. npm install -g pm2 이번에는 batch 파일을 만들어서 일괄로 실행시키고, 일괄로 중지하도록 해보겠습니다. 다음과 같이 3개의 batch 파일을 만들어 줍니다. 먼저 start.bat 파일입니다. @echo off echo compiling start /B npm..

개발이야기 2024.02.02

MSA를 위한 Nest.js의 app 생성 명령

먼저 Nest.js의 프로젝트를 생성해 봅니다. nest new multiapp 리포지토리 선택자에서 npm을 선택해 줍니다. (자신에게 맞는 것을 선택해 줍니다.) 그럼 프로젝트의 각 요소들이 설치가 되는 화면이 보여집니다. 이제 해당 폴더로 이동한 다음, app 명령을 통해, 하나의 프로젝트에 2개 이상의 백엔드 api 를 구축할 수 있게 됩니다. 다음 명령을 입력해서 member app을 추가해 봅시다. nest g app member 프로젝트가 설치된 상황을 VS CODE로 확인해 봅시다. 보다시피, 먼저 설치한 프로젝트와 나중에 app 명령으로 추가한 member가 apps 폴더 아래에 나란히 배치됩니다. 둘은 동급 요소로써 취급됩니다. 이제 app 명령으로 필요한 만큼 프로젝트를 얼마든지 추가..

개발이야기 2024.02.01

자바스크립트의 배열 다루기

자바스크립트 배열의 메소드가 어떤게 있는지 예시로 한번에 살펴보자. [3, 4, 5, 6].at(1); // 4 [3, 4, 5, 6].pop(); // [3, 4, 5] [3, 4, 5, 6].push(7); // [3, 4, 5, 6, 7] [3, 4, 5, 6].fill(1); // [1, 1, 1, 1] [3, 4, 5, 6].join("-"); // '3-4-5-6' [3, 4, 5, 6].shift(); // [4, 5, 6] [3, 4, 5, 6].reverse(); // [6, 5, 4, 3] [3, 4, 5, 6].unshift(1); // [1, 3, 4, 5, 6] [3, 4, 5, 6].includes(5); // true [3, 4, 5, 6].map((num) => num + 6..

개발이야기 2024.01.29

타입스크립트로 프로젝트 기본 생성하기

기본적으로 js 기반의 프로젝트들은 프로젝트 명을 작성할 때 [소문자]로만 해주는 것이 좋다. 리액트의 경우 npx create-react-app [project name] --template=typescript 뷰의 경우 vue create [project name] 위와 같이 지정하면 선택 메뉴가 등장한다. 메뉴얼을 선택해주자. 그럼 초기 설정값을 내가 선택할 수 있게 되는데, 기본적으로 Babel과 Linter만 선택되어 있다. TypeScript, Router, Vuex 등을 추가 선택해주자. 위아래 키보드로 이동해서 스페이스바를 눌러주면 선택된다. 선택이 끝났으면 엔터를 눌러주자. Vue의 버전을 선택하는 화면이 나온다. 3.x를 선택해 주자. 이번에는 class-style component 신..

개발이야기 2024.01.29
반응형