무슨 일을 하는지 그대로 보여 주고, 첫 통화 전에 작업이 먼저 말하게 하세요.
소스 카탈로그: mypage게시 전 검사 안내
타투 아티스트
타투 아티스트 템플릿은 소개, 의뢰 접수, 상세 사례, 운영자 화면 등 핵심 기능과 프로젝트별 2개 데이터 테이블을 갖춘 포트폴리오입니다.
g-port-tattoo.preview.mypage.dev
데모를 불러오는 중…
실제로 돌아가는 앱입니다. 눌러 보세요.
이 템플릿 소개
타투 아티스트 템플릿은 디자인을 몰라도 단정해 보이는 포트폴리오를 줍니다. 이미지 처리와 모바일 화면, 빠른 갤러리는 이미 끝났습니다. 가장 좋은 작업을 고르는 데만 집중하세요.
타투 아티스트 템플릿은 소개, 의뢰 접수, 상세 사례, 운영자 화면 등 핵심 기능과 프로젝트별 2개 데이터 테이블을 갖춘 포트폴리오입니다. 복사되는 것은 고쳐 쓸 수 있는 소스입니다. 정해진 데모에 묶이지 않습니다. 디자인도 글도 데이터 구조도 동작도 다 바꾸시면 됩니다.
핵심 기능
잡지 같은 갤러리
여백까지 잡아 둔 편집형 배치로 작업을 가장 앞에 둡니다.
케이스 스터디 페이지
작업마다 페이지를 따로 두고 그 뒤의 이야기를 풀어냅니다.
바로 연락받기
문의 폼이 들어 있어 잠재 고객이 한 번에 연락합니다.
어디서 봐도 단정하게
휴대폰과 태블릿, PC에서 고르게 다듬은 화면입니다.
기능과 구성
고치고, 검사하고, 게시하고, 소스까지 가져가는 데 필요한 것이 다 들어 있습니다. 화면만 그려 둔 디자인이 아닙니다.
페이지 구조 전체
홈만 있는 게 아닙니다. 모든 페이지가 이어져 있고 서로 오갈 수 있습니다. 주소와 배치, 화면 상태가 이미 짜여 있습니다.
반응형 기본기
휴대폰과 PC 분기점을 잡아 두었습니다. 게시 전에 최종 내용으로 브라우저 검사를 한 번 돌려 보세요.
한 문장으로 전체 스타일 변경
색과 서체, 여백이 서로 묶여 있습니다. 원하는 결을 한 문장으로 말하면 앱 전체가 다시 칠해집니다. 하나씩 찾아 고칠 필요가 없습니다.
검색에 잡히는 페이지
주요 페이지가 진짜 HTML로 내려갑니다. 검색 엔진과 링크 미리보기가 빈 화면 대신 실제 내용을 읽습니다.
흐름에 맞춘 데이터 구조
데이터를 쓰는 템플릿은 실제로 조회되는 표와 행 단위 권한을 씁니다. 보여 주기만 하는 템플릿은 필요 없는 데이터베이스를 만들지 않습니다.
분명한 접근 경계
비공개 화면에는 로그인과 역할 확인, 행 단위 권한이 들어 있습니다. 공개 템플릿은 로그인이 걸린 척하지 않고 핵심 여정을 열어 둡니다.
실제로 도는 폼
문의·예약·가입이 있는 템플릿은 입력 검사와 저장이 자기 데이터에 연결돼 있습니다. 게시 전에 실제 흐름을 한 번 눌러 보세요.
테마용 디자인 토큰
브랜드 색과 여백, 모서리, 배경 톤을 테마 패널에서 한꺼번에 바꿉니다. 색을 정한 뒤에는 글자가 잘 읽히는지 다시 확인해 주세요.
접근성 검사 포함
의미에 맞는 마크업이 기본입니다. 브라우저 검사가 아직 손봐야 할 WCAG A/AA 항목을 알려 줍니다.
빠르게 뜨도록 만든 빌드
Vite가 판이 박힌 자산을 만듭니다. 브라우저와 성능 검사가 더 다듬을 곳을 짚어 줍니다.
말로 고치기
문구나 배치, 색을 말로 설명해서 바꿉니다 — "첫 화면 더 크게", "톤을 더 따뜻하게". 코드는 몰라도 됩니다.
내 코드, 내려받기
서로 떨어진 공간에서 만들고, 보여 드리기 전에 한 번 확인합니다. 소스는 언제든 내려받으시면 됩니다. 붙잡아 두지 않습니다.
이 템플릿과 흔한 유료 시작 템플릿 비교
| 비교 항목 | mypage | 흔한 유료 템플릿 |
|---|---|---|
| 가격 | 복사해 시작하는 데 크레딧 0. AI 작업만 셉니다 | 구독료와 사용 조건은 제품마다 다릅니다 |
| 내 코드 | 따로 빌드되는 소스 내려받기 + GitHub 연동 | Git 연동과 내려받기는 제품·요금제마다 다릅니다 |
| 고치는 방법 | 채팅, 화면, 테마, 소스 편집 | 편집 방식은 제품마다 다릅니다 |
| 백엔드 | 필요한 템플릿에는 프로젝트 데이터베이스와 권한 게이트가 붙습니다 | 관리형 백엔드는 흔히 제공됩니다 |
| 검색 노출 | 서버에서 그리는 경로와 검색 정보 검사 | 렌더 방식과 검색 정보 지원은 제품마다 다릅니다 |
| 화면을 보기까지 | 설치 없이 바로 뜨는 미리보기 | 대부분의 AI 빌더도 미리보기를 제공합니다 |
누구에게 맞나
- 가장 좋은 작업을 보여 주고 싶은 디자이너와 사진가
- 더 잘 맞는 고객을 만나고 싶은 프리랜서
- 작업 사례와 성과를 소개하는 스튜디오와 에이전시
- 지금 실력과 안 어울리는 옛 포트폴리오를 바꾸려는 창작자
- 개인 브랜드를 만드는 일러스트레이터·작가·메이커
- 다음 제안 전에 단정한 소개 페이지가 필요한 분
이럴 때 좋습니다
가장 좋은 작업의 문제와 과정, 결과를 차례로 보여 주세요.
갤러리에 문의나 결제 흐름을 붙여 관심을 문의로 바꾸세요.
실력에 어울리는 화면으로 옛 사이트를 바꾸세요.
무엇을 만들 수 있나
이미지가 주인공이고 나머지는 조용한, 갤러리 위주의 사이트.
과정과 결과를 길게 풀어 고객을 설득하는 작업 페이지.
소개와 작업, 연락처를 한곳에. 나중에 본격적인 사이트로 키울 수 있습니다.
시작하는 법
- 이 템플릿으로 시작
"템플릿 사용"을 누르면 타투 아티스트의 사본이 만들어집니다. 소스를 복사하고, 딸려 있는 데이터베이스를 붙이고, 크레딧 없이 미리보기를 만듭니다. 걸리는 시간은 템플릿과 서버 상황에 따라 다릅니다.
- 브랜드 입히기
테마를 고르면 색이 한꺼번에 바뀝니다. 화면에서 고치기로 글자와 스타일, 올린 이미지 경로를 바로 바꾸면 됩니다. 데이터에 묶였거나 조건에 따라 달라지는 부분은 편집이 깨질 수 있어, 채팅이나 개발자 모드로 안내해 드립니다.
- 내 콘텐츠 넣기
샘플을 내 글과 상품, 사진으로 바꾸세요. 바꿀 내용을 평소 말로 알려 주시거나, 정확히 손보려면 개발자 모드를 쓰면 됩니다. 작업이 성공할 때마다 되돌릴 지점이 남아서 언제든 그때로 갈 수 있습니다.
- 데이터 연결
데이터베이스가 들어 있는 템플릿이면 표와 행 단위 권한이 프로젝트에 그대로 적용됩니다. 게시 전에 역할과 폼, 시작 데이터를 눌러 보세요. 결제와 로그인, 알림은 따로 설정하는 커넥터를 씁니다.
- 게시하기
확인을 마친 판을 실제 주소로 내보냅니다. 호스팅과 https, 서버에서 그린 페이지는 게시 쪽이 알아서 처리합니다. 이후 수정은 후보 판으로 먼저 빌드하므로, 빌드가 실패해도 지금 열려 있는 사이트는 그대로입니다.
데이터·출시 점검
- 이 템플릿에는 내 프로젝트만 쓰는 테이블 2개가 들어 있습니다: works, commissions. 게시하기 전에 실제 데이터와 누가 볼 수 있는지를 확인하세요.
- 실제로 서비스하려면 아래 연동이 필요합니다:
- notify — 받는 사람은 서버가 정하게 두고, 고른 이메일 서비스나 국내 메시지 서비스와 그 서명된 발송 웹훅을 같이 걸어 두세요. 성공·재시도·반송·실패·예약·취소를 눌러 보시고, 받는 사람을 브라우저가 고르게 두면 안 됩니다.
- auth — 이메일·비밀번호 로그인은 이미 연결돼 있습니다. 시험 계정을 하나 만들고, 꼭 필요한 만큼만 역할을 주세요. 게시 전에 비로그인·회원·직원·관리자로 각각 들어가 보세요. 소셜 로그인은 원하시면 따로 붙이면 됩니다.
- 예시 글과 사진을 내 것으로 바꾸세요. 모바일과 데스크톱에서 모든 화면을 한 번씩 보시고요. 브라우저·접근성·보안·성능 검사에서 나온 지적은 공개 전에 다 해결하세요.
정리
타투 아티스트 — 멈춰 있는 화면이 아니라 고쳐 쓰는 소스 프로젝트입니다. 복사해서 시작하고, 만들어진 페이지와 권한을 살펴보고, 대화나 코드로 내 것으로 바꾸고, 브라우저 검사를 돌린 뒤, 준비되면 게시하세요. 내려받은 소스는 따로 빌드되니 코드를 가지고 나가셔도 됩니다.
비슷한 템플릿
내 것으로 만들어 볼까요?
타투 아티스트 템플릿을 무료로 복사해 보세요. 미리보기에 크레딧은 들지 않고, 소스는 언제든 내려받을 수 있습니다.