본문 바로가기

반응형

분류 전체보기

(366)
[npm] axios 사용법 보호되어 있는 글입니다.
[javascript]Array.sort() 사용 시 숫자 정확하게 정렬하기(1,5,10,...) 2024/02/27 기준 | 오름차순과 내림차순 설명이 반대로 되어 있는 것을 보고 수정하였습니다. 숫자정렬 Array.sort() 함수는 인자값으로 비교함수를 받으며, 만일 비교함수를 인자로 입력하지 않으면 Array의 모든 요소를 문자로 변환하고, 유니코드 기준에 따라서 크기 순서대로 정렬하는 함수이다. 때문에, 비교함수를 넣지 않고 10의 자리로 넘어가는 경우 1,10,100,2 와 같은 형식으로 정렬된다. 따라서 문자열은 문자로, 숫자는 숫자 타입으로 정렬하기 위해서는 인자값으로 배열의 각 요소를 비교할 수 있는 비교함수를 정의하여 호출해줘야 한다. function numberSort(num1,num2){ // 선택적 비교 함수 return num1 – num2 // num1 – num2가 음수를..
[javascript] webpack dev server 오픈 시 이미 열린 포트가 있다면, webpack dev server 를 오픈하다가 다음 문제가 발생했다. 이는 오픈 하고자 하는 포트가 이미 열려 있어서 생긴 문제 였다. 사실 다음 절차를 안 거쳐도 그냥 포트 번호를 수정하면 되지만, 그래도 알아두면 좋을 것 같아서 정리해 둔다. 명령 프롬포트나 파워 쉘 등에 들어가서 다음과 같이 입력하면 된다. netstat -ano | findstr 포트번호 //입력 시 해당 포트번호가 열려 있는지 확인할 수 있다. taskkill /f /pid "젤 우측 번호" //입력 시 해당 포트를 닫는다. // 참고로 'pid 번호' 는 프로세스의 id 번호를 의미한다.(id 번호는 프로세스를 구분하기 위한 식별자이다.)
[css] 태그 가운데 정렬 하는 법 부모 태그의 자식 태그를 대상으로 가운데 정렬함을 가정 세로 여백을 0으로 설정하고, 가로 여백을 `auto`로 설정하면, 브라우저가 알아서 여백을 조절하여 중앙정렬을 해준다. 이 때 부모 태그의 가로 넓이를 작게 설정하고, 자식의 가로넓이를 그 부모태그의 100%으로 설정하면, 중앙정렬이 되는 동시에 브라우저 크기에 따라 태그의 크기를 조절할 수 있다. margin 속성 유형 /* 네 면 모두 적용 */ margin: 1em; margin: -3px; /* 세로방향 | 가로방향 */ margin: 5% auto; /* 위 | 가로방향 | 아래 */ margin: 1em auto 2em; /* 위 | 오른쪽 | 아래 | 왼쪽 */ margin: 2px 1em 0 auto; margin 에서 auto 속성..
[node.js] node.js 서버 환경에서 css 파일 적용하는 방법 노란색으로 표시된 파일들을 기준으로 index.html 파일에 css를 적용한다고 가정 //server로 쓰이는 js 파일로 와서 상단에 아래와 같이 작성 app.use('/public',express.static('public')); //ㄴ 앱(app)에서 사용한다(use) /public 경로에 있는 모든 파일을 정적(static) 파일로, // 정적 파일: 수정이 거의 없는 파일
[html] 비디오 태그에서 자동 플레이가 안 될 경우 해결책 보호되어 있는 글입니다.
Cross-Origin Read Blocking(CORB) 관련 내용 링크 프로젝트를 만드는 중 video 태그에 src 속성으로 유튜브 영상과 연결토록 지정한 후 영상을 불러오는데, 아래와 같이 CORB 문구가 뜨면서 네트워크 요청은 성공했지만, 사이트와 연결은 차단되는 아이러니한 문제가 발생했다. Cross-Origin Read Blocking (CORB) blocked cross-origin response https://www.youtube.com/watch?v=46x7PRyNL3Q with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details. 일단 이게 뭐지 싶어서 파파고에 해석을 부탁했더니 교차 출처 읽기로 차단되었다는 것을 알게 되었다. 더 정확히..
[CSS] box-shadow 참고용 box-shadow "태그에 그림자 효과 넣음" /* x축 | y축 | 번짐정도 | 그림자 크기(퍼짐정도) | 그림자 색상 | 옵션(inset 등) */ box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2) inset; 'x축, y축' : 수평축과 수직축을 의미한다. 음수 값을 사용할 수 있다. '그림자 번짐(번짐정도)' : 그림자의 퍼짐 정도를 나타낸다. 값이 커질수록 그림자의 테두리가 흐려지면서 밝아진다. '그림자 크기': 그림자의 크기를 의미한다. 값이 커질수록 그림자 사이즈가 커지고, 반대는 작아진다. '그림자 색상' : 그림자의 색상을 결정한다. 'inset'(옵션) : 그림자를 적용하는 태그의 내부에 그림자 효과를 넣는다. 적용 color1 color2 color..

반응형