3년만에 Genesis G70에서 BMW M340i로 기변을 하기까지

어릴때부터 기계를 좋아했다. 레고도 그냥 레고가 아니라 각종 센서와 엑츄에이터들을 결합하여 직접 상황을 인식하고 코딩하고 움직이기까지하는 그런 레고 말이다.어른이 되고 나서는 관심이 자연스레 차로 가게되었다. 자차가 없기에 쏘카나 그린카같은 단기 렌트 플랫폼에만 가져다 바친돈은 족히 몇백은 될것 같다. 나에게 자동차는 대부분의 사람들이 생각하는 운송수단이 아닌 일종의 머신(?) 개념이였다. 한 3년쯤 그렇게 지냈을까. 일도 열심히 다니고 좋은 조건으로 이직하며 자차에 눈을 들이게 되었다. 내 생애 첫차 Genesis G70사실 당시 나이가 23살에 불과했기에 외제차는 무리가 있었지만, 단순히 움직이기만 하는 차로는 만족이 안됐기에 고성능 세단인 G70이나 스팅어로 적당히 타협을 봤고 역시 후회하지는 않았..

SSR(Server-Side Rendering)의 장점과 단점

SSR(Server-Side Rendering)은 클라이언트와 서버의 역할을 분담하여 페이지를 렌더링하는 방식입니다. 이 방식은 다음과 같은 장단점이 있습니다. 장점: 초기 로딩 시간이 빠름 SSR은 서버에서 이미 페이지를 렌더링했기 때문에 초기 로딩 시간이 빠릅니다. 이는 사용자가 페이지를 보기 위해 기다리는 시간을 줄여주어 사용자 경험을 향상시킵니다. 검색 엔진 최적화(SEO) SSR은 서버 측에서 페이지를 렌더링하기 때문에 검색 엔진이 페이지의 콘텐츠를 잘 인식할 수 있습니다. 이는 검색 엔진 최적화를 위해 중요한 요소입니다. 보안성이 높음 SSR은 서버에서 페이지를 렌더링하기 때문에 보안성이 높습니다. 클라이언트에서 보안을 처리할 필요가 없기 때문입니다. 코드 유지 보수가 용이함 SSR은 클라이언..

CSR(Client-Side Rendering)과 SSR(Server-Side Rendering)의 차이점은 무엇인가?

CSR(Client-Side Rendering)과 SSR(Server-Side Rendering)은 모두 웹 애플리케이션의 페이지 렌더링 방식을 의미합니다. 하지만 두 방식은 다음과 같은 차이점이 있습니다. 클라이언트와 서버의 역할 분담 CSR은 클라이언트 측에서 동적으로 페이지를 렌더링하는 방식으로, 서버는 필요한 자원을 클라이언트에게 전달하는 역할만 수행합니다. 반면에 SSR은 서버 측에서 동적으로 페이지를 렌더링하고, 클라이언트는 렌더링된 페이지를 전달받아 화면에 표시하는 역할을 수행합니다. 초기 로딩 시간 CSR은 초기 로딩 시간이 느리다는 단점이 있습니다. 이는 클라이언트가 페이지를 렌더링하기 위해 필요한 자원을 모두 다운로드하고 초기화하는 시간이 필요하기 때문입니다. 반면에 SSR은 서버에서 ..

SSR(Server-Side Rendering)이란 무엇인가?

SSR(Server-Side Rendering)은 서버 측에서 동적으로 HTML 페이지를 생성하여 클라이언트에게 전달하는 기술입니다. 이는 클라이언트 측에서 동적으로 페이지를 렌더링하는 CSR(Client-Side Rendering)과는 대조적인 방식으로 작동합니다. SSR은 웹 애플리케이션의 성능을 개선하는 데 도움이 되며, 특히 초기 로딩 시간을 단축하여 사용자 경험을 향상시킵니다. 이는 클라이언트가 페이지를 렌더링하기 위해 필요한 자원을 다운로드하고 초기화하는 데 필요한 시간을 줄여줍니다. 또한 SSR은 SEO(Search Engine Optimization) 측면에서도 이점을 제공합니다. 검색 엔진은 페이지의 콘텐츠를 읽어들이기 위해 HTML 코드를 스캔하는데, CSR에서는 초기 페이지 로딩 시점..

클레이튼 대납 기능 구현하기 - klaytn fee delegation

가스비? Web3에서는 생소할수도 있는 가스비 라는 개념이 있다. 블록체인 네트워크에 특정 action(송금, 민팅 등)을 실행시키고, 검증시키는 댓가로 일정한 수수료(가스비)를 낸다. 보통 수수료하면 1,000원, 2,000원 정도를 생각할 수 있다. 하지만 블록체인, 특히 이더리움 같은 경우는 민팅시 사람들이 많이 몰려서 몇십만원 까지 수수료를 낸적도 있었다. 상품가격 보다 수수료가 더 비싸지는 기이한 현상이 발생한 것 이다. 아더디드 NFT를 구매하기 위해 ETH 가스비를 지불해야했는데, 구매 경쟁이 심해지면서 가스비가 최대 5ETH에 이르기도 하였음. 구매자들은 총 1억 2300만달러(약 1,550억원)를 가스비로 지불한것으로 알려졌다. https://twitter.com/yugalabs/stat..

리스트에서 랜덤으로 원소 뽑기 - python list random choices

import random selected = random.choice(someList) print(selected) 번외 확률을 가진 리스트에서 원소를 뽑는 방법이다. import random selected = random.choices( someList, # 원소 probabilityList # 원소의 확률 ).pop() print(selected)

Pillow 이미지처리 multiprocessing으로 성능 올리기

17+ 개의 PNG 레이어들을 랜덤으로 병합하여 10,000개의 이미지를 만들어내는 프로젝트를 진행중이다. 처음 single-thread 방식으로 구현하였을때 6시간이 걸리길래 식겁한 경험이 있다. 이를 단 20분으로 줄인 방법을 설명하고자 한다. 다음은 Pillow 라이브러리를 이용해 이미지 레이어를 합성하는 예시이다. def merge_image_layer(self, trait): image_layer_path = self.parse_image_directory(trait) # layer PNG image directories stack = Image.new('RGBA', (self.width, self.height)) # create new image canvas for layer, path in ..

vue sass global import - Sass 사용시 중복으로 import 안하도록 하는 방법

흔히 scss 작성시 다음과 같이 import 하여 사용한다. @import "./variables.scss"; * { margin: 0; padding: 0; color: $primary-color // variables.scss내에 선언된 변수 } 한두번은 괜찮지만 컴포넌트가 10개...100개...1000개 라면? 코드 한줄 한줄 줄이는건 우리에겐 소중하니까... 다음과 같이 설정해주자 // vue.config.js module.exports = { css: { loaderOptions: { sass: { prependData: ` @import "@/style/variables.scss"; `, }, }, }, }; 이제 다른 컴포넌트에서 자유롭게 사용하자 // exampleComponent.js..