[직원관리 프로그램] 포트폴리오 프로젝트 시작

 

기존에 하던 ERP 포트폴리오 개발이 너무 방대해서, 분리해서 개발 후 한 번에 합치기로 결정했다. 이게 하다 보니 점점 개발 속도가 빨라진다. 그리고 이번에는 경력과 학력을 추가할 수 있는 추가 버튼을 생성했다. 이는 자동으로 생성해준다. 근데... DB에 어떻게  추가하지... 또 찾아봐야하는 노가다를 해야겠다. 

 

기존 뷰는 단일뷰였지만, 이번에 제작하면서 Tab을 만들어서 뷰를 만들었다. 한 페이지 내에서 여러개의 뷰를 관리할 수 있는데, 나는 이것을 Partial View를 활용해서 구현했다.

 

@{
    ViewData["Title"] = "Add Employee";
}
 
<div class="container-fluid mt-5">
    <!-- Tab Header -->
    <ul class="nav nav-tabs" id="myTab" role="tablist">
        <li class="nav-item" role="presentation">
            <button class="nav-link active fs-5 fw-bold" id="tab1-tab" data-bs-toggle="tab" data-bs-target="#tab1" type="button" role="tab" aria-controls="tab1" aria-selected="true">
                직원등록
            </button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link  fs-5 fw-bold" id="tab2-tab" data-bs-toggle="tab" data-bs-target="#tab2" type="button" role="tab" aria-controls="tab2" aria-selected="false">
                직원 목록
            </button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link  fs-5 fw-bold" id="tab3-tab" data-bs-toggle="tab" data-bs-target="#tab3" type="button" role="tab" aria-controls="tab3" aria-selected="false">
                기타
            </button>
        </li>
    </ul>
 
    <!-- Tab Content -->
    <div class="tab-content mt-2" id="myTabContent">
        <!--Tab 1-->
        <div class="tab-pane fade show active" id="tab1" role="tabpanel" aria-labelledby="tab1-tab">
            @Html.Partial("_AddEmployee")
        </div>
 
        <!--Tab 2-->
        <div class="tab-pane fade" id="tab2" role="tabpanel" aria-labelledby="tab2-tab">
            <h3>Content for Tab 2</h3>
            <p>This is the content for the second tab.</p>
        </div>
 
        <!--Tab 3-->
        <div class="tab-pane fade" id="tab3" role="tabpanel" aria-labelledby="tab3-tab">
            <h3>Content for Tab 3</h3>
            <p>This is the content for the third tab.</p>
        </div>
    </div>
</div>

        

        
      

 

ASP.NET Core MVC에서는 Partial View가 있는데, 이는 특정한 뷰에 특정한 뷰를 추가시킬 때 사용한다. 매우 편리한 기능 아닌가? 뷰안에 또 다른 View라니 너무 대단하다. ㅎ 이것을 사용하지 않고도 구현할 수 있는데... 그럼 너무 코드가 복잡해진다.

 

여기에 임의의 뷰 _PartialView1.cshtml이 있다고 가정하자

 

이를 Main View에서 사용하려면

 

@Html.Partial("_PartialView1")을 붙여두면 된다. 

 

이러면 어디에서도 사용할 수 있게 된다.

 

단 여기서 주의해야할 점이 있다. PartialView는 반드시 뷰 파일의 명칭이 _ViewName으로 이루어져 있어야 한다고 한다. 누가? 책에서... 그러니 그냥 그렇게 하겠다 ㅎㅎ;

 

오늘도 새벽에 개발하다가 잠드는 일상이구나