김정환 jeonghwan-kim

If you haven’t worked with JavaScript in the last few years, these three points should give you enough knowledge to feel comfortable reading the React documentation:

We define variables with let and const statements. For the purposes of the React documentation, you can consider them equivalent to var.
We use the class keyword to define JavaScript classes. There are two things worth remembering about them. Firstly, unlike with objects, you don't need to put commas between class method definitions. Secondly, unlike many other languages with classes, in JavaScript the value of this in a method [depends on how it is called](https://developer.mozilla.org/en-US/docs/Web/Jav

react-hot-loader 적용하기

react-hot-loader 는 코드가 변경되었을 때 페이지를 새로고침하지 않고 바뀐부분만 빠르게 교체해주는 라이브러리입니다. 비록, 리액트 어플리케이션을 개발 할 때 필수적인 개발도구는 아니지만, 앱의 규모가 커지면 개발서버가 수정될때마다 새로고침이 된다면 딜레이가 발생되어 개발의 흐름이 중간중간 1~6초씩 끊길 수도 있습니다. 특히, styled-components 를 사용하게 되는 경우엔, 스타일이 JS 안에 있어서, 스타일을 수정 할 때마다 새로고침이 된다는게 조금 불편할수도 있겠죠.

이렇게 자바스크립트 코드의 일부분만 교체하는 기능은 웹팩 개발서버의 기능이기 때문에, 라이브러리 없이도 코드를 조금 건들여주면 가능합니다. 하지만, 어플리케이션의 state 를 계속 유지하려면 과정이 복잡하기 때문에 라이브러리의 힘을 빌릴 필요가 있습니다.

이전에는, webpack 쪽에서 설정을 해야 될 것이 있었기 때문에, 무조건 yarn eject 를 해주어야 했지만, 이제는 바벨 설정만 하면 되므로 eject 하는 작업은 선택적입니다. 최신 react-hot-loader 는 굉장히 많이 편해졌답니다.

설치하기

Styling native elements

Native HTML controls are a challenge to style. You can style any element in the web platform that uses Shadow DOM with a pseudo element ::pseudo-element or the /deep/ path selector.

video::webkit-media-controls-timeline {
  background-color: lime;
}

video /deep/ input[type=range] {

Docker 치트 시트

한국어 번역(초벌): nacyot
같이 읽으면 좋은 문서들

왜 Docker를 사용해야하는가?

Sample service script for debianoids

Look at LSB init scripts for more information.

Usage

Copy to /etc/init.d:

# replace "$YOUR_SERVICE_NAME" with your service's name (whenever it's not enough obvious)

버전 관리 시스템 유랑기, 그리고 Git 적응기

2011년 6월 9일과 11월 10일에 열린 세미나에서 두 번 발표했던 내용을 글로 정리했습니다.

지금까지 다양한 버전관리 시스템을 쓴 경험과 Git의 장점이라고 느낀 점에 대해서 발표했었습니다.

버전관리를 거의 안 하던 시절

버전관리는 먼 나라의 이야기?

Git에 대해 이야기를 하기 전에 지금까지 어떻게 버전관리를 해왔는지 되돌아보겠습니다. 아마 비슷한 경험을 하시고 공감하실 분들이 많으실 듯합니다.

	function changeVolume(diff)
	return function()
	local current = hs.audiodevice.defaultOutputDevice():volume()
	local new = math.min(100, math.max(0, math.floor(current + diff)))
	if new > 0 then
	hs.audiodevice.defaultOutputDevice():setMuted(false)
	end
	hs.alert.closeAll(0.0)
	hs.alert.show("Volume " .. new .. "%", {}, 0.5)
	hs.audiodevice.defaultOutputDevice():setVolume(new)

	" Vundle config

	set nocompatible " be iMproved, required
	filetype off " required

	" set the runtime path to include Vundle and initialize
	set rtp+=~/.vim/bundle/Vundle.vim
	call vundle#begin()
	" alternatively, pass a path where Vundle should install plugins
	"call vundle#begin('~/some/path/here')

	<!doctype html>
	<html ng-app="Demo" ng-controller="AppController">
	<head>
	<meta charset="utf-8" />

	<title>
	Lazy Loading Images With AngularJS
	</title>

	<style type="text/css">

	app.filter('parseUrl', function() {
	var //URLs starting with http://, https://, or ftp://
	replacePattern1 = /(\b(https?\|ftp):\/\/[-A-Z0-9+&@#\/%?=~_\|!:,.;]*[-A-Z0-9+&@#\/%=~_\|])/gim,
	//URLs starting with "www." (without // before it, or it'd re-link the ones done above).
	replacePattern2 = /(^\|[^\/])(www\.[\S]+(\b\|$))/gim,
	//Change email addresses to mailto:: links.
	replacePattern3 = /(\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,6})/gim;

	return function(text, target, otherProp) {
	angular.forEach(text.match(replacePattern1), function(url) {