Public Source Viewer
비나래아카이브 개발자 포털
실제 서비스 구조를 살펴볼 수 있는 공개용 코드 뷰어입니다. 인증, 세션, 외부 연동, 토큰, 관리자 식별 등 보안상 민감한 구현은 파일 단위 또는 줄 단위로 검열됩니다.
view/hinana/works.ejs
공개 가능
1
<!doctype html><html lang="ko"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>작품 일람 · 비나래 라운지</title><meta name="description" content="Hinana Studio Novel에서 출판한 소설과 글. 비나래 라운지의 작은 서가에서 만나보세요."><meta property="og:title" content="작품 일람 · 비나래 라운지"><meta property="og:type" content="website"><link rel="stylesheet" href="/css/site-ui.css?v=3"><link rel="stylesheet" href="/css/site-app.css?v=1"><link rel="stylesheet" href="/css/works.css?v=1"><script src="/js/works.js" defer></script></head>
2
<body class="ui-shell <%= theme==='dark'?'dark-mode':'' %>" data-ui-page="works"><%- include('partials/site-header', {uiPage:'works',uiPath:'/hinana/works'}) %>
3
<main class="works-page" id="ui-content" tabindex="-1"><nav class="works-breadcrumb"><a href="/hinana/lounge">비나래 라운지</a><span>/</span>작품 일람</nav><section class="works-hero"><div><span class="works-eyebrow">THE LOUNGE BOOKSHELF</span><h1>문장이 머무는<br>작은 서가.</h1><p>Hinana Studio Novel에서 건너온 소설과 글.<br>한 편을 고르고, 편안한 자리에서 펼쳐보세요.</p></div><div class="works-book" aria-hidden="true"><small>HINANA STUDIO</small><strong>Novel</strong><span>마음에 남는 문장,<br>다시 펼치는 이야기.</span><i>✦</i></div></section>
4
<section class="works-collection" aria-labelledby="collection-heading"><div class="works-toolbar"><div><h2 id="collection-heading">작품 일람 <span><%= totalCount %></span></h2><p>최근 업데이트한 작품부터 만날 수 있어요.</p></div><form method="get" action="/hinana/works" role="search"><input type="search" name="q" maxlength="120" value="<%= query %>" placeholder="작품명, 작가, 소개 검색" aria-label="작품 검색"><button type="submit">검색</button></form></div>
5
<% if(!works.length){ %><div class="works-empty"><span aria-hidden="true">▤</span><h3><%= query ? '찾으시는 작품이 없어요.' : '아직 서가가 비어 있어요.' %></h3><p><%= query ? '다른 검색어로 다시 찾아보세요.' : '첫 번째 이야기가 도착하면 이곳에서 펼쳐볼 수 있어요.' %></p><% if(query){ %><a href="/hinana/works">전체 작품 보기 →</a><% } %></div><% }else{ %><div class="works-grid"><% works.forEach((work,index)=>{ %><article class="work-card"><a href="<%= work.url %>" class="work-cover theme-<%= work.theme %>"><span class="work-spine"></span><small>HINANA STUDIO NOVEL</small><h3><%= work.title %></h3><span class="work-author"><%= work.author || '작가 미표기' %></span><span class="work-cover-bottom"><%= String(index+1).padStart(2,'0') %><span aria-hidden="true">✦</span></span></a><div class="work-meta"><span><%= work.chapterCount %>개의 글 · <%= work.characterCount.toLocaleString() %>자</span><span><%= work.writing==='vertical'?'세로쓰기':'가로쓰기' %></span></div><p class="work-description"><%= work.description || work.excerpt %></p><div class="work-card-footer"><time datetime="<%= work.updatedAt %>"><%= new Date(work.updatedAt).toLocaleDateString('ko-KR',{timeZone:'Asia/Seoul'}) %> 업데이트</time><a href="<%= work.url %>">읽기 →</a></div><% if(canManage){ %><button class="work-delete" data-delete-work="<%= work.id %>" data-title="<%= work.title %>" type="button">게시 취소</button><% } %></article><% }); %></div><% } %></section>
6
[SECURITY REDACTED] 민감한 설정/인증/토큰 관련 코드입니다.
7