기록장

1.카카오 개발자 사이트에서 web용 애플리케이션 만듬사이트 도메인은 로컬이라 로컬로 지정 2. 등록하러가기 버튼을 눌러, 로그인 성공후 갈 곳 지정   3. 아래의 동의항목 넣음(더하려면 비즈니스 계정 변환 필요)    4. js 앱키 복사 해놓고 html 둘 다에 넣음         | 폴더구성  | index.html (로그인 할 곳 코드) 해당 Live Demo는 테스트용이기 때문에 반드시 소스 코드에 '본인 API 키'를 넣어야 제대로 사용할 수 있습니다.   | kakao_login.html (로그인 한 후 redirection 될 곳 코드) 로딩 중... 로그아웃 | 탈퇴    | 파일 다운

원래의 Prettier 단축키는 ctrl + alt + p? 인가 그런데자신이 쓰고싶은 걸로 바꾸려면 아래처럼 하면 된다! 1. Prettier 다운 및  설치2. 설정(ctrl+,) 에서  default formatter 검색하여 Prettier 로 설정3. 키보드 설정 (바로가기) ctrl+k ctrl+s 에서 Format Document 검색하여키 바인딩 : Ctrl + Shift+  B 변경(나는 위 바인딩이 편해서 이렇게 씀)  이렇게 prettier 설정에서 (확장 프로그램 목록의 톱니바퀴 아이콘 클릭)TAB 가로 폭도 바꿀수있다! (기본이 2이라서 나는 4로 변경)

[01]자바스크립트의 특징으로 아닌 것은 1 웹의 동작(동적) 구현하기 위한 언어 2 웹 브라우저에서 동작(단, node.js는 서버에서 동작) 3 html문서 내에서  ~  태그 안에 작성 4 대소문자를 구별한다 5 객체 기반의 스크립트 언어 6 웹 브라우저 자바스크립트 엔진이 내장되어 있기 때문에 사용이 불가능 정답:- 대소문자를 구별         - 웹 브라우저 자바스크립트 엔진이 내장되어 있기 때문에 사용이 가능 [02]변수(Variable)의 간단히 설명하기 정답: 변수란 데이터를 저장할 수 있는 메모리 공간을 의미합니다.  [03]상수(constant)의 간단히 설명하기 정답: 한번 선언된 상수는 다시 재정의 할 수 없으며, 값도 재할당 할 수 없습니다. [04]자바스크립트의 데이터 타입이란..

📌 연산자1. 산술 연산자산술 연산자: 사칙연산 및 기본적인 연산을 수행하는 연산자.예시: +, -, *, /, %2. 비교 연산자비교 연산자: 두 피연산자의 상대적인 크기를 비교하여 참 또는 거짓을 반환.예시: ==, ===, !=, >, =, 3. 대입 연산자대입 연산자: 변수나 상수에 값을 할당할 때 사용하는 연산자.= : 우측 값을 좌측 변수나 상수에 대입.+=, -=, *=, /=, %=, **=: 우측 값을 좌측 값과 연산한 후, 다시 좌측 변수에 대입.4. 증감 연산자증감 연산자: 변수의 값을 1씩 증가 또는 감소시킬 때 사용.++변수 : 변수를 먼저 1 증가시키고 나서 연산을 수행.변수++ : 연산을 먼저 수행한 후에 변수를 1 증가시킴.--변수 : 변수를 먼저 1 감소시키고 나서 연산을..

alert () 또는 window.alert() : 사용자에게 메시지를 보여주고, 확인을 기다림alert("안녕하세요!"); // 메시지를 보여주고 확인 버튼을 기다림confirm() 또는 window.confirm() : 메세지를 보여주고 확인/취소를 누르면 불리언값으로 결과보임let result = confirm("계속하시겠습니까?"); // 확인을 누르면 true, 취소를 누르면 false 반환prompt() 또는 window.prompt() : 사용자에게 메세지를 보여주고 입력한 문자열을 리턴let name = prompt("이름을 입력해주세요:"); // 메시지를 보여주고 입력한 문자열을 반환 이렇게 반환한 t/f 값으로 다음 js를 작성해서 연계 할 수 있음! 👍👍👍

