CSSIsolation 2

[Blazor Web App] 09. CSS 구조 정리하기 - app.css와 .razor.css 역할 나누기

앞에서 로그인 화면과 회원 페이지를 만들면서 CSS도 같이 작성했다.처음에는 페이지가 하나뿐이라 Home.razor.css에 필요한 스타일을 전부 넣어도 괜찮았다.그런데 Member.razor가 생기고, 버튼이나 페이지 박스 스타일이 비슷하게 반복되기 시작했다.예를 들어 Home.razor.css에는 로그인 버튼 스타일이 있었다..login-button { padding: 10px 16px; border: 1px solid #333; border-radius: 4px; cursor: pointer;}Member.razor.css에도 비슷한 버튼 스타일이 필요했다..login-button { margin-top: 16px; padding: 10px 16px; borde..

language/blazor 2026.07.31

[Blazor Web App] 06. 로그인 흐름 확장하기 - 페이지 이동, 회원 페이지, 기본 템플릿 정리

지난 글에서는 로그인 폼의 구조를 정리했다.처음에는 Home.razor 안에서 아이디와 비밀번호를 직접 검사했는데, 이후 LoginRequest, LoginResult, LoginService를 만들면서 입력 데이터와 처리 결과, 로그인 검증 로직을 분리했다.현재 로그인 흐름은 대략 이런 구조가 됐다. Home.razor→ LoginRequest에 입력값 저장→ LoginService.Login(loginRequest) 호출→ LoginResult 반환→ 성공 또는 실패 결과 표시이번에는 여기서 한 단계 더 나아가서, 로그인 성공 후 다른 페이지로 이동하는 흐름을 만들었다.또 로그인 후 이동한 Member.razor 페이지에서 @if, bool, @onclick을 다시 연습했고, 마지막으로 Blazor ..

language/blazor 2026.07.17