IT56 번들링, 웹팩 번들링프론트 개발자에게 번들링이란?사용자에게 웹 어플리케이션을 제공하기 위한 파일 묶음사용자가 브라우저를 열고 주소를 입력하면 해당 주소에서 프론트 개발자가 번들링한 여러 파일을 받음이 파일을 브라우저가 실행하여 웹 어플을 사용자에게 제공하게 됨번들링의 필요성번들링 없이 그냥 일반적인 방법을 사용하게 되면 발생할수 있는점두개의 js 파일에서 같은 변수를 사용하고 있어 변수간 충돌이 일어남딱 한번 불러오는 프레임 워크 코드가 8MB 라서 인터넷이 느린 곳에서 사용자가 불편함을 느낄수 있음번들 파일 사이즈를 줄이기 위해 파일의 공백을 모두 지우니 가독성이 떨어지게 됨배포 코드가 너무 읽기 쉬워 개발을 할줄 아는 사용자가 프론트 애플리케이션을 임의로 조작해 피해 발생할수 있음번들링 작업에서는 필연적으로 용량을.. 2025. 2. 28. 커스텀 훅 사용해보기 솔로프로젝트를 구현해보는중에 user 관련된 로직이 많이 중복되게 쓰이는걸 보다가 문득 커스텀훅으로 코드의 중복성을 줄여보고자 사용해봄!! user 관련된 로직이 사용되는 곳1. 로그인2. 로그아웃3. 헤더에서 로그인 했을때와 안했을때 상태 감지할때 user 필요4. 마이페이지5. 권한이 있는지 없지 확인하는 로직 지금 다 구현하지 않았음에도 여러곳에서 user 가 사용되고 있음을 확인할수 있음 user 로직을 useUser 라는 커스텀 훅을 통해 간단하게 코드를 구현해보려고 함! export const useUser = () => { const queryClient = useQueryClient(); // user 상태를 useQuery로 관리 const { data: user, isLoading.. 2025. 2. 20. 스프링 메모 @Configuration@Configuration 클래스 레벨@Configuration 애너테이션은 스프링에서 자바 기반의 설정 클래스를 정의하는데 사용주요 역할빈 등록 : @Bean 에너테이션이 붙은 메서드를 통해 스코프랑 컨데이너에 빈을 등록할수 있게 함싱글톤 보장 : @Configuration 클래스 내의 @Bean 메서드로 생성된 객체들이 싱글톤으로 관리 되도록 보장스프링 컨테이너 관리 : @Configuration 이 붙은 클래스 자체도 스프링 빈으로 등록 되어 관리 됨 여기서 싱글톤이란?싱글톤 패턴은 스프링의 핵심 개념중 하나임싱글톤은 클래스의 인스턴스가 애플리케이션 전체에서 단 하나만 생성되고 공유되는 디자인 패턴임메모리 사용을 줄이고 여러곳에서 동일한 객체를 공유하여 사용할수 있음이를 사.. 2025. 2. 10. React - AJAX 실습(1) 간단하게 AJAX 를 통하여 무료 API 활용하여 실습을 해보자!!일단 AJAX 는 useEffect 안에서 내부 또는 이벤트 핸들러에서 실행이 되어야 함또한 직접 해보니 로딩이나 오류 에러 와 같은 상태 관리가 중요하다고 생각이 듬라이브러리는 axios 나 fetch 를 사용하면 되는데 둘다 해보기로 함! 일단 fetch 를 통하여 API 를 받아오되 첫번째 단계로 다섯개만 뿌리고 새로운 포스트 작성을 하면 맨 위로 올라갈수 있도록 해보자!! ** 가장 기본 뼈대 생성import React from "react";const BlogPostFetch = () => { return( )}export default BlogPostFetch; 1. 데이터를 먼저 받아서 잘 받아 왔는지.. 2025. 2. 4. 이전 1 2 3 4 ··· 14 다음