- 전체보기(117)
- 백준(17)
- React(13)
- 코딩테스트(12)
- 자바스크립트(11)
- JavaScript(11)
- 백준알고리즘(9)
- 리액트(9)
- 프로그래머스(8)
- 백준자바스크립트(4)
- 백준코딩테스트(4)
- cookie(4)
- 알고리즘(4)
- Event(3)
- 기술면접(3)
- 프론트엔드(3)
- 단계별문제(3)
- typescript(3)
- type(2)
- (2)
- markdown작성하는법(2)
- Document(2)
- 자바스크립트메소드(2)
- yarn(2)
- DOM(2)
- ESLint(2)
- node.js(2)
- README.md(2)
- readme이미지넣는법(2)
- 온보딩챌린지(2)
- bulid(2)
- CSS(2)
- Sass(2)
- ts(2)
- html(2)
- 단계별(2)
- 백준단계별문제(2)
- useCallback(2)
- vscode(2)
- 백준문자열(2)
- todoList(2)
- 파이썬(2)
- addEventListener(2)
- aos(2)
- readme작성법(2)
- useMemo(2)
- API(2)
- 백준1316자바스크립트(1)
- react자동완성(1)
- 백준그룹단어체커(1)
- min-width(1)
- 하이라이팅(1)
- 클론코딩(1)
- 2292벌집(1)
- BEM(1)
- slickPause(1)
- save-exact(1)
- import(1)
- typescript 설치(1)
- 유튜브클론코딩(1)
- 한수(1)
- React-Class(1)
- 노드시작하기(1)
- git branch divergent(1)
- 백준달팽이자바스크립트(1)
- 모르겠고일단꾸준히(1)
- 서명(1)
- visual studio(1)
- 캐러쉘(1)
- push(1)
- 박스위치맞추기(1)
- vscode터미널(1)
- 터보(1)
- server(1)
- 소인수분해자바스크립트(1)
- popstate(1)
- 평균(1)
- http(1)
- 백준1193자바스크립트(1)
- 25305(1)
- 분수찾기자바스크립트(1)
- 백준단계별(1)
- ruby scss(1)
- 백준2869(1)
- navercloudplatform(1)
- dataset(1)
- git pull(1)
- 좋아요기능(1)
- 파이썬조건문(1)
- browser(1)
- helloworld(1)
- 기능취소하는법(1)
- 반응형(1)
- 백준팩토리얼(1)
- 백준10926(1)
- e.target(1)
- 프로그래머스나누어떨어지는숫자(1)
- OX퀴즈(1)
- assign(1)
- length(1)
- 리액트자동완성(1)
- 백준10926자바스크립트(1)
- 백준1330자바스크립트(1)
- 1330두수비교하기(1)
- 서버생성하는법(1)
- 프로그래머스수박(1)
- 없는숫자더하기자바스크립트(1)
- nodejs백준(1)
- 백준2869자바스크립트(1)
- instanceof(1)
- 모르겠지만일단꾸준히(1)
- 백준함수(1)
- 터미널이모지넣기(1)
- 브라우저사이즈출력(1)
- javascrtpi(1)
- target불러오기(1)
- scrollEvent(1)
- css SVG(1)
- navigate(1)
- 100757(1)
- Inherit(1)
- API 사용규칙(1)
- vertical-align(1)
- capturing(1)
- 배너슬라이드(1)
- 백준재귀팩토리얼자바스크립트(1)
- HTTP Session(1)
- 백준소인수분해(1)
- 터미널꾸미기(1)
- 백준5622(1)
- Modifier(1)
- 서버(1)
- backhistory(1)
- 프로그래머스번호가리기자바스크립트(1)
- 프론트(1)
- 안드로이드(1)
- 버튼disabled(1)
- zshrc(1)
- slickPlay(1)
- 백준조건문9498(1)
- 크로티아알파벳자바스크립트(1)
- 수박수박JS(1)
- git pull안될때(1)
- 주석다는법(1)
- 빌드성공(1)
- 알고리즘사전지식(1)
- ecmascript(1)
- 빌드주소(1)
- react error(1)
- 정수 N개의 합(1)
- 변수선언기준(1)
- 네트워크(1)
- 코멘트(1)
- nodesass(1)
- 알고리즘연산자(1)
- sass설치안될때(1)
- export(1)
- &&(1)
- class컴포넌트(1)
- 프로그래머스수박자바스크립트(1)
- 문법(1)
- 백준팩토리얼자바스크립트(1)
- 주석색변경하기(1)
- 엔진(1)
- 타입스크립트(1)
- Viewport(1)
- 백준1193분수찾기자바스크립트(1)
- Prettier(1)
- 입출력과사칙연산(1)
- 트위터공유하기(1)
- webpack(1)
- frontend(1)
- Backend(1)
- 페이스북공유하기(1)
- css상속(1)
- 애플로고단축키(1)
- 주석익스텐션(1)
- 서명기능개발(1)
- loadevent(1)
- 조건문(1)
- 반응형웹(1)
- 문자열(1)
- Node(1)
- REST API(1)
- scroll(1)
- 이모지단축키(1)
- concat(1)
- const(1)
- let(1)
- reactHook(1)
- react-signature-canvas(1)
- replace(1)
- Screen(1)
- repeat(1)
- 코테(1)
- 최소(1)
- CS(1)
- 1차원 배열(1)
- 월드컵게임(1)
- 프로그래머스없는숫자더하기(1)
- foreach(1)
- 리뷰별(1)
- 온보딩(1)
- 주석색상(1)
- 최대(1)
- 빌드(1)
- 백준코테(1)
- cheerio(1)
- 백준기본수학1자바스크립트(1)
- 나누어떨어지는숫자자바스크립트(1)
- Bubbing(1)
- disabled(1)
- 2292벌집자바스크립트(1)
- 백준손익분기점(1)
- 백줕코딩테스트(1)
- TextField(1)
- 백준다이얼자바스크립트(1)
- @Target(1)
- 백준1316javascript(1)
- handleLike(1)
- 큰수A+B(1)
- 주석이탤릭체없애기(1)
- 백준9498자바스크립트(1)
- cookie-parser(1)
- 구조분해할당(1)
- 11653소인수분해(1)
- 파이썬코딩공부(1)
- hook(1)
- 부녀회장이될거야(1)
- 면접준비(1)
- Pypy3(1)
- shift(1)
- 자바스크립트함수이론(1)
- 백준크로티아알파벳(1)
- 14681사분면백준(1)
- reduce(1)
- navigateState(1)
- 정규식(1)
- 나머지(1)
- splice(1)
- 월드컵게임타입스크립트(1)
- observererror(1)
- preventDefault(1)
- 팝업창(1)
- 상속가능한css(1)
- react-script(1)
- sassnotfound(1)
- 1316자바스크립트(1)
- 에러(1)
- 직전주소찾기(1)
- 개발자(1)
- javascript변수(1)
- CurrentTarget(1)
- 서버만드는법(1)
- javascript type(1)
- 시간계산코드(1)
- 관계형db(1)
- InnerHTML(1)
- meta태그동적으롷사용하기(1)
- 프로그래머스약수의합(1)
- 홀수와짝수(1)
- Overriding(1)
- 14681자바스크립트(1)
- load(1)
- data(1)
- 모노레포(1)
- 블록체인(1)
- 2292(1)
- referrer(1)
- 전개연산자(1)
- 백준1193(1)
- 글씨색바꾸기(1)
- monorepo(1)
- 주석글씨체(1)
- youtube(1)
- 1712(1)
- 5622자바스크립트(1)
- 숫자의 개수(1)
- parse()(1)
- csssvg(1)
- nosql(1)
- 1712번손익분기점(1)
- aws(1)
- 손익분기점(1)
- 프로그래머스자바스크립트(1)
- 상속(1)
- db(1)
- 프로그래머스번호가리기(1)
- betterComments(1)
- JSX(1)
- 수박수박수박(1)
- next.js(1)
- 2566(1)
- 변수선언(1)
- responsiveweb(1)
- 커트라인(1)
- 빨간밑줄(1)
- 최댓값(1)
- ohmyzsh(1)
- 알고리즘풀기전사전지식(1)
- CreateElement(1)
- ES6(1)
- 알고리즘공부처음(1)
- iterms(1)
- max-width(1)
- drag(1)
- node세팅하기(1)
- ncp(1)
- 약수의합JS(1)
- 숫자증가(1)
- 모일꾼(1)
- trim()(1)
- 자동tab(1)
- element(1)
- 프로그래머스홀수와짝수자바스크립트(1)
- sns공유하기(1)
- session(1)
- 프로그래머스약수의합JS(1)
- 시간계산문제(1)
- git(1)
- 모일꾸(1)
- JSDoc(1)
- pointerEvents(1)
- Bolck(1)
- 고양이출력하기(1)
- 팩토리얼자바스크립트(1)
- review(1)
- 백준다이얼(1)
- git 안될때(1)
- scss(1)
- ECMA(1)
- destructuring(1)
- object(1)
- 배열(1)
- 평균은넘겠지(1)
- 백준1316(1)
- branch divergent(1)
- scrolling APIs(1)
- node-scss(1)
- 셀프넘버(1)
- math(1)
- refactoring(1)
popstate
이벤트는 웹 브라우저의 히스토리 스택에서 상태가 변경될 때 발생하는 이벤트입니다. 이 이벤트는 주로 브라우저의 뒤로 가기 및 앞으로 가기 버튼을 사용하여 페이지를 탐색하거나 JavaScript를 사용하여 브라우저 히스토리를 조작할 때 유용하게 활용됩니다.popstate
[용어TIL]포팅과 컨버팅
다른 환경에서도 작동할 수 있도록, 즉 aos에서만 되던 기능을 ios에서도 작동할 수 있도록 하는 것텍스트A를 B에서도 이용할 수 있도록 사용하는 언어를 바꿔주는 것, 즉 리액트가 사용된 코드를 뷰로 바꿔주는 것
[AOS]prompt_context:1: command not found: nbsp
안드로이드 빌드하다가 ctrl+c, enter 뭘해도 나오던 문구... 사라지지 않아서 nbsp를 잘못 쓴 곳이 있나 찾아봐도 찾지 못하다가 zshrc를 통해 원인을 찾고 해결해서 기록해둔다 😇(사실 너무 별거 아니라서 어이없지만... ㅎㅎ )🚨 prompt_con
[React]리액트 서명기능
react-signature-canvas 라이브러리를 통해 유저의 서명을 받아야하는 화면을 개발하였다참고) 보안상 이유도 있다보니 코드는 축약하거나 단순화해서 기록하였다!https://www.npmjs.com/package/react-signature-canv
[TIL]useCallback과 useMemo 차이점
성능 최적화를 위해 사용되는 리액트 훅React 컴포넌트가 렌더링될 때마다 해당 컴포넌트 내부의 함수들도 새로 생성되는데 컴포넌트 구조가 복잡해지고 하위 컴포넌트들이 불필요하게 리렌더링될 때 성능 문제가 발생할 수 있음 특히 함수형 컴포넌트 내부에서 정의된 함수들은
[AOS]빌드 성공했는데 코드반영 안될 때
요청받은 버그를 해결하기 위해 안드로이드 빌드를 해서 dev에서 수정하고 STG에서 확인해서 최종 완료 처리를 해야했다. 😅 aos 개발 경험이 별로 없어 걱정 되는 마음으로 빌드를 진행했다. env파일의 이름은 다를 수 있으나 난 로컬에서 확인할 때는 .env.de
좋아요_handleLike
로그인 여부 확인 isAuthenticatedemotion code에 따라 좋아요 여부 등록emotion code : 400101 (좋아요), 400102 (싫어요)myEmotionCd.code가 400101일 경우 좋아요 삭제myEmotionCd.code가 4001
Review 별표시
(리뷰작성 시 총점을 표시를 5개의 별로 표시할 경우 )왼쪽인 i <= index는 i가 index보다 작거나 같은지를 평가하는 조건starStates 배열의 인덱스가 index보다 작거나 같은 경우에 대해 true를 할당하고, 그 외의 경우에는 false\*\*
useCallback과 useMemo의 차이점은?
\- 성능 최적화를 위해 사용되는 리액트 훅React 컴포넌트가 렌더링될 때마다 해당 컴포넌트 내부의 함수들도 새로 생성되는데 컴포넌트 구조가 복잡해지고 하위 컴포넌트들이 불필요하게 리렌더링될 때 성능 문제가 발생할 수 있음 특히 함수형 컴포넌트 내부에서 정의된 함수
cheerio
https://www.npmjs.com/package/cheeriocheerio는 HTML에서 document.querySelector()처럼 HTML 요소를 골라낼 수 있는 라이브러리이다.
[React]drag와 onClick 이벤트 제어하기
drag와 onClick 기능이 함께 있을 경우 drag를 하나의 스테이트에 따로 관리하여 제어하였다
diabled상태의 버튼 시 레이어 아래요소 클릭 막는법
버튼 disable처리된 상태일 때 클릭 이벤트 버그가 있어 수정했다.버튼이 항상 bottom:0으로 하단에 있다보니 버튼이 diabled되어있는 상태에서 스크롤을 내리다가 클릭이벤트가 있는 요소와 겹칠 경우 겹쳐있는 아래 요소의 클릭이벤트가 진행되는 문제였다. dis
정규식의 g와 gi의 차이점
g : 발생할 모든 pattern에 대한 전역 검색i : 대/소문자 구분 안함숫자와 영문만 작성하도록 만들기 위해 '/^0-9a-zA-Z/gi'정규식을 사용했다.사용을 위해 검색 중 g만 사용한 곳도 있고, i도 함께 사용한 곳이 있어서 찾아봤더니 대소문자 차이였다.
textfield 4글자 작성 후 자동 tab
개발 중 기존 쿠폰 등록하는 부분의 UI 수정과 함께 플로우도 수정되며 새로 작성한 코드가 있어 기록해두고자한다 기존엔 쿠폰함에 가면 바로 쿠폰번호를 등록했다면 수정 후 플로우 : 버튼 선택 -> 쿠폰등록 dialog 오픈 -> 번호 작성 및 확인 -> 등록, 에러처
navigate로 가져온 state 삭제하기
navigate로 url로 페이지를 이동할 수 있습니다.이때 state에 원하는 데이터를 담아서 이동할 수 있습니다.예를 들어 아래 코드처럼 이동 시 orderNo와 clickStatus값을 넣을 수 있습니다. 1번의 방법으로 화면에 데이터를 가져온 뒤 페이지가 다시
TIL_0612_svg스타일링 하는 법
프론트엔드의 경우 svg, png, jpeg 등 다양한 형식의 이미지, 아이콘들을 사용할 일들이 있다. 특히 내가 그렇다 ㅎㅎ css는 속이 시원할만큼 잘 될 때도 있고,말이 안될만큼 움직이지 않을 때도 있다. 이번에 footer의 아이콘들을 바꾸는 간단한 작업이였지만
TIL_0608_배너슬라이드
보통 앱의 메인페이지엔 2-3개의 이미지가 슬라이드되며 노출된다.오늘은 그 기능을 구현했다.직접 뒤로가기, 앞으로가기 컨트롤하는 버전은 아니고 기본적으로 캐러쉘 자체에 탑재되어있는 기능이 많으니 손쉽게 사용할 수 있다.보안의 문제로 여러개 옵션은 작성하지 않았지만 대략
TIL_0607_sns공유하기기능
트위터 공유하기 구현 성공 하고나면 별거아니였지만 찾아 헤맸던 결정적인 oprion은 'card'속성이다리액트로 sns 공유하기 기능을 구현하다보니 서버사이드렌더 관련된 문제로인하여 mata의 data를 토대로 공유하기 컨텐츠를 만드는 현재의 개발 방식엔 문제가 생겼
TIL_0602
터무니없는 실수이기에 더 기억하고 다시는 실수하지 말자!라는 마음으로 기록!! 댓글 신고하기 기능을 구현하는 것이 목적이였다 댓글의 우측 삳단 더보기 버튼을 선택Drawer 오픈내가 작성자일 경우 댓글 수정 / 삭제하기 버튼을 노출 + 내가 작성자가 아닐 경우 댓글달기
[vscode]상황에 따른 주석 색상 익스텐션
실제로 회사에서 개바을 핟보니 주석을 사용할 일이 점점 더 다양해졌다.동료를 통해 꿀팁으로 사용할 수 있는 익스텐션을 추천받아 설치하고 사용하는데 꽤나 만족스럽다 ㅎㅎ vscode 익스텐션 최고!! 아래 보여지는 Better Commnets 익스텐션을 설치 (vscod