킹바구니

예전에 학원에서 배울때 중요하게 들었지만 정작 실무에서는 그렇게 쓰지 않았는데, 어쩌다보니 신경써야할 회사로 오게되서 정리함. 🔽 최대한 간결하게 작성해서 아래 링크에 올려놓음 🔽 https://codepen.io/pmx/pen/yLXMRwm 접근성 고려한 탭 | example of tabs with accessibility 참고 https://youtu.be/3LFUWO9mWpQ?list=PLtaz5vK7MbK2v9j4GW6l9L4dEkze9myE5... codepen.io

1. selector가 기준 2. $(this)쓰는데 뭔가 안될 때 확인해봐야할 것 // 이건 된다 $("button").click(function() { console.log($(this).attr("id")); }) // 이건 자바스크립트 함수라서 this를 인식 못한다. function something() { // no console.log($(this).attr("id")); // ok console.log($(event.target).attr("id")); } 쓰고있는 곳이 함수 안인지 그냥 제이쿼리 명령언지에 따라서 $(event.target)나 $(this) 이렇게 따로 써줘야 먹힘. 3. $("selector")는 기본적으로 여러 selector을 선택하긴하는데.. // 3개 전부 가리킴..

이걸 나도 뭐라 해야할지 모르겠어서 검색할때도 애먹었는데 var theme1 = "테마 1번입니다"; var theme2 = "테마 2번입니다"; var num = prompt('원하는 테마 번호는?'); 예를들어 prompt에 2를 입력하면 theme2에 대한 내용이 출력되도록 하는걸 하고싶었는데, console.log(`theme${num}`); console.log(theme+num); console.log('theme'+num); 이런식으로 하면 변수로 인식하지 못하고 텍스트로 인식해버려서 어떻게 하나 싶었는데 방법은 1. eval 사용하기 (그런데 비추인것 같음) // var theme1 = "테마 1번입니다"; // var theme2 = "테마 2번입니다"; // var num = promp..

1. vscode에서 live server 설치 2. 설정 버튼 누르기 3. Live Server > Settings: Host 확인 기본으로 127.0.0.1로 써져있음 4. 와이파이 아이피 주소로 바꾸기 제어판이나 검색창에 "네트워크 상태"를 검색해서, IPv4 주소 에 써진 아이피 주소를 입력해주면 됨. 5. 모바일에서 접속 아이피 주소가 198.000.0.000라면 198.000.0.000:5500/파일이름 이렇게 쓰면 된다. 예) 그냥 index.html 파일만 있을 때 198.000.0.000:5500/index.html 예) code폴더 안에 register.html 파일이 있을 때 198.000.0.000:5500/code/register.html

-포커스 대상 -새로고침 유발 -스페이스키로 클릭 -서버에 양식 데이터 제출 -disabled로 비활성화 -:focus, :hover, :active, :disabled -모달창 오픈 -팝업메뉴 트리거 -인터페이스 전환 -미디어 콘텐츠 재생 -포커스 대상 -새로고침 유발 -새 페이지/현재 페이지로 이동 -엔터키로 클릭 -:link, :visited, :focus, :hover, :active url도 없고, url이 변경되는 내용도 아니며 핸들러가 있을 경우 모호함

node.js를 활용하여 jwt로 로그인해보기 1. 터미널에서 아래와 같이 입력하여 설치 npm init npm i express dotnev jsonwebtoekn npm i --sav-dev nodemon 한줄씩 설치해주면 된다. 2. package.json에서 아래와같이 변경 server.js 파일 하나 만들고 앞으로 실행할때는 터미널에 npm run devStart라고 써주면 된다. 3. server.js에 아래와같이 써주기 const express = require('express'); const app = express(); const posts = [ { username: 'hobs', title: 'Post 1' }, { username: 'kate', title: 'Post 2' } ];..

transition이나 이런 fade효과가 나한테는 어렵기도 하고, opacity와 visibility와 display의 상관관계를 잘 모르겠어서 공부하다가 기본 형태는 저장해두고 나중에 꺼내서 쓰려고 포스팅함. 1. 공통 click me title LoremLoremLoremLoremLoremLoremLoremLoremLorem ok .modals { width: 100%; height: 100%; position: fixed; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.5); transform: translate(-50%, -50%); } .modal { width: 500px; padding: 1rem; background-color: rgba(255..

1. svn 설치 https://tortoisesvn.net/downloads.html Downloads · TortoiseSVN download TortoiseSVN tortoisesvn.net 2. vscode에서 svn 설치 3. vscode의 product.json 파일 열기 기본 위치는 아래와 같고 C:\Users\사용자계정이름\AppData\Local\Programs\Microsoft VS Code\resources\app 만약에 모르겠으면 그냥 얘한테 오른쪽 마우스 클릭 - 파일 위치 열기 - resources - app에 들어가면 된다. 5. 파일 수정 extensionAllowedProposedApi 검색한 뒤 맨 아래에 쓰고 저장 "johnstonecode.svn-scm" 6. vsco..

예를들어 이것처럼 한 form안에 추가하기/수정하기와 같은 각각 다른 행동을 해야하는 경우 어떻게 해줘야할지 모르겠어서 찾아보다가 발견함. 추가하기 수정하기 이렇게 작성하면 된다. --------------------------------- 1. 원래 코드 추가하기 수정하기 이렇게 되어있다보니 무슨 button을 누르든 /add에 대한 내용으로 처리됨. 2. action 지우고 location 추가 추가하기 수정하기 그랬더니 저렇게 에러가 뜸. /add로 페이지가 가지도 않음. 3. type을 변경 추가하기 수정하기 안가면 type을 바꿔달라길래 submit에서 button으로 바꿔줬더니 url은 /add로 이동하는데 여전히 에러가 뜸. 참고한 곳 https://kutar37.tistory.com/ent..

1. ejs 설치 npm i ejs 2. ejs파일 생성 views > index.ejs 생성해줌. 여기에 index.html파일을 그대로 내용복붙하고 index.html은 삭제. 3. server.js 수정 const ejs = require('ejs'); app.get('/', (req, res) => res.render('index')); // app.get('/', (req, res) => res.sendFile(__dirname + '/index.html')) // 원래 index.html 쓸 때는 이렇게 써뒀었음 여기까지 하면 index.ejs가 로딩되어서 잘 나온다. 4. server.js 수정 app.get('/', (req, res) => { userSchemas.find({}, (err..