본문 바로가기

전체 글

(108)
[네트워크] REST API란 무엇인가? 이 글은 REST API를 참고하여 작성된 글입니다. 🤔 REST란 무엇일까? REpresentational StateTransfer의 약자로, 웹 상에서의 통신 체계에 있어 범용적인 스타일을 규정한 아키텍처이다. 쉽게 말하자면, 어떤 자원에 대해 CRUD(CREATE, READ, UPDATE, DELETE) 연산을 수행하기 위해 요청을 보낼 때, URI를 통해 자원을 표현하고, METHOD를 통해 자원에 대한 행위를 정의하고, 자원의 형태(Representation of Resource) 구성을 REST 라 한다. 🤔 API란 무엇일까? Application ProgrammingInterface의 약자로, 구글맵 API, 카카오 비전 API와 같이 응용 프로그램을 통해서 데이터를 제공받거나 기능을 사용..
[네트워크] HTTPS란 무엇인가? 이 글은 생활코딩-HTTPS를 참고하여 작성된 글입니다. 🤝 HTTPS (Hyper Text Transfer Protocol) + Over Secure Socket Layer 이전 글에서 HTTP를 공부했었는데, 이 규약은 평문 텍스트로 데이터를 주고받기 때문에 보안에 매우 취약하다는 문제점이 있었다. HTTPS는 이를 해결하기 위해 Over Secure Socket Layer라는 개념을 도입하여 보안을 강화한 프로토콜이다. HTTP는 TCP와 직접 통신했는데, HTTPS에서 HTTP는 SSL과 통신하게 되고, SSL이 TCP와 통신하게 된다. 🤔 우선, 용어 정리가 필요하다. HTTPS와 SSL HTTP는 응용 계층에서 사용되는 프로토콜이다. 이 HTTP를 표현계층에서 사용되는 SSL(Secure So..
[네트워크] HTTP란 무엇인가? 이 글은 HTTP를 참고하여 작성된 글입니다. 🤝 HTTP (Hyper Text Transfer Protocol) 클라이언트와 서버가 콘텐츠(주로, html 문서)를 주고받기 위해서 사용하는 공통의 약속이다. HTTP는 주로 평문 텍스트로 데이터를 주고받기 때문에 서버와 클라이언트가 주고받는 메시지의 보안이 매우 취약하다는 단점이 있다. 🤔 HTTP의 대표적인 특징은 무엇이 있을까? 👋 비연결 지향 클라이언트가 서버에게 자원을 요청한 후, 응답을 받게 되면 연결을 끊어버린다. 이는, 많은 클라이언트와 연결이 지속되면 서버에 부하가 발생할 수 있는 문제를 예방하기 위해서이다. 하지만, 요청할 때마다 연결해야 하는 비용이 발생한다는 단점이 있다. HTTP 1.1 버전부터는 지속적인 연결 속성인 Connect..
[Redux] 🌤 Redux-saga를 사용해 간단한 날씨 앱 만들기 본 글은 도서 '리액트를 다루는 기술, redux-saga을 참고하여 작성된 글입니다. 이전 글에서 redux-thunk를 통해 간단한 날씨 앱을 만들어 보았습니다. 이어서 이번 글에서는 redux-thunk 다음으로 가장 많이 사용되는 redux-saga를 사용하여 이전 글과 동일한 기능의 프로젝트를 만들어 보려 합니다. 🧰 redux-saga redux-saga는 위에서 언급한 바와 같이 redux-thunk 다음으로 가장 많이 사용되는 리덕스 미들웨어입니다. redux-thunk를 다시 생각해보면, 액션 객체 대신, 함수를 디스패치할 수 있게 도와주는 도구라고 했습니다. 오늘 사용할 redux-saga는 액션을 모니터링하고 있다가 특정 액션이 발생하면 이에 따라 특정 작업을 수행하는 방식을 사용합니..
[Redux] 🌤 Redux-thunk를 사용해 간단한 날씨 앱 만들기 본 글은 도서 '리액트를 다루는 기술', redux-thunk, redux-middleware를 참고하여 작성된 글입니다. 이전 글에 이어서 이번 글에서는 비동기 작업 처리를 도와주는 리덕스 미들웨어를 공부해보도록 하겠습니다. 🧰 redux-thunk, 그리고 thunk redux-thunk는 리덕스 미들웨어에서 비동기 작업을 처리하는 데 사용하는 미들웨어로 비동기 작업을 다루는 미들웨어 중에서 가장 대표적인 리덕스 미들웨어입니다. 위키백과-썽크에서 서술된 펑크의 정의를 보면, "썽크는 주로 연산 결과가 필요할 때까지 연산을 지연시키는 용도로 사용되거나, "라고 언급되어 있습니다. 그렇다면, 연산 결과를 지연시키는 방법은 무엇이 있을까요? 가령, 1+2를 출력하고 싶다면, 아래와 같이 코드를 작성하면 됩..
[프로그래머스] 두 정수 사이의 합 https://programmers.co.kr/learn/courses/30/lessons/12912 코딩테스트 연습 - 두 정수 사이의 합 두 정수 a, b가 주어졌을 때 a와 b 사이에 속한 모든 정수의 합을 리턴하는 함수, solution을 완성하세요. 예를 들어 a = 3, b = 5인 경우, 3 + 4 + 5 = 12이므로 12를 리턴합니다. 제한 조건 a와 b가 같은 경우 programmers.co.kr function solution(a, b) { var answer = 0; if (a < b) { for (var i = a; i
[프로그래머스] 같은 숫자는 싫어 https://programmers.co.kr/learn/courses/30/lessons/12906?language=javascript 코딩테스트 연습 - 같은 숫자는 싫어 배열 arr가 주어집니다. 배열 arr의 각 원소는 숫자 0부터 9까지로 이루어져 있습니다. 이때, 배열 arr에서 연속적으로 나타나는 숫자는 하나만 남기고 전부 제거하려고 합니다. 단, 제거된 후 남은 programmers.co.kr function solution(arr) { var answer = []; arr.map((a, i) => { if (a !== arr[i + 1]) { answer.push(a); } }); return answer; }
[Redux] ⛓ 리덕스 미들웨어란 무엇인가? (2) 본 글은 도서 '리액트를 다루는 기술'을 공부하며 정리한 글입니다. 리덕스를 통한 카운터 만들기 카운터를 만들어 보는 것은 리덕스의 가장 기초가 되는 예제입니다. 리덕스 미들웨어에 대해서 공부할 예정이기 때문에 카운터에 대한 설명은 생략하겠습니다. yarn add redux react-redux redux-actions -module/counter.js import { createAction, handleActions } from "redux-actions"; const INCREASE = "counter/INCREASE"; const DECREASE = "counter/DECREASE"; export const increase = createAction(INCREASE); export const dec..