문제상황 크롬을 이용해 웹으로 피그마 파일을 자주 열었는데 어느 순간부터 피그마 파일이 안 열렸다 Uh oh... we can't open that fileWe can't open this file because WebGL isn't supported, or is disabled, in your browser. If your browser supports WebGL, check out this help article to find out how to enable it. 이런 메세지가 뜨면서 자꾸 안 열렸다 처음에는 캐시를 삭제하고 브라우저 재시작을 해보았지만 문제가 해결되지 않았다검색을 해보니 해결 방법이 의외로 간단했다  에러 메세지를 읽어보니 Web GL 을 활성해주라고 뜬다아래 단계를 차근차근 따라..

문제상황 얼마 전 프로젝트 기본 구조를 세팅할 일이 있었다우클릭-> 폴더 이름 작성 -> 엔터 하는 과정을 반복하며열심히 폴더를 만들었다그런데, 폴더 구조를 세팅 다 해서 commit 을 하니 noting to commit 에러가 떴다On branch main Your branch is up to date with 'origin/main'. nothing to commit, working tree clean 난 분명 폴더를 열심히 만들었는데? 변경 사항이 있는데? 왜 비교할게 없다고 뜨는 걸까 알고보니 git에서는 기본적으로 비어있는 폴더를 추적하지 않기 때문에, 폴더만 만든 상태에서는 아무것도 커밋 할 게 없다고 나오는 것이었다  해결방법 해결방법은, 비어있는 폴더에 .gitkeep 이라는 파일을 추가..

노트북에서 바로 이미지를 첨부했을때 이미지 크기 조절하기 옵시디언에서 이미지를 바로 첨부하면 위키 링크 형식으로 이미지가 삽입된다. 바로 아래처럼 이미지가 첨부된다 ![[clice.png]] 이미지의 크기를 변경하고 싶다면, 이미지 파일명 뒤에 크기를 지정해주면 된다. 크기를 지정하는 방법은 두 가지가 있다. 기본적으로 방법은 ![[파일명 | 사이즈 ]]형식이라고 알고 있으면 된다 1. 너비만 지정해주는 경우 이 경우 원래 비율에 맞추어 높이는 자동으로 설정된다![[clice.png|100]] 2. 너비와 높이를 동시에 지정해주는 경우이렇게 원하는 대로 사이즈를 지정해 줄 수 있다![[clice.png|100x200]] 이미지 URL 링크 사용하는 경우옵시디언에서는 이미지 URL을 사용하여 외부 이미지를..

서론 개발자들은`백틱 기호`를 써야 할 때가 많다 백틱 기호는 보통 esc 버튼 밑에 위치해있다 원래대로라면 한글 자판에서 이 버튼을 클릭하면 원 기호가 나오고영문자판에서 이 버튼을 누르면 백틱을 쓸 수 있다 그런데 개발자들은 한국어로 글을 작성하다가 백틱 기호를 써야 하면1. 영문 자판으로 전환2. 백틱 기호 입력3. 다시 한글 자판으로 전환이 과정을 매번 거쳐야 했다.이 과정은 매우 번거롭고, 오타도 자주 발생한다. 그래서 이번에는 한글 자판에서 이 버튼을 눌렀을때 바로 백틱 기호가 출력되게 해보자!!    1. 터미널을 열어준다터미널은 맥북에 기본적으로 설치되어있는 프로그램이다 터미널을 열면 이렇게 검정 배경에 무언가를 입력할 수 있게 된다  2. 터미널에 아래와 같이 입력하고 엔터를 친다mkdir..

