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
進擊的 Mac OS 之前端开发
Search
hzlzh
September 06, 2013
Technology
3
400
進擊的 Mac OS 之前端开发
使用Mac OS进行前端开发的一点分享
原版Keynote下载地址:
http://vdisk.weibo.com/s/z9dGioP9NHYr9
hzlzh
September 06, 2013
Tweet
Share
More Decks by hzlzh
See All by hzlzh
[WebRebuild 2013] 移动终端重构Workflow
hzlzh
20
7.7k
1.618 发现设计之美
hzlzh
3
1.1k
Other Decks in Technology
See All in Technology
AIプロダクトのプロンプト実践テクニック / Practical Techniques for AI Product Prompts
saka2jp
0
100
Observability for the system understanding and curious by developers
maruloop
1
490
ヘンリー会社紹介資料(エンジニア向け) / company deck for engineer
henryofficial
0
340
デザインとエンジニアリングの架け橋を目指す OPTiMのデザインシステム「nucleus」の軌跡と広げ方
optim
0
100
Biz職でもDifyでできる! 「触らないAIワークフロー」を実現する方法
igarashikana
7
3.1k
AI駆動で進める依存ライブラリ更新 ─ Vue プロジェクトの品質向上と開発スピード改善の実践録
sayn0
1
240
アウトプットから始めるOSSコントリビューション 〜eslint-plugin-vueの場合〜 #vuefes
bengo4com
3
1.6k
Zephyr(RTOS)にEdge AIを組み込んでみた話
iotengineer22
1
310
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
12
81k
Introduction to Sansan Meishi Maker Development Engineer
sansan33
PRO
0
310
What's new in OpenShift 4.20
redhatlivestreaming
0
160
Contract One Engineering Unit 紹介資料
sansan33
PRO
0
9k
Featured
See All Featured
The Pragmatic Product Professional
lauravandoore
36
7k
Mobile First: as difficult as doing things right
swwweet
225
10k
Designing Experiences People Love
moore
142
24k
How GitHub (no longer) Works
holman
315
140k
The Cult of Friendly URLs
andyhume
79
6.6k
Building a Modern Day E-commerce SEO Strategy
aleyda
44
7.8k
Code Review Best Practice
trishagee
72
19k
Speed Design
sergeychernyshev
32
1.2k
Music & Morning Musume
bryan
46
6.9k
Rails Girls Zürich Keynote
gr2m
95
14k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.5k
The Power of CSS Pseudo Elements
geoffreycrofte
80
6k
Transcript
None
進擊的 Mac OS 前端开发
進擊的 Mac OS ⻩黄⾃自⼒力 @hzlzh 前端开发
進擊的 Mac OS ⻩黄⾃自⼒力 @hzlzh 前端开发
⾃自我介绍
⾃自我介绍 ‣ ECC - 移动终端设计中⼼心 - 前端开发组
⾃自我介绍 ‣ 从Mac OS 10.6 开始做为主开发环境 ‣ ECC - 移动终端设计中⼼心
- 前端开发组
⾃自我介绍 ‣ 从Mac OS 10.6 开始做为主开发环境 ‣ ECC - 移动终端设计中⼼心
- 前端开发组 •10.6 Snow Leopard •10.7 Lion •10.8 Mountain Lion •10.9 Mavericks
⾃自我介绍 ‣ 从Mac OS 10.6 开始做为主开发环境 ‣ ECC - 移动终端设计中⼼心
- 前端开发组 ‣ Mac OS & iOS 发烧友 •10.6 Snow Leopard •10.7 Lion •10.8 Mountain Lion •10.9 Mavericks
为什么选择 MAC OS 开发环境 ?
‣ UI漂亮、操作简单、 ⾼高端⼤大⽓气上档次??? 为什么选择 MAC OS 开发环境 ?
‣ UI 为什么选择 MAC OS 开发环境 ?
‣ UI 为什么选择 MAC OS 开发环境 ? ‣ 基于Unix 集成
c/c++/java/perl/python/php/ruby/lisp
‣ UI 为什么选择 MAC OS 开发环境 ? ‣ 基于Unix 集成
c/c++/java/perl/python/php/ruby/lisp • brew install node
‣ UI 为什么选择 MAC OS 开发环境 ? ‣ 基于Unix 集成
c/c++/java/perl/python/php/ruby/lisp • brew install node • brew install git
‣ UI 为什么选择 MAC OS 开发环境 ? ‣ 基于Unix 集成
c/c++/java/perl/python/php/ruby/lisp • brew install node • brew install git • brew install unrar
‣ UI 为什么选择 MAC OS 开发环境 ? ‣ 基于Unix 集成
c/c++/java/perl/python/php/ruby/lisp • brew install node • brew install git • brew install unrar • brew cask install qq
‣ UI 为什么选择 MAC OS 开发环境 ? ‣ 较好的开发者⽣生态环境 ‣
基于Unix 集成 c/c++/java/perl/python/php/ruby/lisp • brew install node • brew install git • brew install unrar • brew cask install qq
‣ UI 为什么选择 MAC OS 开发环境 ? ‣ 较好的开发者⽣生态环境 ‣
基于Unix 集成 c/c++/java/perl/python/php/ruby/lisp ‣ 丰富的开发⼯工具、效率⼯工具、成熟的⼯工作流 • brew install node • brew install git • brew install unrar • brew cask install qq
‣ UI 为什么选择 MAC OS 开发环境 ? ‣ 较好的开发者⽣生态环境 ‣
基于Unix 集成 c/c++/java/perl/python/php/ruby/lisp ‣ 丰富的开发⼯工具、效率⼯工具、成熟的⼯工作流 ‣ Time Machine备份,⼏几乎没有病毒, 游戏稀少 • brew install node • brew install git • brew install unrar • brew cask install qq
内⺴⽹网 MAC 开发环境问题
内⺴⽹网 MAC 开发环境问题 == 可访问 == • 内网环境 • yahoo.com
/ gmail.com • twitter.com / facebook.com ‣ 内⺴⽹网WiFi
内⺴⽹网 MAC 开发环境问题 == 可访问 == • 内网环境 • yahoo.com
/ gmail.com • twitter.com / facebook.com ‣ 内⺴⽹网WiFi == 不能访问 == • 未配代理:Dropbox | Sublime Text Package Control | intellij IDEA Plugin • 不支持代理:Mail.app/Sparrow.app | 迅雷.app | Alfred Feedback • 命令行:node | python | wget | npm | ruby | curl • 非白名单的被认证网站:feedly.com | vimeo.com | gfwlist.autoproxy.org 1SPYJGJFSBQQ
None
MAC 前端开发效率⼯工具分享
* 快速启动 * 剪切板历史记录 * 快速翻译 * 常⽤用短语⽚片段 * Hosts切换
* Hosts管理 * 取⾊色⼯工具 * PhotoShop 联动 Alfred Gas Mask Frank DeLoupe * 强⼒力8合⼀一⼯工具 * iOS标注,预览 * ⾃自动刷新浏览器 * ⾃自动编译 * 配⾊色⼯工具 * 配⾊色预览 xScope Live Reload ColorSchem er Studio * 快速开发环境 * 代码⽚片段收藏 * 查阅⽂文档 * 短语快速扩展 * 多屏多窗⼝口管理 * 快捷键定位窗⼝口 Code Runner Dash Moom MAC 前端开发效率⼯工具分享
新项⺫⽬目流程
‣ grunt init - 初始化项⺫⽬目 新项⺫⽬目流程
‣ grunt init - 初始化项⺫⽬目 ‣ grunt less - less
-> yuicompress -> css 新项⺫⽬目流程
‣ grunt 2x2x - @2x 转 普清 ‣ grunt init
- 初始化项⺫⽬目 ‣ grunt less - less -> yuicompress -> css 新项⺫⽬目流程
‣ grunt 2x2x - @2x 转 普清 ‣ grunt init
- 初始化项⺫⽬目 ‣ grunt hellosprite - 合并雪碧图 ‣ grunt less - less -> yuicompress -> css 新项⺫⽬目流程
‣ grunt 2x2x - @2x 转 普清 ‣ grunt init
- 初始化项⺫⽬目 ‣ grunt copy - 创建发布⺫⽬目录 ‣ grunt hellosprite - 合并雪碧图 ‣ grunt less - less -> yuicompress -> css 新项⺫⽬目流程
‣ grunt 2x2x - @2x 转 普清 ‣ grunt init
- 初始化项⺫⽬目 ‣ grunt copy - 创建发布⺫⽬目录 ‣ grunt hellosprite - 合并雪碧图 ‣ grunt pngmin - 压缩png图⽚片 ‣ grunt less - less -> yuicompress -> css 新项⺫⽬目流程
‣ grunt 2x2x - @2x 转 普清 ‣ grunt init
- 初始化项⺫⽬目 ‣ grunt copy - 创建发布⺫⽬目录 ‣ grunt hellosprite - 合并雪碧图 ‣ grunt pngmin - 压缩png图⽚片 ‣ grunt watch - 监控⽂文件变动触发事件 ‣ grunt less - less -> yuicompress -> css 新项⺫⽬目流程
‣ grunt 2x2x - @2x 转 普清 ‣ grunt init
- 初始化项⺫⽬目 ‣ grunt copy - 创建发布⺫⽬目录 ‣ grunt hellosprite - 合并雪碧图 ‣ grunt pngmin - 压缩png图⽚片 ‣ grunt watch - 监控⽂文件变动触发事件 ‣ grunt ftp-deploy - 发布到内⺴⽹网服务器和外⺴⽹网体验 ‣ grunt less - less -> yuicompress -> css 新项⺫⽬目流程
None
MAC 效率⼯工具推荐
* 超赞的 Diff ⼯工具 * 精美的界⾯面 * 时间管理⼯工具 * 健康提醒⼯工具
* 番茄⼯工作法 * 图⽚片素材收集 * 素材管理 Kaleidoscope Break Time Sparkbox * 效率⼯工具 *类iOS Tip机制 * 临时栈 * ⽂文件操作 * Mac App 更新⼯工具 * 软件管家 Popclip Dropshelf MacUpdate * 多屏幕⿏鼠标切换 * 节省⿏鼠标轨迹 * Menu栏管理 * ⾃自定义图标排列 * 强迫症必备 * 快捷键提⽰示 * 键盘流的⺩王道 Catch Mouse Bartender CheatSheet MAC 效率⼯工具推荐
扩展 ‣ OS X Daily - http://osxdaily.com/ ‣ V2EX -
Mac OS 节点 - http://v2ex.com/go/macosx/
None
THANK YOU! @hzlzh