개요현재 개발중인 서비스 ARIPAY는 교내 매점 상품권을 온라인으로 관리할 수 있는 플랫폼이다.지난번에 현재 잔액 조회 및 사용자 조회에 대한 개발을 마무리했고, 이제 포인트 충전 및 차감 기능을 구현해보려고 한다. 포인트 차감 & 충전흐름 쪼개기우선 포인트 차감은 사용자 및 관리자가, 포인트 충전은 관리자가 할 수 있어야한다. 사용자 학생증 바코드 찍기해당 하는 학생 정보를 포함해 충전 화면 이동금액 입력충전 버튼 클릭충전 완료그리고 차감은 아래와 같이 정리할 수 있었다.사용자 학생증 바코드 찍기해당 하는 학생 정보를 포함해 충전 화면 이동금액 입력결제 버튼 클릭충전 완료여기에 더해, 우리가 알아야할 데이터 정보를 정리할 수 있다.학생증 바코드포인트 내역충전/결제 여부금액고려해야할 부분여러 곳에서 상..

재조정이란? 리액트에서 재조정은 VDOM에서 발생하는 변경 사항을 반영하는 과정입니다. VDOM은 메모리 상에 존재하는 가상의 DOM으로, 리액트에서 컴포넌트를 업데이트할 때 변경된 부분만 실제 DOM에 반영하려고 사용됩니다. 이 과정은 리액트의 성능과 효율성을 결정하는 중요한 요소 중 하나입니다. *재조정 알고리즘 리액트는 재조정 알고리즘을 사용하여 최소한의 업데이트만 수행합니다. 이는 성능을 향상시키는데 중요한 역할을 합니다. 재조정 알고리즘은 다양한 최적화 기술을 사용하여 성능을 향상시킵니다. 예를 들어, 컴포넌트의 props나 state가 변경되었을 때, 해당 컴포넌트와 그 자식 컴포넌트만 다시 렌더링하고 나머지는 그대로 유지합니다. Diffing 알고리즘 리액트의 재조정 알고리즘에서 핵심적인 역..

🚨 본 글에서 프론트엔드는 Nex.js + Typescript, 백엔드는 Node.js + Express를 나타냅니다. 해결 방법은 맨 아래 '내가 해결한 과정' 부분 부터 봐주세요. :) 사용자 API를 구축한 후 테스트를 하기 위해 임시로 코드를 작성하고 로그인이 되는 지 확인하기 위해 API 연결을 해줬다. 하지만 에러가 발생하는데 ... Uncaught (in promise) SyntaxError: Unexpected token '

계절에 맞춰 적는 글 🚨 본 글은 Promise를 알고있다는 전제하에 작성한 글입니다. :) 1. 등장 배경 우리는 동적 웹 사이트를 만들기 위해 서버로 부터 데이터를 받아온다. Javascript에서 HTTP 통신을 위해 *XMLHttpRequest 객체를 사용하는 등의 방식이 일반적이었다. Json이나 XML형태로 필요한 데이터만 받아 갱신하기 때문에 그만큼의 자원과 시간을 아낄 수 있다는 장점이 있었지만, 반대로 사용자에게 아무런 진행정보를 주지 않기 때문에 사용자가 요청이 완료가 안되었는데 페이지를 떠날 수도 있다는 점과 복잡한 구조를 제공한다는 단점이 있다. * XMLHttpRequest에 대해 더 알고 싶다면 아래 링크를 참고하길 바란다. [JavaScript] Ajax 정리 - Azderic..

도입 배경 현재 진행하기로 한 프로젝트는 STAY MATE라는 프로젝트로, 기숙사 입소 인증을 돕기 위한 플랫폼이다. 해당 프로젝트에서 학생들의 정보를 관리하기 위해 로그인 및 회원가입 기능이 필요하다. 그래서 정보를 관리하고 저장할 브라우저 저장소가 필요했고, 쿠키와 세션 그리고 토큰(JWT) 중 이번에 토큰(JWT)을 활용하기로 하였다. 왜 JWT 여야만 할까? 이전에 쿠키를 사용해서 로그인과 회원가입 기능을 개발한 적 있다. 그 경험을 토대로 이번에도 똑같이 적용하려고 했으나, 쿠키를 사용하기엔 큰 문제점이 있었다. 바로, 정보 탈취의 위험성 이 있다는 것이다. 쿠키에 대해 공부하던 중 아래와 같은 단점에 대해 알게 되었다. 보안에 취약하다. (요청 시 쿠키의 값을 그대로 보내어, 유출 및 조작당할..

자바스크립트는 웹 개발 분야에서 가장 인기 있는 프로그래밍 언어 중 하나로, 기술적 진보와 개발 생태계의 확장으로 인해 매우 강력한 도구로 자리 잡았다. 하지만 프로젝트의 규모가 커지고 복잡해지면서 기존 자바스크립트의 문제점들이 두드러지기 시작했다. 이로 인해 많은 개발자들이 타입스크립트를 채택하고 있다. 먼저 아래에는 스택오버플로우에서 조사한 가장 사랑하는 언어 순위를 매긴건데, 보면 타입스크립트가 자바스크립트를 한참 제치고 4위에 올랐다.(자바스크립트는 15위쯤...) Typescript란 타입스크립트는 Microsoft에서 개발한 오픈 소스 프로그래밍 언어로, 기존 자바스크립트의 문제점을 보완하기 위해 만들어졌다. 타입스크립트는 자바스크립트에 아주 강력한 타입을 부여한 언어라는건데, 그냥 쉽게 얘기..