본문 바로가기

JavaScript2

[React] JavaScript와 Express의 웹 서버 구축 및 get, post방식의 통신(VScode) JavaScript와 Express를 사용하여 웹 서버를 구축하고, React와의 통신을 통해 GET과 POST 요청을 처리하는 방법입니다.해당 프로젝트는 웹 서버와 클라이언트(React)를 분리하여 구성하며, 각 요청에 대한 응답 처리를 구축합니다.1. 프로젝트 설정먼저, Express 모듈을 사용하여 서버를 만들고 React 클라이언트와 통신할 준비를 합니다.const express = require('express'); const app = express(); const port = 3000; const path = require('path'); const cors = require('cors'); // CORS 정책을 해결하기 위한 패키지app.use(cors()); //cors활성화express.. 2024. 9. 27.
[React] 개발 단계에서 렌더링 두 번 발생 원인 및 방지 방법 (참고:해당 설명은 Vitrual Studio 프로그램 기준으로 설명합니다.) 다들 리액트로 개발하면서, 웹 콘솔창에 이유 없이 두 번의 상태값을 보신 적이 있을 겁니다. 어? 나는 아무것도 안 했는데? 이게 왜 뜨지라는 생각을 하였을 겁니다. 렌더링이 무엇이고, 개발 단계에서 두 번 발생하는지도 알아보겠습니다.목록렌더링이란?렌더링 발생 두 번 그 이유는?렌더링 발생 두 번 방지 1. 렌더링이란?웹 개발 관점에서의 렌더링은 웹 개발에서는 주로 "웹 페이지 UI를 생성"하고 "표시하는 과정"을 "렌더링"이라고 합니다. 사용자가 웹 페이지에 접속하거나 상호작용할 때, 브라우저는 웹 페이지의 구조와 스타일을 기반으로 화면에 내용을 그리는 렌더링 과정을 거칩니다.간다히 말씀드리자면, 우리가 웹 브라우저를 열어 .. 2023. 8. 30.