Home

2024
0
SpringSpring Core

[Spring Core] - 의존성 주입 방식

목차 [Spring Core] - 의존성 주입 방식 [Spring Core] - 컴포넌트 스캔과 의존성 주입 [Spring Core] - BeanDefinition [Spring Core] - 스프링 빈 [Spring Core] - 스프링 컨테이너 생성과 Bean 등록, 의존성 주입 [Spring Core] - 스프링 컨테이너 🔎 의존성 주입 (Dependency Injection) 의존성 주입은 객체간의 의존성을 관리하기 위한 디자인 패턴 한 객체가 직접 의존성하는 다른 객체를 생성하거나 관리하지 않고, 프레임워크와 같은 외부로부터 필요한 의존성을 주입받는 방식입니다. 이를 통해 객체간 의존성을 수정하기 위해 직접 코드를 수정할 필요가 없어 객체간 결합도 를 낮춰줍니다. 📌 스프링에서의 의존성 주입스프링에서는 스프링 컨테이너 가 객체의 의존성을 관리하고 주입해줍니다. 이때, 스프링 컨테이너가 의존성을 관리 및 주입을 위해 관리하는 객체들을 스프링 Bean 이라 부릅니다. 스프링에서 의존성 주입을 위해서는 우선, 스프링 컨테이너에 객체들을 스프링 Bean 으로 등록해야 합니다. 의존성 주입은 스프링 Bean 으로 등록된 객체들을 기준으로 주입이 이뤄집니다. 스프링에서 의존성 주입을 위해 @Autowired와 @Inject 를 사용하고 생성자, Setter, 필드, 메소드 에 붙일 수 있습니다.

0
FrontendVite

Vite 환경에서 tsconfig Path 사용하기

라이브러리 설치npm install vite-tsconfig-paths import react from "@vitejs/plugin-react";import {defineConfig} from "vite";import EnvironmentPlugin from "vite-plugin-environment";import tsconfigPaths from "vite-tsconfig-paths";// https://vitejs.dev/config/export default defineConfig({ plugins: [ react(), tsconfigPaths(), ], resolve: { alias: {}, }, build : { outDir: "./build", }, server : { port: Number(process.env.PORT || 3000), }, define : {},});

0
FrontendVue3

Vuex 시작하기

라이브러리 등록# Vue 3 npm install vuex --save# Vue 2npm install vuex@3.6.2 --save Store 생성 Vue 2 에서 Store 생성 const Store = new Vuex.Store({ state: {}, getters: {}, mutations: {}, actions: {}, modules: {},}) Vue 3 에서 Store 생성 import { createStore } from "vuex";export default createStore({ state: {}, getters: {}, mutations: {}, actions: {}, modules: {},}); Store 등록 Vue 2 에서 Store 등록

0
FrontendVue

Vue - 시작하기

라이브러리 설치npm install vue -g 프로젝트 생성vue create <생성할 프로젝트 이름> Vue CLI v5.0.8? Please pick a preset: (Use arrow keys)❯ Default ([Vue 3] babel, eslint) Default ([Vue 2] babel, eslint) Manually select features Vue CLI v5.0.8? Please pick a preset: Manually select features? Check the features needed for your project: (Press <space> to select, <a> to toggle all, <i> to invert selection, and <enter> to proceed) ◉ Babel ◉ TypeScript ◯ Progressive Web App (PWA) Support❯◉ Router ◉ Vuex ◯ CSS Pre-processors ◉ Linter / Formatter ◯ Unit Testing ◯ E2E Testing Vue CLI v5.0.8? Please pick a preset: Manually select features? Check the features needed for your project: Babel, TS, Router, Vuex, Linter? Choose a version of Vue.js that you want to start the project with 3.x? Use class-style component syntax? No? Use Babel alongside TypeScript (required for modern mode, auto-detected polyfills, transpiling JSX)? Yes? Use history mode for router? (Requires proper server setup for index fallback in production) Yes? Pick a linter / formatter config: Prettier? Pick additional lint features: Lint on save? Where do you prefer placing config for Babel, ESLint, etc.? In dedicated config files? Save this as a preset for future projects? (y/N) n

0
SpringSpring Security

[Spring Security] - SecurityContextRepository

