[Javascript] How to Become a Great JavaScript Developer

번역 사이트

자바스크립트도 굉장히 매력적인 언어라 공부할 수 있는 방법을 정리해봤습니다.

[요점정리]

1. 책읽기

  • JavaScript: The Good Parts by Douglas Crockford
  • JavaScript: The Definitive Guide, 6th Edition be David Flanagan
  • Secrets of the JavaScript Ninja by John Resig’s

2. 라이브러리 배우기, 사용하기, 읽기

  • jQuery
  • Backbone (recommended)
  • Underscore

3. 연습하고, 스스로에게 질문하기

  • Closures
  • Prototypes
  • Array Extras(Map, Filter)
  • Prototype을 사용한 상속은 어떻게 동작하는가?
  • Closure의 정의는 무엇인가?
  • this 키워드 의미는 어떻게 변하는가?
  • apply/bind/map/filter/call은 어떻게 사용하는가?

[질문]

"bind를 두번 썼을 때, `this`는 무엇을 의미하는가? 어떻게 jQuery는 `this` 키워드를 전역 object가 아닌 jQuery Object로 만드는가?

4. 표준 배우기

5. 웹에 있는 자료 활용

오픈소스 파일별 라인수

집에서 동영상으로 코딩 가이드에 대한 강좌를 보는 과정중에 재미난 내용이 있어 python을 사용해서 분석해 보았습니다.

해당 동영상에 나온 내용은 빠른 시일내에 블로그에 정리해서 올릴려고 합니다. 좋은 내용들이 많아서…

프로그래밍 가이드에는 왜 한 라인에 80자만 사용하라고 하는 것인가?

동영상 강좌에 나온 내용으로는 예전 환경은 콘솔 + 작은 모니터 + IDE없는 이어서 한 줄에 80라인을 넘기면 보기가 어려워서 그렇다고 설명을 하였습니다.

그러면서 나온게 최근에 사용되는 오픈소스 프로젝트인 JUnit, Ant와 몇몇가지를 예를 들어 최근에는 80자가 넘는 소스들도 많이 있다고 하였습니다.

그렇지만 한 줄에 너무 많은 글자를 쓰면 가독성이 떨어진다고 단지 좌우스크롤이 안될 정도로만 하라고 설명하셨습니다.

분석

그렇다면 제가 자주 사용하는 라이브러리들은 한 줄에 어느정도의 평균 글자수 와 한 파일에 몇라인이 포함되어 있는지 확인을 해보았습니다.

분석은 소스 폴더에 포함된 java로 확장자를 가지는 파일을 대상으로 하였습니다.

[분석도구]

  1. python 2.7
  2. matplotlib
  3. OSX(Yosemite)

[분석대상]

  1. commons-lang
  2. commons-net
  3. Ant
  4. Open JDK7

결과

결과는 어느정도 예상한대로 commons-lang 과 commons-net의 경우는 평균 100자를 넘지 않는 수치가 나왔습니다. 그렇지만 의외로 open-jdk7에서 평균 400자를 넘는 파일이 있어 확인을 해보니 그럴만한 이유가 있었습니다. 기타 참조

commons-lang

commons-lang_result

commons-net

commons-net_result

open-jdk7

jdk_result

분석 소스

import os
import fnmatch
import matplotlib.pyplot as plt

class FileVO:
def __init__(self, filename, file_size, line_of_file, avg_char):
self.file_size = file_size
self.line_of_file = line_of_file
self.avg_char = avg_char
self.filename = filename

def __str__(self):
return '%-20s / size=%5d, line=%5d, chars(AVG)=%5d' % (self.filename, self.file_size, self.line_of_file, self.avg_char)

if __name__=='__main__':
matches = []
source_path = '/Users/coozplz/Downloads/sources/src-jdk'
for root, dirnames, filenames in os.walk(source_path):
for filename in fnmatch.filter(filenames, '*.java'):
found_file = os.path.join(root, filename)
file_size = os.path.getsize(found_file)
js_file = open(found_file)
lines = js_file.readlines()
sum_of_chars = 0
for line in lines:
sum_of_chars += len(line)
vo = FileVO(filename, file_size, len(lines), sum_of_chars / len(lines))
# print vo
matches.append(vo)
js_file.close()

plt.title("%s(%d files)" % (source_path, len(matches)))
for match_file in matches:
plt.scatter(match_file.line_of_file, match_file.avg_char)
plt.ylabel("Average chars of line")
plt.xlabel("Lines per file")
plt.grid()
plt.show()

기타

평균글자수가 가장 많은 파일 : launcher.java
아래와 같은 코딩이 되어 있어 평균 글자수 길이가 비약적으로 많이 나오는거 같습니다. 나머지 파일들도 마찬가지라고 생각합니다.

소스코드

