지영이의 개발 블로그

✔중첩 함수 특정 함수의 내부에 선언된 함수 C나 Java 등에서 사용 불가능, 자바스크립트에서 사용 가능 자바스크립트에서는 외부 함수의 최상위 레벨에만 중첩 함수 작성 가능 함수 안의 if문와 while문 등의 문장 블록 안에는 중첩 함수 작성 불가능 중첩 함수의 참조는 그 중첩 함수를 둘러싼 외부 함수의 지역 변수에 저장 외부 함수의 바깥에서는 읽거나 쓰기 불가능 자신을 둘러싼 외부 함수의 인수와 지역 변수에 접근 가능 외부 함수의 변수 유효 범위가 그 함수의 중첩 함수에 미침 (클로저의 핵심 구성 요소) 간단한 예시 1)의 중첩 함수 sumSquare는 변수 x 사용 변수 x는 외부 함수인 example의 인수 let sum = a => b => { return a + b; }; 이걸 일반 func..

Redux-Persist React의 Redux-Persist를 사용하면 새로고침을 해도 데이터가 지속적으로 유지된다. CRA 설치 # Redux + Plain JS template npx create-react-app my-app --template redux 기존 # NPM npm install @reduxjs/toolkit # Yarn yarn add @reduxjs/toolkit 사용방법 내프로젝트에 적용해보기 🦴store.js import { configureStore } from '@reduxjs/toolkit'; import { createLogger } from 'redux-logger'; import accountsSlice from './accountsSlice'; import user..

https://juni-official.tistory.com/226

redux로 비동기 통신을 처리해야 하는 과제가 주어졌다 . 하지만 리덕스로 비동기 처리하기 위해선 미들웨어를 설치해야 하는데 나는 리덕스 툴킷에 내장 되어있는 thunk api를 사용해 비동기 통신을 요청해 보고자 하였다. createAsyncThunk는 비동기 작업을 처리하는 action을 만들어줍니다. redux가 아닌 리덕스 툴킷을 사용하고자 하는 이유는 다음과 같다 . - 설정이 어렵다. -미들웨어 설치가 따로 필요하다 -리덕스 툴킷은 더이상 다양한 패키지들를 설치 하지 않아도 됩니다. 리덕스를 사용하면 redux devtool, immer, thunk 등 여러가지 라이브러리를 추가적으로 설치해야 하지만, redux-toolkit 내부에 이미 설치가 되어 있기에 굳이 설치 할 필요가 없습니다. ..

옵셔널 체이닝 , 인터섹션 옵저버 참고 : https://velog.io/@xka926/React-IntersectionObserver-github-API React - IntersectionObserver , github API 이번 시간에는 GitHub에서 제공해주는 API를 어떻게 사용하는지 (사실 다는 모름) 또는 IntersectionObserver를 사용한 인피니트 스크롤링은 어떻게 하는지에 대해 경험적으로다가 정리를 한다. GitHub API velog.io 참고 : https://egg-programmer.tistory.com/275 [React] Infinite Scroll과 Skeleton Loading 만들기 [React] Infinite Scroll과 Skeleton Loading ..

ESLint와 Prettier, Git Hook을 이용한 팀의 능률 올리기 1. Lintter & Code Formatter 하나의 프로젝트에서 작업자마다 각자 다른 코딩 스타일을 가지고 있고, 그것이 코드에 드러난다면 이 프로젝트를 제 3자가 읽기도 어려워지며, 팀원들끼리도 다른 팀원들이 작성한 코드를 읽고 이해하기가 힘들어집니다.이러한 요소들은 결국 비효율을 유발하게되고 이를 극복하기 위해서 팀으로 작업을 할 때는 여러 작업자들의 코딩 스타일을 일치시키기 위한 Lintter와 Code Formatter를 사용하는 것이 좋습니다. 자바스크립트 진영에서는 Linter로 ESLint를, Code Formatter 로는 Prettier를 사용하는것이 일반적입니다. 2. ESLint 일관되고 버그를 피할수 있..

프리온 보딩 프론트엔드 코스에 합격하여 동료협업을 수행하던중 git 이라는 난관에 봉착해 버렸다 ,,, 사실 3개월동안 혼자 독학으로 공부하면서 git은 git add 와 push 같은 간단한 작업만 수행 하였기 때문에 협업에 필요한 git 명령어를 써본적이 없어 의도치않게 팀에게 민폐를 끼치게 된것같다 ,,ㅠㅠ 이를 극복하고자 블로그 뒤져가며 merge와 pull에 사용법을 알아보았고 git을 더욱 이해할 수 있는 시간을 가질수있었다. 1.git 커밋 작성자 변경 git log git rebase -i 해시번호 자동으로 열리는 vi에서 pick->edit 로 변경 i 를 누르고 pick 을 edit로 변경해 rebase 대상임을 알린다. $ git commit --amend --author="작성자명 ..

모듈이란? 자바스크립트로 개발을 하다보면 코드의 재사용이나 유지보수 측면에서 파일을 여러개로 분리 해서 개발 하곤 하는데 이렇게 분리된 파일을 모듈 이라고 합니다. 자바스크립트 코드를 모듈로 분리하게 되면 이러한 모듈을 필요한 어떤곳에서든 재사용이 가능하기 때문에 자주 사용하는 코드같은 경우에는 모듈로 분리해서 개발합니다 이렇게 웹 애플리케이션이 완성이 되면 웹서버라는 공간에 배포를 하게 되고 사용자가 브라우저를 통해 웹 사이트에 접근을 하게 되면 브라우저는 사용자들에게 UI를 보여주기 위해 웹서버에 HTML,CSS,JAVASCRIPT같은 자원(resource)를 요청 하게 됩니다 . 웹서버는 준비된 자원을 브라우저에게 응답함으로써 사용자들은 ui를 볼수있게 되는것 하지만 개발 편의성을 위해 모듈을 계속..