목차 [Spring Security] - SecurityContextRepository [Spring Security] - SecurityContextPersistenceFilter 와 SecurityContextHolderFilter 🔎 SecurityContextRepository SecurityContextRepository 는 SecurityContext 를 저장하고 검색하기 위한 저장소입니다. Spring Security 에서는 인증 후 생성된 SecurityContext 를 저장하고 관리하기 위해 SecurityContextRepository 인터페이스를 제공합니다. SecurityContextRepository 인터페이스 구현을 통해 인증 객체(SecurityContext) 를 Request 객체나 Session 에 저장하거나 아니면 Redis 와 같은 별도의 저장소에 저장할 수 있습니다. SecurityContextRepository.javapublic interface SecurityContextRepository { @Deprecated SecurityContext loadContext(HttpRequestResponseHolder requestResponseHolder); default DeferredSecurityContext loadDeferredContext(HttpServletRequest request) { Supplier<SecurityContext> supplier = () -> loadContext(new HttpRequestResponseHolder(request, null)); return new SupplierDeferredSecurityContext(SingletonSupplier.of(supplier), SecurityContextHolder.getContextHolderStrategy()); } // 변경된 보안 컨텍스트를 저장합니다. 주로 사용자가 인증되면 새로운 보안 컨텍스트를 저장하는 데 사용됩니다. void saveContext(SecurityContext context, HttpServletRequest request, HttpServletResponse response); // 현재 요청에서 보안 컨텍스트가 존재하는지 확인합니다. boolean containsContext(HttpServletRequest request);} 1. Session 에 저장 - HttpSessionSecurityContextRepository HttpSessionSecurityContextRepository 는 Session 에 SecurityContext 정보를 저장합니다.

0
SpringSpring Security

[Spring Security] - SecurityContextPersistenceFilter 와 SecurityContextHolderFilter

목차 [Spring Security] - SecurityContextRepository [Spring Security] - SecurityContextPersistenceFilter 와 SecurityContextHolderFilter 기존에 인증을 하고 SecurityContext 를 생성하면 로그인 Session 이 유지가 됐는데, 새 프로젝트를 개발하면서 Reqeust 가 끝나면 인증이 풀리는 것을 알게 됐습니다. Spring Security 5.7 버전 이상부터는 SecurityContextPersistenceFilter 가 Deprecated 되고 SecurityContextHolderFilter 로 대체돼면서 이런 문제가 생긴거 같아 내용을 정리했습니다. 🔎 SecurityContextPersistenceFilterSecurityContextPersistenceFilter 에서는 인증을 위해 SecurityContextRepository 에 저장된 SecurityContext 정보를 가져와 인증 처리를 하고 요청이 종료되면 SecurityContext 정보를 SecurityContextRepository 에 저장합니다. SecurityContextPersistenceFilter 에서는 saveContext 를 이용해 SecurityContext 를 저장합니다. SecurityContextPersistenceFilter.javaprivate void doFilter(HttpServletRequest request, HttpServletResponse response, FilterChain chain) throws IOException, ServletException { ... // SecurityContext 를 가져옵니다. SecurityContext contextBeforeChainExecution = this.repo.loadContext(holder); try { this.securityContextHolderStrategy.setContext(contextBeforeChainExecution); if (contextBeforeChainExecution.getAuthentication() == null) { logger.debug("Set SecurityContextHolder to empty SecurityContext"); } else { if (this.logger.isDebugEnabled()) { this.logger .debug(LogMessage.format("Set SecurityContextHolder to %s", contextBeforeChainExecution)); } } chain.doFilter(holder.getRequest(), holder.getResponse()); } finally { SecurityContext contextAfterChainExecution = this.securityContextHolderStrategy.getContext(); this.securityContextHolderStrategy.clearContext(); // SecurityContext 를 저장합니다. this.repo.saveContext(contextAfterChainExecution, holder.getRequest(), holder.getResponse()); request.removeAttribute(FILTER_APPLIED); this.logger.debug("Cleared SecurityContextHolder to complete request"); }} 🔎 SecurityContextHolderFilterSecurityContextHolderFilter 에서는 인증을 위해 SecurityContextRepository 에 저장된 SecurityContext 정보를 가져와 인증 처리를 진행합니다. 하지만 SecurityContextPersistenceFilter 와는 다르게 SecurityContextRepository 에 저장하지는 않습니다.

2023
0
DevelopDjango

Django - 장고 시작하기

목차 Django - App 생성하기 Django - 장고 시작하기 장고 설치하기pip install django 장고 프로젝트 생성하기 - django-admindjango 를 설치하면 django-admin 명령어를 사용할 수 있습니다. 설치된 django-admin 에 startproject 명령어를 사용하면 새롭게 장고 프로젝트를 시작할 수 있습니다. django-admin startproject mysite 장고 서버 실행하기 - manage.py새로운 장고 프로젝트에 들어가면 manage.py 파일이 있습니다. runserver 명령어를 사용하면 장고 서버를 실행할 수 있습니다.

0
DevelopDjango

Django - App 생성하기

목차 Django - App 생성하기 Django - 장고 시작하기 장고 앱 만들기장고 App 생성은 manage.py 가 있는 프로젝트 폴더에서 startapp 명령어를 사용합니다. startapp 명령어를 사용해 hello_world 라는 이름의 앱을 만들어 줍니다. python manage.py startapp hello_world view.py 작성하기앱 폴더 내에 views.py 파일에 다음과 같은 코드를 작성해줍니다. from django.http import HttpResponsedef hello(request): return HttpResponse("Hello, world. You're at the hello_world index.")# Create your views here.] url.py 작성하기

0
FrontendReact Query

React Query - 캐싱 라이프 사이클

목차 React Query - 캐싱 라이프 사이클 React Query - React Devtools 사용하기 React Query - 시작하기 cache 와 stale 설정const queryClient = new QueryClient({ defaultOptions: { queries: { staleTime: 1000 * 60, cacheTime: 1000 * 60 * 5, } },});const App = ({ Component, pageProps }: AppProps) => { return ( <QueryClientProvider client={queryClient}> <Component {...pageProps} /> </QueryClientProvider> );}; cacheReact Query 는 설정한 cacheTime 만큼 데이터를 메모리에 저장해 놓습니다. 다시 이야기 하자면 React Query 에서의 Cache 는 QueryCache 객체의 queries 배열과 queriesInMap 객체의 Query 객체가 존재하는 것을 말합니다. cache 라이프 사이클 - fresh 와 stalestale 은 React Query 에서 cache 에 저장된 데이터 상태를 의미합니다. cache 에 저장된 데이터가 staleTime 만큼은 fresh 한 상태로 있다가 그 후에는 stale 상태로 넘어갑니다. stale 상태의 데이터는 cache 에 오랫동안 저장돼 있어 refetch 가 필요한 상태임을 의미합니다. React Query 에서는 stale 상태의 데이터가 특정 조건을 만족하면 refetching 이 일어나도록 합니다.