계박사의 코딩교실

html table 에서 CSS로 아래와같이 표현을 하려고하였지만 굉장히 힘들었습니다.

그래서 결국 이미지로 만들어서(아시는 디자이너분께 도움을 받았습니다. ㅋㅋ)

아래와 같이 image 태그에 넣어서 해결했습니다.

이번에 시마노 MTB 클릿인 PD-A600 을 중고로 구매했습니다.

기존에는 PD-M520 페달을 사용했는데 양면 클릿이라 끼우기도 편하고 좋은데 뭔가 페달이 아닌 봉을 밟는 느낌이 좀 있습니다.

특히 해머링하거나 댄싱 시에 먼가 면을 밟는 다는 느낌이 강하지 않습니다.

그래서 페달을 투어링용으로 중고로 구매하여 교체하였습니다.

기존에 쓰던 PD-M520 클릿입니다. 이것도 중고로 구매하고 한 6개월정도 사용한 것 같네요.

양면이라 대충 비벼도 잘 껴지지만 밟는 면적이 넓지 않아서 100% 힘을 내기는 조금 어려운듯합니다.

A600 과 M520 을 같이 두고 보면 확실히 면적 차이가 느껴집니다.

거의 비슷한 듯하지만 양쪽 날개부분이 면적이 더 넓습니다.

페달을 교체하였는데 로드 클릿 모습과 비슷하네요.

[Table A] 에 있는 데이터를 SELECT 하여 [Table B]의 데이터를 UPDATE 하는 경우가 있습니다.

그럴경우 간단하게 아래와같이 쿼리를 작성하여 처리하면 됩니다.

MySQL 에서 기본적으로 제공하는 MySQL Workbench 를 설치하여 이용할 경우에 update 시에 아래와 같은 오류가 날 수 있습니다.

Error Code: 1175. You are using safe update mode and you tried to update a table without a WHERE that uses a KEY column To disable safe mode, toggle the option in Preferences -> SQL Editor and reconnect.

이러한 오류가 났을 경우 UPDATE 를 하려면 2가지 방법이 있습니다.

1. SAFE MODE 끄기

옵션을 바꿔주시면 됩니다.

2. MySQL Workbench 옵션 변경

상단 메뉴의 Edit -> Preferences 메뉴 이동

SQL Editor 메뉴에 있는 "Safe Updates" 를 체크하여 옵션을 꺼줍니다.

MySQL 에서 테이블을 복사를 할 경우가 있습니다.

데이터 dump 를 위하여 테이블을 복사하거나 비슷한 테이블을 생성해야 할 때 등등 자주 사용됩니다.

1. 테이블이 없을 경우 복사

빈 테이블이 없어서 똑같이 테이블을 생성하면서 복사를 합니다.

2. 테이블이 있을 경우 복사

테이블이 있어서 데이터만 복사 할 때 사용합니다.

이번에 소개해 드리는 옷은 세컨윈드에서 나온 방풍바지입니다.

이름이 윈드라인 윈터 인것 처럼 완전 겨울용입니다.

패드는 없고 안에 기모처리가 되어있으며 앞쪽은 완전 방풍으로 되어있네요.

가격은 약 4만원 후반대로 가격대비 품질이 좋네요. 겨울용 등산바지하고 비슷하다고 보시면 편할 것 같습니다.

dhb 기모 빕을 입고 12월을 보낼 자신이 없었습니다.

방풍기능이 없다보니 5도 이하로 온도가 내려가고 바람이 좀 불면 허벅지와 무릎리 싸~하더군요.

그래서 먼가 빕 위에 입을 만한 저렴한 방풍되는 제품을 찾다가 세컨윈드 방풍바지를 구매하게 됬습니다.

사진이 잘 보이지 않지만 바지는 크게 튀는 부분 없이 무난합니다.

일반 등산바지를 보는 것 같네요. 

바지를 직접 입어본 착샷입니다.

기모 빕 위에 입었는데 핏이 아주 딱 좋습니다.

184cm / 80kg 이며 XL 사이즈로 구매했는데 기모 빕 위에 입었을 때 딱 맞네요.

특히 자전거 바지이기 때문에 밑단이 발목까지 슬림하게 핏이 떨어집니다.

마치 스키니 진같은 느낌이라고 보시면 편하겠네요.

그리고 앉았다 일어났다했는데 편하고 좋네요. ㅋㅋㅋ잘 샀다는 생각입니다.

Bootstrap 의 Button CSS 입니다.

CSS 몇개의 추가로 버튼을 디자인 할 수 있습니다.

<a> , <input> , <button> 해당 태그에 버튼 CSS를 사용 할 수 있습니다.

색상도 기본 제공되는 class 로 바꿀 수 있습니다.

사이즈도 class 를 추가해주면 원하는 크기로 바꿀 수 있습니다.

버튼도 다양하게 변경이 가능하며 자세한 예제는 아래의 URL에서 확인이 가능합니다.

http://getbootstrap.com/css/#buttons

Bootstrap 에서 제공하는 Table CSS 입니다.

데이터 리스트를 보통 테이블 태그를 이용하여 구성을 할 때 디자인적으로 깔끔하게 class 를 추가하여 바꿀 수 있습니다.

보통 일반적인 html 코드로 table 을 구성하면 이러한 화면으로 보입니다. 기본 html 코드입니다.

하지만 테이블에 몇개의 class 만 넣어주어도 디자인이 이쁘게 바뀝니다.

class 에 넣은 값이 몇개 없지만 처음 테이블과 다르게 변한 것을 볼 수 있습니다.

