CategoryTips/ETC (32)

뽀모도로 기법 - Pomodoro Technique

뽀모도로 기법 - Pomodoro Technique뽀모도로란 이탈리아어로 토마토를 뜻한다. 토마토가 들어간 파스타 요리로 우선 다음과 같은 재료를 준비한다.뽀모도로는 집중력 향상을 위한 시간 관리 방법론이다.프란체스코 시릴로(Francesco Cirillo)가 제안한 방법으로 개념은 간단하다.작업 흐름25분 동안 무언가에 집중한다. (절대 집중, 인터럽트는 없어야 한다!)이렇게 한 번 하면 1 Pomodoro이다.이후 5분 쉰다.4 Pomodoro를 채울 때 마다 30분 쉰다. 주의사항시간은 꼭 25분 고정적이지 않다. 유동적으로 설정할 수 있다.작업시간 전에 해당 작업을 마쳤더라도 남은 시간 동안 작업에 대해서 다시 점검하기를 권한다.만약 정해진 시간에 하나를 마치고 다른 작업으로 전환하고 싶다면 중간..

프로그래밍 언어들의 간단한 특징

프로그래밍 언어들의 간단한 특징개발자들은 많은 프로그래밍 언어를 마주하고 있다.당장 우리가 쓰는 언어만 해도 어려운데 영어, 중국어, 일본어, 스페인어를 배워야 한다면? 아니, 당장 학교 다닐 때를 생각해보라 제2 외국어 정하는데도 심사숙고하지 않는가?그렇다. 우리에게 닥친 이 선택은 너무나 가혹하다.정말 다행인 건 프로그래밍 언어의 경우 전체적인 개념은 다를지언정 기초적인 부분이 어느 정도 비슷하다는 것이다. (변수의 할당과 사용이라든지...)각설하고, 갑자기 막노동을 나가더라도 적어도 연장의 쓰임은 알아야 할 것 아닌가?앞으로 밥벌이할 때 사용 하게 될 언어들의 간단한 특징을 한번 살펴보도록 하자. Bash Bash(Bourne Again Shell)는 Shell 명령어를 자동화하는 데 가장 많이 사..

예제를 통해 보는 간단한 자바스크립트 정규표현식

목차목차간단한 예제를 통해 보는 자바스크립트 정규 표현식정규표현식이란?자바스크립트에서 정규표현식 사용하기.exec과 match의 차이반복?+*예외문자길이를 지정하기.[]^ (Negative)캡쳐링 그룹(?:그룹)대괄호의 축약형Flagg - Global Flagi - Ignore Casem - Multi Line마치며참고간단한 예제를 통해 보는 자바스크립트 정규 표현식제목에 자바스크립트는 이 포스트에서 자바스크립트를 사용해 예제를 만들었다는 의미다. 여기서 설명하는 정규표현식은 다른 언어에서도 똑같이 사용할 수 있다. 정규표현식이란?정규표현식(正規表現式, Regular Expression)은 문자열을 처리하는 방법 중의 하나로 특정한 조건의 문자를 '검색'하거나 '치환'하는 과정을 매우 간편하게 처리할 수..

[ETC] 구글 크롬 개발자도구 속도개선

크롬 개발자 도구 느려짐 개선어느날 부터 크롬 개발자도구 속도가 진짜 심각하게 느려졌습니다.크롬에서 뭔가 개선하면서 잘못됐거나 현재 작업중인 페이지의 엘리먼트가 너무 많아서 생기는 문제라고 생각하고 대수롭지 않게 사용하고 있었습니다.그런데 저만이 아니고 옆 자리에 동료도 같은 문제를 얘기했고 해결책을 찾았습니다.문제는 바로 Ahnlab Safe Transaction 였습니다.네... 황당하지만 회사컴퓨터로 은행업무 할 때 깔린 것 같습니다.제어판으로 들어가서 제거 후, 크롬 종료 후 재시작 하니 다시 빨라졌네요..!저는 이걸 찾아볼 생각도 못하고 있었다보니.. 우연히 보신분들이 알아채서 이 문제를 해소할 수 있게 포스트로 작성해야겠다는 생각이 들었습니다.개선 방법프로그램 추가제거 - Ahnlab Safe..

