[.NET 교육] Day5 오전

Web Brower(css)

HTML Template

brower Markup Language

Template Rendering Service

 

CSS 

CSS ver2 Spark view engine

Razor view Engine

 

NoGet == nodejs npm

 

MVC는 모델 = Data(execution?)

service dataService

 

Person.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;

namespace BlazorApp4.Data
{
    public class Person
    {
        public int Id { get; set; } = default;
        public int Age { get; set; } = default;
        public bool Gender { get; set; } = default;
        public string Name { get; set; } = default;
        public override string ToString() => $"ID: {Id} Age : {Age} Gender : {Gender} Name : {Name}";

    }
    //Poco class ===> DTO 객체 생성 -> JSON 패킷 data transport object serverside 
    //Entity(store service) ORM 객체 entitiy service  save 하면 테이블
    public class Saram
    {
        //column
        public int Id { get; set; } = default;
        public int Age { get; set; } = default;
        public string Name { get; set; } = default;
        //read-Only expression property service;
        public string SaramDisplay =>  $"Age: {Age}   Name : {Name}"; 

        public override string ToString() => $"Age: {Age}   Name : {Name}"; //class override service class 서비스야
        //bad coding 클래스는 무거운 기술임 

    }
}

PersonService.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;

namespace BlazorApp4.Data
{
    public class PersonService
    {
        public Task<Person[]> GetPersonAsync()
        {
            List<Person> people = new List<Person>{
                    new Person{ Id =1,Age=11, Gender =true, Name="Son"},
                    new Person{ Id =2,Age=22, Gender =false, Name="Kim"},
                    new Person{ Id =3,Age=33, Gender =true, Name="Lee"},
                    new Person{ Id =4,Age=44, Gender =false, Name="Park"},
                    new Person{ Id =5,Age=55, Gender =true, Name="Ryu"},
                    new Person{ Id =6,Age=66, Gender =true, Name="Jang"},
                    new Person{ Id =7,Age=77, Gender =false, Name="Um"},
                    new Person{ Id =8,Age=83, Gender =true, Name="Oh"},
                    new Person{ Id =9,Age=94, Gender =false, Name="Min"},
                    new Person{ Id =10,Age=15, Gender =true, Name="Song"},
                    new Person{ Id =11,Age=21, Gender =true, Name="An"}
             };
            return Task.FromResult(people.ToArray());
        }


        //2
        public ValueTask<Person[]> GetPerson2Async()
        {
            List<Person> people = new List<Person>
{
    new Person{ Id =1,Age=11, Gender =true, Name="Son"},
    new Person{ Id =2,Age=22, Gender =false, Name="Kim"},
    new Person{ Id =3,Age=33, Gender =true, Name="Lee"},
    new Person{ Id =4,Age=44, Gender =false, Name="Park"},
    new Person{ Id =5,Age=55, Gender =true, Name="Ryu"},
    new Person{ Id =6,Age=66, Gender =true, Name="Jang"},
    new Person{ Id =7,Age=77, Gender =false, Name="Um"}
    };
            return new ValueTask<Person[]>(people.ToArray());
        }
    }
}

Pages 폴더

HeleleConponent1.razor

@page "/HeleleComponent1"

@using BlazorApp4.Data
@inject SaramService SaService

<h3>HeleleComponent1</h3>
<ul>
    @foreach (var kkk in people)
    {
        <li>@kkk.ToString()</li>
    }
</ul>
<hr>
@if (people == null)
{
    <p>없음</p>
}
else
{
    <table class="table">
        <thead>
            <tr>
                <th>Id</th>
                <th>Age</th>
                <th>Name</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var per in people)
            {
                <tr>s
                    <td>@per.Id</td>
                    <td>@per.Age</td>
                    <td>@per.Name</td>
                </tr>
            }
        </tbody>
    </table>
}



@code {

    @* injector *@
    List<Saram> people;
    @* Injection service*@
protected override async Task OnInitializedAsync()
{
    people = await SaService.GetSaram2Async();
}
}

Startup.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.HttpsPolicy;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Hosting;
using BlazorApp4.Data;

namespace BlazorApp4
{
    public class Startup
    {
        public Startup(IConfiguration configuration)
        {
            Configuration = configuration;
        }

        public IConfiguration Configuration { get; }

        // This method gets called by the runtime. Use this method to add services to the container.
        // For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
        public void ConfigureServices(IServiceCollection services)
        {
            services.AddRazorPages();
            services.AddServerSideBlazor();
            services.AddSingleton<WeatherForecastService>();
            services.AddScoped<PersonService>();
            services.AddTransient<SaramService>(); //생성자가 없어서  injection 서비스
        }

        // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
        public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }
            else
            {
                app.UseExceptionHandler("/Error");
                // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
                app.UseHsts();
            }

            app.UseHttpsRedirection();
            app.UseStaticFiles();

            app.UseRouting();

            app.UseEndpoints(endpoints =>
            {
                endpoints.MapBlazorHub();
                endpoints.MapFallbackToPage("/_Host");
            });
        }
    }
}