BlazorCsharp

C# Blazor로 배우는 프론트엔드의 기초

Goal

프론트엔드의 기초를 이해하고 Blazor를 이용하여 웹 어플리케이션을 만드는 실습을 한다.

Target

• 프론트엔드의 기초를 알고 싶은 사람
• Blazor의 사용법을 배우고 싶은 사람

Contents

• Frontend 1일차 : Web, Blazor 소개, HTML, CSS, JS, C# 베이직, 환경 구축

  • Web개발의 이해
  • 웹 서버, 웹 애플리케이션 서버, 클라이언트 구조와 상호작용
  • URI와 URL의 이해
  • HTTP의 이해
  • Frontend 소개
  • HTML, CSS, JavaScript의 관계와 상호작용
  • 프론트엔드 프레임워크의 기능
  • 프론트엔드 웹 디자인
  • Blazor 소개
  • HTML 언어 베이직
  • CSS 언어 베이직
  • HTML & CSS를 사용한 정적인 자기소개 페이지 만들기
  • JS 언어 베이직
  • C# 언어 베이직
  • 환경 설정

• Frontend 2일차 : ASP.NET Core Blazor fundamentals & tutorial

  • ASP.NET Core Blazor fundamentals
    • An introduction to Blazor for ASP.NET Web Forms developers
    • Architecture comparison of ASP.NET Web Forms and Blazor
    • Blazor app hosting models
    • Project structure for Blazor apps
    • App startup
    • Build reusable UI components with Blazor
    • Pages, routing, and layouts
    • State management
    • Forms and validation
    • Work with data
    • Modules, handlers, and middleware
    • App configuration
  • tutorial
    • Blazor를 사용하여 첫 번째 웹앱 빌드
    • Blazor를 사용하여 할 일 목록 빌드
    • Blazor를 사용하여 커넥트 4게임 빌드

• Frontend 3일차 : ASP.NET Core Blazor fundamentals

  • Blazor를 사용한 웹 개발 소개
  • Blazor 웹앱에서 데이터와 상호 작용
  • 페이지, 라우팅 및 레이아웃을 사용하여 Blazor 탐색 개선
  • Blazor 웹앱에서 폼 및 유효성 검사의 작동 방식 개선
  • Blazor 웹앱에 대한 풍부한 대화형 구성 요소 빌드
  • Blazor를 통해 재사용 가능한 구성 요소 빌드

Reference

• https://github.com/dotnet-presentations/blazor-workshop?tab=readme-ov-file
• https://learn.microsoft.com/en-us/training/paths/build-web-apps-with-blazor/
• https://learn.microsoft.com/en-us/dotnet/architecture/blazor-for-web-forms-developers/