둥지

6. 그림자 효과의 세 가지 방법: box-shadow, text-shadow, drop-shadowCSS에서 그림자를 표현하는 방법은 크게 세 가지가 있습니다:1. box-shadow: 요소 전체에 그림자를 적용 2. text-shadow: 텍스트에만 그림자를 적용 3. filter: drop-shadow(): SVG나 PNG 이미지에 그림자를 적용 각각의 속성은 다음과 같은 형식으로 사용됩니다: - box-shadow: x축 y축 blur 색상 - text-shadow: x축 y축 blur 색상 - filter: drop-shadow(x축 y축 blur 색상) 아래의 예제에서 볼 수 있듯이, 각각의 그림자 효과는 서로 다른 용도에 최적화되어 있습니다. box-shadow는 div와 같은 블록 요소에,..

이 글은 해당 영상을 정리한 글입니다.1. 간단하게 보더에 그라디언트를 줄 수 있습니다border-image 속성을 사용하면 가상 선택자 없이도 그라디언트 테두리를 만들 수 있습니다. 이 방법의 장점은:1. 코드가 간단하고 직관적입니다 2. 가상 선택자를 사용하지 않아도 됩니다 3. 브라우저 호환성이 좋습니다 border-image와 linear-gradient를 함께 사용할 때 주의할 점은 기본적으로 모서리에만 그라디언트가 적용된다는 것입니다. 하지만 border-image-slice 속성을 활용하면 테두리 전체에 균일한 그라디언트를 적용할 수 있습니다. 아래 예제는 border-image-slice 값을 1로 설정하여 그라디언트를 테두리 전체에 균일하게 적용한 예시입니다. border-image-sl..

