0

웹에이전시 전문 프리랜서 개발자 프리터코더입니다.

이번 챕터에서는 웹사이트 개발 과정 중 백오피스 매장 목록 개발을 작업합니다.

<백오피스 매장 목록 개발> 글은 웹에이전시의 의뢰를 받아서 프리터코더가 웹사이트를 개발하는 과정을 가상으로 보여주는 웹에이전시의 개발자들은 어떻게 일하나 시리즈 중 하나입니다.

1

매장 등록 백오피스 목록을 만들어 봅니다. 백오피스 메뉴 관리와 동일한 절차로 진행하면 됩니다.

2

사이드바에 매장 관리를 추가합니다.

3

눈에 띈 김에 "SB Admin 2" 문구도 "미스사이공 백오피스" 문구도 바꿉니다.

<div class="sidebar-brand-text mx-3">미스사이공 <sup>백오피스</sup></div>

백오피스 사이드바는 이렇게 보입니다.

4

최대한 간결하게 목록을 만듭니다. 가능한 목록에 표시하는 가짓수를 줄이고, 수정/삭제 버튼을 상세 페이지에서만 구현하겠습니다.

<div class="card shadow mb-4">
    <div class="card-header py-3">
        <h6 class="m-0 font-weight-bold text-primary">매장 목록</h6>
        <h6 class="m-0 float-right">
            <a href="/backoffice/store/create" class="btn btn-primary">매장 생성</a>
        </h6>
    </div>
    <div class="card-body">
        <div class="table-responsive">
            <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
                <thead>
                    <tr>
                        <th>이름</th>
                        <th>주소</th>
                        <th>사용 여부</th>
                    </tr>
                </thead>
                <tfoot>
                    <tr>
                        <th>이름</th>
                        <th>주소</th>
                        <th>사용 여부</th>
                    </tr>
                </tfoot>
                <tbody>
                    <?php
                    $row_list = query("select * from store");
                    ?>
                    <?php foreach($row_list as $row) : ?>
                    <tr>
                        <td>
                            <a href="/backoffice/menu_item/edit?id=<?= $row["id"] ?>"><?= $row["name"] ?></a>
                        </td>                                            
                        <td><?= $row["addr"] ?></td>
                        <td><?= $row["visible_yn"] ?></td>
                    </tr>
                    <?php endforeach ?>
                </tbody>
            </table>
        </div>
    </div>
</div>

5

문제가 없는지 확인합니다.

아직 데이터가 없으므로 잘 모르겠습니다. 일단 데이터를 채운 후 다시 확인하기로 합니다.

개발 요청은 프리터 코더 소개를 읽어보시고, 이메일 로 부탁드립니다.