찐망고'S 퍼블리싱그리고디자인

안녕하세요 찐망고 입니다. 오늘은 자바스크립트에서 변수에 대해 알아보겠습니다.변수란 무엇이며, 어떻게 사용하는지, 그리고 자바스크립트에서 변수 선언의 다양한 방법에 대해 자세히 설명해 드릴게요.  변수란?변수는 값을 저장하는 선물 상자와 같아요.이 상자에는 한 번에 한 가지 물건만 담을 수 있으며, 다른 물건을 넣으면 기존의 물건은 사라지거나 다른 상자를 준비해야 하죠.프로그래밍에서 변수는 변하는 값을 담는 그릇을 의미하며, 'variable'이라고 불러요.   변수에 값을 할당하기변수에 값을 넣는 것을 **할당(assignment)**이라고 합니다.예를 들어, mood라는 변수에 "행복"이라는 값을 할당하거나, age라는 변수에 40이라는 값을 할당할 수 있습니다.mood = "행복";age = 40;..

안녕하세요 찐망고입니다. 자바스크립트 첫 포스팅은 스크립트의 역사부터 시작하려고 했는데검색해 보니 정리가 잘된 블로그들이 많더라고요..그래서 해보는 링크 공유 자바스크립트의 역사브라우저에서 동작하는 언어였던 자바스크립트는 범용 프로그래밍 언어가 되기까지 ECMAScript, CommonJS 등 표준화를 거쳐왔다. 지금은 이 표준을 기반으로 자바스크립트는 어디에서나 사용할 수roseline.oopy.io 추가로 더 써보자면 자바스크립트의 탄생자바스크립트는 1995년, 브렌던 아이크(Brendan Eich)가 넷스케이프와 썬 마이크로시스템즈와 함께 개발한 언어입니다.자바스크립트는 웹 브라우저에서 좀 더 동적인 기능을 제공하기 위해 만들어졌는데,초기에는 간단한 폼 검증과 같은 작업에 주로 사용되었죠.자바스크립..

