그냥, 일단 써내려가자

안녕하세요 :) 무택입니다🧔 오늘 리뷰해 볼 제품은 '바질크림 불닭우동면'입니다.저는 워낙 맵찔이라서 매운걸 아예 먹으려고 하지 않습니다.근데 씨유를 갔는데 출입문에 붙여진 1+1 행사가 눈에 너무 들어왔고.. 저도 모르게 사버렸고.. 해서 사 먹어본 후기입니다. 일단 씨유에서 4월 동안 1+1 행사 진행 중이고 가격은 3,600원입니다. 요즘 물가가 너무 올랐는데 이 제품도 이번에 100원 정도 오른 것 같아요. 칼로리는 385kcal이고 제가 중요하게 생각하는 탄수화물과 단백질은 79g/7g씩이네요. 어차피 불닭먹는데 탄수화물이 몇인지 칼로리가 몇인지 뭐가 중요하겠습니까😀 먼저 조리방법은 우동면과 불닭소스, 뜨거운 물을 선까지 붓고 전자레인지에 2분 30초 정도 돌려줍니다. 그리고 후첨 바질 분말을 ..

제품명widthheightSamsung Galaxy Note 8414846Samsung Galaxy Note 9414846Samsung Galaxy Note 10412869Samsung Galaxy Note 10+412869Samsung Galaxy Note 20412915Samsung Galaxy Note 20 Ultra412883Samsung Galaxy S7360640Samsung Galaxy S7 edge360640Samsung Galaxy S8360740Samsung Galaxy S8+360740Samsung Galaxy S9360740Samsung Galaxy S9+360740Samsung Galaxy S10360760Samsung Galaxy S10+412869Samsung Galaxy S1..

안녕하세요 :) 무택입니다🧔 오늘 알아볼 내용은 "YTPlayer" 플러그인입니다. 유튜브 iframe은 모바일에서 자동재생, 자동바 숨김이 안되기 때문에 이런 경우에 활용가능한 라이브러리(플러그인)입니다. 01. 일반 활용 See the Pen [라이브러리]유튜브영상을 배경으로 활용하기(YTPlayer) by TytanLee (@TytanLee) on CodePen. 일반적인 활용을 하면 html파일에서 문서가 지저분해 보여서 html에서 설정한 속성값을 스크립트로 넘겨서 html파일을 깔끔하게 만들 수 있습니다. 깔끔하게 정리한 문서는 아래를 참고해주세요. 02. 코드 간소화 활용 See the Pen [라이브러리]유튜브영상을 배경으로 활용하기(YTPlayer)+코드 간소화 by TytanLee (@..

See the Pen scrollTrigger 활용 by TytanLee (@TytanLee) on CodePen. scrollTrigger 라이브러리 활용해서 css수정하기 - 문제점 : 한 번만 활용하는 게 아니라 두 번 활용할 경우 코드 어떻게 활용할지 찾기

1.HTML 프로덕트 매니지먼트 사용자 친화적 서비스 개발 PM 실무 역량 강화 더 알아보기> 2.CSS *{ margin: 0; padding: 0; } #container{ padding: 20px; width: 300px; height: 200px; background-color: lightgray; position: relative; top: 10vh; transition: all .2s ease-out; border-radius: 16px; box-sizing: border-box; } #container > p{ margin-block: 16px; } #container > a > span{ background-color: white; border-radius: 100%; } #containe..

안녕하세요 :) 무택입니다🧔 오늘 알아볼 기능은 포토샵에서 RGB모드로 작업하다가 CMYK로 변경하려고 할 때 사용할 기능입니다. RGB는 온라인용 작업물을 말하고 CMYK는 인쇄용 작업물을 말합니다.보통 인쇄용 작업물을 포토샵으로 잘 사용하진 않는데 어쩔 수 없이 사용이 필요할 경우에 사용하기도 합니다. 01. 먼저 RGB모드인지 확인을 해줍니다. 02. 그리고 인쇄용으로 작업하기 위해서는 해상도를 높여야 합니다. 인쇄용은 72dpi를 사용하지만 인쇄용은 150-300dpi를 사용하기 때문에 해상도 높이는 작업을 먼저 해주겠습니다. '이미지 - 이미지 크기(Alt+Ctrl+I)' 클릭 03. 해상도를 300으로 설정해줍니다. 용량이 큰 파일들을 첨부하고 있으면 해상도 바꾸는데 시간이 오래 걸릴 수도 있..

안녕하세요 :) 무택입니다🧔 오늘은 간단하지만 인풋대비 좋은 아웃풋을 낼 수 있는 기능을 가져왔습니다. 홈페이지에서는 잘 사용하지 않지만 원페이지로 되어있는 있고 페이지의 길이가 긴 경우에 사용하기 좋은 기능입니다. 바로 scroll-behavior 설정입니다. See the Pen [CSS]a태그 클릭시 섹션 부드럽게 넘어가기(scroll-behavior) by TytanLee (@TytanLee) on CodePen. 위처럼 html에 'scroll-behavior: smooth;' 값을 주면 페이지 전체에 a태그 클릭 시 부드럽게 이동하는 효과를 적용할 수 있습니다. 서치 하다 보니 옛날에는 js라이브러리를 이용해서 구현했던 것 같은데 지금은 위 기능으로도 충분히 좋은 ux를 적용할 수 있으니 시대..

안녕하세요 :) 무택입니다🧔 오늘은 웹사이트 서치하다가 좋아 보이는 기능을 발견해서 그 기능에 대해 기록해보려 합니다. 스크롤 시 천천히, 부드럽게 보여주는 애니메이션에 대한 내용입니다. smoothwheel 제이쿼리를 찾아보다가 문제점이 있어서 실제 적용하기는 힘들어 보여서 실제로 더 서치 하다가 적용 가능한 scrooth라이브러리를 발견해서 두 가지를 남겨봅니다. 1. smoothwheel.js 원본 링크 - https://github.com/fatlinesofcode/jquery.smoothwheel GitHub - fatlinesofcode/jquery.smoothwheel: Cross browser smooth mouse wheel and trackpad scrolling Cross browse..

안녕하세요 :) 무택입니다🧔 오늘은 제이쿼리 여러 가지 선택자에 대해 정리해보려고 합니다. closest(), parent() 등 선택자는 쓰이는 경우가 많아서 꼭 알아야 할 문법인 것 같습니다. 예시 코드도 같이 설명에 넣어놨으니 활성화 버튼을 누르기 전에 뭐가 활성화될지 한번 생각해 보고 눌러보면 좋을 것 같습니다. #부모 선택자 $("기준요소").parent() : 기준요소의 부모 선택 - See the Pen jQuery_parent by TytanLee (@TytanLee) on CodePen. $("기준요소").parents() : 기준요소의 부모들 모두 선택 - See the Pen jQuery_parent by TytanLee (@TytanLee) on CodePen. $("기준요소").c..

안녕하세요 :) 무택입니다🧔 오늘은 동등연산자(==)와 일치연산자(===)의 비교입니다.처음에 보면 헷갈리는 부분이 있기 때문에 정리해보려고 합니다. #동등연산자(==) - 두 피연산자의 값이 같으면 true반환 - 피연산자의 타입이 서로 다르면 강제로 타입을 같게 변환 [10 == '10'] // true [true == 1] // true [true == '1'] // true [true =='true'] // false [null == undefined] // true [10 == '10'] 하나가 숫자형이고 다른 하나가 문자열이면 문자열을 숫자로 변환 후 비교 [true == 1] 피연산자 중 불리언 값이 있으면 불리언 값을 0&1로 변환 후 비교(false=0, true=1) [true == '..