📌자바스크립트의 타입변환자바스크립트의 변수는 타입이 고정되어 있지 않음. 같은 변수에 다른 타입 값을 대입할 수 있음.let a = 10; // 숫자형a = "안녕"; // 문자열형  1. 암시적 타입 변환암시적 타입 변환: 타입의 값을 기대하는 곳에 다른 타입의 값이 오면, 자동으로 타입을 변환해서 사용함.NaN은 '정의되지 않은 값'이나 '나타낼 수 없는 값'을 의미함.예시: 0을 0으로 나누거나, 숫자로 변환할 수 없는 연산을 시도한 경우 NaN 반환.NaN (Not a Number)2. 명시적 타입 변환자바스크립트는 자동으로 타입 변환을 수행하지만, 명시적으로 타입을 변환해야 할 때도 있음.이를 위해 사용할 수 있는 함수는 다음과 같음:[명시적 타입 변환의 종류] Number() : 문자를 숫자..

📌 자바스크립트의 특징 웹의 동적 동작을 구현하기 위한 언어웹 브라우저에서 실행되며, 서버 환경에서는 Node.js로 동작 가능HTML 문서 내에서 태그 안에 작성대소문자를 구별함 (let과 Let은 다른 변수로 인식)객체 기반의 스크립트 언어로, 다양한 객체를 활용하여 동작을 구현웹 브라우저 자바스크립트 엔진이 내장되어 있어 별도의 설정 없이 사용 가능 📌 use strict (js 작성시 최상단에 작성) 자바스크립트에서 strict mode를 사용하겠다는 선언엄격한 문법을 적용하여, 실수를 줄이고 코드 품질을 높이는 역할예: 변수 선언 없이 사용 불가, 대소문자 명확하게 구분상단에 "use strict";를 추가하여 활성화 가능use strict 없이도 코드를 작성할 수 있지만, 이를 사용하면 ..

| 문제상황click이벤트를 사용한 반응형 웹페이지 제작시데스크탑에서는 정상작동하지만 갤럭시 폰에서 특정버튼에 터치이벤트가 걸리지 않음= > click touchend 를 줬더니 대부분 동자갛나, 몇개의 터치 이벤트 동작이 안됨 | 문제의 코드 $(document).ready(function () { $(".drag_box_inner_btn .box_playlist").on("click touchend ", function () { let img = $(this).find("img"); if (img.hasClass("widget_active_bgm")) { img.re..

| 목표안경 낀 고양이 외의 요소(플레이리스트, 시계, 왼쪽 사이드의 고양이들 등) 들은각 sub/ 의 html 안에서 공통적으로 쓰일 div이며,js의 script 또한 동작해야함    | 방법  1. 공통으로 넣을 div를 가진, html 파일을 만듬 (common_widget.html)⚠️ meta tag 빼고 div 알맹이만 가지는 파일이 돼야함 ⚠️ Insomnia's Room .... 그 외 div요소들 2. 공통으로 넣어질 html (common_widget.html) 파일의 css와 js를 만듬(common.css /sub_common.js)// 아래는 이해를 돕기위한, sub_comm..

| 문제상황index.html과 sub/subpage.html 은 같은 JS를 공유해서 사용하는 상황.같은 mp3파일을 JS를 통해 가져와야 하는데,경로가 달라서 JS가 sub/subpage.html 에서 동작할경우'. ./ '가 추가되어야 함 $(document).ready(function () { const basePath = window.location.pathname.includes('/sub/') ? '../' : ''; const audioPaths = { Bgm1_Fireplace: basePath + 'bgm/DC_fire.mp3', Bgm2_Rain: basePath + 'bgm/DC_rain.mp3', Bgm3_MxRedKeyboard: ..