jonbeo 님의 블로그

CSS에서 레이아웃을 만들다 보면 "이 요소 왜 여기 있어?", "왜 고정이 안 되지?" 같은 혼란이 생기죠.그 핵심 원인은 바로 position 속성을 정확히 이해하지 못해서입니다.이번 포스팅에서는 CSS position 속성의 5가지 값인static, relative, absolute, fixed, sticky를 실제 예제와 함께 정리해드립니다. ✅ position: static (기본값)모든 요소는 기본적으로 position: static입니다.별도로 좌표를 지정해도 무시되며, HTML의 문서 흐름에 따라 배치됩니다.div { position: static; top: 20px; /* ❌ 적용되지 않음 */} ✅ position: relative기존 위치(문서 흐름)를 기준으로 상대적으로 이동합..

🙋 Q1. 광고 클릭은 많은데 왜 전환이 없을까요?상품 상세페이지 품질이 낮거나가격 경쟁력이 없을 수 있어요.또는 배송비, 리뷰 수, 이미지 등이 부족할 수도!✅ 해결 팁상세페이지 개선 (리뷰 강조, 비교 이미지 삽입)가격대 점검 (경쟁상품과 비교)무료배송 옵션도 고려해보세요 🙋 Q2. 광고 등록했는데 노출이 안돼요. 왜 그런가요?입찰가가 너무 낮거나해당 키워드에 검색량이 적어서일 수 있어요.✅ 해결 팁키워드 성과 확인 후 인기 키워드로 수정입찰가 +50원 단위로 점진적 상승시도 🙋 Q3. 쇼핑검색 광고에 입찰가 수동으로 조정은 어디서 하나요?[광고관리 > 캠페인 > 광고그룹 > 소재]에서각 상품 소재 타이틀 오른쪽 현재 입찰가(VAT미포함) 영역의 입찰가 클릭! 🙋 Q4. 광고 성과는 어디서 확..

💡 ROAS란?ROAS = 매출 ÷ 광고비 × 100 (%)쉽게 말해, 광고비 1만원을 썼을 때 5만원이 팔리면 ROAS는 500%! 📈 Step 1. 전환율 높은 상품만 집중 운영하기 모든 상품에 광고를 걸 필요는 없어요!데이터가 말해주는 고효율 상품만 집중적으로 운영하면 ROAS가 자연히 올라갑니다.✅ 상품 성과 체크 포인트클릭률(CTR) 높고전환수도 꾸준하며ROAS ≥ 300% 이상 나온다면 우선순위! 🛒 Step 2. 저효율 상품은 ‘OFF’ 또는 입찰가 조정광고는 무한정 돌리는 게 아니라, 데이터 보고 잘라내는 작업이 중요해요.전환이 없는 상품은 일단 중지(OFF) 하거나, 입찰가를 50~100원 단위로 내려서 관찰! 📊 Step 3. ROAS 좋은 상품의 입찰가 소폭 상향ROAS가 높은..

🧩 Step 1. 하루 예산 설정 팁 (쇼핑검색 기준)쇼핑검색 광고는 클릭 단가가 높게 형성되는 경우가 많아서, 하루 예산을 너무 낮게 잡으면 광고 노출이 거의 되지 않을 수 있어요.최소 하루 10,000원 추천! 🧰 Step 2. 수동입찰 방식으로 전환하기쇼핑검색 광고 생성 시, 기본은 ‘자동입찰’로 되어 있어요.생성 후 광고그룹 내 키워드/상품을 클릭 → ‘입찰가 일괄설정’ > ‘수동입찰’ 선택상품별 입찰가를 직접 입력하면 수동입찰 완료! 🔎 Step 3. 입찰가 전략 세우기모든 상품에 동일 입찰가는 금물!다음 기준으로 차등 입찰 전략을 세워보세요:상품 유형전략입찰가 예시베스트 상품노출 극대화800원 이상신상품테스트 운영500~600원소진목적 재고상품제한적 노출300~400원💡 팁: 상품단가가..

💡 이런 분께 딱이에요!광고 예산은 쓰고 있는데 성과는 불확실한 분뭐가 잘되고 뭐가 안 되는지 보고서가 너무 어려운 분효율 낮은 광고를 정리하고 싶은 분! 📊 Step 1. 광고 보고서, 어디서 어떻게 보나요? 광고관리 > 보고서 > 캠페인 보고서 / 소재 보고서에서어떤 키워드/소재/캠페인이 잘되고 있는지 확인할 수 있어요.주요 지표는 아래를 기준으로 확인해요:지표뜻체크 포인트노출수광고가 보여진 횟수너무 적으면 타겟 부족클릭수클릭된 횟수노출 대비 클릭률(CTR) 중요클릭률(CTR)클릭수 ÷ 노출수 (%)1% 이상이면 괜찮은 편전환수실제 구매 등 액션이 일어난 횟수클릭 후 구매 연결됐는지 체크ROAS광고수익률 (매출 ÷ 광고비)300% 이상이면 양호 🧹 Step 2. 광고비 아끼는 정리 기준 효율이..

