이번에야말로

토큰(token)은 본래 ‘징표’, ‘형식물’이라는 뜻에서 유래하여 상품권이나 서비스의 교환권을 뜻하는 영단어로, 화폐의 기능을 대신하는 유가증권의 일종이다. 실물로 주조될 경우 대개 화폐와 비슷한 모양으로 발급되며 재질은 동전부터 종이띠의 형태까지 다양하다. 카지노

토큰 인증 방식을 공부하다보면 항상 탈취 위험에 대한 이야기가 나온다. 실제로 토큰 탈취가 어떻게 일어나는지 궁금해서 찾아보았고. 대표적인 사례에 대해 조사해보았다.토큰 기반의 인증 방식에서 토큰은 세션과 다르게 무상태(stateless)라는 특징을 가지고 있다. 그래

AWS Lightsail 인스턴스에 서버를 띄울 일이 있었는데 CI/CD를 적용해보기로 했다. 하지만 EC2에 관련된 내용이 주로 있었고 Lightsail에 관련된 내용은 거의 없어서 이번 기회에 잘 정리 해놓으려고 한다.대부분 서버를 EC2로 띄우던데 EC2는 복잡하

서론 1편까지 Github Action과 Lightsail을 연결하기 위한 환경설정을 했다. 이번 편에서 실제로 Github Action의 워크플로우와 yml파일을 이용해 Lightsail 인스턴스에 접근하고 배포를 자동화 해보자. .yml 파일 작성 ci/cd에 대

영상편집 툴의 대표적인 Adobe Premiere Pro에서 동작하는 플러그인을 개발중인데 해당 플러그인은 HTML, CSS, JavaScript로 개발할 수 있다. 따라서 React환경을 구축해서 빌드하였다. 하지만 React App은 클라이언트 사이드 렌더링을 통해

Vite는 빠른것을 뜻하는 프랑스어에서 유래되었다고 한다.Vite는 vue.js의 창시자인 Evan Tou가 만든 차세대 프론트엔드 빌드 툴이다.기존의 Webpack, Parcel등이 번들링을 중심으로 개발 서버를 구성했다면, Vite는 ESM(ECMAScript Mo

React는 왜 props로 ref를 전달하지 못할까?에 대한 궁금증이 생겼고 Deep Dive 해보기로 했다.React는 컴포넌트 기반 라이브러리이다.컴포넌트 단위로 내부 구현을 캡슐화하고 명확한 인터페이스를 제공하기 위해 추상화를 고려하여 설계하여야한다.프론트엔드는

항해 1주차 과제 SPA 프레임워크 없이 SPA 만들기 과제를 진행하던 중 이벤트 관리에 있어서 꽤나 애를 먹었었다.그래서 SPA(특히 React)는 어떤식으로 이벤트를 관리하고 위임하는지 궁금해서 찾아본 내용을 정리하였다.브라우저는 클릭, 키보드 입력, 네트워크 응답

서론 React를 오래 써온 개발자면 useState, useEffect 같은 훅은 매우 익숙할 것이다. 이번 글은 React 18부터 등장한 useSyncExternalStore 훅에 대해서 공부하고 이 훅이 해결하려는 문제에 대해서 정리해보려고 한다. useSy

실시간 스트리밍 채팅 기능을 구현하게되면서 SSE에 대해 공부할 일이 있었다. 아래는 실제 코드를 작성해보며 SSE에 대해서 공부한 글이다.현대 웹 애플리케이션에서 실시간 데이터 통신은 필수적인 요소이다. 사용자가 페이지를 새로고침하지 않고도 실시간으로 업데이트되는 정

서론 Promise는 자바스크립트의 비동기 작업을 다루는 데 필수적인 객체이다. 콜백 헬(callback hell)에서 벗어나 비동기 작업의 성공과 실패를 명확히 구분하고 체이닝을 가능하게 하게한다. 이 글은 Promise가 어떻게 작동하는지, 그 핵심 원리를 단계별

JavaScript로 트라이 자료구조를 구현하며 이해하기