셩잇님의 잡동사니

🎞 부록  지난 시간에는 엔티티 프레임워크 코어의 데이터 모델링에 대해서 학습하였다. 데이터 모델링은 크게 관례형, 데이터 주석형, 플루언트 API 형이 있다. 어떤 걸 사용해야 하는지는 필요로 하는 기능에 따라 각각의 종류를 알맞게 사용하면 되는 것 까지 알아보았다. 이번 시간에는 일전에 학습하였던 엔티티 프레임 코어의 데이터 관계 모델링에 대해서 알아보는 시간을 가져보도록 한다.  💥 EF Core 데이터 관계 모델링  일전에 배운 것은 '엔티티 프레임워크 데이터 모델링'이였다면, 오늘 배울 것은 엔티티 프레임워크 데이터 관계 모델링'이다. 용어가 비슷하니 헷갈리지 말자. 이번 주제는 데이터 관계를 어떤식으로 모델링을 해서 엔티티 프레임워크에게 넘겨줄까? 이다.   먼저 관계라는 것이 무엇인지 알..

🎞 부록  지난 시간에는 Unity와 WebApi를 연동시켜주었다. Unity와 WebApi를 연동시켜주는 것은 이전 시간에 학습했었던 Blazor와 WebApi를 연동시켜주는 것과 크게 다를 것이 없었다. Blazor를 통해 이용했을 때에는 HttpClient를 사용했지만, 유니티에서는 HttpClient가 아닌 WebRequest를 사용해야 했다. 이 후 REST를 구현하기 위해 CRUD를 함수를 모두 만들어 구현했다. 구현하는 과정에서는 크게 다를 것이 없어서 어려움은 딱히 없었다. 이번 시간에는 일전에 학습하였던 Entity Framework에 대해서 조금 더 심화과정으로 알아보는 시간을 가져보도록 한다.  💥 EF Core 데이터 모델링  엔티티 프레임워크는 일전에 아무런 개념도 모른체 그냥..

🌀 WebAPI와 REST 서비스  지난 시간에는 Blazor와 WebApi를 연동시켜주었다. 이를 통해 ApplicationDbContext를 사용하지 않고 HttpClient를 사용하여 Blazor와 WebApi와 서로 통신할 수 있도록 처리해주었다. 이 후 각각의 CRUD를 Json을 통해 전달하면서 SerializeObject, DeserializeObject를 통해 JSON 형태 ↔ Objectc 형태로 변환하는 과정을 통해 통신하였다. 이번 시간에는 Unity와 WebApi 프로젝트를 연동시켜 보는 시간을 가져보도록 한다.  🐊 Unity와 WebApi 연동  기본적으로 Unity와 WebApi를 연동하는 것은 크게 Blazor와 다르지 않다. 유니티 허브에서 WebTest 프로젝트를 새롭..

🌀 WebAPI와 REST 서비스  지난 시간에는 CRUD 중 R을 제외한 Create, Update, Delete에 대해서 구현하고 학습해보았다.이 후 마찬가지로 Postman 툴을 사용하여 구현한 스크립트가 정상적으로 작동하는지 확인하였다. 이번 시간에는 일전에 사용하였던 RankingApp Blazor 프로젝트와 WebApi 프로젝트를 연동시켜 보는 시간을 가져보도록 한다.  🐊 Blazor와 WebApi 연동  이번 시간에는 Blazor 프로젝트와 WebApi를 연동할 것이다. 먼저 RankingApp에 산하에 있는 Models 폴더와 gameResult를 삭제해주도록 한다. 왜냐하면 일전의 WebApi 프로젝트를 진행할 때 GameResult를 공용 데이터인 SharedData 프로젝트에서 ..

🌀 WebAPI와 REST 서비스  지난 시간에는 REST의 개념과 활용을 통해 CRUD 중 R을 맡고 있는 Read에 대해서 구현하고 학습해보았다. 또한 수동으로 데이터를 DB에 넣어주고 Postman 툴을 사용하여 수동으로 넣어준 데이터를 직접 작성한 Read 코드로 데이터를 조회하였다. 이번 시간에는 CRUD의 나머지 부분을 마저 구현하는 시간을 가져보도록 한다.  🐊 WebApi #3  오늘은 이전 시간에 이어서 REST의 나머지 부분인 C/U/D 부분을 만들어주도록 하자. Create부터 만들어주도록 하자. Create의 경우 POST 메서드와 Body에 데이터를 넣어준다고 하였으므로 아래와 같이 코드를 작성해준다. using Microsoft.AspNetCore.Http;using Micr..