들어가기 앞서자바스크립트로 프로그래머스 코딩 테스트 문제를 풀고 정리하는 시리즈입니다.이 시리즈는 C, C++, Python, Java 위주로 가득한 코딩 테스트 자료들 사이에서 자바스크립트로 문제를 푸는 데 어려움을 겪는 프론트엔드 개발자들에게 도움을 주기 위해 만들었습니다.자바스크립트 문제 풀이가 부족해서 어려움을 겪는 분들에게 이 시리즈가 가뭄의 단비 같은 존재가 되길 바랍니다. 목차삼항연산자MapFilter최대공약수, 최소공배수 함수Math.ceil몫을 구하는 가장 쉬운 방법 Math.floor, ~~틸트 연산자중복을 허용하지 않는 Set 객체배열 요소 정렬하기 sort() [JS]배열의 평균값 -프로그래머스120811 sort 함수의 동작 원리에 대해문제 링크: https://school.pro..

자주 사용하는 tailwind class 이름을 정리해보자이 글에 없는 다른 className을 찾고 싶다면 다음 공식문서에서 확인 할 수 있다: https://tailwindcss.com/또한, 카카오 엔터 기술블로그에서도 tailwind css 사용기에 대해 정리해두었으니, 흥미가 있는 사람들은 한번 들어가서 보길 추천한다: https://fe-developers.kakaoent.com/2022/220303-tailwind-tips/ Tailwind CSS 사용기 | 카카오엔터테인먼트 FE 기술블로그서종만(coze) 생산성을 높이는 일을 좋아합니다. 오늘 1분 걸린 작업이 내일 30초 걸리는 방법을 발견하면 기뻐합니다.fe-developers.kakaoent.com 레이아웃(Layout)contain..

문제 링크: https://school.programmers.co.kr/learn/courses/30/lessons/120585문제 설명머쓱이는 학교에서 키 순으로 줄을 설 때 몇 번째로 서야 하는지 궁금해졌습니다. 머쓱이네 반 친구들의 키가 담긴 정수 배열 array와 머쓱이의 키 height가 매개변수로 주어질 때, 머쓱이보다 키 큰 사람 수를 return 하도록 solution 함수를 완성해보세요.제한사항1 ≤ array의 길이 ≤ 1001 ≤ height ≤ 2001 ≤ array의 원소 ≤ 200입출력 예arrayheightresult[149, 180, 192, 170]1673[180, 120, 140]1900입출력 예 설명입출력 예 #1149, 180, 192, 170 중 머쓱이보다 키가 큰 ..

문제 링크: https://school.programmers.co.kr/learn/courses/30/lessons/120811문제 설명중앙값은 어떤 주어진 값들을 크기의 순서대로 정렬했을 때 가장 중앙에 위치하는 값을 의미합니다. 예를 들어 1, 2, 7, 10, 11의 중앙값은 7입니다. 정수 배열 array가 매개변수로 주어질 때, 중앙값을 return 하도록 solution 함수를 완성해보세요.제한사항array의 길이는 홀수입니다.0 -1,000 입출력 예arrayresult[1, 2, 7, 10, 11]7[9, -1, 0]0 입출력 예 설명입출력 예 #1본문과 동일합니다.입출력 예 #29, -1, 0을 오름차순 정렬하면 -1, 0, 9이고 가장 중앙에 위치하는 값은 0입니다.내가 작성한 코드우선..

입력값이 배열인지 아닌지 판단하려면 어떻게 해야 할까?기본적으로 다음과 같이 if문을 쓰고 여러가지 조건을 붙이는 생각을 할것이다 1. typeof =='object'배열의 type은 기본적으로 'object'로 출력된다그래서 typeof연산자를 이용해 'object'인지 아닌지 판단한다 그렇지만 이러면 일반적인 객체도 type이 object이기 때문에 이것만으로 배열을 골라낼 수는 없다따라서 2번,3번 조건들로 object값을 가지는 다른 객체들 중에 배열이 아닌 것들의 특징을 이용해 배열을 골라내보자 2. inputArray !== nullJavaScript에서 null은 객체이며, 배열도 객체이기 때문에, null을 제외하는 조건을 추가해야 한다. 그래서 !==null 조건으로 inputArray가..