package sun.launcher.resources;

import java.util.ListResourceBundle;

public final class launcher extends ListResourceBundle {
protected final Object[][] getContents() {
return new Object[][] {
{ "java.launcher.X.macosx.usage", "nThe following options are Mac OS X specific:n -XstartOnFirstThreadn run the main() method on the first (AppKit) threadn -Xdock:name="n override default application name displayed in dockn -Xdock:icon=n override default icon displayed in docknn" },
{ "java.launcher.X.usage", " -Xmixed mixed mode execution (default)n -Xint interpreted mode execution onlyn -Xbootclasspath:n set search path for bootstrap classes and resourcesn -Xbootclasspath/a:n append to end of bootstrap class pathn -Xbootclasspath/p:n prepend in front of bootstrap class pathn -Xdiag show additional diagnostic messagesn -Xnoclassgc disable class garbage collectionn -Xincgc enable incremental garbage collectionn -Xloggc: log GC status to a file with time stampsn -Xbatch disable background compilationn -Xms set initial Java heap sizen -Xmx set maximum Java heap sizen -Xss set java thread stack sizen -Xprof output cpu profiling datan -Xfuture enable strictest checks, anticipating future defaultn -Xrs reduce use of OS signals by Java/VM (see documentation)n -Xcheck:jni perform additional checks for JNI functionsn -Xshare:off do not attempt to use shared class datan -Xshare:auto use shared class data if possible (default)n -Xshare:on require using shared class data, otherwise fail.n -XshowSettings show all settings and continuen -XshowSettings:alln show all settings and continuen -XshowSettings:vm show all vm related settings and continuen -XshowSettings:propertiesn show all property settings and continuen -XshowSettings:localen show all locale related settings and continuennThe -X options are non-standard and subject to change without notice.n" },
{ "java.launcher.cls.error1", "Error: Could not find or load main class {0}" },
{ "java.launcher.cls.error2", "Error: Main method is not {0} in class {1}, please define the main method as:n public static void main(String[] args)" },
{ "java.launcher.cls.error3", "Error: Main method must return a value of type void in class {0}, please ndefine the main method as:n public static void main(String[] args)" },
{ "java.launcher.cls.error4", "Error: Main method not found in class {0}, please define the main method as:n public static void main(String[] args)" },
{ "java.launcher.ergo.message1", " The default VM is {0}" },
{ "java.launcher.ergo.message2", " because you are running on a server-class machine.n" },
{ "java.launcher.init.error", "initialization error" },
{ "java.launcher.jar.error1", "Error: An unexpected error occurred while trying to open file {0}" },
{ "java.launcher.jar.error2", "manifest not found in {0}" },
{ "java.launcher.jar.error3", "no main manifest attribute, in {0}" },
{ "java.launcher.opt.datamodel", " -d{0}t use a {0}-bit data model if availablen" },
{ "java.launcher.opt.footer", " -cp n -classpath n A {0} separated list of directories, JAR archives,n and ZIP archives to search for class files.n -D=n set a system propertyn -verbose:[class|gc|jni]n enable verbose outputn -version print product version and exitn -version:n require the specified version to runn -showversion print product version and continuen -jre-restrict-search | -no-jre-restrict-searchn include/exclude user private JREs in the version searchn -? -help print this help messagen -X print help on non-standard optionsn -ea[:...|:]n -enableassertions[:...|:]n enable assertions with specified granularityn -da[:...|:]n -disableassertions[:...|:]n disable assertions with specified granularityn -esa | -enablesystemassertionsn enable system assertionsn -dsa | -disablesystemassertionsn disable system assertionsn -agentlib:[=]n load native agent library , e.g. -agentlib:hprofn see also, -agentlib:jdwp=help and -agentlib:hprof=helpn -agentpath:[=]n load native agent library by full pathnamen -javaagent:[=]n load Java programming language agent, see java.lang.instrumentn -splash:n show splash screen with specified imagenSee http://www.oracle.com/technetwork/java/javase/documentation/index.html for more details." },
{ "java.launcher.opt.header", "Usage: {0} [-options] class [args...]n (to execute a class)n or {0} [-options] -jar jarfile [args...]n (to execute a jar file)nwhere options include:n" },
{ "java.launcher.opt.hotspot", " {0}t is a synonym for the "{1}" VM [deprecated]n" },
{ "java.launcher.opt.vmselect", " {0}t to select the "{1}" VMn" },
};
}
}

[Mac] 유선 마우스(Mighty Mouse) 휠 동작 문제

갑자기 마우스가 동작 안된다면?

오늘 오후 잘되던 마우스가 휠이 아래로 내려가지 않는 문제가 발생.
가격이 싼 제품이 아니기 때문에 마음이 굉장히 상했지만 구글 검색으로 해결.
[출처] http://macintoshhowto.com/hardware/how-to-fix-the-scroll-wheel-on-your-apple-mighty-mouse.html

방법