🌀 WebAPI와 REST 서비스  지난 시간에는 Blazor가 아닌 WebApi와 REST 서비스를 통해 Blazor와 WebApi 연동, 더 나아가 Unity와 WebApi를 연동하는 첫 번째 시간을 가져보았다. 새로운 프로젝트를 .Net Core Web App로 만들어주고, 마찬가지로 공용 데이터를 저장할 프로젝트도 하나 더 만들어 주었다. 이 후 ApplicationDbContext 스크립트를 만들어 DB 연동을 위해 PM을 통해 마이그레이션을 진행을 했다. 이번 시간에서는 본격적으로 웹 API를 만들어 보는 시간을 가져보도록 한다.   🐊 WebApi #2  웹 API를 사용하기 위해 프로젝트에 Controllers 폴더를 만들어주고, 해당 폴더 산하에 API 컨트롤러 - 비어있음 형태의 R..

🌀 WebAPI와 REST 서비스  지난 시간까지 Blazor를 통해 미니 프로젝트인 RankingApp를 만들어보며 Entity Framework와 DB 그리고 CRUD를 통해서 실습을 진행해보았다. 이번 시간에서는 Blazor가 아닌 WebApi와 REST 서비스를 통해 Blazor와 WebApi 연동, 더 나아가 Unity와 WebApi를 연동하는 시간을 가져보도록 한다.  🐊 WebApi #1  Blazor는 C#을 통해 클라이언트 단도 만들 수 있기 때문에 굉장히 유용하다. 그렇지만 블레이저는 HTML 형식을 보낸 다음에 이를 SPA 방식을 통해 필요한 부분만 받아 갱신하는 것이 핵심이었다.  하지만 우리는 Unity를 통해 웹 서버와 연동을 필요로 한다. 따라서 지금까지 해왔던 블레이저와 ..

🥪 Blazor 미니 프로젝트  지난 시간에는 이전에 만들었던 RankingApp 프로젝트에 CRUD 기능 중 하나인 Create를 구현해보았다. 이번 시간에는 CRUD 중 남은 U/D인 Update, Delete를 직접 구현하는 시간을 가져보도록 하자.  🌅 RankingApp #4 Update/Delete  Entity와 Blazor를 통한 DB 연결이 무척 쉽기 때문에 이럴꺼면 SQL을 왜 배웠나 싶다. 하지만 그렇게 생각하면 오산이다. 왜냐하면 항상 ORM을 사용하는 것이 아니기 때문이다. C# 같은 경우 엔티티 프레임워크가 존재하기 때문에 사용할 수 있지만, C++의 경우 ORM을 딱히 사용하지 않아 이전과 같이 한땀한땀 처리해야 한다.  물론 C++에서도 일일히 다 노가다로 만들어 전송하는..

🥪 Blazor 미니 프로젝트  지난 시간에는 이전에 만들었던 RankingApp 프로젝트에 게임 결과 및 데이터 저장, 조회 등 다양한 기능을 추가 개발하였다. 이를 통해 CRUD 중 Read를 처리하였다. 이번 시간에는 CRUD중 Create를 직접 구현하는 시간을 가져보도록 하자.  🌅 RankingApp #3 Create  이전에 만들어준 Ranking 레이저 컴포넌트에서 gameResult 데이터 결과를 보여주는 부분을 로그인한 사용자에게만 보여줄 수 있도록 인증 처리를 진행한다. 로그인한 유저에게만 데이터를 보여주고, 그렇지 않은 유저에게는 데이터를 보여주지 않도록 하는 것이다. 해당 부분은 Shared 폴더 내 LoginDisplay 레이저 컴포넌트를 참조하도록 하자. @page "/ra..

🥪 Blazor 미니 프로젝트  지난 시간에는 Blazor에서 미니 프로젝트인 RankingApp을 만들기 위해 새로운 프로젝트와 데이터베이스를 생성하고 이를 연결해주었다. 이번 시간은 이전에 만들었던 RankingApp 프로젝트에 게임 결과 및 데이터 저장, 조회 등 보다 다양한 기능을 추가 개발하는 시간을 가져보도록 한다.   🌅 RankingApp #2 모델링  랭킹 시스템을 만들기 위해 어떤 게임의 결과물을 저장하고, 이를 읽어오는 예제를 만들도록 하자. 이를 직접 모델링하는 실습을 한다고 생각하면 된다. 먼저 Data 폴더 밑으로 Models와 Services 폴더를 만들어주도록 하자. Models 폴더 밑으로는 GameResult C# 스크립트 파일을 만들어준다.  해당 스크립트는 게임 결..