1. 자주 묻는 질문 (FAQ)Q1. VS Code는 무료인가요?👉 완전히 무료입니다! 오픈소스 기반이라 기업에서도 사용 가능해요.Q2. 터미널이 안 열려요.👉 Ctrl + ~ 단축키 확인!메뉴에서 [터미널 > 새 터미널] 클릭해보세요.그래도 안 될 땐 VS Code 재시작 또는 설정 초기화.Q3. 확장 프로그램이 설치가 안 돼요.👉 인터넷 연결 확인 → 좌측 메뉴의 Extensions 아이콘 클릭 → 로그 확인경우에 따라 방화벽이 막고 있을 수도 있어요.Q4. 테마가 갑자기 바뀌었어요.👉 [파일 > 기본 설정 > 테마]에서 확인 및 재설정 가능Q5. 디버깅 시작했는데 멈추질 않아요.👉 Breakpoint가 없는 경우 전체 코드가 실행됨디버깅 중지: Shift + F5 2. VS Code 실전 ..

온라인 셀러라면 매년 5월이면 찾아오는 종합소득세 신고, 꼭 해야 할 의무입니다.이번 글에서는 스마트스토어, 쿠팡, 네이버 셀러, 무신사 셀러 등 1인 사업자 또는 부업자 셀러 기준으로,종합소득세를 언제, 어떻게, 얼마를 신고해야 하는지 꼼꼼히 정리해드립니다.✅ 종합소득세란?한 해 동안 개인이 벌어들인 모든 소득을 합산하여 신고하고 세금을 납부하는 제도입니다. 사업소득(스마트스토어, 쿠팡 수익) 뿐 아니라근로소득(회사 월급), 이자소득, 배당소득, 기타소득도 합산해서 신고해야 합니다.📌 신고 대상: 개인사업자, 프리랜서, 온라인 셀러, 유튜버 등📌 신고 기간: 매년 5월 1일 ~ 5월 31일📌 납부 기한: 5월 31일까지 (연장 시 6월 말까지) ✅ 온라인 셀러는 왜 신고해야 하나요?온라인 쇼핑몰에..

온라인 셀러라면 한 번쯤은 고민해봤을 질문,“스마트스토어나 쿠팡 운영하면 4대 보험 가입해야 하나요?”이번 포스팅에서는 직장 재직 중인 셀러, 퇴사 후 셀러, 이제 막 시작한 초보 셀러 3가지 상황으로 나눠서,4대 보험 가입 여부와 건강보험 조정 방법, 예상 금액까지 실제 사례 위주로 정리해볼게요. ✅ 1. 회사 다니면서 부업으로 셀러 운영 중인 경우✅ 4대 보험 추가 가입 필요 없음→ 회사 다니는 동안엔 이미 직장가입자로 4대 보험이 처리되므로,부업으로 스마트스토어나 쿠팡을 운영해도 건강보험/국민연금 지역가입은 비대상이에요.✅ 단, 부수입이 발생하면 세무 신고는 필수→ 종합소득세 신고 시 부업 수익 포함해서 신고해야 해요.→ 세금은 더 낼 수 있지만 4대 보험에는 영향 없음. ✅ 2. 퇴사 후 전업 셀..

지금까지 MUI와 Ant Design의 기본 사용법과 커스터마이징 방법을 배워봤다면,이번엔 그걸 직접 관리자 페이지 레이아웃에 적용해보는 실습을 해볼 차례입니다.사이드바 + 상단바 + 콘텐츠 영역으로 구성된 기본적인 대시보드 틀을 구현해볼게요.✅ 구조 설계 미리보기+-------------------------------+| Header Bar |+------------+------------------+| Sidebar | Main Content |+------------+------------------+ ✅ MUI 버전 예제import { Box, AppBar, Toolbar, Drawer, Typography } from '@mui/material'..

Ant Design v5부터는 기존 Less 기반 커스터마이징 방식에서 CSS-in-JS 기반의 Token 시스템으로 바뀌었습니다.이제는 JavaScript 코드 안에서 직접 테마를 설정하고, 전역 스타일을 간편하게 커스터마이징할 수 있습니다.이번 포스팅에서는 색상, 폰트, 라운딩 등 핵심 스타일을 어떻게 내 맘대로 바꾸는지 정리해볼게요! ✅ 테마 커스터마이징 기본 구조npm install antdimport { ConfigProvider, theme } from 'antd';const customTheme = { token: { colorPrimary: '#FF6F61', borderRadius: 8, fontFamily: 'Pretendard, sans-serif', },};fun..