그냥, 일단 써내려가자

안녕하세요 무택이에요 :) 오늘은 관악구청에서 여권 발급하는 과정에 대해 써보려고 해요. 최근 코로나가 풀리면서 여행 가는 사람들이 많아지고 있는데 관악구청에서 여권을 처음 발급해 본 사람으로서 과정에 대해 쓰면서 저랑 같은 상황인 분들한테 도움이 되는 팁들을 모두 적어보도록 할게요😊 관악구청 여권민원실 위치 여권 민원실은 관악구청 입구에 들어가면 바로 왼쪽에 있어요. 구청 들어가서 왼쪽으로 가면 이렇게 되어있는데 번호표 뽑을 필요 없이 신청하는 곳에 가서 줄을 스면 돼요. 진상이 있지 않는 이상 금방금방 줄이 빠져요. 여권 신청에 필요한 준비물 - 신분증 - 6개월 이내 촬영한 여권용 사진 - 비용(카드 결제 가능) 신분증은 무조건 필요하고 다른 곳은 등본, 병역증명서 제출하는 곳도 있던데 여긴 없어도..

안녕하세요 무택입니다 :) 오늘은 영등포에 있는 샐러드 맛집 "아메리칸 샐러드"에 다녀온 후기를 써보려고 합니다. 위치 : 타임스퀘어 지하 1층 - 아메리칸트레이 영등포타임스퀘어점 서울 영등포구 영중로 15 지하1층 (영등포동4가 442) place.map.kakao.com 타임스퀘어 중앙에서 한층 에스컬레이터 내려가고 지하 2층으로 내려가는 곳 바로 앞에 있습니다.(사진을 못 찍었네요😭) 메뉴 - 저는 주말 5시쯤에 갔는데 웨이팅 없이 바로 들어갔습니다. 매장 앞에 앉아서 대기할 수 있는 의자가 있던데 사람이 많을 때는 웨이팅 하기도 하는 것 같네요. 그리고 메뉴는 2인이 갔는데 세트메뉴가 있길래 국룰은 역시 세트메뉴지 하면서 아메리칸 트레이 세트 하나를 주문했습니다. 구성은 리코타 치즈 샐러드 + 과..

안녕하세요 무택입니다 :) 오늘 알아볼 유용한 정보는 웹사이트의 변화를 감지할 수 있는 플러그인입니다. 저의 경우에는 게시판을 이용하는 사이트가 있는데 새 글이 올라왔을 때 알림 오는 기능이 없어서 이 기능이 있었으면 하는 마음에 찾아보다가 찾은 플러그인입니다. 며칠 사용해 본 결과 사용성이 좋아 보여서 내용을 공유하고자 합니다. 아래 내용에서 알림을 받는 조건은 pc를 사용 중인 경우에만 해당합니다. 이 글을 읽으면 좋은 사람 - 상품 판매 버튼 활성화 알림을 받고자 하는 분 - 게시판의 새 글 알림을 받고자 하는 분 - 영화 예매 오픈 알림을 받고자 하는 분 등 상황에 따라 여러 가지로 적용할 수 있을 것 같습니다. 사용 방법 1. 플러그인 설치 - Visualping 플러그인 설치 사이트에서 설치 ..

안녕하세요 무택입니다 :) 오늘 알아볼 기능은 포토샵에서 레이어마스크를 활용해서 이미지를 원본 그대로가 아닌 가독성 있게 사용해보려고 합니다. 레이어마스크가 초보자분들이 활용하기에는 어려울 수 있지만 익히고 나면 활용할 곳이 어마어마하게 많으니 한번 보고 익혀보면 좋을 것 같습니다😊 레이어마스크란? 레이어마스크는 원본이미지를 보존하면서 지우기 기능을 사용할 수 있는 기능입니다. 레이어를 지우개 기능으로 지우면 원본 파일이 없어졌을 때 이미지를 복원하기가 힘듭니다. 그래서 레이어마스크를 만들고 레이어에서 지우고 싶은 영역을 지우면 됩니다. 다만, 레이어마스크에서 작업하기 위해서는 지우개 툴이 아닌 브러시 툴로 지우는 방식을 사용합니다. 검은색 브러시는 칠하기 기능, 흰색 브러시는 원본이미지로 복구입니다.(..

안녕하세요 무택입니다 :) 오늘 알아보려고 하는 기능은 퍼블리싱하는데 시간 절약을 도와주는 animate 라이브러리를 알아보려고 합니다. 퍼블리싱하는 데 있어서 정적인 웹보다 동적인 웹이 UX에 있어서 더 좋은 환경이라는 건 많은 분들이 알고 계실 겁니다. 그런 동적인 웹을 만드는 데 있어서 많은 도움을 주는 라이브러리니까 아래 설명을 보고 활용해 보면 좋을 것 같습니다😉 Animate 라이브러리란? animate 라이브러리는 다양한 모션을 템플릿 형식으로 만들어서 웹사이트 퍼블리싱 할 때 쉽게 모션을 넣게 해주는 라이브러리입니다. 해외에서 만든 모션들이기 때문에 국내 페이지 개발에 사용할만한 모션이 많지는 않지만 적절한 상황에 넣으면 좋은 효과를 낼 수 있는 모션들이 많아서 퍼블리싱하면서 적절한 상황에..

