본문 바로가기
반응형

Development302

[javascript] webpack.config.js 설정 개요 node.js 문법을 써야 한다. entry 에 있는 명령어를 읽어서 변환과정을 거쳐서 output 으로 전달함. entry -> module -> plugin -> output 으로 전달됨 const HtmlWebpackPlugin = require("html-webpack-plugin"); const path = require("path"); module.exports = { mode: "development", entry: "./src/app.js", output: { path: path.resolve(__dirname, "dist"), filename: "bundle.js", }, devServer: { compress: true, port: 9999, }, module: { rules: [.. 2023. 1. 13.
[javascript] 배열 연산의 형태 여러가지 배열 연산 형태 함수 형태나 쓰임이 많다보니 코드를 봤을때 대체 무슨 의미인지 파악이 어려워서 공부하다가 형태를 기억하면 좋을것 같아서 남겨놔봤다. type Book = { title: string; copyright?: string; author?: string; }; const books: string[] = [ "헨리 6세", "리처드 3세", "실수 연발", "말괄량이 길들이기", "헨리 8세", ]; // foreach 문 books.forEach((book: string, idx: number, books: string[]) => { console.log(book, idx); }) // map 사용1 const bookObject: Book[] = books.map((book:stri.. 2022. 12. 23.
[Javascript] 함수 형태 매일 봐도 까먹는 자바스크립트 함수형태들... function fn(x){ return x + 100; } const result = fn(10); # 이름없는 함수 const fn2 = function (){ return 100; }; fn2(); # 즉시 실행 함수 (function(){ console.log('test') })(); # Arrow 함수 const fn3 = () => { return 100; } const fn4 = () => 100; # Generator 함수 # 최초 호출하면 함수가 실행되지 않고 실행 준비상태로 만듬. # 그리고 객체를 반환하며 이 객체에는 함수를 실행할 도구가 담겨져 있다. # 도구를 이용해서 함수를 실행하고 멈추고 할수 있음. function* fn5(){ .. 2022. 12. 20.
BASE 분산 트랜잭션 속성 소프트웨어 아키텍처 Hard Parts 의 내용을 정리한 내용입니다. BASE 분산 트랜잭션 특유의 속성 BA (Basic availavility) 분산 트랜잭션의 모든 서비스 또는 시스템이 분산 트랜잭션에 참여할 수 있으리라고 기대하는것. S (Soft state) 분산 트랜잭션이 진행중이고 원자적 비지니스 요청이 미 완료된 상태. 고객 프로필 정보에서 Profile 테이블에는 데이터카 커밋 됐지만 다른 연관 테이블에는 커밋되지 않은 상태. E (Eventual Consistency) 충분한 시간이 지나면 언젠가는 결국 분산 트랜잭션이 완료되고 모든 데이터가 서로 동기화 된다는 의미. 백그라운드 동기화 패턴 (Background synchronization pattern) - 326p 별도의 외부 서비.. 2022. 11. 11.
Python 가상환경 Python Virtualenv 프로젝트별 종속성 문제를 해결하기 위해서 가상환경을 제공한다. 동시에 여러개의 프로젝트 진행시 각각의 파이썬 버전이 다를경우 사용한다. virtualenv 환경 구성 pip install virtualenv D:\STUDY\study_python>virtualenv py3.8-env created virtual environment CPython3.8.5.final.0-64 in 6461ms creator CPython3Windows(dest=D:\STUDY\study_python\py3.8-env, clear=False, global=False) seeder FromAppData(download=False, pip=bundle, setuptools=bundle, whee.. 2022. 10. 27.
Ubuntu 에서 파이썬 버전 확인 및 변경 Ubuntu 에서 파이썬 설치 위치 확인 DESKTOP-MBRI3VL:~$ python --version Python 2.7.17 DESKTOP-MBRI3VL:~$ python3 --version Python 3.6.9 파이썬을 설치하다 보면 2.X 도 있고 3.X 도 있다. 위와 같이 각각의 버전을 확인해보면 설치된 버전을 확인할 수 있다. Ubuntu를 설치하면 기본적으로 2.7을 path 로 설정한다. 아래와 같이 명령어를 실행 하면 설치된 파이썬 목록들이 나완다. (정말 이것 저것 많다.) DESKTOP-MBRI3VL:~$ ls /usr/bin | grep python python-config python2 python2-config python2.7 python2.7-config python3 .. 2022. 10. 25.
[WSL] 디폴트 배포버전 설정하기 PS C:\Users> wsl -l -v NAME STATE VERSION * docker-desktop-data Stopped 2 docker-desktop Stopped 2 Ubuntu-18.04 Running 2 위와 같이 배포버전이 여러개 일 경우 default 로 설정되는 배포버전으로 변경하기 위해서는 다음과 같이 설정하면 된다. C:\Users> wsl --setdefault Ubuntu-18.04 그럼 다음과 같이 변경이 된다. C:\Users> wsl -l -v NAME STATE VERSION * Ubuntu-18.04 Running 2 docker-desktop Stopped 2 docker-desktop-data Stopped 2 이것을 찾아봤던 이유는 VS Code 에서 remote.. 2022. 10. 21.
[React] Warning: Each child in a list should have a unique "key" prop. React 에서 Key 가 필요한 이유 Map 사용시 고유한 Key 가 필요하다. React 는 상태를 메모리에 저장하고 있다가 변경된 부분만 렌더링 한다. Key 값이 없으면 모든 데이터를 비교해야 하지만 Key 가 있으면 Key만 비교하면 된다. {props.users.map((user) => ( {user.username} ({user.age} years old) ))} Map 에서 index 를 Key로 하면 안되는 이유 0번의 index 가 삭제되면 React 가 변경을 감지하여 리렌더링 되고 0번 부터 다시 매핑한다. 1번 인덱스가 0번으로 매핑이 된다. 결론적으로 인덱스가 추가되거나 삭제되면 값이 바뀌기 때문에 index 를 key 로 사용하는것은 안좋다. 2022. 8. 12.
[React] React.useState() 값과 함수를 반환한다. 함수는 값을 변화시킨후 컴포넌트를 리렌더링한다 여러개의 state 를 정의할 수도 있고 object로 관리할수도 있다. const [enteredTitle, setEnteredTitle] = useState(''); const [enteredAmount, setEnteredAmount] = useState(0); const [enteredDate, setEnteredDate] = useState(); const [userInput, setUserInput] = useState({ enteredTitle: '', enteredAmount: 0, enteredDate: '' }) 주의 할 점은 update 시 object에 있는 일부 키만 업데이트 한다면 다른 키들이 사라진다. 아래와.. 2022. 8. 12.
리다이렉션 응답 301(Permanently Moved) 요청한 URL에 대한 HTTP 요청의 처리 책임이 영구적으로 Location 헤더에 반환된 URL 로 이전되었다는 응답. 영구적으로 이전되었으므로 브라우저는 이 응답을 캐시한다. 추후 같은 URL 로 요청시 브라우저는 캐시된 원래 URL 로 요청을 보낸다. 302 (Found) 요청한 URL 이 "일시적으로" Location 헤더가 지정하는 URL 에 의해 처리되어야 한다는 응답. 클라이언트 요청은 항상 단축 URL 서버에 먼저 보내진 후 원래 URL 로 리다이렉션이 된다. 2022. 6. 16.
@ElementCollection 컬랙션 객체임을 JPA 에 알려주는 Annotation. @Entity public class Person { @Id private Long id; private String email; @ElementCollection @CollectionTable( name = "address", joinColumns = @JoinColumn(name = "person_id") ) List addressInfoList = new ArrayList(); } Entity 와 라이프 싸이클을 같이 하며 독립적으로 사용 불가능 하다. 부모 Entity가 삭제될 경우 같이 삭제된다. (실제 클래스에 cascade 를 설정하는 옵션이 없다.) ElementCollection의 Fetch 전략은 기본이 Lazy 이다. 실제 테이.. 2022. 6. 13.
@Access 어노테이션 JPA 가 엔티티 데이터에 접근하는 방식을 지정한다. 1. AccessType.FIELD : 필드에 직접 접근한다. @Access(AccessType.FIELD) private String address1; 2. AccessType.PROPERTY : 프로퍼트로 접근한다. @Access(AccessType.PROPERTY) public String getAddress2() { return address1 + address2; } 3. AccessType 이 지정되지 않은 경우는 @Id 위치에 따라 지정된다. @Entity public class OrderInfo { @Id private Long id; private String address1; @Transient private String addres.. 2022. 6. 3.
728x90
반응형