태그를 사용하여 특정경로로 이동시켜주는 경우는 개발과정에서 흔한경우입니다.보통 버튼이나 텍스트에 태그를 통해 링크를 걸어주지만 간혹 이미지의 특정 영역에 링크를 걸어야 경우가 있는데요.이런경우 보통 태그에 position:absolute 속성을 통해 위치를 고정시킨 후 사용하곤 했습니다.하지만 이러한 방법보다 더 간편한 방법이 있습니다.바로 태그와 태그를 이용하여 이미지의 특정좌표에 링크를 연결할 수 있습니다.  // map name 설정 필수 // usemap 에 map name을 연결, 연결할 때 # 붙여야함 // shape은 rect, poly, circle 중 선택가능, coords 는 위치값 // area 를 사용해서 원하는 갯수만큼 클릭영역을 잡을 수 있음 사용방법을 간단히..

이 에러는 괄호 하나때문에 3일간 골머리를 썩은 후 작성한 글입니다. 포트폴리오 웹사이트를 제작하던 중 버튼요소의 사용빈도가 잦아졌고, 불필요하게 컴포넌트별로 버튼스타일을 지정해주기 보다는 재사용가능한 공용 버튼 컴포넌트를 만들어서 사용해야겠다고 생각했습니다. 그래서 아래와 같이 버튼이벤트나 텍스트, 스타일요소를 props로 받아 사용할 수 있도록 버튼컴포넌트를 생성했습니다. 버튼 컴포넌트를 바꿨으니 이제 버튼태그와 컴포넌트별로 구성되어있던 버튼 스타일 코드들을 지워주고 버튼컴포넌트로 대체해주면 끝입니다. 이처럼 버튼 컴포넌트로 바꿔줬습니다. 그런데 .. 버튼 컴포넌트를 적용했더니, 해당 페이지 이외에도 모든 서비스 페이지에 스타일이 깨져버렸습니다. 내가 리액트 컴포넌트 사용방법에 위배되는 코드를 작성한..

https://school.programmers.co.kr/learn/courses/15008/lessons/121683?language=javascript 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제설명 수도코드 로직구성 1.알파벳 배열을 순회한다. 2.순회하면서, 알파벳이 바뀐걸 체크해야한다 3.알파벳이 바뀔떄마다 배열에 넣어주고, 해당배열에 indexOf(el) 했을 떄, -1이 안나온다면 같은 알파벳이 서로 뭉쳐있지 않은 외톨이. 4.외톨이 알파벳을 answer배열에 넣어준다. 5.순회가 끝나면, answer 배열을 알파벳순으로 정렬 후 중..

문제 : https://school.programmers.co.kr/learn/courses/30/lessons/250137 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제설명 수도코드 조건 시전 시간 * 초당 회복량 = 체력회복량 (시전 시간)초 연속으로 붕대를 감으면 추가 회복량 만큼 체력회복 최대체력은 health보다 올라갈 수 없다. 공격당하면 체력회복이 불가능하고 기술이 취소되며, 연속시간 0으로 초기화 bandage는 [시전 시간, 초당 회복량, 추가 회복량] health는 최대체력 attacks[i] = [공격 시간, 피해량] 이고 공격시..

구글 애널리틱스로부터 fatching한 데이터를 . 디비에 넣어서 관리하고싶은데 백엔드 팀원이 없기때문에 직접 노드서버에 DB를 붙이는 과정에서 겪은 에러이다. 대충 해석해보면 "핸드쉐이크가 가득 차 있는데, 그 후에 또 핸드쉐이크를 채울 순 없다." 음... 나 배부른데 또 뭘 먹이려고? 라는 뉘앙스이다. 아마도 내가 한번이면 되는 걸 처리가 되기전에 너무 빨리요청하거나 혹은, 두번 요청한다는 느낌이다. 아니나 다를까 다른 사람들의 트러블슈팅 기록을 보니 DB connection이 중복으로 호출된게 문제였다. //sql 연결하기 const connection = mysql.createConnection({ host: 'localhost', user: 'root', password: 'drrsrd0330..

인턴십 기업에서 새로운 서비스를 오픈하기 위해 관리자용 대시보드 페이지를 구상해야 했고, 앱 환경에서의 대시보드는 어떤식으로 구성해야 사용자에게 좀 더 나은 사용경험을 줄 수 있을까 고민하다가 토스앱을 분석하기로 했습니다. 토스가 UI/UX를 디자인하면서 적용하는 몇 가지 법칙에대해 알아보겠습니다. 1. 제이콥의 법칙 사용자는 본인이 지금까지 여러 서비스를 사용하면서 축적된 경험을 토대로 새로운 서비스를 판단하려는 경향이있다. 기존에 대중적으로 사용해오던 익숙한 서비스 모델을 멘탈 모델(Mental Model) 이라고 부릅니다. 이러한 멘탈모델을 무시하고 다른 방향으로 서비스를 디자인 한다면, 사용자는 처음부터 사용법과 UI에 대한 감각을 다시 학습해야하는 불쾌함을 경험하게 됩니다. 우리 서비스의 대시보..