🥪 Blazor 미니 프로젝트  지난 시간에는 Blazor에서 Javascript 연동하는 이유와, 그 방법에 대해서 알아보았다. 왜 자바 스크립트를 써야하는지, 또 어떻게 사용하는지 알아보았다. 이 후 자바스크립트로 생성한 값을 C#으로 받거나 C#으로 생성한 값도 자바스크립트로 받는 처리를 진행하였다. 이번 시간부터는 Blazor에서 RaningApp 프로젝트를 통해 직접적으로 실습 해 보며 학습하는 시간을 가져보도록 한다.   🌅 RankingApp #1 프로젝트 생성  먼저 기존의 사용하던 프로젝트는 '인증'에 대한 설정 값을 변경하지 않았기 때문에 프로젝트를 다시 새롭게 만들어주도록 하자. 랭킹을 보여주기 위한 작업을 진행할 것이며, DB에서는 CRUD 연산을 통해 이를 실습할 것이다. 먼저..

🦮 Blazor 입문  지난 시간에는 State 관리에 대해서 학습하는 시간을 가져보았다. Counter Nav 메뉴에서 클릭하여 숫자를 올려도, 다른 탭을 왔다갔다 할 경우 클릭하여 숫자를 올린 값이 다 사라져서 문제가 되었지만, 이를 Scoped를 통해 처리하였고 이 후, UI가 갱신되지 않는 현상도 마찬가지로 이벤트와 StateHasChanged를 통해 처리하여 실시간으로 갱신이 되게끔 처리하였다. 이번 시간에는 Blazor에서의 Javascript 연동에 대해서 학습하는 시간을 가져보며, 마찬가지로 직접 실습하며 페이지를 제작해보도록 한다.  🏄‍♀️ Javascript 연동  먼저 왜 자바 스트립트를 써야 할까?, 이는 이전에 배운 State 관리와 이어진다. 이전 시간에 우리는 Counte..

🦮 Blazor 입문  지난 시간에는 Form의 대해서 학습하는 시간을 가져보았다. Blazor에서 Form은 Modal을 통해서 header와 content를 나눠서 처리하였고, 값을 입력하는 부분에서 아무 내용을 넣지 않을 경우 그냥 저장되는 문제가 있어 Validation을 통해 이를 검증하고 확인하는 것까지 알아보았다. 이번 시간에는 State 관리 개념에 대해서 학습하는 시간을 가져보며, 마찬가지로 직접 실습하며 페이지를 제작해보도록 한다.  🏄‍♀️ State 관리  먼저 기존의 사용하던 BlazorApp, BlazorStudy 프로젝트를 삭제하고, 새롭게 BlazorApp 프로젝트를 하나 만들어 주도록하자. 이 후 프로그램을 실행하면, Counter 메뉴에서 Click Me를 클릭할 때마..

🦮 Blazor 입문  지난 시간에는 Blazor의 SPA의 개념에 대해서 상세하게 학습하는 시간을 가져보았다. SPA는 Single Page Application으로 갱신이 필요한 일부분만 갱신 처리해주는 개념이었다. 이후 Router를 통해 URI 요청이 올 경우 어떠한 컴포넌트를 보여줘야 하는지 규칙을 설정하는 것 까지 알아보았다.  이번 시간에는 Form, Validation의 개념에 대해서 학습하는 시간을 가져보며, 이 또한 직접 실습하며 페이지를 제작해보도록 한다.  🏄‍♀️ Form  이번 시간에는 기존에 사용하던 BlazorStudy 프로젝트를 활용하여 학습할 것이다. 이번에는 FetchData를 통해 Form을 만들고, 만든 Form을 활용하여 기존에 있던 WeatherForecast..

🦮 Blazor 입문  지난 시간에는 Blazor의 Dependency Injection의 개념에 대해서 학습하는 시간을 가져보았다. Dependency Injection는 말 그대로 의존성 주입을 뜻하는데, Program에 내가 사용할 서비스를 AddSingleton으로 처리하여 특정 서비스를 new를 통해 새롭게 생성하는 것이 아닌 임의로 지정하여 이를 처리할 수 있었다. 이 후 ASP.NET 차원에서 PaymentSevice까지 생성자에서 자동으로 특정 서비스를 찾는 것 까지 살펴보았다. 마지막으로 Program에서 사용되는 Singleton, Transient, Scoped  서비스의 생명주기까지 파악해보았다. 이번 시간에는 SPA 구조, Router의 개념에 대해서 학습하는 시간을 가져보며, ..

