これからのWEB制作必須スキルセット #wpdfes #gmoyours

1,276 views

Published on

WP-D Fes #01 Megane Fes in GMO
2014/02/01/sat

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,276
On SlideShare
0
From Embeds
0
Number of Embeds
204
Actions
Shares
0
Downloads
7
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

これからのWEB制作必須スキルセット #wpdfes #gmoyours

  1. 1. これからのWEB制作必須スキルセット
  2. 2. 機器 Apple - MacBook Pro Ratina - 画面キレイ! - スペックに文句なし - 16GB メモリ - キャプチャが倍で面倒 - ストレージ256GBは
 こころ細かった
  3. 3. まずはデモ http://www.youtube.com/watch?v=WjYWMPdpfHk
  4. 4. さて黒い画面です
  5. 5. さて黒い画面です cd 移動
  6. 6. さて黒い画面です ls 表示
  7. 7. さて黒い画面です exit 出る
  8. 8. さて黒い画面です 大抵書いてある ドルマークは不要
  9. 9. このページが大事 http://gatespace.jp/2013/10/31/mac-web-setup-use-terminal/
  10. 10. Homebrew
  11. 11. webkit2png
  12. 12. node node npm ! ruby
  13. 13. npm
  14. 14. Ruby
  15. 15. RubyGem
  16. 16. Grunt
  17. 17. Gruntはnpm
  18. 18. Compass
  19. 19. CompassはRuby
  20. 20. なんにせよこのページです http://gatespace.jp/2013/10/31/mac-web-setup-use-terminal/ 色々なのでとにかく gatespace ! ----
  21. 21. 何回も出てくる内容 ! 何がし -v バージョン確認 ! 確認 -v これができればインストールできてる
  22. 22. やっと Gruntです そしてGrunt nodeで動くので npm でインストールしてる
  23. 23. やっと Gruntです https://github.com/megane9988/Foundation5-meganeset タスクランナー ! いろんなことを任意のタイミングでできる ! メガネのを見てみましょう ! ホスト作って ! 監視して ! そのタイミングで自動化
  24. 24. さて黒い画面です とここまでやりましたが ! codekit koara ! などは 入れればできます。
  25. 25. さて黒い画面です ! じゃあなんでやるの? ! そのうち、もっとすごい機能がでるかも なれるならいまのうち
  26. 26. さて黒い画面です つづいてgit ! 分散ファイル管理 ! 流れ ! ローカル編集 ! リポジトリ(共有保管庫)にプッシュ ! 本番からプル
  27. 27. さて黒い画面です いいところ ! リポジ トリ ftp見たいにまどろっこしくない ! 全部履歴残る ! 戻せる ! プログラマの変更箇所わかる ! 学べる 本番 ローカル
  28. 28. さて黒い画面です 共有保管庫 ! github ! 掲示板のような機能があり フォローしたり ウォッチしたり ! あとほかにも、ある
  29. 29. さて黒い画面です バックログは見やすいうえに 課題管理と繋がる ! べんり ! おぼえるとすぐ ! 黒い画面じゃなくても大丈夫 ! でも使えた方がお得
  30. 30. さて黒い画面です foundation ! cssフレームワーク 有りものですぐ実装できる ! 例えばオフセット ! グリッド
  31. 31. さて黒い画面です http://notnil-creative.com/blog/archives/1785 ドキュメントをみながらやればok ! ヒッシーのブログは翻訳してくれてる ! 8に対応したければ3をつかう ! 脆弱性きにしなくてよい
  32. 32. Vagrant vagrant ! ローカルにサーバ環境を作る ! 一発でwordpress入る ! すぐはじめられる ! ここで修正 ! 確認後git を使ってアップすれば効率良い
  33. 33. Vagrant up ! halt ! destroy
  34. 34. wp cli wp cli コマンドでいろいろ操作 ! プラグインリスト ! コアアップロード ! 手っ取り早い ! WordPressが入ってるサーバで WordPressを操作する
  35. 35. Fesサイトでデモします こんな感じ リポジ トリ ! fesサイトも大体全部使ってる 本番 ローカル
  36. 36. 後出来る限り便利なソフト ClipMenu sublime Dragon Drop Bartender Fantastical Alfred ! ! macの方がべんりツール多い印象 さあ、快適構築環境でレッツラゴー!

×