하수도키의 성장일기

재테크일기/니콜라(NIKOLA)

[미국주식] 니콜라(NIKOLA)주식 알아보기(티커:NKLA)

이번에는 말도 많고 탈도 많은 니콜라에 대해 알아볼게요. 가장 이슈가 될때는 이런 문구로 사람들의 이목을 끌었죠. 제2의 테슬라를 꿈꾸는 수소 트럭 스타트업 기업 니콜라 전기차는 테슬라, 수소차는 니콜라 니콜라는 수소 트럭차 니콜라 원(NIKOLA ONE)을 2015년도에 공개하면서 수소차를 바탕으로 수소 충전소도 만들 계획도 있고 최종적으로 수소 플램폿을 구축한다고 합니다. 아직 트럭을 1대로 팔지 못했지만 뛰어난 주요 투자자의 지원으로 수소 1회 충전으로 약 1920km 운행할 수 있는 수소트럭, 전기배터리 트럭 등을 개발하고 유럽을 겨냥중입니다. 니콜라는 6월 4일 상장 후 첫 거래일을 33.75달러로 마감했지만, 상장 후 4일만에 93.99달러까지 갔습니다. 약 4일만에 3배에 가까운 상승률을 기..

개발일기/Web

CDN(Contents Delivery Network) 개념 살펴보기(웹 최적화)

CDNs(Content delivery networks)에 대해 알아보자 AWS CloudFront를 사용중인데 CDN, 캐쉬 관련해서 대략적인 개념만 알고 있는 상태다. 웹 최적화를 검색하는 도중 CDN관련 내용이 있어 간단하게 정리하겠다. web.dev 여기 포스팅을 참고 했다. 개요 CDN은 분산된 서버 네트워크를 사용해 사용자들에게 리소스를 제공함으로써 사이트 성능을 향상시킨다. CDN은 서버 부하(서버 로드)를 줄이기 때문에, 서버 비용을 절감하고, 트래픽 급증(traffic spkies) 처리에 적합하다. 이 포스팅은 CDN이 작동하는 법, CDN 설정 최적화, 플랫폼을 고르는법과 설정하는 법을 알려준다. CDN은 캐시 된 컨텐츠를 제공하는 걸로 잘 알려져 있지만, 캐쉬 할수 없는 컨텐츠를 제..

개발일기/알고리즘

알고리즘 빅 오 표기법 살펴보기

알고리즘 빅 오 표기법 살펴보기 개요 알고리즘을 문제 은행에서 푼 기억은 있어도 알고리즘에 대해 공부한 적이 없어서 이 참에 공부하면서 정리하기로 마음 먹었습니다. 어려운 내용은 제가 이해를 못하니 간단하게 한번 살펴 보겠습니다. 처음으로 살펴볼 내용은 빅 오 표기법입니다. 빅 오 표기법이란 시간 복잡도(알고리즘의 시간 효율성)를 쉽게 소통할 목적으로 자료 구조와 알고리즘의 효율성을 간결하고 일관된 언어로 설명하기 위해 수학적 개념을 차용했습니다. 이러한 개념을 형식화한 표현을 빅 오 표기법이라고 부릅니다. 지금 설명은 수학적 관점을 최대한 배제하고 있습니다.(아주 쉬운 버전) 빅 오: 단계 수 계산 O(1) "빅 오1", "차수 1"이라고 부르며, 오 1이라고 편히 부르겠습니다. O(1)은 데이터 크기..

개발일기/CSS

input, image 등에서 ::before 를 사용할 수 없는 이유?

input, image 등에서 ::before 를 사용할 수 없는 이유? 개요 CSS 작업하다보면 ::before, ::after 를 이용해서 처리할때가 있다. 하지만, 어떤 태그에서 작동이 안하는 경우가 있습니다. 이걸 한번 알아봅시다. ::before, ::after pseudo-elements(가상 요소)는 텍스트 입력하는 태그들과, 이미지 또는 영상을 보여주는 태그에는 사용할 수가 없다. 그 이유는 repalced elements(대체요소)때문이다, HTML 표준 렌더링 섹션에 특별한 카테고리에 자세한 설명이 있으니 참고하길 바랍니다. ,,,,,,, img,input,embed 는 가상요소가 될수도있고 대체요소가 될 수 있습니다. img 예제 // html // wrong img url // cs..

