🐢 스프링 빈 등록 방법 2가지 1.컴포넌트 스캔 + 자동 의존관계 설정(@Componenet 계열)2.자바 코드로 직접 등록(@Configuration + @Bean) 🐢 1. 컴포넌트 스캔과 자동 의존관계 설정 @Component 달린 클래스 → 자동으로 스프링 빈 등록됨 🐢@Controller, @Service, @Repository 도 사실상 @Component 포함하고 있음 👉 그래서 컨트롤러/서비스/리포지토리 클래스 위에 어노테이션만 붙여도 스프링이 알아서 빈 등록함 ✔️자동 등록의 원리 스프링은 시작 시 @Component 달린 클래스 전부 스캔하위 패키지 전부 싹 뒤져서 빈으로 등록함등록된 빈은 기본적으로 싱글톤(하나만 생성)✔️스프링 빈으로 등록하면 좋은 이유? 스프링 컨테이..

🐢 일반적인 웹 애플리케이션 계층 구조 Controller: 웹 요청 받고 응답 주는 창구 거북이 🐢📨Service: 비즈니스 로직 담당하는 두뇌 거북이 🐢🧠Repository (DAO): 데이터 저장/조회 담당하는 창고 거북이 🐢📦Domain (Entity): 회원, 주문 같은 핵심 객체 → 실제 데이터 거북이 🐢 👉 요청 → 컨트롤러 → 서비스 → 리포지토리 → DB 순서로 흐름 *위에 일반적인 웹 애플리케이션 계층 구조 🐢 Optional.ofNullable null 방지 거북이 🐢 값이 있으면 감싸서 Optional로 반환, 없으면 Optional.empty() 반환Optional 이런 식으로 많이 씀Optional member = Optional.ofNullable(rep..

🐢 MVC?Model, View, Controller의 약자 역할 분리해서 개발 효율성과 유지보수성 높이는 패턴 안 그러면 코드 스파게티 대환장 파티 🐢 역할분담 Model: 데이터랑 비즈니스 로직 담당 → 똑똑한 거북이 🐢💻Controller: 요청 받고 Model 불러서 View에 넘김 → 중간 전달 거북이 🐢📨View: 화면 그리기만 함 → 예쁜 거북이 🐢🎨 🔥 정리 Model/Controller는 서버 뇌근육, View는 디자인 담당임 🐢 MVC동작 흐름 1.브라우저에서 URL 요청함 2. 내장 톰캣 서버가 받음 → 스프링 컨트롤러 호출 3. 컨트롤러가 name: spring 데이터 세팅하고 hello-template 리턴함 4. ViewResolver가 templat..

1️⃣ 프로젝트 생성 (Spring Initializr)스프링 부트 프로젝트는 https://start.spring.io/에서 생성합니다.Project: Gradle (요즘은 Gradle이 더 많이 쓰임)Language: JavaSpring Boot: 최신 버전 선택Dependencies:Spring Web (웹 애플리케이션 개발)Thymeleaf (템플릿 엔진)다운로드 후 압축을 풀고 IntelliJ IDEA에서 열어줍니다.2️⃣ Gradle vs Maven (빌드 도구 차이)스프링 부트 프로젝트를 만들 때 Gradle과 Maven 중 하나를 선택할 수 있습니다.✅ MavenXML 기반 설정 (pom.xml)오래된 표준, 안정적설정이 직관적이지만 코드가 길어짐✅ GradleGroovy/Kotlin DS..

1️⃣ React는 화면을 빠르게 바꾸는 JS 라이브러리bash복사편집npm create vite@latest → Vite로 설치하면 빠르고 가벼운 개발 환경이 만들어져요.2️⃣ JSX는 JS 안에서 HTML처럼 코드를 짜는 문법jsx복사편집const element = h1>Helloh1>; → HTML처럼 생겼지만, class → className 등 문법 차이 주의!3️⃣ 컴포넌트는 화면의 부품 단위jsx복사편집function Hello() { return p>안녕하세요p>; } → 함수처럼 만들고 처럼 태그로 사용할 수 있어요.4️⃣ Props는 컴포넌트에 값을 전달하는 방법jsx복사편집function Hello(props) { return p>{props.name}님 반가워요!p>; } Hello..

React로 화면을 만들다 보면,“버튼 클릭했을 때 숫자 올리기”“입력창에 글자를 쓰면 화면에 반영하기”이런 걸 하고 싶을 때가 많죠!👉 그럴 때 사용하는 게 바로 이벤트 처리예요!이번 글에서는✅ 이벤트란 뭔지✅ 어떻게 처리하는지✅ 클릭과 입력 예제쉽고 간단하게 설명드릴게요.1️⃣ 이벤트란 뭘까요?이벤트(Event) = 사용자의 행동예를 들어:버튼 클릭키보드 입력마우스 움직임스크롤이런 걸 전부 “이벤트”라고 부릅니다!React에서는**“이벤트가 일어났을 때 실행할 코드”**를 미리 정해두는 걸👉 **이벤트 처리(Event Handling)**라고 해요.2️⃣ 클릭 이벤트 처리 (onClick)버튼을 눌렀을 때 어떤 일이 일어나게 하고 싶다면?jsx복사편집function App() { const han..