StringBuilder와 String의 차이 StringBuilder와 String은 둘 다 문자열을 다루는 클래스라는 건 알고 있지만.. 무슨 차이가 있을까? 1. String 불변성(Immutability): String은 불변(immutable)한 클래스이다. 즉, 한 번 생성되면 해당 문자열의 내용을 변경할 수 없다. 문자열을 수정하려면 새로운 String 객체를 생성해야 한다. 안전성: 불변성으로 인해 String은 스레드 안전(thread-safe)하며, 동시에 여러 스레드가 문자열에 접근해도 예기치 않은 결과가 발생하지 않는다. 메모리 관리: 문자열을 연결하거나 수정할 때마다 새로운 객체를 생성하기 때문에, 메모리 사용량이 늘어날 수 있다. 성능: 문자열을 수정할 때마다 새로운 객체를 생성..
오류 화면 React 프로젝트 진행 중 @material-ui를 설치하려니 오류가 나면서 설치하지 못 했다. 오류 내용 npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: todo-react-app@0.1.0 npm ERR! Found: react@18.2.0 npm ERR! node_modules/react npm ERR! react@"^18.2.0" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer react@"^16.8.0 || ^17.0.0" from @m..
클래스형 컴포넌트 코드 작성 1. useState란? useState는 리액트 훅 중 하나이다. 함수형 컴포넌트에서 상태(state)를 관리하기 위해 사용된다.. useState는 배열 형태의 반환값을 가지며, 첫 번째 요소는 현재의 상태값이고, 두 번째 요소는 상태를 변경하는 함수다. 이를 통해 우리는 함수형 컴포넌트에서도 상태를 생성하고 업데이트할 수 있다. 2. useState를 사용하는 이유 클래스형 컴포넌트에서만 사용할 수 있던 상태 관리를 함수형 컴포넌트에서도 가능 상태값을 초기화하고 변경하는 함수를 제공받아 편리하게 상태를 관리 용이 상태값이 변경되면 리액트가 자동으로 컴포넌트를 다시 렌더링하여 화면에 반영 함수형 컴포넌트에서도 상태를 관리할 수 있기 때문에 코드의 가독성과 재사용성을 높인다..
JSX 문법에 대해 리액트 공부를 하며, JSX를 처음 접해본다. 사용하기 위해선 규칙을 알아야 하기 때문에 정리를 해봤다. 1. 감싸인 요소 컴포넌트 함수 내부에 여러 요소가 있다면 반드시 부모 요소 하나로 감싸야 한다. 태그를 사용해도 되고, 리액트 v16이상이라면 태그를 사용할 수 있다. 잘못된 예시 function App(){ return ( 문단1 문단2 ) } 감싸주지 않는다면 오류가 발생한다. 올바른 예시 function App(){ return ( 문단1 문단2 ) } 여기서 ~ 를 ~ 또는 ~ 로 써도 무방하다. 2. 자바스크립트 표현 JSX는 DOM 요소 렌더링 기능뿐 아니라, 자바스크립트 표현식을 사용할 수 있다. function App() { let name= '민민의 하드디스크';..
리액트 소스 코드 이해하기 및 JSX에 대해 1. App.js import logo from './logo.svg'; import './App.css'; function App() { return ( Edit src/App.js and save to reload. Learn React ); } export default App; 기본적으로 제공되는 App.js 코드이다. 리액트는 얼핏보면 파이썬 같기도 하지만 자바스크립트 라이브러리이다. import: 다른 파일들을 불러와서 사용할 수 있으며, 원래 브라우저에서는 없던 기능이며 Node.js에서 지원하는 기능이다. function App(): 기본적으로 function은 함수라고 하는데, 위 코드에서는 함수의 return(반환) 값이 HTML인 마크업 언..
리액트 환경 설정하기 1. Node.js + npm 설치하기 Node.js는 크롬 V8 자바스크립트 엔진으로 빌드한 자바스크립트 런타임이며, 웹/앱 등 많은 프로젝트에 사용된다. 백엔드 프로그래머의 필수 요소로 자리잡았다. https://nodejs.org/ko/download 다운로드 | Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 설치가 되었다면 터미널 창에서 확인 가능 $ node -v 2. Yarn 설치 yarn은 npm의 글로벌 설치 기능을 통해 설치가 가능하다. $ npm install --global yarn 설치가 되었다면 터미널 창에서 설치확인 $ yarn --versi..
JSP 세션에 대하여 세션(Session)의 개념 및 활용 예시 JSP Session은 웹 애플리케이션에서 사용자의 상태 정보를 유지하고 관리하기 위한 메커니즘이다. 사용자가 웹 애플리케이션에 접속하면 서버는 해당 사용자에 대한 고유한 세션을 생성하고, 이 세션을 통해 사용자의 상태를 추적하며, 각 세션은 고유한 세션 ID를 가지고 있으며, 이를 사용하여 클라이언트와 서버 간의 상태 정보를 식별한다. JSP Session 특징 1. 세션 생성: 사용자가 웹 애플리케이션에 최초로 접속하면 서버는 새로운 세션을 생성한다. 세션은 일반적으로 사용자의 브라우저와 연결된 유효 시간을 가지며, 유효 시간이 지나면 세션은 만료된다. 2. 세션 식별: 각 세션은 고유한 세션 ID를 가지고 있다. 세션 ID는 일반적으로..
JSP에서 DB 연동 및 로그인 회원가입 페이지 구현 구현할 페이지 목록 index.jsp: 메인페이지이며 로그인 버튼과 회원가입 버튼으로 구성 login.jsp: 로그인 페이지이며, 메인페이지에서 로그인 버튼이 onclick()되면 로그인 화면으로 이동 로그인 정보를 loginAction.jsp에 POST loginAction.jsp: 로그인 페이지에 입력된 사용자 정보를 GET하여 그 값을 DB값과 비교/검사 join.jsp: 회원가입 페이지이며, 메인페이지에서 회원가입 버튼이 onclick()되면 회원가입 화면으로 이동 회원가입 정보를 joinAction.jsp에 POST joinAction.jsp: 회원가입 페이지에 입력된 사용자 정보를 GET하여 그 값을 DB에 INSERT 1. TABLE 생성..