개발일기/Vue.js

[Vue.js] 토큰 기반 인증(#3. 사용자 등록)

2020/10/31 - [개발일기/Vue.js] - [Vue.js] 토큰 기반 인증 (#7. 자동 로그인) 2020/10/31 - [개발일기/Vue.js] - [Vue.js] 토큰 기반 인증 catch 사용 (#6. 에러 처리) 2020/10/30 - [개발일기/Vue.js] - [Vue.js] 토큰 기반 인증(#5. 유저 로그아웃) 2020/10/28 - [개발일기/Vue.js] - [Vue.js] 토큰 기반 인증(#4. 유저 로그인) 2020/08/30 - [개발일기/Vue.js] - [Vue.js] 토큰 기반 인증(#3. 사용자 등록) 2020/07/27 - [개발일기/Vue.js] - [Vue.js] 토큰 기반 인증(#2. 인증을 위한 프로젝트 구조 살피기) 2020/07/24 - [개발일기/Vu..

개발일기/Web

로컬에서 서브 도메인 활용하기(local sub domain)

로컬에서 서브 도메인 활용하기 개요 다국어 작업을 서브 도메인을 이용해야 되는데 로컬에서 테스트 하기가 애매해서 구글링 하다 발견한 내용을 정리했다. 이 포스팅은 엄청 간단하게 내가 이해한 내용을 바탕으로 쓸 예정이다. 아래는 이미지 1개정도 넣어야 될 것 같아 URL 구조 이미지를 추가했으니 참고!! 로컬에서 호스트 설정하기 windows 환경 CMD 커맨드 프롬프트를 관리자 권한으로 열고 아래 명령어를 입력한다. notepad c:\Windows\System32\Drivers\etc\hosts mac/Linxus 환경 mac/linxus 사용자는 sudo 권한으로 아래 명령어를 입력한다. sudo nano /etc/hosts 현재 mac을 사용하고 있으므로 mac 기준으로 설명할 텐데 크게 다른 점은..

개발일기/알고리즘

[알고리즘] 해쉬 위장(프로그래머스)

https://programmers.co.kr/learn/courses/30/lessons/42578 코딩테스트 연습 - 위장 programmers.co.kr 해쉬 위장 문제 - 알고리즘의 부족함을 느껴 짬이 날 때마다 알고리즘 연습을 하기로 마음먹었다. - 우선 한글로 된 프로그래머스를 통해 연습 중이다. 추후 영어 잘하고 실력이 향상되면 영문으로 된 다른 사이트의 문제들도 풀어볼 예정이다. 문제 설명 - 이미지로 대체한다. - 간략히 설명하면 얼굴, 상의, 하의, 겉옷의 경우의 수를 구하는 것이다. 내 풀이 1번째 function solution(clothes) { const initCount = clothes.length; const convertToObjectClothes = clothes.red..

개발일기/TypeScript

[TypeScript] 타입스크립트 시작하기

타입스크립트 시작하기 개요 타입스크립트는 새로운 언어보다는 자바스크립트의 상위집합(Superset)으로 이해하면 된다. 자바스크립트 파일을 .ts를 바꿔도 경고만 나오고 실행은 된다. 타입스크립트 파일(.ts)를 컴파일하면 자바스크립트 파일(.js)이 생성된다. 컴파일 시 타입체크를 한다. 타입스크립트의 가장 중요한 기능은 정적 타입이다. 자바스크립트는 지원하지 않고 있다. var state = 1; stae = "success"; 숫자형으로 할당된 변수에 문자열을 넣어도 에러가 발생하지 않는다. 간단하게 편하게 사용할 수 있으나, 프로젝트 규모가 커지고 관리해야될 변수가 많을 경우에는 오류가 발생하기 쉽다. 브라우저에서 타입스크립트를 자바스크립트로 바로 컴파일해준다.타입스크립트 플레이그라운드 타입스크립..

개발일기/Vue.js

[Vue.js] Vue 테스트 코드 작성하기(Jest)

Vue에서 Unit Test(단위테스트)를 해보자. 개요 vue를 통해 unit test를 살펴보자. vue-test-utils,jest를 사용할 예정이다. 테스트를 하는 이유는 자신감 증가, 퀄리티있는 코드, 잘 정리된 문서를 꼽을 수 있다. 테스트를 위한 세팅 터미널에서 아래 명령어를 입력 후 사진과 같이 설정한다. vue create unit-testing-vue 설치가 되고 package.json파일을 열면 아래 코드가 있는데 이걸로 테스트를 한다. "scripts": { ... "test:unit": "vue-cli-service test:unit" }, npm run test:unit tests/unit 폴더에 테스트할 파일을 넣는다. 첫번째 유닛 테스트(Data 업데이트 될때 UI 변경) 로..

개발일기/자바스크립트 코딩의기술 정리

자바스크립트 코딩의 기술(시리즈 8 - 클래스로 인터페이스를 간결하게 유지하라#2)

자바스크립트 코딩의 기술(시리즈 8 - 클래스로 인터페이스를 간결하게 유지하라#2) 자바스크립트 코딩의 기술 책을 읽고 복습 겸 정리하는 포스팅이다. 시리즈 1이 시작이며 시리즈 몇까지는 대지는 진행하면서 가늠잡아 보겠다. 개요 프로토타입이 조합된 자바스크립트 클래스를 살펴볼 예정이다. get과 set으로 인터페이스를 단순하게 만들어라. 제너레이터로 이터러블 속성을 생성하라 bind()로 문맥 문제를 해결하라 get과 set으로 인터페이스를 단순하게 만들어라. 이전 tip에서 클래스에 기본을 알아 보았다. 인스턴스 생성 속성과 메서드 호출 부모 클래스 확장(쌍속) 이번 tip에서는 get, set를 통해 비공개 속성처럼 사용해보기 클래스는 아래 코드처럼 속성에 접근하여 변경도 가능하다. 같이 협업하는 개..

개발일기/자바스크립트 코딩의기술 정리

자바스크립트 코딩의 기술(시리즈 8 - 클래스로 인터페이스를 간결하게 유지하라#1)

자바스크립트 코딩의 기술(시리즈 8 - 클래스로 인터페이스를 간결하게 유지하라#1) 자바스크립트 코딩의 기술 책을 읽고 복습 겸 정리하는 포스팅이다. 시리즈 1이 시작이며 시리즈 몇까지는 대지는 진행하면서 가늠잡아 보겠다. 개요 프로토타입이 조합된 자바스크립트 클래스를 살펴볼 예정이다. 읽기 쉬운 클래스를 만들어라 상속으로 메서드를 공유하라 클래스로 기존의 프로토타입을 확장하라 읽기 쉬운 클래스를 만들어라(TIP37) 자바스크립트에서 클래스를 작성하는 방법을 살펴보자. class Coupon { constructor(price, expiration) { this.price = price; this.expiration = expiration || "2주"; } } const coupon = new Coup..

개발일기/자바스크립트 코딩의기술 정리

자바스크립트 코딩의 기술(시리즈 7 - 유연한 함수를 만들어라)

자바스크립트 코딩의 기술(시리즈 7 - 유연한 함수를 만들어라) 자바스크립트 코딩의 기술 책을 읽고 복습 겸 정리하는 포스팅이다. 시리즈 1이 시작이며 시리즈 몇까지는 대지는 진행하면서 가늠잡아 보겠다. 개요 이 장에서는 함수의 사용법을 다룰 예정이며, 기본기는 다루지 않을 예정이다. 테스트 가능한 코드 작성법 화살표 함수의 매개변수에 대한 개념 함수를 반환하는 고차함수와 재사용 가능한 함수 화살표 함수의 문맥 개념 테스트하기 쉬운 함수를 작성하라(TIP32) 테스트를 작성하면 코드를 쉽게 리팩토링 가능 오래된 코드를 쉽게 이해 가능 마지막으로 명확하고 버그가 적은 코드를 작성 가능 위와 같은 장점들이 있지만 현실을 테스트를 작성하는것 쉽지 않다.(테스트 작성의 어려움, 코드가 외부 의존성이 강하게 결합..