All-round programmer

요즘 협업을 하면서, 팀을 리드하면서 디자인 리뷰를 하면서 많이 생각하게 되곤 합니다. 내가 생각하고 있는 것이 맞는 정답일까, 이 사람이 만들어놓은 디자인은 맞는 정답일까? 그런데 프로젝트를 여러 번 하다 보니 내리게 된 결론은 다음과 같습니다. 시스템 디자인에 정답은 없습니다. 요즘 다시 고용 시장이 조금 회복되면서 다시 인터뷰도 많이 하고 있습니다. 저는 자주 시스템 디자인 세션을 맡곤 하는데, 한 시간의 인터뷰 세션 안에서 자기소개하고 인터뷰이 소개하고 기본적인 질문들을 하다 보면 15분 정도 쉽게 지나가고 마지막 5분은 질답 시간으로 남겨두려면 결국 남는 건 40분 밖에 되지 않습니다. 40분 안에 물어보는 시스템 요구사항에 대한 최적의 디자인을 만들기란 당연히 턱 없이 부족합니다. 인터뷰어로서..

코드리뷰를 하다보면 정말 좋지 않은 코드를 많이 보곤 하죠. 이럴 때 '이것 제대로 고쳐주세요', 라고 이야기하면 가끔씩 들려오는 이야기가 "급하니까 나중에 고칠께요." "일단 배포하고 수정할께요." 비슷한 부류로 이러한 케이스도 있죠. "일단 배포하고 테스트 쓸께요." 이러한 상황이 많다면 근본적으로 다시 어떻게 일을 하고 있는지 검토가 필요할 겁니다. 아니면 혹시 주위에 이러한 개발자가 보인다면, 이러한 개발자는 온 몸에 시한폭탄을 두르고 다니는 개발자이기 때문에 좋은 길로 잘 인도해주거나 좀 거리를 두는 것이 좋을 것입니다. 그러면 이러한 개발자를 어떠한식으로 올바르게 성장 시킬 수 있을까요? 먼저 어떠한 개발자들이 이러한 이야기를 많이하는지 대충 살펴보면: (1) 정말 급한 요청을 처리하는 개발자..

제목을 다소 과하게 잡기는 했는데 이 부분에 대해서 제가 스트레스를 받은 적이 많아서 꼭 이야기하고 싶었던 내용 중 하나입니다. 사실 제목과 다르게 남의 문제를 지적하는 건 사실 괜찮습니다. 이거 보여주고 싶어서 어그로 끌어보았습니다. 제가 여기서 집중하고자 하는 부분은 '남의 문제를 지적'하는 행위 자체가 아니라 '어떻게 지적하느냐'에 대해서 조금 더 이야기해보고 싶었습니다. 제가 최근에 몇 년 새에 겪었던 두 가지 케이스를 이야기해드리고자 합니다. 1. 이상주의 개발자 D와의 협업 가끔 보면 개발자 중에 이상주의자들이 많습니다. 이상주의자란 무엇이냐 하면 항상 이상적인 세계를 꿈꾸듯, 이상주의 개발자는 항상 이상적인 코드와 이상적인 인프라를 상상하는 개발자들입니다. 이러한 이상적인 것을 추구하는 것이..

정말 이거 하소연하고 싶어서 미쳐버릴 것 같네요. 여러 오래된 서비스를 제공하고 있는 팀들과 협업하다보면 이러한 이야기를 자주 듣곤 합니다. "너무 옛날 시스템이라서요" "문서화가 전혀 안 되어있어서요" "개발 했던 개발자가 팀을 떠나서요" "옛날에 다른팀에서 지원해줬던 개발자가 개발한거라서요" 하.. 이런 핑계들 좀 안 하면 안 될까요. 이러한 소리 들으면 정말 답답하고 한숨만 납니다. 물론 저도 개발자인지라 가끔 특정한 기준 아래에 이러한 핑계를 대기는 합니다. "처음 서비스를 인수인계 받고 담당하게 되는 세 달 동안만 이런 핑계 허용" 세달은 프리패스로 책임 회피가 가능한 마법의 문장들이죠. 물론 세달 동안 서비스의 구석구석 100% 전부다 이해할 수는 없지만, 최소한 메인 플로우, 문제가 있다면 ..

