All posts by yceffort

with more effoooooooooort

[edX] Microsoft’s DAT210x – Programming with Python for Data Science 완료

번갯불에 콩 구어 먹듯이 완료한 강의.

새해 기념이랍시고 시작했다가, 결혼준비의 압박 & 각종업무의 압박 & 서비스 오픈의 압박 등 각종 압박에 시달리다가 간신히 다 들었다.

물론 이렇게 급하게 들을 만한 일정은 아니었지만, 얼른 듣고

이걸 듣고 싶은 마음이 간절하여 빠르게 클리어하게 됐다.

기존에 다른 강의들과 크게 다를 건 없었지만, 그래도 짜임새나 강의의 질이 상당히 좋았다.

어느정도 Python을 알고 머신러닝을 알고 있다면 추천하고 싶다.

 

 

 

[Mysql] varchar(256) vs varchar(255)

DB컬럼의 변경을 위해서 무의식적으로 varchar(256)을 신청을 했는데, DB관리자로 부터 다음과 같은 이야기를 들었다.

“정말로 긴 글자를 저장하셔야 하는 상황이라면 varchar(256) 대신 varchar(255) 로 처리가 가능하신지도 문의드립니다.
255 와 256은 mysql 내부적으로 차이가 큽니다.”

음 그래요? 무슨 차이 일까?

 

DBMS는 내부에서 varchar타입을 저장할때, 그 데이터의 길이도 저장하는데, 255 까지는 이 길이를 저장하는데 single byte가 필요하다.

그러나 256 혹은 그 이상이 되는 순간, two byte 가 필요하게 되면서 더 많은 디스크 점유를 발생시킨다.

덧붙여, 오라클을 제외한 대부분의 DBMS는 NULL 과 빈 string 을 의도적으로 구별하는데, 이 역시 varchar컬럼이 더 많은 공간을 차지하게 되는 원인이 된다.

 

출처 (stackoverflow.com/a/2340662)

[Angular2 + HammerJS] Swipe시 스크롤이 안되는 문제 (Scrolling disabled on Hammer.js Swipe element?)

Angular2에서 swipe를 구현하기 위해 hammerJS를 사용했다.

자세한 사용법은 하단에 나와있으니 참고하면 좋다.

근데 한가지 문제가 발견됐는데, Swipe를 사용하는 영역 위에서는 페이지 스크롤이 안될수도 있다는 것이다.

문제는 저 샘플에서도 스크롤이 안된다는 것(…)

export class MyHammerConfig extends HammerGestureConfig  {
  overrides = <any>{
      'swipe': {velocity: 0.4, threshold: 20} // override default settings
  }
}

이부분에서 HammerGestureConfig를 customize화 시킬 필요가 있다.

declare var Hammer: any;

import {Inject, Injectable, OpaqueToken} from "@angular/core";

export const HAMMER_GESTURE_CONFIG: OpaqueToken = new OpaqueToken("HammerGestureConfig");

export interface HammerInstance {
  on(eventName: string, callback: Function): void;
  off(eventName: string, callback: Function): void;
}

@Injectable()
export class HammerGestureCustomConfig {
  events: string[] = [];
  overrides: { [key: string]: Object } = {};

  buildHammer(element: HTMLElement): HammerInstance {
    let mc = new Hammer(element, {
      touchAction: "pan-y",
    });
    return mc;
  }
}

이런식으로 touchAction을 pan-y를 주면된다. swipe에 대한 기본 값은 pan-x다. touchAction에 대한 자세한 내용은 여기를 참고하면 된다.

auto 로 주는 것도 가능하지만, auto로 설정할 경우,  swipe를 대각선으로 하면 페이지 스크롤도 동시에 일어나서 보기에 매끄럽지가 않다.

 

이 문제 때문에 anuglar2, hammerjs github 등에 이슈로 올라오거나 stackoverflow에 질문이 많았다.

그러나 변변한 답을 못찾아 고생을 했는데, 정답은 역시 document에 있다. 늘 그런건 아니지만.

AWS에서 닷홈으로 호스팅 이전 완료

Aws의 FreeTier가 끝나가고, 트래픽이 증가해서 돈이 줄줄 새고 있는 관계로 Aws에서 옛날 부터 쓰던 닷홈으로 이동했습니다.

어려운 작업이 될 것이라 생각했는데, 생각보다 문제 없이 금방 끝나서(?) 다행입니다.

혹시 이런 작업을 하실분이 있을지 모르겠지만

 

Route 53에서 등록된 도메인만 변경해주면 됩니다. (너무 당연한건가…)

도메인은 동일했기 때문에 (yceffort.com에서 주소를 옮긴건 아니기 때문에) 그저 ftp로 덤프를 뜨는 형식으로 진행해도 수월했습니다.

혹시 호스팅 이전을 고려하시는 분들이 있다면 duplicator plugin 사용을 추천해드립니다.

[Angular2] DOMSanitizer by Pipe

innertHTML등으로 string의 내용을 html DOM 에 바인딩 할때,  스크립트 공격 등을 방어하기 위해 Angular2는 DOMSanitizer를  제공한다.

이를 pipe형태로 간단하게 템플릿에서 사용하기 위해 아래와 같이 처리했다.

import {Pipe, PipeTransform} from "@angular/core";
import {DomSanitizer} from "@angular/platform-browser";

@Pipe({name: "safeHtml"})
export class SafeHtmlPipe implements PipeTransform {
    constructor(private sanitized: DomSanitizer) {
    }

    transform(value: string) {
        return this.sanitized.bypassSecurityTrustHtml(value);
    }
}

@Pipe({name: "safeCss"})
export class SafeCssPipe implements PipeTransform {
    constructor(private sanitized: DomSanitizer) {
    }

    transform(value: string) {
        return this.sanitized.bypassSecurityTrustStyle(value);
    }
}

@Pipe({name: "safeScript"})
export class SafeScriptPipe implements PipeTransform {
    constructor(private sanitized: DomSanitizer) {
    }

    transform(value: string) {
        return this.sanitized.bypassSecurityTrustScript(value);
    }
}

@Pipe({name: "safeResourceUrl"})
export class SafeResourceUrlPipe implements PipeTransform {
    constructor(private sanitized: DomSanitizer) {
    }

    transform(value: string) {
        return this.sanitized.bypassSecurityTrustResourceUrl(value);
    }
}