blazor (16) 썸네일형 리스트형 blazor Cookie window.methods = { CreateCookie: function (name, value, days) { var expires; if (days) { var date = new Date(); date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); expires = "; expires=" + date.toGMTString(); } else { expires = ""; } document.cookie = name + "=" + value + expires + "; path=/"; } } @page "/" @inject IJSRuntime JSRuntime @code { private async void CreateCookie(string name.. sessionStorage localStorage 웹에서 상태를 저장할 때 클라이언트(브라우저)에서는 보통 3가지의 방법이 있다. 1. 전통적인 쿠키 (도메인당 쿠키 수 제한, 용량 제한 4KB) 2. HTML5 브라우저 세션 sessionStorage(5MB 제한, 브라우저를 닫으면 지워짐) 3. HTML5 브라우저 스토리지 localStorage (5MB 제한, 따로 지우지 않는 한 계속 유지됨) 쿠키의 경우 서버측 코드로 접근이 가능하지만 2,3번은 불가능하며 별도의 작업(Header, Parameter)에 담아서 서버 측에 전송 가능하다. (쿠키는 매번 서버로 전송 된다 => 네트워크 트레픽 비용 증가) 모던한 웹 개발에선 2,3 번을 주로 권장한다. localStorage 및 sessionStorage는 다음과 같은 차이점이 있습니다. lo.. blazor MatTab @page "/Events" @inject NavigationManager NavigationManager Change Tab Active tab index: @tabIndex Onclick index: @tabClickIndex First Content Second Content Third Content Fourth Content Fourth Content Fourth Content Fourth Content Fourth Content Fourth Content Fourth Content Fourth Content @code { public int tabIndex = 0; public int tabClickIndex = 0; // to redirect the user, do something like .. NavigationManager 시트 MyNavigationManager.Uri #> https://localhost:5001/counter/3?q=hi MyNavigationManager.BaseUri` #> https://localhost:5001/ MyNavigationManager.NavigateTo("http://new location") #> Navigates to new location MyNavigationManager.LocationChanged #> An event that fires when the navigation location has changed. MyNavigationManager.ToAbsoluteUri("pepe") #> https://localhost:5001/pepe MyNavigationManager... BlazorInputFile FileUpload @page "/Up" @using BlazorInputFile @using System.IO @inject IFileUpload FileUpload 단일 파일 업로드 코드 조각 @status @code { string status; private MemoryStream ms = new MemoryStream(); private IFileListEntry[] selectedFiles; void HandleSelection(IFileListEntry[] files) { selectedFiles = files; } private async Task btnSave_Click() { var file = selectedFiles.FirstOrDefault(); if (file != null) { await File.. 생성 주기 OnInit & OnInitAsync 구성 요소가 초기화될 때 실행되는 동기 및 비동기 이벤트. OnInitialized 가 먼저 실행 되고, OnInitializedAsync 가 실행. 구성 요소가 완전히 로드되면 실행. UI의 각 컨트롤이 초기화 이벤트 이후에 발생 하므로, 이 이벤트에서 데이터를 구성. @page "/LifeCycle" 초기화 동기 비동기 Demo @foreach (var item in evtType) { @item } @functions{ List evtType = new List(); //동기 초기화 protected override void OnInitialized() { evtType.Add("OnInitialized 호출."); } //비동기 초기화 protected ove.. 라우팅. 블레이저 서버 앱은 ASP.net Core EndPoint라우팅을 사용하며, ASP.net Core EndPoint 라우팅의 MapBlazorHub 확장 방법을 사용 Blazor 구성요소에 대한 수신 연결을 허용한다. Blazor Client app Blazor Server app 일반적으로 _Host.cshtml 구성요소에 정의 되나, 기본적으로는 아래 설정을 따른다. public void Configure(IApplicationBuilder app, IWebHostEnvironment env) { //요청 URL에 대한 경로 사용 및 계산 설정 app.UseRouting(); //컨트롤러와 해당 핸들러를 실행하는 설정 app.UseEndpoints(endpoints => { endpoints.MapB.. Blazor 소개. C# 만으로 서버 / 클라이언트 개발을 할 수 있게 해 줍니다. Html / Css / Javascript 는 기본적으로는 숙지가 되어야겠지만요... Blazor는 WebAssembly 및 Server의 2개의 호스팅 모델을 제공하며, Razor / Scss / Typescript는 알아두면 좋습니다. 이제 도구 설정을 해 봅시다. 기본적으로는 Windows 10 Home 또는 Pro를 설치하여야 합니다. 1.. NET Core SDK 3.1 이상 설치 Download .NET (Linux, macOS, and Windows) Free downloads for building and running .NET apps on Linux, macOS, and Windows. Runtimes, SDKs, and .. 이전 1 2 다음