🦮 Blazor 입문  지난 시간에는 Blazor의 Templated Component의 개념에 대해서 학습하는 시간을 가져보았다. Templated Component는 말 그대로 템플릿 컴포넌트 인데, 여기서 말하는 템플릿은 C#의 제네릭과 동일하다는 의미를 가진다. 따라서 Templated Component를 사용하여 붕어빵처럼 컴포넌트를 찍어낼 수 있다. 이 때에 RenderFragment를 사용하고, 타입을 선언하는 것을 razor에서는 @typeparam을 통해 대체하는 것 까지 알아보았다. 이번 시간에는 Dependency Injection 라는 개념에 대해서 학습하는 시간을 가져보며, 이 또한 직접 실습하며 페이지를 제작해보도록 한다.  🏄‍♀️ Dependency Injection  ..

🦮 Blazor 입문  지난 시간에는 Blazor의 Cascading Parameter의 개념에 대해서 학습하는 시간을 가져보았다. Cascading Parameter을 사용하여 User에 있는 List 형태의 _options을 ShowUser에서도 사용하였으며, 아울러 부모-자식 관계를 넘어 손자, 증손자까지에게도 이를 적용할 수 있는 것에 대해서 알아보았다. 이번 시간에는 Templated Component 라는 개념에 대해서 학습하는 시간을 가져보며, 이 또한 직접 실습하며 페이지를 제작해보도록 한다.  🏄‍♀️ Templated Component  Templated Component. 단어 그대로 직역하자면 '템플릿 컴포넌트'이다. 여기서 말하는 템플릿의 개념은 C++ 개발자라면 대충 눈치를 ..

🦮 Blazor 입문  지난 시간에는 Blazor의 Parameter, Ref, EventCallback 등 다양한 개념에 대해서 학습하는 시간을 가져보았다. 파라미터User와 ShowUser 컴포넌트를 넘나들며 기존에 사용하던 _users 데이터를 ShowUser에서도 사용할 수 있도록 설정하였다. 이후 Ref, Action, EventCallback을 사용하여 부모-자식 관계인 User와 ShowUser 컴포넌트 사이 사용되는 함수를 서로 참조하면서 사용할 수 있도록 설정해보았다. 이번 시간에는 Cascading Parameter 라는 개념에 대해서 학습하는 시간을 가져보며 이 또한 직접 실습하며 페이지를 제작한다.    🏄‍♀️ Cascading Parameter  이어서 알아볼 내용은 Casc..

🦮 Blazor 입문  지난 시간에는 Blazor의 Binding의 추가적인 내용에 대해서 학습하는 시간을 가졌다. 첫 번째 내용은 HTML의 속성에도 바인딩 할 수 있는 것과 두 번째 내용으로는 conditional atrribue 속성 자체에도 조건을 붙일 수 있다는 것이다. 이번 시간에는 Parameter, Ref, EventCallback 등 다양한 개념에 대해서 학습하는 시간을 가진다. 이번에도 직접 실습해보며 페이지를 제작해보자.    🏄‍♀️ Parameter, Ref, EventCallback   우리가 지금까지 페이지를 만들 때 보면 레이저 컴포넌트를 활용해 페이지를 만들 수 있었다. 그리고 이러한 컴포넌트라는 말에서 비롯하여 여러 스크립트를 부품화하여 조립해 페이지를 구성한 것을 알..

🦮 Blazor 입문  지난 시간에는 Blazor의 Binding을 User.razor 스크립트를 통해 실습해보며 간단한 페이지를 제작하는 시간을 가져보았다. 이번 시간에는 일전에 학습한 Binding의 추가적인 내용에 대해서 보충하는 시간을 가진다. 마찬가지로 이번에도 직접 실습해보며 간단한 페이지를 제작하는 시간을 가져보며 학습해보도록 한다.    🏄‍♀️ Binding 보충  Binding은 HTML의 속성(attribue)에도 바인딩 할 수 있다. 따라서 기존에 작성한 User.razor 스크립트의 유저 추가 class의 버튼을 아래와 같이 변경하여 사용할 수 있다. @page "/user"... Add a User @code{ // 유저 데이터 생성 List..