2024/10 6

신입사원의 첫 출근 필수 매뉴얼

안녕하세요 찐망고입니다. 저는 포트폴리오를 만드는 훈련교사이다 보니첫 취업이거나 사회생활경험이 적은 친구들에게 이런저런 이야기를 하는 편이에요.제 나이대가 제 친구들은 관리자급이고 친한 제자들은 한창 열심히 일할 주임, 대리들이다 보니그들 사이의 이야기를 듣는 게 너무 재밌어 짜릿해 이전에 신입이든 경력직이든 첫 출근을 했을 때 겪는 상황을 글로 써 놓은걸 어디선가 보았는데(인스타였나) 너무 재밌더라고요. ㅎㅎ 웃자고 쓴 글이니까 너무 진지하게는 생각하지 않았으면 해요.출처를 몰라서 일단 글만 공유해봅니다.혹시 출처 아시는 분은 제게 댓글을 ^^;  1. 처음 들어갔는데 사수가 있다면?사수의 말을 잘 듣습니다. 인수인계하는 건 목이 아픈 일입니다. 광동 비타 500 제공 또는 함께 담배 타임을 가지도록 ..

나/이것저것 2024.10.31

Swiper 슬라이더와 탭 연동하기, loop해결

안녕하세요 찐망고입니다오늘은 tab과 swiper슬라이드를 연결할 건데요.예전 jQuery때랑 코드 부분이 조금 달라져서 포스팅해 봅니다.  1. Tab과 슬라이더를 연결2. Tab클릭 시 슬라이더가 첫 시작위치로 로드 되어야 함3. Tab클릭시 슬라이더는 모두 loop처리되어야 함 이 세 가지 조건에 맞는 슬라이더를 구현해 보도록 합니다. Tab부분은 기본적인 리스트 형태로 마크업을 할 거고요.리스트 하나는 ALL버튼입니다.처음 로드 되었을 때와 ALL버튼을 누르면 전체 swiper-slide가 다 보이게 할 거예요. 아래는 html코드입니다. ALL EYE LIP BASE OTHERS  플러그인은 swiper를 이용하여 따로 ..

플러그인/swiper 2024.10.28

피그마 ai 디자인, 플러그인 - Codia Ai Design

안녕하세요 찐망고입니다.ai플러그인 관련 포스팅을 해달라고 했는데..제 맘에 쏙 드는 플러그인이 없어 포스팅을 안 하려다가..숏츠나 릴스보고 혹 하신 분들에게 이 글을 전합니다. 이전에 추천한 플러그인 중에 html.to.design이라는 플러그인이 있었죠?문서 링크를 연결하면 피그마 파일로 짠 하고 만들어주는 플러그인이었죠. 하지만 완벽하지 않다고...  관련포스팅글 피그마 추천 플러그인안녕하세요 찐망고입니다.벌써 5번째 카테고리인 플러그인 포스팅으로 넘어왔네요 저는 피그마 플러그인을 많이 사용하는 편은 아닌데요.그래도 있으니까 편하다 하는 것들 위주로 포스팅 해uiweb.tistory.com   이번에 포스팅할 플러그인은 디자인 캡처이미지를 클론디자인해 주는 플러그인인데요.Codia Ai Design..

피그마 컴포넌트 해제, 베리언트 등록

안녕하세요 찐망고입니다. 피그마가 업데이트 이후 툴바나 패널이 조금 바뀌었어요.오토레이아웃이나 컴포넌트, 베리언트, 컨스트레인트 등도 조금 바뀌었지요.영상을 만들면 조금 편할 거 같은데 왜 저는 아직도 텍스트로 포스팅을 하려고 하는 걸까요.옛날사람이라 그럼... 이전 글 참고 해주시고 포스팅을 이어할게요. 피그마 컴포넌트, 베리언트 (Component, Variants)안녕하세요 찐망고입니다  오늘은 피그마의 Component와 Variants에 대해서 포스팅 해볼까 해요일단 피그마 이전글들을 참고해주시구요  0. styles등록 (text, color)  피그마 ui-스타일가이드, 스타일uiweb.tistory.com 피그마에서 컴포넌트와 베리언트는 디자인 시스템을 효율적으로 관리하고 재사용성을 높이는..

CSS, 2024년 드디어 코드 한줄로 수직 정렬 기능 추가 : align-content

안녕하세요 찐망고입니다.드디어..드디어 CSS가 추가로 지정되는 속성 없이 코드 한 줄로 요소를 수직정렬하는 기능이 생겼네요. 과거 요소들을 수직정렬하기 위해(특히 center) 행했던 수많은 수직정렬의 역사들이 주마등처럼 스쳐 지나가네요. 새로 코드가 생긴 건 아니고, 원래 flex나 grid에서 사용했던 CSS코드였는데요.flex나 grid 없이 사용이 가능하게 되었습니다. (와! 짝짝짝)align-content: center; 테스트를 여러 번 해보니 기본 좌우 정렬해서 수직정렬하는 건flex나 grid를 사용하면 될 것 같고a링크요소들처럼 버튼처리해서 만드는 요소들은 수직정렬하기가 편하겠어요. center 외 start, end로 값을 지정할 수 도 있겠지만 안 쓸 거 같죠..?크롬 123, 파이..

WEB/CSS 2024.10.10

VSCode) Alt + B 단축키로 HTML 파일 브라우저로 바로 열기

안녕하세요 찐망고 입니다. VScode는 익스텐션이 많은데요.그중 open in browser를 설치하면 단축키를 이용하여 HTML파일을 브라우저로 열 수 있습니다. 익스텐션 아이콘을 클릭하고, Open In Default Browser를 검색합니다.  설치하면 되겠죠? 설치 후 마우스 우클릭 해보면 Open In Default Browser메뉴가 생겼습니다.  Alt + B는 현재 열려 있는 HTML 파일을 기본 브라우저에서 열기 위한 단축키이고,Shift + Alt + B는 브라우저를 선택해서 HTML 파일을 열 수 있는 단축키입니다.

WEB/HTML기초 2024.10.04