분류 전체보기(60)
-
코딩마차 Coding Space
목록 일상 혼자 하는 개발. 정말 나쁘기만 할까? 어느덧 회사에서 프론트엔드 개발(+ firebase로 백엔드)을 혼자 하게 된 지 거의 1년이 되어가고 있다. 처음에 입사할때는 어드민 페이지로 시작을 했지만 여러 모바일 개발자분들이 사정상 그만두 mingeesuh.tistory.com 2023.06.05 - [Diary] - 스타트업 2년차에 접어들며.. GIT 2022.02.12 - [Git] - Git 최초설정 및 사용해보기 2022.09.19 - [Git] - git commit 메세지 수정하는 방법 REACT 2022.02.18 - [React] - React 절대경로 설정 및 컴포넌트 불러오기 2022.02.27 - [React] - [React] 드롭다운 메뉴 만들기 (feat. useRef..
2022.03.15 -
JS 배열 요소 삭제하는 방법 (shift, pop, splice, slice, filter)
전 포스트에서 자바스크립트 배열에 요소를 추가하는 방법에 대해 알아보았으니 이번에는 삭제하는 방법은 어떤 것이 있는지 한번 살펴보도록 하자. 삭제하는 방법도 마찬가지로 기존 배열을 변경시키는 mutable(가변) 방식과 그렇지 않은 immutable(불변) 방식이 존재한다. Mutable(가변) 방식 shift 배열의 첫번째 요소를 삭제시키고 삭제된 요소를 반환한다 const foods = ['🌭','🍗','🍕','🍟']; const firstFood = foods.shift(); console.log(lastFood); // 🌭 console.log(foods); // ['🍗','🍕','🍟'] pop 배열의 마지막 요소를 삭제 시키고 삭제된 요소를 반환한다 const foods = ['🌭','🍗','🍕..
2022.03.13 -
JS 배열에 요소 추가하는 방법 (mutable, immutable)
이번 포스트에서는 자바스크립트 배열에 요소를 추가하는 방법에 대해 알아보자. 배열에 요소를 추가할 수 있도록 해주는 방식은 mutable(가변) 그리고 immutable(불변) 방식으로 나뉜다. Mutable(가변) 방식 기존의 선언된 배열을 변경시키는 메서드로는 push, unshift, splice가 있다. 직접 인덱스로 접근해 변경시키는 방법 또한 기존 배열 객체를 변경시키는 행위이기 때문에 함께 추가했다. 아래 동물 배열에 닭을 추가하는 방법을 살펴보자. const animal = ['🐯', '🐴', '🐇']; 원래라면 가변 함수를 사용하기 때문에 아래 예시를 실행할때마다 animal 배열이 변경되겠지만 독립적으로 실행된다고 가정하겠다. 첫번째 요소로 추가하기 (unshift, splice)- [..
2022.03.12 -
JS 배열 생성하는 방법 (리터럴, 생성자 함수)
이번 포스트에서는 JS에서 배열을 생성하는 방법에 대해 복습하는 시간을 가져보자. 배열의 정의가 궁금하다면 해당 문서를 읽고 오길 바란다. 배열 생성 자바스크립트에서 배열을 선언하는 방법은 크게 두 가지로 나뉜다. 배열 리터럴 [ ]인 대괄호를 사용해 선언하는 방법과 배열 생성자 함수를 통해 선언하는 방법이다. 배열 리터럴 [] 필자는 두 방식 모두 사용하긴 하지만 배열 리터럴을 사용해 선언하는 편이 더 직관적이라 일반적인 경우에는 이 방식을 사용하고 있다. 빈 배열 또는 숫자 1, 2, 3, 4를 요소로 가지는 배열을 만들기 위해서는 아래와 같은 방식으로 선언해주면 된다. const array = []; // 빈 배열 (length가 0인 배열) const number = [1, 2, 3, 4]; //..
2022.03.11 -
React 성능 최적화를 위한 useMemo 와 useCallback
이번 포스트에서는 리액트 메모이제이션 훅으로 사용되고 있는 useMemo와 useCallback에 대해 알아보자. 위키피디아에 따르면 메모이제이션(memoization)이란 동일한 계산을 반복할 때, 이전에 계산한 값을 메모리에 저장해서 동일한 계산의 반복을 제거하면서 프로그램 실행 속도를 높이는 기술이다 리액트에서 메모이제이션이 필요한 이유 이 포스트를 읽고 있을 독자들은 어떨지 모르겠지만 필자는 리액트를 처음 접했을 때, 관련 컴포넌트가 아닌데도 불구하고 부모 컴포넌트가 변경되었다는 이유로 해당 컴포넌트 전체가 재정의/실행되어야 한다는 점이 좀 마음에 걸렸다. 이때 메모이제이션을 이용하면 이전 상태에서 변화가 없다면 메모리에 저장해두었던 값/함수를 사용하기 때문에 컴포넌트 전체를 다시 계산해서 그릴 ..
2022.03.09 -
[Firebase 웹] 지정된 시간마다 Cloud Function 직접 호출
이번 포스트에서는 트리거로 클라우드 함수를 호출시키는 방식이 아닌 직접 호출하는 방법에 대해 알아보자. 파이어 베이스 앱에서 직접 함수를 호출하는 방법은 아래와 같다. 앱에서 직접 함수 호출 (onCall) HTTP 요청을 통한 함수 호출 (onRequest) 일정에 따라 함수 호출 (schedule) 첫 번째와 두 번째 방법은 추후 포스트에서 알아보고 오늘은 일정에 따라 함수를 호출해보도록 하자. 함수 예약 많은 웹/앱들을 보면 정기적으로 특정한 작업이 이루어지는 걸 본 적이 있을 것이다. 예를 들어 매주마다 리더보드가 갱신된다던지, 매일 특정한 시간에 알림을 받아봤을 것이다. 필자는 아래와 같은 상황 때 해당 방식을 유용하게 사용했다. - 회원 탈퇴 시 회원정보를 바로 삭제하지 않고 7일 뒤에 삭제 ..
2022.03.06