CSS 중앙 정렬은 최근 들어 상당히 쉬워졌음에도 불구하고 어려운 것 중 하나입니다. web.dev에 소개된 탄력성 고리(The Resilience Ringer)라는 5가지 테스트 요소가 있습니다.1. Squished: 중앙 정렬은 너비 변경을 처리할 수 있어야 합니다.2. Squashed: 중앙 정렬은 높이 변경을 처리할 수 있어야 합니다.3. Duplicate: 중앙 정렬은 항목 수에 따라 동적이어야 합니다.4. Edit: 중앙 정렬은 콘텐츠의 길이와 언어에 따라 동적이어야 합니다.5. Flow: 중앙 정렬은 문서 방향 및 쓰기 모드에 독립적이어야 합니다.좋은 중앙 정렬은 위 요소를 모두 만족하는 경우가 탄력적이며, 안정적인 중앙 정렬이라 할 수 있다고 소개되었습니다. 1. 컨텐츠 중앙 정렬 (Con..

HTTPS란 무엇일까?보안은 매우 중요한 요소입니다.이러한 보안을 강화하기 위한 핵심 기술로 HTTPS가 사용되고 있습니다.HTTPS는 " Hypertext transfer protocol secure"의 약자로서 데이터를 암호화하여 전송하는 프로토콜입니다.HTTPS는 SSL/TLS 프로토콜을 사용해 데이터를 암호화함으로써 무결성과 기밀성을 보장하게 됩니다.이러한 특징 때문에 중간자 공격으로부터 보호되기 때문에 대부분의 웹사이트에서 필수적으로 사용되고 있습니다. 왜 로컬에서 HTTPS를 사용해야할까?대부분 로컬에서 HTTPS를 사용할 필요는 없습니다. 하지만 로컬에서 HTTPS를 사용할경우 아래와 같은 이점이 있습니다.- 실제 배포 환경과 유사한 조건에서 개발 및 테스트- 혼합 콘텐츠를 로컬에서 확인 가..

소프트웨어와 관련된 유명한 3가지 원칙이 있습니다.바로 KISS, YAGNI, DRY 입니다. 이 셋은 아래와 같이 정말 간단히 설명할 수 있습니다.1. KISS (Keep It Simple Stupid): 되도록 간단하고 단순하게 만들어라.2. YAGNI(You Ain't Gonna Need It): 불필요한 작업을 하지 말아라.3. DRY(Do not Repeat Yourself): 코드를 반복하지 말아라. KISS는 코드는 간결하고 단순해야 이해하기 쉽고, 이해하기 쉬울수록 버그가 발생할 가능성이 줄어들게 하는 원칙입니다. YAGNI는 미래 어느 시점에 사용될지도 모를 코드를 작성하는 것은 KISS와 반대로 코드가 불필요하게 장황해지기 때문에 당장 필요한 작업에 집중하고 쓸데 없는 작업은 하지 말라..

테스트 환경 셋팅하기 # 프로젝트 init npm init -y # 필수 라이브러리 및 프레임워크 설치하기 npm i --save express npm i --save-dev chai chai-http mocha # 아래와같이 package.json 파일을 수정 "scripts": { "test": "./node_modules/mocha/bin/mocha" }, main.js 파일을 생성 const express = require('express') const bodyParser = require('body-parser') const app = express() app.use(bodyParser.json()) app.use(bodyParser.urlencoded({extended:true})) app.g..

제목과 같은 문제가 자꾸 발생해서 짜증이 나던중 해결법을 찾아보았습니다. 당연하게도 또한 다행이지만 저와 같은 문제를 겪고 해결을 하고자 하신 분들이 많았습니다. 그중에서 가장 좋다고 생각하는 방법을 공유합니다. 아래의 블로그를 들어가보시면 아시겠지만 cmd창에서 아래와 같은 내용을 쳐보시기 바랍니다. set LC_ALL=ko_KR.UTF-8 만약 위와 같은 내용을 치고 문제가 해결이 되었다면 간단합니다. 이제 환경 변수에 위의 내용을 입력하면 됩니다. 방법은 다음과 같습니다. 먼저 시스템 속성 > 고급 탭으로 이동하여 하단의 환경 변수를 클릭합니다. 다음으로 아래 보이는 이미지와 같은 창에서 시스템 변수의 새로 만들기를 클릭합니다. 아래와 같이 입력하시고 계속 확인을 눌러 열려진 창을 모두 꺼주시면 해..

깃에 push를 할때 주로 혼자 작업을 하면 빼먹은게 있다보면 amend를 적용시킨 후 git push -f 이런식으로 하면 안된다는걸 알면서도 이러게 되네요. 문제는 최신 커밋 상태로 적용되고 있는 다른 repo에서인데요 이때 강제로 pull을 하기 위해 git pull -f origin master 이렇게 치면 강제로 merge가 됩니다. 이때 merge가 되지 않도록 하는 방법을 찾다가 F.E.D 님의 블로그에서 좋은 내용을 봤네요. git fetch --all git reset --hard origin/master 위와 같이 입력을 하면 원격 repo의 변경사항을 Merge 없이 적용시킬 수 있습니다. 참조 : https://frontdev.tistory.com/entry/GIT-Conflict%..

1. 설치 가능한 postgresql의 버전을 확인합니다.yum list | grep ^postgresql 2. 저장소를 업데이트 합니다. ( postgresql 11 버전 설치 할것 )yum install -y https://download.postgresql.org/pub/repos/yum/11/redhat/rhel-7-x86_64/pgdg-centos11-11-2.noarch.rpm 3. postgresql 설치 합니다.yum install -y postgresql11-server postgresql11 4. 패키지가 제대로 설치되었는지 확인합니다.rpm -qa|grep postgresql 5. postgres 계정이 있는지 확인합니다.cat /etc/passwd | grep postgres 6. ..

배그를 하기위해 헤드셋을 하나 구매했습니다. 다얼유 EH722 헤드셋입니다. 음.. 나쁘진 않은거 같은데밴드가 너무 고탄력입니다. "고"탄력입니다.. 강조합니다 "고"탄력입니다.이것과 쿠션에서 조금 인조가죽냄새가 나는것만 제외한다면 괜찮은거 같네요.옆에 보이는 기하학적인 무늬는 LED가 되서 무지 이쁩니다. 나중에 고무부분에 테이프를 감아서 내려오지 않게 만들던지 해야겠네요 아.. EQ 설정이 필수입니다...그런데 다얼유에 문의한 결과 설정을 위한 자기들의 측정값이 존재하지 않는다네요 ㅠㅠ감으로 맞춰야 합니다..