Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Project Lab Squirrel #2
Search
Mu-An Chiou
May 25, 2014
Technology
1
570
Project Lab Squirrel #2
Location: My home
Time: 25 May 2014 (Sun)
Mu-An Chiou
May 25, 2014
Tweet
Share
More Decks by Mu-An Chiou
See All by Mu-An Chiou
Details on <details>
muan
0
280
Publishing and Hosting on GitHub pages
muan
4
130
Having no patience(Japanese)
muan
1
360
JSDC
muan
2
520
Design with Code
muan
5
530
Having no patience
muan
1
290
Design in GitHub
muan
5
360
Project Lab Squirrel #1
muan
8
810
A girl with no patience
muan
18
1.9k
Other Decks in Technology
See All in Technology
CDCL による厳密解法を採用した MILP ソルバー
imai448
3
150
Security-JAWS【第35回】勉強会クラウドにおけるマルウェアやコンテンツ改ざんへの対策
4su_para
0
180
エンジニア人生の拡張性を高める 「探索型キャリア設計」の提案
tenshoku_draft
1
130
TypeScriptの次なる大進化なるか!? 条件型を返り値とする関数の型推論
uhyo
2
1.7k
FlutterアプリにおけるSLI/SLOを用いたユーザー体験の可視化と計測基盤構築
ostk0069
0
100
飲食店データの分析事例とそれを支えるデータ基盤
kimujun
0
160
AWS Lambdaと歩んだ“サーバーレス”と今後 #lambda_10years
yoshidashingo
1
180
リンクアンドモチベーション ソフトウェアエンジニア向け紹介資料 / Introduction to Link and Motivation for Software Engineers
lmi
4
300k
複雑なState管理からの脱却
sansantech
PRO
1
150
DynamoDB でスロットリングが発生したとき_大盛りver/when_throttling_occurs_in_dynamodb_long
emiki
1
430
100 名超が参加した日経グループ横断の競技型 AWS 学習イベント「Nikkei Group AWS GameDay」の紹介/mediajaws202411
nikkei_engineer_recruiting
1
170
OS 標準のデザインシステムを超えて - より柔軟な Flutter テーマ管理 | FlutterKaigi 2024
ronnnnn
0
230
Featured
See All Featured
Gamification - CAS2011
davidbonilla
80
5k
Rails Girls Zürich Keynote
gr2m
94
13k
Writing Fast Ruby
sferik
627
61k
Code Review Best Practice
trishagee
64
17k
Testing 201, or: Great Expectations
jmmastey
38
7.1k
The Art of Programming - Codeland 2020
erikaheidi
52
13k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
27
840
Side Projects
sachag
452
42k
Facilitating Awesome Meetings
lara
50
6.1k
Docker and Python
trallard
40
3.1k
The Cost Of JavaScript in 2023
addyosmani
45
6.8k
Rebuilding a faster, lazier Slack
samanthasiow
79
8.7k
Transcript
ḱᙿᖳᔚᩲᤍ Project Lab Squirrel #2
layout
FROM IMAGE TO HTML ᷡṍኈ
<body> <div class="menu"> <div class="logo"><img src="/logo.png"></div> <a href="">LESSONS</a> <a href="/participants">PARTICIPANTS</a>
<a href="">ABOUT</a> </div> <div class="content"> ⼀一些內容在這裡頭。 </div> </body>
<body> <div class="menu"> <div class="logo"><img src="/logo.png"></div> <a href="">LESSONS</a> <a href="/participants">PARTICIPANTS</a>
<a href="">ABOUT</a> </div> <div class="content"> ⼀一些內容在這裡頭。 </div> </body>
<body> <div class="menu"> <div class="logo"><img src="/logo.png"></div> <a href="">LESSONS</a> <a href="/participants">PARTICIPANTS</a>
<a href="">ABOUT</a> </div> <div class="content"> ⼀一些內容在這裡頭。 </div> </body>
<body> <div class="menu"> <div class="logo"><img src="/logo.png"></div> <a href="">LESSONS</a> <a href="/participants">PARTICIPANTS</a>
<a href="">ABOUT</a> </div> <div class="content"> ⼀一些內容在這裡頭。 </div> </body>
<body> <div class="menu"> <div class="logo"><img src="/logo.png"></div> <a href="">LESSONS</a> <a href="">PARTICIPANTS</a>
<a href="">ABOUT</a> </div> <div class="content"> ⼀一些內容在這裡頭。 </div> </body>
<div class="content"> ... </div> .content { padding: 50px; height: 100%;
overflow: scroll; } <div class="menu"> ... </div> .menu { float: left; width: 20%; height: 100%; } TADA!
Wait, float?
JUST LIKE WRAPPING! WORD. Ⴐ᠏የ᠏Ⴐ᠏የ
CSS BOX MODEL ᷱᥘኦṞ
CSS BOX MODEL ᷱᥘኦṞ box-sizing: content-box CONTENT PADDING BORDER
MARGIN WIDTH
CSS BOX MODEL ᷱᥘኦṞ box-sizing: border-box CONTENT PADDING BORDER
MARGIN WIDTH
GIT
GITHUB FOR MAC/WINDOWS GIT ON THE COMMAND LINE
Git REPOSITORY ఔࣜࢿྉᇄ BRANCH ࢧฏߦੈք COMMIT ঝఏަ
DIFF ࠩҟ
ADD a BRANCH ᙮ᬓᵪḝᕴ
WOrking area STAGING AREA GIT DIRECTORY modified: index.html modified: style.css
WOrking area STAGING AREA GIT DIRECTORY modified: index.html modified: style.css
WOrking area STAGING AREA GIT DIRECTORY modified: index.html modified: style.css
git add css/style.css ਗЪ ᏦࣩЗѧ
WOrking area STAGING AREA GIT DIRECTORY modified: index.html modified: style.css
WOrking area STAGING AREA GIT DIRECTORY modified: index.html modified: style.css
WOrking area STAGING AREA GIT DIRECTORY modified: index.html git checkout
style.css ਗЪ ᏦࣩЗѧ modified: style.css
WOrking area STAGING AREA GIT DIRECTORY modified: index.html modified: style.css
WOrking area STAGING AREA GIT DIRECTORY modified: index.html modified: style.css
git add css/style.css ਗЪ ᏦࣩЗѧ
WOrking area STAGING AREA GIT DIRECTORY modified: index.html modified: style.css
WOrking area STAGING AREA GIT DIRECTORY modified: index.html git commit
-m “修改css” ਗЪ ܸ֛ৃࢹ modified: style.css ৃࢹ
WOrking area STAGING AREA GIT DIRECTORY modified: index.html modified: style.css
WOrking area STAGING AREA GIT DIRECTORY modified: index.html 83ca17b style.css
commit sha
PUBLISH BRANCH ᓓ᧵ᵪḝᕴ
PULL REQUEST
PULL REQUEST
TADA!
᷀ᮈ Project Lab Squirrel #2