테이블 class 속성에 stripe, hover, border 등 몇개만 주었을 뿐인데 느낌이 확 다릅니다.

자세한 예제는 아래의 URL에서 확인 하시면 됩니다.

http://getbootstrap.com/css/#tables

Bootstrap 에서 제공하는 Grid System (그리드 시스템) 활용 방법입니다.

그리드를 가지고 반응형 화면을 구성 가능합니다. 

화면을 가로 12개의 사이즈로 나누어 화면 해상도에 따라서 자동으로 맞추어 줍니다.

프로그램 개발자 입장에서 간략히 어떻게 작동되는지 알아두면 간단하게 추가나 수정이 가능합니다.

간단하게 기본 Grid 를 그려봤습니다.

소스를 웹화면에서 보면 이렇게 나옵니다.

총 12개의 칸을 가지고 숫자값을 가지고 나누어서 쓸 수 있습니다.

또한 화면 해상도의 변화에 따라 Grid 위치가 자동적으로 바뀌게 됩니다.

스마트폰, PC, 태블릿 등 각각의 화면에 맞추어 자동으로 바뀌기 때문에 반응형 웹으로 구성하기 좋습니다.

다양한 Grid System 의 옵션들입니다.

다양한 class 옵션들로 화면 구성이 가능합니다.

Offset 옵션으로 중간에 빈칸을 만들 수도 있습니다.

사이즈를4 주었지만 offset 4의 값을 주면서 중간에 4 사이즈 만큼 빈칸이 생기게 됩니다.

이번에 소개하는 제품은 Mio Cyclo 105 제품입니다.

맘같아서는 가민(Garmin) 510 으로 구매하고 싶었지만 약 30만원대로 가격이 사실 많이 비쌉니다.

그래서 브라이튼(bryton) 제품으로 알아보다가 eBay 에서 Mio 속도계를 $89 가격으로 세일하길래 바로 구매했습니다.

사실 미오 제품과 브라이튼 제품이 비슷한 중저가 GPS 속도계라고 보시면 될 것같습니다.

가민 제품 중에 500과 비슷한 것 같네요. 가민이 가격이 거의 2배는 비싼 것 같네요.

처음 자전거 탈때 스마트폰 앱인 ipbike, 엔도몬도, 스트라바 등등 여러가지 앱으로 라이딩을 기록을 했었습니다.

스마트폰으로 기록을 하다보니 단점이 항상 배터리가 부족하게되고 실시간으로 속도를 보기가 힘든 점이 있습니다. 

그래서 GPS 속도계로 변경을 했는데 정말 만족스럽습니다.

박스를 오픈해보면 심플합니다.

속도계를 보면 사이즈는 정말 작습니다. 가민 500과 비슷한 정도 크기입니다.

왼쪽에 버튼 2개와 오른쪽에 버튼 2개해서 총 4개의버튼이 있습니다.

전원을 키면 삐릭~하는 소리와함께 켜지는데 옛날에 다마고치 사용하는 느낌이네요.

디자인도 깔끔하고 색감도 좋습니다.

화면 분할 세팅해 놓은 화면입니다. 

케이던스, 심박 등 불필요한 화면은 제거하고 필요한 데이터만 넣어두었습니다.

현재 속도와 거리는 크게 보고 평균속도와 라이딩 시간은 작게 표시했습니다.

왼쪽 위의 LIGHT 버튼을 누르면 백라이트가 이렇게 꺼집니다.

백라이트가 되서 야간 라이딩 시에 진짜 좋습니다.

왼쪽의 MENU 버튼을 누르게되면 화면이 전환이 됩니다.

이 부분도 세팅이 가능하며 저같은 경우 현재 시간으로 해두었습니다.

그래서 라이딩을 하다가 현재 시간을 보고 싶으면 버튼 하나 눌러서 시간을 보고 다시 돌려놓고 합니다.

메뉴에서 오른쪽의 위,아래 버튼으로 눌러서 기록, 설정 등 이동이 가능합니다.

또한 PC 연결 메뉴로 업로드도 하구요.

케이엣지에 마운트한 모습입니다.

가민 510과 비슷한 Mio Cyclo 105 를 5개월정도 사용하면서 느낀점입니다.

Mio Cyclo 105 의 장점입니다.

1. 약 10만원 정도의 저렴한 가격 (단 케이던스, 심박계 제외)

2. 18시간 정도 라이딩 가능한 배터리용량

3. 백라이트 가능

4. Auto Pause, 화면 분할 등 다양한 기능 (가민과 비슷한 것 같습니다.)

개인적으로 느끼는 단점입니다.

1. 기록을 Upload 하려면 MioShare 이라는 전용 프로그램을 통해서만 업로드 가능

2. 마이크로 USB 잭이 아닌 이전 버전 USB 포트 (가민 510과 동일한 포트)

저에게 단점으로 느끼는 점은 이제는 쓰지않는 USB 포트 규격과 upload의 불편한 점 외에는 크게 불편한 점은 없었습니다.

Strava 와 동기화도 잘되고 GPS도 튄적 한번도 없어서 라이딩을 기록하기에는 좋은 제품이었습니다.

특비 배터리 같은 경우 하루종일 라이딩을 하고 와도 50% 이하로 떨어진 적이 없어서 배터리 걱정은 하지 않아도 되니 좋습니다.

제가 GPS 속도계를 사용하는 이유는 단순히 라이딩을 기록하기 위한 목적이기 때문에 저에게는 가격대비 맞네요.

가민 520, 510, 500 제품 가격이 부담스러우시고 가볍게 라이딩 기록 목적이시라면 구매해서 사용해 보시는 것도 좋을 것같습니다.