개발자로 일하다보면 정말 답답하게 행동하는 사람들이 너무나 많은데 그냥 갑자기 하소연이 하고 싶어지네요. 사실 트위터 정도의 짧은 글로 써도 되는 시리즈이기는 하지만, 트위터는 쉽게 쓰고 쉽게 지워져버리니 블로그에 짧게나마 짧게 짧게 쓰려고 합니다. 어떠한 주제로 글을 쓸거냐면: "제발 개발자라면 이런것 좀 하지 말아라" 입니다. 그래서 개발자 안티패턴으로 쓰려고 합니다. 절대 제 주위에 답답하고 짜증나게 하는 개발자들만 많아서 이런거 쓰는건 이니지만(..), 그냥 오며가며 여러 개발자들과 동업하다보면 특정한 행동이 답답한 경우가 많아서 그러한 경험들을 돌이켜보며 하소연하려고 합니다. 참고로 저는 상대가 답답하게 하면 그 행동이 고쳐질 때까지 지적하고 귀찮게 합니다. 그래서 제 주위에 그런 사람이 많지는..

이번에 회사 내에서 컨퍼런스 발표를 하려고 간단하게 자료 조금 준비했던게 있어서 블로그에 간단하게 공유하려고 합니다. 최근의 경험들을 바탕으로 어떠한식으로 서비스 개발이 이루어지고 있는지에 대한 개발 프로세스를 소개하려고 합니다. 앞으로 글을 대략 5개 정도로 나눠서 Trunk based development 방법론에 대해서 다루려고 합니다. 개인적으로는 기존의 깃플로우나 깃헙플로우와 비교했을 때 보다 월등하게 좋아서 관련 경험들과 노하우들을 공유하려고 합니다. 개발 방법론에 대한 이야기라 글이 많지는 않겠지만, 대략적으로 아래의 5개 정도가 될 것 같고 두주에 글 하나 정도씩 업데이트를 목표로 하겠습니다. - [1] Trunk based development 소개 - [2] Trunk based dev..

이번에는 Bootstrap에서 지원해주고 있는 기타 다른 CSS 기능들인 스타일에 대해서 살펴볼 것이다. 이전의 글에서 언급한대로 Bootstrap의 강점 중 하나는 모든 화면 크기의 브라우저나 기기에 따라서 반응형으로 최대한 유사한 사용자 경험을 제공해주고자 하는 것이므로 각종 버튼이나 폰트, 그리고 폼 양식을 작성할 때에도 이러한 기본적으로 Bootstrap에서 제공해주고 있는 CSS 기능들을 활용하면 좋을 것이다. 특히 Bootstrap에서는 표준에 정의되어있는 태그들에 대하여 동일한 스타일을 적용하는 것 이외에도 새로운 태그들도 정의하여 활용 가능하다. 이전에는 각종 태그들과 본문 등에 적용 가능한 기본 클래스들을 살펴보고 다음에는 폼 엘레멘트들과 테이블의 양식을 살펴볼 것이다. *이전글2016/..