  1. A4용지 한장을 준비
  2. 마우스 휠 위에 A4 용지를 덮음
  3. 휠 버튼 클릭
  4. (위, 아래, 좌, 우) 와 같이 원하는 방향으로 스크롤

저는 위와 같이 하니 정상적으로 되었습니다. 추가적으로 비용이 발생되지 않아 더욱 행복했던…

[잡담] Angular.js ??….

최근 웹페이지 처리와 관련된 부분의 업무를 하다보니 Javascript 관련 기술들을 자주 검색하게 됩니다. 그중에 Bootstrap, Angular.js 등 여러가지 프레임웍이 요즘에 많이 사용되고 있는거 같습니다.

검색을 해보니 2009년에 최초 릴리즈 되었다고 위키피디아에 나와있습니다.[참조]

헐… 벌써 5년이 지났군요. 국내에서 angularjs 를 얼마나 실무에 적용되고 있는지는 제가 직접 참여하지 않아서 잘은 모릅니다.
저의 2년뒤 목표는 기술 이민을 하는 것입니다.
그래도 이민을 하려면 어떤 기술들이 현지에서 잘 취직이 되는가에 대한 꾸준한 리서치가 필요로 하겠죠…
그래서 호주 구인사이트인 [SEEK] 에 들어갔습니다.
매번 눈으로 확인하고 대충 넘어갔었는데 그날 따라 무슨 바람이 불었는지 이 사이트를 결과 패턴을 분석해서 자동으로 하면 좋겠다는 생각을 했습니다.

그래서 검색 결과에서 분석을 위해 “소스 보기”를 클릭하는 순간… OTL

Keyword 검색 결과에 대한 부분이 전혀 페이지에 표시않고 AngularJS 스크립트만 표시가 됩니다…..

그래서 결심했습니다. 리서치는 수동으로 하고 AngularJS 를 배워야겠다..

잡담이었습니다.

[잡담] Java 개발자가 되기 위한 나만의 준비과정

회사 업무로 일본에 10일간 출장을 와 있습니다.
이번 일정은 Bug fix 또는 긴급한 개발을 필요로 하는 업무가 아닌 관계로 약간의 시간 여유가 있어 밤에 잠 안자고 글을 몇자 적어봅니다.
제가 대학교를 졸업하고 Java 개발자로 취업한 내용을 몇자 적어봤습니다. 허접한 내용이라고 생각하고 편하게 읽어주세요…^^

저는 개발자로 진로를 선택한 대부분의 사람들과 마찬가지로 전산과 출신입니다.
그렇다고 대학교 시절 프로그래밍을 아주 즐겨하거나 프로그래밍 동아리에 들어 개발, 교수님 연구동아리에 드는등… 개발자로 갖춰야할 사전 작업은 전혀 하지 못한 상태로 졸업을 하였습니다.

[졸업 후 1년동안]
위에서 간단하게 적었지만 저는 프로그래밍에 대해서는 전혀 하지 못한 상태로 졸업을 하였습니다. 졸업한 후의 저의 상태를 간단하게 프로그램으로 돌아보면 4학년 2학기에 c언어를 재수강 하였지만 도움이 없이는 a,b 를 swap() 시키는 함수조차 작성하지 못하는 상태였습니다. 그렇지만 개발자가 비전이 있다는 생각을 가지고 Java 개발자가 되기위한 준비에 들어갔습니다.
– 졸업 후 1개월
강남 비트 컴퓨터 학원에서 java fundamental 과정을 수강하면서 저의 Java 개발자가 되기 위한 기반을 다졌습니다. 그때 강사님이 해주신 말씀중에 몇가지 기억나는 부분이 있습니다.
첫번째. Java 개발자라면 Java 커뮤니티와 Sun 의 Java 포럼은 매일 들어가서 동향을 파악해야 한다.
두번째. 영타는 반드시 잘쳐야 하는건 아니지만 잘 쳐서 나쁜 것은 없다.

– 비트 컴퓨터에서 중앙정보처리 학원으로…
1개월간 java에 대한 강좌를 들었지만 머리속에 개념이 완전하게 잡히지는 않았고 6개월 과정의 국비지원 java 교육과정이 있어 다시 교육센터에 들어갔습니다. 당시 강좌 내용은 java, xml, oracle 10g, struts, spring, jdbc, MVC 패턴등 회사에서 사용하는 전반적인 내용을 간단간단하게 배우는 교육과정이었습니다. 단기간에 많은 것을 배우다 보니 진도를 따라가기도 어려운 상황 이었습니다. 지금 생각해도 한가지 아쉬운 점은 학원에서 자격증 응시료를 받기위해 억지로 OCP 자격증을 취득하는거라던지 SCJP 자격증은 반드시 따야 한다며 덤프로 외워 자격증을 따라는 식의 권유는 지금 생각해도 해서는 안될 행동이었던 것 같습니다.

– 중앙정보처리학원에서 한경교육센터로…
6개월간의 교육을 마치고 자바 개발자로 취직을 하기 위해 이력서를 열심히 내고 있었습니다. 이력서를 냈다고 많은 연락이 오거나 하지는 않았습니다. 여러군데 지원을 하다가 한군데서 연락이 왔습니다. 면접 후 신입사원 교육겸 해서 한경교육센터에서 java 과정을 수강하고 특별한 문제가 없으면 채용을 하겠다는 조건이었습니다. 문제가 될거라는 생각은 없었기에 java 교육을 회수로 3번째 듣게 되었습니다. 3번 들으니 이제는 아무 도움 없이 java로 “HelloWorld”는 찍을 수 있었습니다. 그리고 회사에서 메신저를 만드니 최종 프로젝트로 메신저 서버와 메신저 클라이언트를 java로 만드는 것을 선택하였습니다. 결과적으로 접속자수 10명이 넘으면 OutofMemory가 발생되는 허접한 메신저 서버를 만들었습니다.

[교육센터에서 실무로]
교육센터는 일정에 대한 압박은 거의 없었습니다. 그렇지만 교육센터에서 최종 제출한 산출물을 회사에 제출해야 한다는 조항이 있어서 그 당시에는 최선을 다해 만들었습니다.
제가 느끼는 교육센터와 현업의 가장 큰 차이점은 “유효성 검증 및 예외 처리” 입니다.
제가 작성 프로그램의 일부를 예로 들어보겠습니다.

String phone = rs.getString("phone");
if(phone.length == 10) {
    // DO something
}

위와 같은 코드를 만들었습니다. 제가 취업 했을때 저의 생각은 “설마 전화번호가 없는 사람이 있겠어???” 이런 마인드였습니다.
혹시나 했으나 역시나 있더군요.. 데이터베이스에 대한 갱신이 정상적으로 일어나지 않는다고 해서 지원을 하게 되면 대부분이 위와 같은 NullPointer에 대한 예외처리가 빠져
발생되던 부분이 있었습니다.

지금 작성하라면 아래처럼 간단한 예외처리 정도는 넣겠죠…

String phone = rs.getString("phone");
phone = (phone == null ? "" : phone);
if(phone.length() == 10) {
    // Do something    
}

그리고 가끔씩 전화번호 필드에 한글 또는 영문을 넣는 경우도 있습니다.
그렇다면 문자를 제외하 나머지 숫자만 가지고 처리를 해야 할때가 있으면 아래와 같이 할거 같습니다.

String phone = rs.getString("phone");
phone = (phone == null ? "" : phone.replaceAll("[^\\d]", "");
if(phone.length() == 10) {
     // Do something
}

몇번 격으니 지원을 하는것 보다는 예외처리를 하는게 제 몸과 마음이 편하다는 것을 깨달았습니다.
추가적으로 교육센터 출신분들에게 물어보면 대부분 코드에 예외처리 하는 것은 안배운다고 합니다..^^

[Markdown] Cheat Sheet

신규로 생성한 프로젝트를 Github에 비공개 프로젝트로 구성하면서 Markdown을 처음 접했습니다. 단순히 생각하면 “텍스트로 편안하게 작성된 글이 HTML 문서로 변경된다.” 고 볼 수 있습니다. 일단 가이드를 한번 보고 자주 사용할게 될거 같은 부분은 문서로 정리해서 보면 좋겠죠?? 저와 같은 생각을 하고 있는 많은 분들이 있습니다.

그래서 구글 이미지 검색에서 “markdown cheat sheet” 로 검색을 하니 아래와 같은 이미지가 나왔습니다. 자주 사용한다면 모니터 옆에 붙여넣고 쓰면 좋을것 같습니다.

markdown_cheat_sheet

프로그래밍을 잘하려면?

얼마 전에 도움이 될만한 글을 읽어 잊지 않기 위해서 작성합니다.
가슴에 팍 와 닿은 글이라서 원문 내용과는 별 생각 없이 제 느낌대로 적어봅니다.

프로그램을 잘 만드는 개발자가 되는 것은 글을 잘 쓰는 작가가 되는 것과 비슷합니다.
작가가 되기 위해서는 글을 쓰기만 해도 될 수 있지만 좋을 글을 쓰기 위해서는 다른 사람이 쓴 글을 많이 읽어야 합니다. 개발자도 동일합니다. 자신이 좋은 프로그램을 만들기 위해서는 다른 사람이 잘 만든 프로그램을 많이 봐야 합니다. ^^