본문 바로가기

분류 전체보기

(70)
highcharts.js.map 404 오류 해결하기 안녕하세요. 오늘은 highcharts.js를 사용하면서 만난 오류 해결 과정에서 찾은 자료들을 정리해보려고 합니다. 저는 public/js/ 디렉터리 하위에 highcharts.js 파일을 두고 사용 중입니다. 그런데 개발자 도구 콘솔 로그에 계속 아래와 같은 오류가 찍히는 문제가 있었습니다. DevTools failed to load source map: Could not load content for http://xxx.xxxx.com:xxxx/public/js/highcharts.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE highcharts.js.map 파일이 없어서 404 에러가 발생하고 있었습니다. .map..
Cookie 값 세팅하기 쿠키 세팅하기 콘솔에서 아래처럼 원하는 쿠키 값을 세팅 document.cookie ='key=value' 결과 Chrome 개발자도구 Application 탭에서 확인 가능
[동영상 강의] Do it! HTML + CSS + 자바스크립트 웹 표준의 정석 - Javascript 자바스크립트와 첫 만남 자바스크립트로 무엇을 할까 다양한 라이브러리를 사용할 수 있다. D3.js - 정보시각화 라이브러리. tensorflow.js - 머신러닝 라이브러리. React, Angular, Vue 서버를 구성하고 서버용 프로그램을 만들 수 있다. node.js - 프런트엔드 개발에 사용하던 자바스크립트를 백엔드 개발에서 사용할 수 있게 만든 프레임워크. 간단한 입출력 방법 alert, confirm, prompt document.write console.log 자바스크립트 스타일 가이드 자바스크립트 소스를 작성할 때 지켜야 할 기본 규칙 코드를 보기 좋게 들여쓴다. Tab 키나 스페이스바를 눌러 2칸이나 4칸을 들여씀 최근에는 공백 2칸 들여쓰기를 많이 사용함 세미콜론으로 문장을 구분한다...
[Tmux] MacOS에서 Tmux 설치 및 사용하기 MacOS에서 Tmux 설치하기 brew install tmux https://github.com/tmux/tmux/wiki/Installing 참고) 오류 해결 설치 중 아래와 같은 오류가 발생하였다. Error: The following directories are not writable by your user: /usr/local/share/man/man8 You should change the ownership of these directories to your user. sudo chown -R $(whoami) /usr/local/share/man/man8 And make sure that your user has write permission. chmod u+w /usr/local/share..
node_modules/node-sass: Command failed. 오류 해결 하기 안녕하세요. 오늘 새로운 프로젝트를 세팅 중에 오류가 발생하여 해결하였던 내용을 공유해보려고 합니다😊 문제 발생 기존에 있던 프로젝트를 가져와서 사용을 하게 되었는데, yarn install 명령어 실행 시 오류가 발생하였습니다. yarn install /Users/user/Documents/workspace/.../node_modules/node-sass: Command failed. ... 1 error generated. make: *** [Release/obj.target/binding/src/binding.o] Error 1 gyp ERR! build error gyp ERR! stack Error: `make` failed with exit code: 2 gyp ERR! stack at Chi..
[동영상 강의] Do it! HTML + CSS + 자바스크립트 웹 표준의 정석 - 반응형 웹과 미디어 쿼리 뷰포트 뷰포트 지정하기
[동영상 강의] Do it! HTML + CSS + 자바스크립트 웹 표준의 정석 - 트랜지션과 애니메이션 변형(transform, 트랜스폼) 웹 요소의 위치나 크기를 바꿈으로써 시각적인 효과를 만드는 것 2차원 변형 x축, y축 좌우, 위아래로만 변형이 일어나면 2차원 변형 3차원 변형 x축, y축, z축 앞, 뒤로 이동 추가. 원근감이 추가됨. 보는 사람 쪽으로 다가올수록 값이 더 커짐 transform 속성 뒤에 원하는 함수를 추가해주면 됨. transform: translateX(50px); /* x축(가로 방향)으로 50px 이동 */ transform: translateY(50px); /* y축(세로 방향)으로 50px 이동 */ transform: translate(10px, 20px); /* x축(가로 방향)으로 10px, y축(세로 방향)으로 20px 이동 */ transform: scaleX..
[동영상 강의] Do it! HTML + CSS + 자바스크립트 웹 표준의 정석 - CSS 고급 선택자 연결 선택자 하위 선택자: container 안에 있는 모든 p 태그 #container p 자식 선택자: container의 자식 요소인 p태그에만 적용 #container > p #container > div > p 형제 선택자: h1 다음에 오는 형제 요소들 중 모든 p태그에 적용 h1 ~ p 인접 형제 선택자: 바로 다음에 있는 형제 p태그에만 적용 h1 + p 속성 선택자 href 속성이 있는 a태그에만 적용 li a[href] href 값이 #인 a태그에만 적용 li a[href="#"] { cursor:default; } 가상 클래스와 가상 요소 가상 클래스 링크에 사용 가능한 가상 클래스 :link :visited - 방문했던 링크 :hover - 마우스를 올렸을 경우 :active - 마..