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

안녕하세요 찐망고입니다 SUIT폰트가 있고SUITE폰트가 있더라구요. 전체적인 텍스트에서 손글씨 느낌이 난다 생각했는데손글씨를 기반으로해서 만들었다고 하네요. 아무래도 다른 Noto Sans Kr, Pretendard폰트들 보단 가독성이 떨어질 수 있지만,디자인적인 요소에서는 최고 일 것 같아요.귀엽고 아기자기한 사이트에 잘 어울릴 것 같죠? 아래는 SUITE 폰트로 만든 메인 섹션 중 일부인데, 참고하시면 좋을 것 같아요.     otf, ttf, woff2 파일 다운 가능합니다.https://sun.fo/suite/ Sun sun.fo  CSS 코드@font-face { font-family: 'SUITE'; font-weight: 300; src: url('./SUITE-Light.woff2') f..

안녕하세요 찐망고 입니다.  settings.json 파일은 VSCode의 사용자 설정을 저장하는 JSON 형식의 파일인데요.이 파일을 통해 VSCode의 다양한 설정을 커스터마이즈할 수 있습니다.  VSCode에서 settings.json 파일을 여는 방법: VSCode 실행: VSCode를 실행명령 팔레트 열기: Ctrl + Shift + P (Windows/Linux) 또는 Cmd + Shift + P (Mac)를 눌러 명령 팔레트를 열기명령 입력: "Preferences: Open Settings (JSON)"을 입력하고 선택 { "open-in-browser.default": "firefox", "diffEditor.wordWrap": "on", "editor.wordWrap":..

안녕하세요 찐망고입니다. 이전에 그라디언트를 이용하여 마우스 hover할때 밑줄 애니메이션 효과를 적용하는 포스팅을 한적이 있는데요. 마우스 호버 CSS 밑줄 효과, CSS hover 밑줄 애니메이션안녕하세요 찐망고입니다. 오늘은 마우스 hover시 텍스트에 밑줄이 들어가는 작업을 해볼 거예요 https://hobancf.or.kr/ 호반문화재단 Creating culture, connecting hearts. www.hobancf.or.kr https://www.yesan.go.kr/chusa.duiweb.tistory.com 오늘은 텍스트에 배경색이 아래서 위로 채워지는 효과를 포스팅 할 예정입니다. 예시 사이트를 보면 스크롤 이동시 텍스트에 배경색이 채워집니다.     CSS코드h2 { color..

안녕하세요 찐망고 입니다.오늘은 데이터베이스 도메인 관련 포스팅을 해볼까 하는데요. 인터넷 주소의 도메인이 아니라, 데이터베이스에서 사용되는 도메인에 대해 설명드릴게요.  데이터베이스 도메인은 주로 다양한 데이터베이스 시스템에서 사용됩니다.회사 내부 시스템: 직원 정보, 급여, 재고 관리 시스템 등에서 사용돼요. 예를 들어, 직원의 나이, 이름, 급여, 입사 날짜 등을 저장할 때 각 속성마다 올바른 형식과 범위를 정해두죠.웹 애플리케이션: 웹사이트나 앱에서 사용자 정보를 관리할 때 사용돼요. 예를 들어, 회원 가입 시 이름, 나이, 이메일 주소 등을 입력받을 때 올바른 형식으로 입력되도록 도와줘요.정부 및 공공기관 데이터베이스: 주민등록 시스템, 세금 신고 시스템 등에서 정확하고 일관된 데이터를 저장하기..

안녕하세요 찐망고 입니다. 오늘은 자바스크립트에서 변수에 대해 알아보겠습니다.변수란 무엇이며, 어떻게 사용하는지, 그리고 자바스크립트에서 변수 선언의 다양한 방법에 대해 자세히 설명해 드릴게요.  변수란?변수는 값을 저장하는 선물 상자와 같아요.이 상자에는 한 번에 한 가지 물건만 담을 수 있으며, 다른 물건을 넣으면 기존의 물건은 사라지거나 다른 상자를 준비해야 하죠.프로그래밍에서 변수는 변하는 값을 담는 그릇을 의미하며, '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: ..