HTML - 다운로드 바로가기 CSS - body { text-align: center; padding: 40px; } .btn a:hover .arrow::after { left: 6px; } .btn .btnTxt { display: inline-block; position: relative; padding: 10px 28px 10px 20px; color: #fff; background-color: #00cc00; border-radius: 8px; } .btn .btnTxt span { color: #a3f2a3; } .arrow { position: relative; } .arrow::after { position: absolute; left: 4px; top: 6px; content: ''; ..

안녕하세요 무택입니다 :) 오늘 알아볼 기능은 CSS의 홀수, 짝수 선택자 기능입니다. css를 작성하다 보면 짝수 항목에만 효과를 줘야 될 때가 더러 있습니다. 이럴 때 사용하면 좋은 코드로 상황에 따라 활용성이 많다고 생각합니다. # 한장 요약 # code - 코드 예제 See the Pen [css]홀수, 짝수 선택자 by TytanLee (@TytanLee) on CodePen. # 다른 코드 홀수 선택자는 :nth-child(1n) 짝수 선택자는 :nth-child(2n) 도 마찬가지로 적용이 되니 상황에 따라 사용하시면 됩니다.

안녕하세요 무택입니다 :) 오늘은 제품 리뷰를 가져왔습니다. 바로 샐러디에서 오늘 출시한 팔도비빔 메밀면 샐러디입니다. 이름만 들어도 상상이 안 가는 메뉴인데 호기심에 한번 구매해서 먹어본 후기를 적어볼까 합니다🤔 구성 토핑으로는 닭가슴살, 계란, 오이, 양파, 옥수수, 메밀면이 들어가고 드레싱은 무려 팔도비빔장 입니다.. 진짜 어지러운 구성인데 맛보기 전까지는 무슨 맛일지 가늠이 안 갔습니다. 영양 구성 열량(kcal) 탄수화물(g) 당류(g) 단백질(g) 지방(g) 포화지방(g) 나트륨(mg) 322.6 42.9 4.6 26.8 10.3 1.7 505.6 영양은 나트륨이 조금 있는 거 빼고 건강한 식사 정도이네요😶 맛 후기 일단 음식은 눈으로 한번 먹고 입으로 두 번 먹는 건데.. 비주얼은 맛있겠다는..

안녕하세요 무택입니다 :) 오늘 알아볼 기능은 OTF와 TTF의 개념에 대해 알아보려고 합니다. 이 개념은 디자이너도 가끔 헷갈릴 정도인데 한번 누구라도 명확하게 알기 쉽게 써보도록 하겠습니다😀 개념 일반적으로 OTF는 고해상도의 작업물에 사용하고, TTF는 일반 문서 등 저해상도의 작업물에 사용합니다. 차이점 1. 곡선 구현 방식 둘 다 베지어 곡선을 사용하지만 ttf는 2차원, otf는 3차원을 사용합니다. 쉽게 풀어쓰자면 3차원 베지어 곡선을 사용하는 otf는 곡선을 더 섬세하게 표현할 수 있기 때문에 고해상도 작업물에 어울립니다. 2. 글꼴 처리 앞서 설명한 것처럼 otf는 3차원의 베지어 곡선을 사용하기 때문에 글꼴을 불러오는 데 있어서 리소스를 더 많이 필요로 합니다. 리소스를 많이 필요로 한..

안녕하세요 무택입니다 :) 오늘 알아볼 기능은 박스 안에서 텍스트가 올라오는 기능입니다. 최근 웹사이트에 사용되는걸 자주 보는 기능인데 말로 설명하는 것보다 아래에서 사례를 바로 알아봅시다. 기능을 적용하려면 animate 라이브러리 사용법을 기본적으로 알아야합니다. 코드 예제 See the Pen 박스 안에서 텍스트 올라오기(animate라이브러리) + txt stroke/txt fill by TytanLee (@TytanLee) on CodePen. HTML - M. Cloud Bridge CSS - *{ padding: 0; margin: 0; font-family: 'Prompt'; } div{ overflow: hidden; } h1{ font-size: 84px; line-height:1; t..