[ETC] .NET Fiddle - 브라우저에서 써보는 .NET 프레임워크

.NetFiddlefiddle이 무엇일까요? 사전을 보시면 fiddle 미국·영국 [|fɪdl] 영국식 중요 (특히 지루하거나 초조해서) 만지작거리다2. (세부 사항을) 조작하다 바이올린을 켜다 라고합니다.. 저희가 알아보려는건 1번에 더 가깝겠네요많은 웹개발자분들은 fiddle하면 jsFiddle 이 떠오르실 겁니다.간단한 HTML, CSS, Javascript를 테스트하고 디버깅하기에는 정말 최고의 기능을 제공하는 웹사이트라고 생각합니다.jsFiddle에 대한 자세한 사용 방법은 생활코딩에도 소개 되어 있어서 이에대해 더 관심이 있으신 분은 아래 링크로 가셔서 보시면 많은 도움이 될 것입니다.생활코딩 jsfiddle소개 바로가기각설하고 제가 지금 소개 하려는건 사이트는 .Net 기반으로 위와같이 간단..

[ETC] 당신은 jQuery가 필요하지 않을 수도 있습니다 - You Might Not Need jQuery

자바스크립트 Native API? jQuery가 훨씬 편해요. 하지만.. jQuery는 분명 간단하고 좋은 라이브러리입니다. 하지만 그 편안함에 익숙해져 무분별하게 사용되기도 합니다. 예를들면 간단한 기능을 수행하는 페이지가 있습니다.버튼을 클릭하면 해당 버튼의 값이 바뀌는 기능입니다. var elem = $('#btn'); //id가 btn인 요소 elem.val('click!'); //해당 요소에 사용되는 jQuery는 요소 셀렉터와 값변경 정도일 것입니다. 위 코드는 물론 보기에도 편하고 이해하기도 쉽지만, 이는 마치 나무가지를 하나 자르는데 전기톱을 가져와서 썰어버리는 모습을 연상 시킵니다. 말인 즉 만약 저 기능을 자바스크립트 native API로 구현한다면 불필요하게 jQuery 라이브러리를 ..

[ETC] highlight.js for HarooPad and Markdown-Here

highlight.js? 자바스크립트로 만들어진 코드 구문 강조 라이브러리 입니다. 거의 모든 마크업에서 작동하고 자동 언어 감지 기능을 가지고 있습니다. 공식사이트 꾸준히 업데이트가 이루어 지고 있습니다. (Language, Style 등) 라이브러리이기 때문에 어디든 추가 하여 사용 가능합니다. 하지만 이 포스트는 설치가 아닌 하루패드와 Markdown-Here에 대해서 다루고 있으므로 설치 관련해서는 아래 블로그를 참조 부탁드리겠습니다. WEBDRI - highlight.js 하루패드, Markdown-Here에서의 Highlight.js 하루패드와 Markdown-Here는 모두 코드 구문강조를 지원하며, 둘 다 Highlight.js 라이브러리를 사용하고 있습니다. 하루패드 코드 구문 강조 문서..

[ETC]에버노트에서 하루패드로

불편함으로 다가온 에버노트의 변경점한달전 에버노트가 크게 변경될 것이라는 예고와 함께 메일이 왔었습니다.그 후 한달동안 신경 안쓰고 있었는데.. 포스트 작성을 위해서 접속을 해보니 웬걸 미묘한 변화가 느껴집니다.에버노트가 기기 제한 2개가 생기고 기존에 베타로 제공하던 기능이 기본적으로 작동하게 패치가 되었습니다.기기 제한은 회사 컴퓨터 집 노트북만 쓰면되지 사실 그렇게 큰 문제는 아니였습니다.문제가 된건 새로운 기능이었습니다.마크다운 문법에 따라 자동치환 해주는 기능인데 에버노트에서 Markdown-Here(크롬플러그인)을 연동해서 쓰는 저에게는 엄청 큰 불편함이 느껴지더군요.그런 이유로 미련을 버리고 새로운 마크다운 에디터를 찾아 떠나게 되었습니다.하루패드한국인 개발자가 개발한 마크다운을 제공하는 텍..

