프레듀 원격평생교육원

과목정보

[HD]Blazor(블레이저)를 사용하여 풀스택 웹 개발 하기 Part.1-2

강사명 차시 학습시간 샘플
박용준 20 6 시간
모두보기
과정소개
학습대상
학습목표
학습내용

과정소개

본 과정은 Blazor와 C#을 사용하여 풀스택 기반으로 웹앱을 만드는 방법을 살펴봅니다.

학습대상

최신의 Blazor(블레이저)를 사용하여 웹앱을 만들고자하는 학생 또는 개발자

학습목표

Blazor와 C#을 사용하여 풀스택 기반으로 웹앱을 만드는 방법을 살펴봅니다.
최근 유행하는 웹 개발 방식인 SPA(Single Page Application) 방식으로 구현할 때 Blazor를 사용하면 편리하게 구현이 가능합니다.
웹 응용 프로그램 제작시 자주 사용되는 CRUD 및 페이징, 팝업, 차트 출력, 파일 업로드 등의 기능을 하나의 웹앱으로 통합해서 데모로 보여줍니다.

학습목표

1. 관리자 모드 작성용 부트스트랩 템플릿인 SB Admin 2 다운로드 및 Admin 프로젝트에 적용
2. 대시보드 템플릿에 ChartJs.Blazor 컴포넌트 샘플 코드를 적용하기
3. MatBlazor NuGet 패키지를 설치하고 머티리얼 디자인 형태로 폼을 꾸미는 컴포넌트 사용하기 데모
4. VisualAcademy 솔루션에서 사용할 웹 및 API 등의 프로젝트 미리 생성
5. Samples 폴더 생성 후 강의 데모 소스 모아놓기
6. TabDemo_Bootstrap의 Tab 기능을 자바스크립트 방식과 Blaozr 방식으로 적용하기
7. 현재 사이트에서 사용된 기술 리스트와 추천 사이트 출력하는 컴포넌트 만들기
8. JavaScript Interop을 사용하여 Bootstrap Carousel 컴포넌트를 실행하도록 설정
9. VideoAppCore 솔루션 생성 및 GitHub Private 저장소에 업로드
10. 비디오 앱을 위한 Videos 테이블 생성 및 로컬 DB에 게시
11. Videos 테이블과 일대일로 매핑 Video 모델 클래스 생성
12. Videos 테이블에 대한 CRUD API 명세서 가이드용 인터페이스 생성
13. 리포지토리 인터페이스를 상속하는 3가지 리포지토리 클래스 만들기
14. DbContext 클래스 생성 및 웹 프로젝트의 DI 컨테이너에 DbContext 클래스 등록
15. VideoDbContext 사용 테스트 레이저 컴포넌트 페이지 작성
16. 여러 DBMS를 편하게 대응하기위해서 Created 컬럼을 DateTimeOffset에서 DateTime으로 변경
17. 레코드에 대한 상태 추적을 위한 4개의 속성 제공하는 AuditableBase 클래스 생성 및 상속
18. 비동기 메서드를 제공하는 인터페이스와 이를 상속하는 리포지토리 클래스 생성
19. 3가지 형태의 리포지토리 클래스 코드 구현 후 DI 등록 후 테스트 페이지에서 테스트
20. Videos_비디오 리스트를 출력하는 Index 컴포넌트 작성