* 오랜만에 다시 블로그 글을 쓰고자 하니 이전에 쓰다가 날라갔던 내용을 다시 쓰려고 한다. 쉬운 내용으로 HTML5의 geolocation에 대해서 살펴보고자 한다. 아마 많은 웹들이 위치 기반으로 서비스를 제공하고 싶은 경우가 많을텐데 예전에는 웹앱으로 네이티브API와 연동하는 것이 필요했다면 이제는 이러한 경우에 웹페이지에서 위치 정보를 수집할 때 사용하면 된다. 웹페이지에서 HTML5의 위치 정보 수집 기능을 이용하면 좋은 점은 모바일 뿐 만 아니라 GPS가 내장된 노트북 등에서도 동일하게 위치 정보 기반의 서비스를 제공할 수 있다는 점이다. 그러면 먼저 간단하게 사용법부터 알아보자. * 이전 편들 2012/10/07 - [HTML5 튜토리얼] 공부 시작 - 계획 2012/10/25 - [HTML..

* 3년만에 약간 뜬금없지만, "속깊은 자바스크립트"의 마지막 글을 작성합니다. 2000년 초반부터 자바스크립트를 다양하게 활용하면서 개발하다가 문득 해외에서의 자바스크립트에 대한 인지도와 국내에서의 인지도가 많이 다르다는 것을 느끼고, 2012년 12월에 처음으로 "속깊은 자바스크립트"라는 이름으로 시리즈 작성을 마음먹었습니다. 일반적인 문법적인 이야기가 아닌 동작 원리와 개발 방향에 대한 내용을 작성하기 시작하여 2013년 11월까지 열심히 작성하였습니다. 직장 생활과 결혼 준비로 인하여 글 작성을 쉬던 중 2014년 여름에 출판 제의가 와서 그 후 2년만에 "속깊은 자바스크립트"의 마지막이라고 할 수 있는 책을 출판하게 되었습니다. 따라서 속깊은 자바스크립트 시리즈는 이제 책의 출판으로 그 마지막을..

* 이번에는 Bootstrap으로 반응형 웹을 만드는데 가장 중요한 기능 중 하나인 CSS 기능들에 대해서 살펴볼 것이다. CSS 기능은 말그대로 CSS를 토대로 제공이 되는 기능들로 특정 class 명을 부여함으로써 Bootstrap에서 제공하는 틀대로 반응형으로 동작하도록 해주는 기능들을 이야기한다. - 이전글 2016/05/19 - [자바스크립트 프레임워크] 시작 예고편 2016/05/21 -[Bootstrap] 소개 * Bootstrap 프레임워크 CSS 기능: Bootstrap 프레임워크의 CSS 기능은 웹페이지에 적용하게 되는 CSS 규칙들을 기본적으로 설정하고, 기본 HTML 요소들에 대한 스타일을 적용하는 기능들을 포함하고 있다. 특히, Bootstrap 프레임워크에서 제공해주고 있는 반응..

* 이전의 드랍다운 메뉴 만들기를 하고나서 의외로 많은 질문이 들어온 것이 가로형 메뉴는 어떻게 만드느냐에 대한 내용이었는데, 이 부분은 이전의 메뉴를 그대로 수정해서는 은근히 어려울 수 있어서 이 부분에 대하여 한번 더 정리해보고자 한다. 이번의 글의 목적은 HTML과 CSS만으로 가로로 떨어지는 드랍다운 메뉴를 만드는 것이고, 그 다음에는 아마도 CSS만으로는 구현하게 되면 UX상 개선하고 싶은 몇가지 내용들에 대하여 개선할 수 있는 HTML과 자바스크립트로 드롭다운 메뉴를 만들어 볼 것이다. - 이전 글 2013/11/01 - [밑바닥부터 홈페이지 만들기] 예고편 2013/11/01 - [밑바닥부터 홈페이지 만들기] HTML5 기본 템플릿, DOCTYPE 종류 2014/01/13 - [밑바닥부터 홈..

* 이번에는 전의 글에 사이드바에 이미지 배너를 넣는 것이 가능한지 물어보는 댓글이 있어서 사이드바에 이미지 배너를 넣는 방법에 대해서 살펴볼 것이다. 기본적으로 이미지 사이드바를 넣는 방법은 몇 가지가 있을 텐데, 각각의 장단점이 있을테니 간단하게 살펴볼 것이다. 크게 이미지를 업로드하는 방법과 사이드바를 넣는 방법으로 나누어서 살펴볼 것인데, 어떠한 방법을 선택할지는 먼저 아래에 정리를 하여 넣어두었으므로 참고하고 해당 방법을 따라가면서 해보는 것이 좋을 것이다. 이번의 글은 꼭 반응형 스킨이 아니더라도 일반 스킨에 대해서도 수정과 응용이 가능하다. * 이전 글2016/05/09 - [티스토리 반응형 스킨 편집] 페이스북 좋아요 버튼, 구글+1버튼 넣기2016/05/13 - [티스토리 반응형 스킨 편..

* 가장 먼저 보게 될 프레임워크는 바루 Bootstrap이다. 이 프레임워크를 가장 먼저 보게 되는 이유는 바로 지금 블로그에 반영한 티스토리의 반응형 스킨이 이 bootstrap을 사용하고 있기 때문이다. 따라서, 지금 블로그의 반응형 스킨을 개선하거나 변경하고자 한다면, 먼저 bootstrap에 대해서 알고 있어야지 문제 없이 변경할 수 있을 것이기 때문에 bootstrap을 먼저 선택하였다. * 이전글2016/05/19 - [자바스크립트 프레임워크] 시작 예고편 * Bootstrap 프레임워크? : http://getbootstrap.com : Bootstrap은 어디선가 한번씩은 들어봤을 프레임워크라고 생각한다. 이 Bootstrap에 대해서 소개하고 있는 내용을 보면 위의 홈페이지에 들어가면 ..

* 속깊은 자바스크립트 시리즈를 쓴지도 5여년이 지나고 이제 순수 자바스크립트에 대한 중요성과 인지도가 많아 향상 되었다고 생각한다. 그런데 최근에 최업 준비를 하면서 해외의 front-end engineer 자리들을 보고 있으면, 이제는 단순히 자바스크립트만 해서는 경쟁력이 떨어지고 있다는 것을 더욱더 느끼게 된다. 따라서, 속깊은 자바스크립트는 순수 자바스크립트를 살펴보는 시리즈 였다면, 자바스크립트를 응용하는 프레임워크나 라이브러리들이 어떠한 것이 있고 기본적인 사용 방법에 대해서 살펴보고자 한다. * 자바스크립트 프레임워크의 시대: 자바스크립트는 이제 정말 수 없이 많은 프레임워크들이 나오고 그러한 프레임워크의 개발을 요구하는 회사들도 많아지고 있다. 가장 쉽게 프레임워크가 얼마나 많은지 확인하는..

* 이전글2016/05/06 - [C++ 기본] Hello World 시작2016/05/10 - [C++ 기본] 클래스와 상속, friend, virtual, template 키워드 등2016/05/13 - [C++ 응용] 퀵, 머지, 힙, 버블, 선택, 삽입 정렬 알고리즘 구현 * 이번에는 변수형과 기본 함수들에 대해서 간단하게 살펴볼 것이다. 기본적인 내용이므로 레퍼런스로만 봐도 되도록 정리할 것이다. * 변수형: 각 변수형의 크기는 처음에는 크게 신경쓰지 않아도 되지만, 나중에 TCP 연동을 하거나 메모리 취적화가 필요할 때에는 조금씩 신경을 써야할 것이다. - char: 1byte=8bit 크기의 문자를 하나 저장- short: 2byte=16bit 크기의 정수를 저장- int: 4byte=32b..

* 이전글2016/05/09 - [티스토리 반응형 스킨 편집] 페이스북 좋아요 버튼, 구글+1버튼 넣기 * 시작: 이번에는 먼저 반응형 스킨을 하나 선택해서 기존의 반응형으로 동작하고 있는 부분 중에서 마음에 들지 않는 부분들을 수정할 것이다. 가장 먼저 일단 반응형 스킨을 하나 선택할 것인데, 아래의 반응형 스킨이 깔끔한 것이 마음에 들어서 선택하였다. : 마음에 들었던 점은 스킨에서 메뉴가 오른쪽에 있다는 점이 제일 컸고, 하얀색 바탕을 중요하게 생각해서 좋은 스킨이라고 생각하여 선택하였다. 그런데 전체적으로 디자인은 내 마음에 들지 않아서 이제부터 편집, 커스터마이징을 해보려고 한다. * 상단바 수정: 스킨을 일단 적용해보면 가장 마음에 들지 않는 것은 상단에 크게 떠있는 이미지이다. 혹자는 이러한..

* 알고리즘의 기본인 정렬 알고리즘들의 대표적인 케이스들을 직접 C++로 구현해보았다. C++을 이용해서 재귀적으로도 처리하기도 하고, O(nlogn)이나 O(n^2)에 대한 알고리즘 분석의 기본이 되므로 기본적으로 알고 있으면 유용하다. * Quick Sort: 퀵소트는 하나의 피봇이 있어서 피봇보다 작은 값들을 앞으로, 큰 값들을 뒤로 보낸 다음, 다시 나뉘어진 그룹을 정렬하는 top-down 식 정렬 알고리즘이다. #include using namespace std; void quickSort(int arr[], int size) { int pivot = arr[0]; int cursor = 0; for (int i = 1; i arr[i]) { c..

* 이전글2016/05/06 - [C++ 기본] Hello World 시작 * 면접이 조만간 잡히게 될 것 같아 우선적으로 복습이 필요한 내용인 클래스와 상속에 대해서 문법을 간단하게 살펴보고 hackerrank.com이나 기본 소팅 알고리즘을 구현해보는 것을 할 예정이다. * 클래스 선언: 클래스 선언은 클래스의 전체적인 구조를 나타내며, 변수에 대한 정의와 함께 함수의 구조를 정의한다. 아래와 같은 구조는 주로 헤더 파일에 들어간다. Car.h에 정의해조자.class Car { private: int wheels; int price; public: void setWheels(int); void setPrice(int); int getWheels(void); int getPrice(void); }; *..

* 한동안 글을 쓰지 않으면서 항상 생각해오던 것이, 기존의 블로그 디자인을 싹 바꾸고 싶다는 생각이었다. 색이 갈색 바탕이었던 것부터 해서 평범하지는 않았기 때문에 블로그만의 특징이 있기는 했지만, 사실 내가 좋아하는 것은 흰색/검은색 구성이라서 이에 맞게 수정을 하고 싶었다. 그래서 지금부터 간단하게 블로그의 스킨을 조금씩 수정하면서 그에 대한 내용을 정리해보려고 한다. 그 중에서 가장 먼저 페이스북과 구글+1 버튼을 넣는 것을 먼저 해결하려고 한다. * 블로그 설정 화면: 다른 블로그들에서는 "HTML/CSS 편집"이나 "파일 업로드" 등을 이용해서 사용하는 경우가 많은데 이러한거 다 필요없다. 물론 위젯이 들어가는 위치가 아닌 조금 다른 위치에 넣고자 한다면 "HTML/CSS 편집"이 필요하지만,..

* 이번에 C++관련 면접을 보게 되면서 다시 한번 C++에 대해서 복습하는 기회를 가지려고 한다. 기본 문법부터 간단한 객체지향 설계까지 훑어보고자 한다. * 시작하기 전에..: 먼저 C++에 대해서 다시 공부하기 전에 MacOSX에서 gcc를 기반으로 진행하려고 한다. MacOSX가 아니면 리눅스나 유닉스에도 같이 포함이 되어있을테니 해당 OS에서 작업하거나 GNU의 gcc 컴파일러를 받아도 되고, 다른 컴파일러를 받아서 사용해도 된다. 아래는 GNU gcc 관련 웹사이트이다. https://gcc.gnu.org/ : MacOSX는 xcode를 먼저 깔아야 gcc가 정상적으로 동작하기 때문에 OSX와 xcode를 최신버전으로 다운로드 받아서 gcc의 동작을 먼저 확인하고 진행하였다. : OSX에 이어..

* 오랜만에 쓰는 글은 쉬운 내용으로 다시 워밍업을 하려고 한다. 일단 HTML5에 대한 내용들이 이제 대부분의 브라우져에 지원이 되기 시작하고 있어서 슬슬 HTML5에 대해서 부담없이 사용하게 되는 시기가 아닌가 생각한다. 아직 HTML5가 많이 지원 안되는 Internet explorer 8과 9가 10% 가량 남아있기는 한데 마이크로소프트의 강제 업그레이드(감사하게도!!) 덕분에 빠르게 줄어들고 있는 것을 확인할 수 있으니 올해 말 정도에는 이러한 기능들을 마음껏 사용해도 될 것이라 생각한다. * 이전 편들2012/10/25 - [HTML5 튜토리얼] HTML5의 등장 배경과 여러 가지 개발 환경 및 현재 현황2012/11/03 - [HTML5 튜토리얼] 기초 및 기본 구조, 프로그래밍상 기존의 H..

* 이번에는 자동 로그인 등과 같은 기능을 구현할 때 유용하게 사용할 수 있는 기능인 SharedPreference에 대하여 알아보도록 하자. - 이전 글 2012/11/07 - [Android(안드로이드) 앱 개발 기초] 안드로이드 프로젝트 생성하고 에뮬레이터로 앱 실행하기 2012/11/10 - [Android(안드로이드) 앱 개발 기초] 간단한 인터페이스 구현과 다른 Activity로 넘어가기 2012/11/21 - [Android(안드로이드) 앱 개발 기초] Activity 라이프사이클 공부 2012/11/24 - [Android(안드로이드) 앱 개발 응용] Google Map API로 지도 보여주기(MapView), Overlay Item 그려주기 예제 2012/11/28 - [Android(안..

* 이번에는 음악 재생을 위하여 사용하게 되는 MediaPlayer의 개발자 매뉴얼을 살펴보도록 하자. 음악을 재생할 때 주의할 점들과 각종 상황들에 대한 다양한 팁들을 포함하고 있어서 읽어보면 매우 유익할 것이다. - 이전 글2012/11/07 - [Android(안드로이드) 앱 개발 기초] 안드로이드 프로젝트 생성하고 에뮬레이터로 앱 실행하기2012/11/10 - [Android(안드로이드) 앱 개발 기초] 간단한 인터페이스 구현과 다른 Activity로 넘어가기2012/11/21 - [Android(안드로이드) 앱 개발 기초] Activity 라이프사이클 공부2012/11/24 - [Android(안드로이드) 앱 개발 응용] Google Map API로 지도 보여주기(MapView), Overlay..

* DB로 직접 접근하기 vs ContentProvider 사용하기?: 안드로이드에서는 기본적으로 SQLite를 사용할 수 있도록 API를 다양하게 편리하게 제공해주고 있다. 하지만, 이러한 SQLite는 기본적으로 해당 DB를 생성한 앱에서만 접근이 가능한 제약 사항이 있기 때문에, 앱간의 공유가 어려웠었다. 하지만, 이제는 안드로이드에서 기본적으로 주소록이나 콜로그 등에 대해서 ContentProvider를 통해서 데이터를 제공해주고 있고, Android SDK에서도 해당하는 내용을 사용할 것을 권하고 있다. 만약 앱에서 데이터를 내부적으로만 사용한다면, 굳이 ContentProvider를 사용하지 않아도 되고, 사실 ContentProvider를 처음에 접하게 되면 익숙하지 않기도 하고 제대로 된 ..

* 이번에는 마우스 오버 이미지 배너를 만드는 방법을 알아볼 것이다. 이러한 마우스 오버될 때 이미지가 변경되는 것은 다양한 방법들이 있는데, 이러한 방법들을 해당 태그의 중요도나 위치에 따라서 다르게 구현하는 방법들을 적용하면 UX가 향상된 홈페이지를 만들 수 있을 것이다. 만약 모든 경우에 오직 한가지 방법만 고집한다면 각 방법들의 적용 방법을 익혀서 필요에 따라서 사용한다면 아주 좋을 것이다. - 이전글2013/11/01 - [밑바닥부터 홈페이지 만들기] 예고편2013/11/01 - [밑바닥부터 홈페이지 만들기] HTML5 기본 템플릿, DOCTYPE 종류2014/01/13 - [밑바닥부터 홈페이지 만들기] 최종 목표 예고 - toc21.com2014/01/15 - [밑바닥부터 홈페이지 만들기] n..

* 지난번에 이어서 이번에는 HTML과 CSS로 드롭다운(드랍다운/drop down) 가로형 메뉴를 만드는 것을 해보자. 기존에는 플래시를 이용하거나 복잡한 자바스크립트를 사용해야했지만 이제는 CSS와 HTML만으로도 다양한 효과의 드랍다운 메뉴를 만들 수 있게 되었다. 물론 IE9이상 버전이어야 좀 제대로 보이기는 할테지만 CSS를 기반으로 만들게 되면 IE8에서도 투박하기는 하지만 기능은 제대로 동작하게 된다. 지금까지 있었던 그러한 투박한 드랍다운 메뉴를 생각한다면 CSS3를 얕보고 있는것이다. CSS3는 웹개발자 본인의 능력에 따라서 얼마든지 화려한 기능을 부여할 수 있다. "물론 CSS3는 IE 사용자인 경우 10버전 이상에 한해서 멋지게 되는 것이지만 말이다. 다른 브라우져는 다 잘된다!" *..

* 원래 웹사이트의 아이콘을 먼저 만드는 작업을 하려고 했는데, 디자이너의 작업이 늦어지면 이러한 아이콘 또한 늦게 나오기 마련이다. 따라서, 먼저 대략적인 구조를 받기 전에 요즘 웹페이지에 거의 들어갈만한 메뉴를 html과 css로 만들어보자. 화려한 애니메이션이나 이러한 옵션은 나중에 기획이 확정되면 넣기로 하고 일단 기본적인 틀만 만들어보자. - 이전글 2013/11/01 - [밑바닥부터 홈페이지 만들기] 예고편 2013/11/01 - [밑바닥부터 홈페이지 만들기] HTML5 기본 템플릿, DOCTYPE 종류 2014/01/13 - [밑바닥부터 홈페이지 만들기] 최종 목표 예고 - toc21.com * 작업하던 소스 : 지난번에는 기본적인 템플릿을 만들어서 기본 html 개발을 하기 전에 준비 단계..

* 그동안 퇴근 이후에 짬짬히 만들면서 쓰려고 했던 시리즈가 본업이 바빠지면서 전혀 진행을 못했었는데, 부업으로 개발을 하던 홈페이지가 베타로 오픈을 하게 되어서 일단 현재 베타의 상태를 현재 쓰고 있는 '밑바닥부터 홈페이지 만들기' 시리즈의 최종목표가 될 것이라는 생각이 들어서 먼저 최종 목표와 다루게 될 내용들을 먼저 정리하고자 한다. - 이전 글 2013/11/01 - [밑바닥부터 홈페이지 만들기] 예고편 2013/11/01 - [밑바닥부터 홈페이지 만들기] HTML5 기본 템플릿, DOCTYPE 종류 * 목표 : 뭐든지 목표 설정이 중요하기 때문에, 현재 생각하고 있는 목표는 "toc21.com"의 홈페이지에 나와있는 컴포넌트들에 대해서 만드는 방법들을 설명하는 것이다. http://www.toc..

* 이번에는 진짜로 실용적으로 쓸 수 있는 내용들을 쭉 한번 살펴보자. 지난번의 글로벌 변수에 대한 내용도 사실은 진정한 '프로그래머'라면 글로벌 변수를 잘 안 쓸테니 별로 쓸일도 없을거라고 생각하면 그다지 실용적인 내용은 아니라고 볼 수 있다. 하지만 이번에는 변수 선언을 하면서 들이면 좋을 습관들과 왜 그렇게 하는 것이 좋은가에 대한 내용까지 다루면서 자바스크립트를 개발하면서 습관들이면 좋을 내용들을 다룰 것이다. - 이전글 2012/12/10 - [속깊은 자바스크립트 강좌] 시작 (예고편) 2012/12/17 - [속깊은 자바스크립트 강좌] 자바스크립트의 Scope와 Closure 기초 2013/01/07 - [속깊은 자바스크립트 강좌] function declaration vs function e..

* 홈페이지를 밑바닥부터 만들 때 가장 먼저 해야할 것은 기본 틀을 만들어두는 것이다. 이제 거의 모든 브라우져들이 HTML5를 지원해주므로 HTML5에서 사용하고 있는 기본 템플릿을 살펴보자. - 이전글 2013/11/01 - [밑바닥부터 홈페이지 만들기] 예고편 * Zen-coding의 HTML5 템플릿 : 웹 개발을 하는데 잘 쓰면 유용한 개발 플러그인 중에 Zen-coding이라는 플러그인이 있다. 이 플러그인이 어떤 플러그인인가 하면 코딩을 단축키의 연속으로 하듯이 간단한 문자열로 소스코드를 바로바로 생성할 수 있는 플러그인이다. 이러한 Zen-coding에서 HTML5용 템플릿을 생성하면 아래와 같은 템플릿이 나오게 된다. : 나중에 기회가 되면 이 플러그인에 대해서 별도로 다루기로 하고, 우..