이번 포스트에서는 리액트 훅 시리즈인 useRef에 대해서 공부한다. 왜냐하면 내일 업무에서 useRef를 써야 하기 때문이다🥲.. useRef를 사용해 슬라이더(prev/next 버튼)을 만들어 볼 건데, 무사히 완성되면 관련 내용도 정리해서 포스팅해 볼 계획이다.
이 포스트에서 다룰 것 useMemo에 이어, 리액트의 최적화 훅인 useCallback에 대해 학습한다. 입사하고 나서 부랴부랴 공부하는 리액트(ㅠㅠ)! 매일 매일 쌓아가면 언젠가는 친해질 거라 믿는다. 이란? 와 마찬가지로 메모이제이션 기법을 통해 성능을 향상시키
같은 동작을 해도 의도가 보이는 코드를 짜자hex code의 - textColor\[1:]보다, \`textColor.replace('- 외부로 나가는 일을 하는 함수는 on, 내부에서 작동하면 handle prefixhex code는 16진수이다0~9, a(1
2022년 11월, 한 달 동안 일어난 1년차 프론트엔드 개발자의 해고부터 재취업까지의 과정을 기록한다.다소 신변잡기적인 내용이 있고, 개발과 무관한 내용이 대부분이므로 개발면접을 준비하고자 찾아오신 분들에겐 도움이 되지 않을 수 있다!다니던 회사에서 갑작스럽게 이메일
자바스크립트와 타입스크립트의 차이, 타입스크립트를 사용하는 이유, 기본 문법을 간단하게 살펴본다. 타입스크립트는 이름 그대로 자바스크립트에 타입을 부여한 언어로, 자바스크립트의 업그레이드 버전이라고 할 수 있다. 타입스크립트는 자바스크립트와 달리 브라우저에서 실행하려면
웹개발을 하면서 DOM의 기능을 활용하면서도,"화면에 나타나는 요소" 정도로만 알고 있고 정확하게 답변할 수 없는 모호한 개념만 가지고 있었다. 이 포스트에서는 DOM과 가상DOM 무엇인지 확실하게 학습할 것이다.Document Object Model의 약자로, HTM
이 포스트에서 다룰 것 웹 페이지를 렌더링하는 방식들인 Server Side Rendering(SSR) Single Page Application(SPA) Static Site Generation(SSG) Client Side Rendering(CSR) 위의 개념들
회원가입을 커스터마이징하는 업무를 하다 구현한 검색기능을 튜토리얼으로 만들어보았다. input창에 글자를 칠 때마다 ajax를 사용해 해당 데이터를 가져오고, 클릭하면 하단에 출력해주는 기능을 구현해볼 것이다.포스팅을 위해 예제 프로젝트를 만들었다.json파일은 위의
https://school.programmers.co.kr/learn/courses/30/lessons/17686 문제 이해 주어진 파일명을 규칙에 맞게 정렬하는 문제이다. 숫자를 기준으로 파일명을 head, number, tail로 구분하고 1단계: head를 기준
지난 포스트에서는 정규표현식의 기본 문법에 대해 학습했다. 아는 만큼 보인다더니, 정규식을 공부하고 나니 실무와 알고리즘 문제에서도 정말 유용하게 쓰이는 걸 느꼈다. 내가 정리한 블로그 글을 내가 제일 많이 들어가서 다시 본 것 같다(기술블로그의 장점을 잘 활용하는 것
이 포스트에서 다룰 것 8월 27일에 응시한 프론트엔드 데브매칭에서 구현한 것과 구현하지 못한 것을 정리하고 복기할 것이다. 구현 사항 무한스크롤 fetch로 json 파일 가져오기 localStorage input pattern, title 요소 가운데 정렬하기
업무 중 DOM 요소 테이블의 innerText를 가져오는 과정에서, \\n과 \\t가 잔뜩 들어있는 배열 안의 값을 가져와야 하는 일이 있었다. 테이블의 빈 셀이 \\t로 바뀌어 저런 모양이 된 것 같다. filter함수를 이용해 원하는 모양대로 데이터를 가공했는데
https://www.acmicpc.net/problem/2309쉬운 문제였으나, 나의 사고력 부족과 게으름이 여실히 드러난 문제였기 때문에 반성의 의미로 포스팅한다.9명의 난쟁이의 키가 주어졌을 때, 9명의 난쟁이 중 진짜 7명의 난쟁이를 찾아야 한다. 찾는
https://programmers.co.kr/learn/courses/30/lessons/92341누적 주차 시간을 계산한 후,누적 주차 시간이 기본 시간 이하라면 기본 요금누적 주차 시간이 기본 시간 초과하면 기본 요금 + 초과한 시간에 대한 단위 시간 \
https://programmers.co.kr/learn/courses/30/lessons/92334유저는 다른 유저를 신고할 수 있고, k번 이상 신고당한 유저는 이용 정지를 당한다. 유저 A가 신고한 유저가 이용 정지를 받는다면 유저 A에게 신고 결과를 발
https://programmers.co.kr/learn/courses/30/lessons/72410이 문제는 문자열을 다루는 문제로, 오래 전에 이미 풀었었다. 그런데 얼마 전 포스팅한 정규식을 이용하면 더 간단하게 풀 수 있을 듯 하여 다시 풀어보고, 이전
2년동안 미뤄 둔 정규표현식을 드디어 공부한다. 공부해야지 생각만 하며 외계어 같고 어려워서 미뤄뒀는데, 코딩테스트에서 문자열을 처리할 때 뿐만 아니라 실무에서도 정말 많이 쓰인다는 걸 깨달았다. 특히 회원가입 같은 기능을 만들 때, 이메일이나 전화번호를 sanitiz
이 포스트에서 다룰 것 2015년에 나온 ES6, 2020년에 나온 ES11 자바스크립트 신 문법에 대해서 알아본다. ES6 목록 Shorthand Property Name Destructing Assignemnt Default parameters Tenary Ope
이 포스트에서는 시멘틱 태그, 웹 접근성, SEO의 개념에 대해서 정리하고, 헷갈리기 쉬운 HTML 태그들을 비교할 것이다. 얼마 전에 보았던 면접 내용을 복기하면서, 부끄럽게도 기본적으로 알아야 하는 질문들에 대해 제대로 답변하지 못한 기억이 나서 정리해본다. 포스팅