[ETC] Brush.js - Canvas를 간단하게 사용하자

Canvas란간단하게 설명하자면 HTML5의 canvas는 그래픽들을 위한 컨테이너 입니다. 선, 사각형, 원, 문자, 이미지 등을 추가하는 메서드를 지원하며, canvas엘리먼트를 정의 후 자바스크립트를 이용하여 그림을 그려줍니다. html에 다음과 같이 정의 합니다. 도형 등은 자바스크립트를 이용하여 그려 줄 수 있습니다. w3s html5_canvas 하지만 급하게 canvas를 사용하고 싶거나 애니메이션을 적용하고 싶을 경우 처음부터 공부해야 하는 어려움이 있습니다. 그럴 때 아래에서 소개할 오픈소스 라이브러리를 사용하여 빠르게 내 사이트에 적용 시킬 수 있습니다. Brush.jsBrush.JS 소개 Brush.js는 canvas 사용을 도와주는 라이브러리 입니다. 간단한 그리기를 비롯해 애니메이..

[ETC] Heroku Push 시, Username/Password 입력 무반응

Heroku Push 안되는 현상Mac환경에서 작업하여 Heroku에 Push할때는 별 이상없는데, 회사에서 수정해볼까 하고 소스를 받아서 수정 후 git push heroku master를 해보니 username, password를 입력하라고 뜹니다.C:\heroku>git push heroku master Username for 'https://git.heroku.com': Password for 'https://gnin@git.heroku.com': 처음보는 문구에 당황하긴 했지만 우선 입력해 보았습니다.remote: ! WARNING: remote: ! Do not authenticate with username and password using git. remote: ! Run `heroku l..

[ETC] 초고속 코딩도구 Emmet, SublimeText에서 사용하기

Emmet초고속 코딩 도구! 이름이 거창합니다. 하지만 아래 주소로 가셔서 사용 데모를 보시면 왜 초고속인지 이해가 되실거라 믿습니다. Emmet 공식 사이트간단하게 설명하자면 CSS 셀렉터를 이용하여 HTML코드로 변경하는 도구입니다.이 외에도 수많은 기능이 있으며 아래에서 설명하겠습니다. 이 포스트의 목적은 제가 작업중에 생각이 안날 때 쉽게 찾기 위함이었으나, 간단한 기능적 설명도 달아서 기능을 모르셔도 한번 봐두시면 도움이 될 것 입니다.설치하기package control을 이용하여 설치하겠습니다. 설치방법은 이전 포스트를 참조부탁드립니다.지난 포스트 보기Package Install에서 Emmet을 검색하여 설치합니다.Emmet의 경우 설치 후 Sublime Text의 재시작이 필요합니다. 재시작..

[ETC] Webpack에서 NODE_ENV 사용하기 및 Heroku 환경변수 설정

Heroku에 작업물을 올리고 빌드를 했더니 오류가 발생한다.디버그 해보니 로컬에서 작업할 때 사용한 NODE_ENV 환경변수를 webpack에서 빌드 후에 제대로 불러오지 못하고 있었다. process.env.NODE_ENV를 사용하기 위해서 webpack definePlugin 기능을 사용하였고 말끔하게 해결됐다.DefinePlugin 사용WebPack Config에 아래와 같이 설정을 추가해 주자module.exports = [{ plugins: [ new webpack.DefinePlugin({ 'process.env': { 'NODE_ENV': JSON.stringify(process.env.NODE_ENV) } }) }] 위 플러그인을 추가해주고 다시 빌드 하니 정상적으로 동작하는걸 확인 할 ..