본문 바로가기

전체 글

(61)
메서드 체이닝(Method Chaining) Method Chaining? 객체 지향 프로그래밍 언어에서 여러 메서드 호출을 하기 위한 구문. 각 메서드는 객체를 return해서 메서드를 이어서 호출할 수 있다. 말 그대로 chain으로 엮는다. 즉, return되는 객체가 없으면 chaining을 할 수 없다. jQuery가 메서드 체이닝에 특화된 라이브러리 중 하나다. 일반적으로 메서드를 인스턴스에 붙혀서 호출하는데 여러 메서드를 호출하려면 me.method1(); me.method2(); me.method3(); 이렇게 메서드 실행 => 종료 => 실행 => 종료 하는 과정을 거쳐야하는데 메서드 체이닝을 하면 실행 => 실행 => 실행 하는 방식으로 진행된다. let myObj = function() { this.name = ""; this...
React : public 폴더 이미지 절대경로로 사용하기 오픈 그래프로 썸네일 이미지를 넣으려는데 아무리 넣어도 썸네일이 뜨지 않았다. 우선 에서 이미지 경로는 상대경로가 아니라 절대경로로 들어가야한다! publlic 폴더에 썸네일에 사용할 이미지를 넣어주고 이렇게 %PUBLIC_URL% 를 사용하면 된다. 나같은 경우엔 public 폴더 안에 바로 이미지가 있으니 %PUBLIC_URL%/jeju.jpg가 됨. 더 자세한 내용은 공식 문서를 참고하세요! https://create-react-app.dev/docs/using-the-public-folder/ Using the Public Folder | Create React App Note: this feature is available with react-scripts@0.5.0 and higher. cre..
React : useRef() 사용 프로젝트를 진행하면서 리액트 상태 관리에서 애를 많이 먹었다. 덕분에 라이프사이클과 useEffect에 대해 공부할 수 있었다! useEffect()에서 setState()를 사용하면 state가 바로 업데이트 되지 않아 초기값만 반환했다. 그러다 hook에서 useRef를 알게 되었고 useEffect에서 사용하니 컴포넌트가 마운트 되는 시점에서도 원하는 값을 불러올 수 있었다 ㅎㅎ 다음에도 비슷한 문제가 발생했을 때 참고할 수 있도록 정리해보고자 한다. useRef const resetRef = useRef(initialValue); useRef는 current 프로퍼티로 전달된 인자로 초기화된, 변경 가능한 ref객체를 반환합니다. 반환된 객체는 컴포넌트의 전 생애주기를 통해 유지된다. useRef..
[JavaScript] ES6 문법 여러 강의를 들으면서 공부를 해오고 있는데 ES6문법을 주로 사용하고 있어서 이참에 ECMAScript2015 또는 ECMAScript 6이라고도 하는 ES6문법을 정리해보려고 한다. ES6 문법의 주요 특징 - const, let 변수 const는 ES6에서 새로 등장한 키워드다! 말 그대로 constant(상수)역할을 하는데 반드시 선언과 동시에 초기화해야 한다. 재할당이 금지 되어있다. const 키워드는 재할당을 금지할 뿐, 불변을 의미하진 않는다. const 키워드로 선언된 변수에 원시 값을 할당한 경우 값을 변경할 수 없다. 하지만 const 키워드로 선언된 변수에 '객체'를 할당한 경우 값 변경이 가능하다. let은 변경 가능하며, 재할당도 가능하다. let 과 const는 블럭 단위에서 동..
Uncaught TypeError: querySnapshot.forEach is not a function 에러 해결 firestore를 이용해 read기능을 구현하던 중 마주친 오류.. is not a function 오류 자주 마주쳐서 힘들다 .. 처음엔 배열 객체 오류인줄 알았으나 스택 오버플로우 답변을 참고하니 get() 메서드가 비동기방식이라 then(), async/await 를 사용해야 한다고 함! 해결!
FirebaseError: Missing or insufficient permissions 에러 발생 FirebaseError: Missing or insufficient permissions firebase로 프로젝트를 진행 중 데이터가 등록하려는 순간 이런 에러가 떴다. 뭔가 허가가 안되었다는 말인데..!! 이럴 경우 본인 firebase에 들어가서 생성한 데이터베이스로 들어간다 거부 수를 보면 뭔가 문제가 있는 것을 알 수 있다 해결 방법은 그 옆에 규칙 수정을 눌러서 보안 규칙을 수정해주면 된다! 더 자세한 보안 규칙은 공식 문서를 참고하기 https://firebase.google.com/docs/firestore/security/get-started Cloud Firestore 보안 규칙 시작하기 | Firebase Documentation 의견 보내기 Cloud Firestore 보안 규칙 ..
React 4: 함수형과 클래스형 보호되어 있는 글입니다.
React 3 : CRUD 생활코딩 강의 들으면서 주석으로 정리한거 읽어보면서 복기하기 App.js import './App.css'; import React, { Component } from 'react'; import TOC from './components/TOC'; import ReadContent from './components/ReadContent'; import Subject from './components/Subject'; import Control from './components/Control'; import CreateContent from './components/CreateContent'; import UpdateContent from './components/UpdateContent'; //App 컴..