안녕하세요 찐망고입니다.  CSS에서 그라디언트는 background-image 속성으로 적용됩니다. 그러나 그라디언트는 직접적인 값의 변화가 아니라, 하나의 이미지처럼 렌더링 되기 때문에CSS의 `transition` 속성을 사용해도 그라디언트의 색상이나 위치가 부드럽게 변화하지 않습니다.그래서 그걸 해결하려면!! 가상 요소를 사용하기 가상 요소(::before 또는 ::after)를 사용하여 기존 요소 위에 그라디언트를 덮고, opacity 속성을 이용해 부드럽게 보였다 안보였다 하도록 설정합니다. .element { position: relative; width: 200px; height: 200px;}.element::before { content: ""; position: absolut..

티몬의 시작은 2010년 5월 10일로, 대한민국 최초의 소셜커머스 플랫폼이었다.그 당시 ' 티켓몬스터 '라는 이름으로 출발해, 공구를 통해 상품과 서비스를 할인된 가격에 제공하는..이때 함께 기억하는 브랜드가 바로 마녀공장이다.티몬의 인기에 힘입어 마녀공장은 출시 초기부터 큰 성공을 거뒀던 기억이 난다.출시한 지 일 년도 안되어 대박 난 마녀공장!!그때 당시 브랜드 화장품 외에 (우리가 흔히 알고있는 대기업 화장품들)듣도 보던 중소기업 화장품 브랜드를 판매할 유통망은 아예 없었다고 해도 무방하다.홈쇼핑, 백화점 모두 마다할 때 손을 내밀었던 건 그때의 티켓몬스터아마 티몬이 없었더라면 지금의 마녀공장은 어떻게 되었을까 궁금하다.  특히, 가성비가 뛰어난 제품으로 주목받았던 마녀공장은,티켓몬스터의 저렴한 ..

안녕하세요 찐망고입니다. 제가 오늘은 네이티브앱, 하이브리드앱, 웹앱을 좀 쉽게 포스팅해보려고 해요.그니까 머랄까 다들 대충은 알고 있잖아요?대충은 아는데 내가 아는 게 맞나 싶을 때 이 포스팅 읽으면 해결됨 자 먼저 1. 네이티브 앱(Native App)네이티브 앱은 특정 플랫폼(iOS, Android)을 위한 전용 언어와 개발 도구로 개발된 애플리케이션인데요.iOS 앱은 Swift나 Objective-C로, Android 앱은 Kotlin이나 Java로 작성됩니다.Kotlin개발자가 전세계에서 작년 연봉 1위라면서요? 부럽다.. 주요 특징: 최적화된 성능: 하드웨어와 직접 상호작용하므로 높은 성능과 속도를 제공네이티브 UI/UX: 플랫폼별 UI 가이드라인을 따라 사용자 경험이 최적화광범위한 API 접..

안녕하세요 찐망고입니다.CSS의 너무 기초적인 부분을 포스팅하려고 합니다. CSS(Cascading Style Sheet)란 웹 페이지의 겉모습을 정의하고 꾸미는 데 사용되는 스타일 시트 언어인데요. 주요 기능은 다음과 같습니다:  레이아웃 정의: 페이지의 구조와 배치를 지정합니다.스타일 설정: 텍스트의 글꼴, 색상, 크기 등을 지정합니다.디자인: 배경, 테두리, 여백 등을 설정하여 페이지의 시각적 디자인을 조정합니다.반응형 디자인: 다양한 장치(데스크톱, 태블릿, 스마트폰 등)에 맞게 레이아웃과 스타일을 조정합니다.   CSS는 기본적으로 선택자(Selector)와 선언(Declaration)으로 구성되며, 선언은 속성(Property)과 값(Value)으로 이루어집니다. h1 { color: ..

안녕하세요 찐망고입니다.작년 여름에 개인정보취급방침에 대해서 포스팅했는데요. 개인정보처리방침안녕하세요 찐망고 입니다. 웹사이트에서 푸터에 해당하는 부분을 보면 꼭 들어가는 내용이 있죠?카피라이트, 사업자정보, 그리구 개인정보처리방침!!!!   개인정보처리방침이란?개인정보보uiweb.tistory.com 오늘은 웹사이트 저작권 표시 관련 포스팅을 해볼까해요네 맞아요 그친구 © ㅎㅎ  웹사이트 저작권표시란? 웹사이트 저작권 표시는 웹사이트의 콘텐츠가 저작권법에 의해 보호받고 있음을 알리는 역할을 합니다. 이는 법적 보호뿐만 아니라, 사용자들에게 콘텐츠를 무단으로 복제하거나 배포하지 않도록 경고하는 역할도 합니다.   저작권 표시의 중요성  법적 보호: 저작권 표시는 저작권 소유자가 콘텐츠에 대한 권리를 주장..

안녕하세요 찐 망고입니다. 최근 Config 2024에서 재설계된 Figma UI3을 소개받았는데요.새로운 UI3은 디자인 경험을 단순화하려고 노력한 흔적이 보입니다.그리고 생각보다 많이 바뀌었어요. 해당 링크를 참고 삼아 포스팅해보려고 합니다.https://help.figma.com/hc/en-us/articles/23954856027159-Navigating-UI3-Figma-s-new-UI  내비게이션 패널:UI 최소화: 클릭 아이콘으로 탐색패널과 속성패널을 축소할 수 있음파일 이름 및 위치:  파일이름 옆 드롭다운 아이콘을 통해 파일이동, 라이브러리, 브랜치생성, 버전기록등을 손쉽게 수행할 수 있음.Assets탭: 구성요소를 검색, 탐색, 삽입하는 과정이 더 쉬어짐     - 이전 피그마 page..

안녕하세요. 찐망고입니다. 오늘은 Apple Touch Icon 관련 포스팅을 해볼까 하는데요. Apple Touch Icon은 iOS기기에서 웹 사이트를 홈 화면에 추가할 대 사용하는 아이콘 입니다.이 아이콘을 설정하면 사용자가 웹 사이트를 홈 화면에 추가했을 때 표시되는 아이콘 이미지를 지정할 수 있습니다. 물론 Apple Touch Icon을 웹 사이트에 추가하는 것이 필수는 아니지만,홈화면 추가시 iOS 기기의 홈화면에 아이콘이 깔끔하게 표시됩니다.만약 이 아이콘이 없다면 기본 웹 브라우저 아이콘이나 웹사이트의 축소된 화면이 표시될 수 있는데 그거 정말 너무나 별로겠죠?또한 Apple Touch Icon을 설정하는 것은 최신 웹표준을 따르는 좋은 관행 중 하나입니다.   Apple Touch Ic..

안녕하세요 찐망고입니다.오늘은 favicon에 대해 포스팅 할겁니다.  파비콘이란?  모든 브라우저의 탭엔 제목이 있고 그옆엔 저렇게 파비콘이 붙어요.물론 없어도 큰일 나지는 않지만, 있으면 이뻐! 파비콘은 브라우저 탭, 북마크, 즐켜찾기 목록에서 웹사이트를 대표하는 작은 아이콘입니다.이를 통해 사용자는 쉽게 웹사이트를 인식하고 찾을 수 있어요.일관된 브랜드 이미지 구축에도 도움이 되구요. 파비콘의 중요성사용자가 여려개의 탭을 열어놓았을때, 탭이 아주 작아지는 경험들 다들 있으시잖아요?파비콘이 있으면 제목이 뭔지 몰라도 웹사이트를 빠르게 식별할 수 있습니다. 또한, 일부 검색 엔진은 파비콘을 검색결과에 표시하기도 합니다.당연히 사용자의 클릭률(CTR)을 높이는데 기여할 수 있죠 제일 중요한건 파비콘이 없..