react로 소셜 로그인을 구현했는데 배포를 하고 나서 내 컴퓨터가 아닌 다른 컴퓨터 또는 핸드폰으로는 로그인 후 다음 화면으로 넘어가지 않는다. 내 컴퓨터로만 작업을 하다 보니 그런 문제가 있는지도 몰랐었다. 왜 다른 컴퓨터나 핸드폰에선 로그인이 정상적으로 작동되지 않는 걸까 … 또 배포 후 다른 문제점은 url 주소창에서 url을 직접 작성해 라우...

처음으로 풀스택으로 프로젝트를 시작했다. 혼자 해결해 나가는 부분에서 삽질을 많이 했다. 아직도 미흡한 점이 많지만 일단 배포를 먼저 해보기로 결정했다. 고치고 싶은 부분이라면 끝도 없이 많기에 .. 프론트엔드는 react와 redux를 사용해서 작업했고 netlify 배포 서비스를 사용했다. 백엔드는 node.js express 와 mongoDB...

Mongoose는 Node.js와 MongoDB를 연결해 주는 역할을 한다. Node.js에서 MongoDB를 사용할 수 있게 해주는 라이브러리이다. 노드 패키지 매니저 npm 또는 yarn을 사용해서 설치할 수 있다. npm install mongoose --save yarn add mongoose // -- save로 packge.json에...

String, Boolean, Number 같은 원시형 값을 복사했을 경우 순수한 값이 복사되고 독립적인 값이 저장된다. 하지만 Reference형 객체 복사에는 크게 얕은 복제(shallow copy)와 깊은 복제(deep copy)로 분류된다. Reference복사 아래와 같이 새로운 변수obj2에 obj를 할당했다. 그리고 obj에 obj.c...

LifeCycle API 생명주기 출처-LifeCycle Mounting component가 브라우저에 나타날 때 constrctor : component가 만들어지는 과정에서 가장 먼저 실행되는 함수로 초기 state를 설정한다. import React from 'react'; class App extends React.Comp...

배열은 순차적으로 비동기 처리를 하려고 할 때, promise 사용법을 블로깅 하려고 한다. 반복문이 있을 경우 promise를 사용하기 어려웠다. 예를 들어, function test () { return new Promise(function (resolve, reject) { for(let i=0; i < 5; i++) { ...

섞여있는 데이터들을 어떤 기준에 맞춰 정렬하는 여러종류의 정렬 알고리즘이 있다. 기본적으로 자바스크립트에는 데이터를 정렬해주는 sort()라는 메소드가 존재한다. 하지만 정렬 알고리즘을 공부하는 이유는 데이터의 양이나 상황에 따라 적합하지 않을 수도 있기 때문에 여러 정렬 알고리즘을 상황에 맞게 잘 선택해서 사용해야 하기 때문이다. 대표적인 Bub...

Asynchronus 자바스크립트는 비동기 처리를 위해 콜백 함수를 사용한다. 콜백 함수는 순차적인 처리가 많을 경우 가독성이 나쁘다. 또, 비동기 처리를 한꺼번에 처리하는 것도 한계가 있으며 에러 예외 처리에 대한 곤란한 부분이 있다. Promise? promise는 자바스크립트 비동기 처리에 사용되는 비동기 흐름을 제어해 주는 객체이다. 비...

디자인 패턴이란? 프로그램을 개발하는 과정에서 발생하는 다양한 문제점들을 해결하기 위해 많은 개발자들이 빈번하게 발생하는 문제들을 상황에 따라 적용해서 쓸 수 있는 패턴 형태로 만든 증명된 기술들이다. 어떠한 상황에서 정확한 해결책을 제시해 주는 것은 아니지만 일종의 방향성(솔루션)을 제시해준다. 1. Modules 모듈 패턴 모듈(modul...

hash table 어떠한 데이터를 받아 저장하려고 할 때, 저장할 데이터의 키를 받아 해시 코드로 변환해서 데이터 구조에 저장한다. 해시 코드를 만드는 것을 hashing이라고 하는데 hashing 이란 암호화하는 것이다. 해시 함수는 암호를 일정한 길이로 반환해준다. 대표적으로 ex) MD5, SHA .. 등 이 있다. 해시 함수는 연산을 여러...