본문 바로가기
728x90

전체 글138

Jave - Thread 개괄 ​안녕하세요. Thread 와 Thread 동시성 문제에 관해서 시리즈화해서 포스트하려고 합니다. 이번 포스트에서는 Thread가 무엇이고 동시성 문제가 왜 발생하는지 알아보겠습니다. Thread 란? Thread는 프로세스 내에서 실행 되는 실행의 단위입니다. 스프링에서 실행되는 public static void main(String[] args) { } 메소드도 사실 유저 스레드의 중에 하나입니다. 알게 모르게 유저 스레드를 만들어서 실행하고 있는 셈이죠. 일반적으로 우리는 멀티 코어에서 멀티 스레드를 사용하게 될 것입니다. 멀티 코어는 CPU의 코어를 말하는 것이고 여러 작업장이 존재하는 것으로 비유할 수 있습니다. 멀티 스레드는 작업장 하나에서 번갈아가면서 스레드를 수행하는 것입니다. 또한 멀티 .. 2022. 5. 3.
Java - 객체 지향 설계 원칙 SOLID SOLID (객체 지향 설계 5원칙) SOLID 원칙은 가독성이 확보되고 확장이 쉬운 객체 지향 설계 기반의 소프트웨어를 만들기 위한 원칙입니다. SOLID 원칙은 앞글 자를 따서 S : 단일 책임 원칙 O : 개방-폐쇄 원칙 L : 리스코프 치환 원칙 I : 인터페이스 분리 원칙 D : 의존관계 역전 원칙 으로 구성 됩니다. 단일 책임 원칙 (Single responsibility principle) SRP 한 클래스는 하나의 책임만 가져야 합니다. 개방-폐쇄 원칙 (Open/closed principle) OCP “소프트웨어 요소는 확장에는 열려 있으나 변경에는 닫혀 있어야 한다.” 상속이나 한 클래스를 다른 클래스의 맴버 변수 활용하는 등의 방식으로 확장은 가능하게 하되, 직접적인 클래스 수정은 지.. 2022. 4. 9.
[Spring Cloud] 12Factors 헤로크라는 개발 회사에서 제시한 12가지 항목으로, 클라우드 서비스를 개발 시 고려해야하는 항목을 정리한 것입니다. https://12factor.net/ The Twelve-Factor App Background The contributors to this document have been directly involved in the development and deployment of hundreds of apps, and indirectly witnessed the development, operation, and scaling of hundreds of thousands of apps via our work on the Heroku pla 12factor.net I. Codebase One cod.. 2022. 3. 29.
JPA - 트랜잭션 매니저3 전파 속성 @Transaction 속성 @Transaction 에 설정할 수 있는 속성은 다음과 같습니다. @Transaction 속성 중에 이번 포스트에서 Propagation 속성을 살펴보겠습니다. Propagation 속성 Propagation 은 전달 또는 전파라고 하며, 진행되고 있는 트랜잭션에서 다른 트랜잭션이 호출될 때 어떻게 처리할지 정하는 것을 '트랜잭션의 전파 설정'이라고 부릅니다. 위와 같이 전파 속성은 총 7가지 설정이 존재합니다. 사용 예시는 다음과 같습니다. @Transactional(propagation = Propagation.REQUIRED) @Transactional(propagation = Propagation.REQUIRES_NEW) @Transactional(propagatio.. 2022. 3. 25.
JPA - 트랜잭션 매니저1 개요 트랜잭션이란? 트랜잭션이란 insert, update, delete 등 DB 변경에 해당하는 SQL 문을 처리하는 작업의 단위입니다. 기본적으로 SQL 명령문 하나를 실행하는 것에서부터 서비스 내 메소드 전체가 트랜잭션의 단위가 될 수 있습니다. 부모 트랜잭션 내부에 자식 트랜잭션이 있는 경우에 부모 트랜잭션으로 트랜잭션 단위가 묶이게 됩니다. 트랜잭션의 속성(ACID) 트랜잭션은 4가지 속성(ACID)을 기반으로 작동합니다. Atomicity 원자성 원자성 - 부분적인 성공을 허용하지 않습니다. all or nothing 트랜잭션 내에 있는 모든 작업이 완료되거나 모든 작업이 완료되지 않아야 한다. 즉, 트랜잭션 내의 작업 중 하나라도 exception이 발생하면 트랜잭션 내의 모든 작업은 롤백(rol.. 2022. 3. 25.
JPA - 트랜잭션 매니저2 독립성(격리) 속성 @Transaction 속성 @Transaction 에 설정할 수 있는 속성은 다음과 같습니다. @Transaction 속성 중에 이번 포스트에서 isolation 속성을 살펴보겠습니다. Isolation 속성 Isolation 은 트랜잭션에서 독립성 혹은 격리성이라고 부릅니다. Isolation 은 Transaction 에서 일관성이 없는 데이터를 허용하도록 하는 수준이며, 여러 Transaction들이 다른 Transaction의 방해로부터 보호되는 정도를 나타냅니다. 격리성에는 격리 레벨(수준)이 존재합니다. 격리 레벨이 높은 수록 데이터의 정합성을 보장해주는 대신에 동시 처리하는 수행능력(성능)이 떨어지게 됩니다. 반대로, 격리 레벨이 낮을 수록 성능은 좋아지지만 데이터의 정합성이 떨어지게 됩니다.. 2022. 3. 25.
JPA - Entity Listener JPA에서 제공하는 Entity Listener의 종류와 쓰임에 대해서 정리해보았습니다. Entity Listener는 JPA가 동작하는 이벤트 구간을 관찰하고 있다가 발생하면 특정 동작을 실행하는 메소드라고 볼 수 있습니다. Entity Listener Annotation @PrePersist: entity manager persist operation(insert 작업)가 실행되기 전 @PreRemove: entity manager remove operation(delete 작업)가 실행되기 전 @PreUpdate: database의 update 작업이 실행되기 전 @PostPersist: database의 insert 작업이 실행된 이후 @PostRemove: database의 delete 작업이 .. 2022. 3. 25.
ESLint ESLint 란? 자바스크립트의 문법 검사&교정을 하는 도구입니다. https://eslint.org/ https://github.com/eslint/eslint#configuration ESLint를 플러그인을 설치하면, .eslintrc.js 설정파일이 생성됩니다. 파일에 들어가서 rules 속성에 필요한 설정을 추가하면 됩니다. package.json에 eslint 플러그인이 설치되지 않았다면, npm i -d eslint 를 통해 설치합니다. ESLint 에러가 화면에 표시되지 않게 하는 설정 Vue cli 3.x 후반 버전부터 ESLint 에러가 실행 화면을 덮는 현상이 발행하였고, 이를 해결하기 위해 몇 가지 설정이 필요합니다. 해결방법 1. vue.config.js vue 설정 파일을 생성합.. 2022. 3. 25.
webpack - 환경변수 process.env 웹팩의 환경변수 설정 파일을 Webpack DefinePlugin을 통해서 설정할 수 있습니다. 하지만, Vue cli 3.x 부터는 Webpack DefinePlugin을 설치하지않아도 프로젝트 내에서 해당 설정을 할 수 있습니다. Vue cli를 쓰지 않는 경우 Webpack에 환경 변수 설정을 직접 추가해야합니다. 그렇지 않으면 다음과 같은 에러가 발생하고 js에서 process.env 의 환경 변수를 읽을 수 없습니다. 이러한 환경 변수 문제를 해결하기 위해 webpack.config.js에 다음과 같은 설정을 해야합니다. // webpack.config.js ... const webpack = require("webpack"); const isProduction = process.env.NODE.. 2022. 3. 25.
webpack - babel 설정, regeneratorRuntime 에러 webpack 설정 시에 발생하는 대표적인 에러인 regeneratorRuntime 에 대해 다루어보겠습니다. ES8 문법인 async/await를 사용해 비동기 함수를 작성하면 브라우저에서 다음과 같은 에러가 발생합니다. async/await 함수 호출 예시 import axios from 'axios' export async function test() { const resposne = await axios.get( 'https://api.hnpwa.com/v0/news/1.json' ); console.log(resposne.data); return resposne.data; } async/await 지시어를 써서 정상적으로 비동기 api를 호출하기 위해서 babel을 설정해야합니다. 우선 아래의 .. 2022. 3. 25.
Vue - VueRouter 설정 Vue Router 설치 및 기본 설정 Vue와 같이 클라이언트 사이드 랜더딩(CSR)을 하는 경우, VueRouter와 같은 플러그인을 사용합니다. VueRouter 설치 npm install vue-router VueRouter 사용방법 routes > index.js 디렉토리와 index.js 파일을 만듭니다. 그 후 아래와 같은 코드를 추가 합니다. import Vue from 'vue'; import VueRouter from 'vue-router'; // Vue.use(...) 플러그인을 초기화하기 위해 필요한 코드임 Vue.use(VueRouter); 모듈 시스템에서 사용하면 Vue.use()를 통해 명시적으로 라우터를 추가해야합니다. 여기까지 초기 router 설정 파일 설정입니다. 이제 .. 2022. 3. 25.
Vue - axios 구조화(instance 활용) axios 구조화 axios 호출코드를 그때그때 쓸 필요없이 instance를 이용한 간소화와 js를 이용한 모듈화를 하여, axios 함수를 관리할 수 있습니다. api > index.js 와 같은 js 파일을 만들어줍니다. import axios from 'axios'; // axios 공통 성정을 미리 다 넣는 메소드 create() const instance = axios.create({ baseURL: 'https://some-domain.com/api/', headers: { 'X-Custom-Header': 'foobar' }, timeout: 1000, }) function registerUser(userData) { return instance.post('/signup', userData.. 2022. 3. 25.
Vue - VueRouter Navigation Guards VueRouter Navigation Guards란? 사용자가 브라우저의 url을 이용해서 페이지를 강제로 이동할 때 이를 방지하기 위한 라우터 설정입니다. 또한 사용자에게 특정 페이지에 접근권한을 부여하거나 조건에 따른 리다이렉트 등을 설정할 때 사용합니다. Navigation Guards 기본형 const router = new VueRouter({ ... }) router.beforeEach((to, from, next) => { // ... }) router.beforeEach는 router에서 데이터를 먼저 받아와서 페이지를 호출하게 하는 함수이며 전역 가드입니다. 네비게이션이 트리거될 때마다 가드가 작성 순서에 따라 호출되기 전의 모든 경우에 발생합니다. 가드는 비동기식으로 실행 될 수 있으며.. 2022. 3. 25.
Vue - Vuex 헬퍼 함수 Vuex를 먼저 이해한 후 보는 것을 추천합니다. Vuex를 다룬 이전 포스팅 참고하세요. https://getthismoment.tistory.com/108 Vuex 헬퍼 함수란 Vuex 헬퍼 함수란 Vuex store에 선언된 state, getters, mutations, actions 프로퍼티와 메소드를 다른 vue 컴포넌트에서 손쉽게 호출하고 재사용하기 위해 사용하는 함수입니다. Vuex helper 함수 종류 mapState - state를 연결해주는 함수 mapGetters - getters를 연결해주는 함수 mapMutations - mutations를 연결해주는 함수 mapActions - actions를 연결해주는 함수 Vuex 헬퍼 함수 기본형 컴포넌트에 Vuex 헬퍼 함수를 선언한 .. 2022. 3. 25.
Vue - axios Interceptors // Add a request interceptor axios.interceptors.request.use(function (config) { // Do something before request is sent return config; }, function (error) { // Do something with request error return Promise.reject(error); }); // Add a response interceptor axios.interceptors.response.use(function (response) { // Any status code that lie within the range of 2xx cause this function to trigger // Do .. 2022. 3. 25.
728x90

티스토리툴바