13
Windowsで始めるウェブ制作 ~開発環境 構築編~ コクボユウキ

Windowsで始めるウェブ制作 ~開発環境 構築編~

Embed Size (px)

Citation preview

Page 1: Windowsで始めるウェブ制作 ~開発環境 構築編~

Windowsで始めるウェブ制作

~開発環境 構築編~

コクボユウキ

Page 2: Windowsで始めるウェブ制作 ~開発環境 構築編~

Windowsで始めるウェブ制作 ~開発環境 構築編~

本日の概要

1. はじめに

2. パッケージ管理ソフト Chocolatey

3. ターミナルエミュレータ ConEmu と PuTTY

4. ローカルでWordPressが動く XAMPP

5. とりあえず入れておきたい Git や Ruby

6. その他、あれば便利なソフトなど

Page 3: Windowsで始めるウェブ制作 ~開発環境 構築編~

1. はじめに

Windowsで開発環境を整えようとして、挫折したことはありませんか?

Macなら標準で入っているターミナルさえ、

Windowsでは自分で用意しなければ、

SSHでサーバにつなぐこともできません。

今日のお話は、環境構築にかかる手間を省いて、

ウェブ制作を始めるまでの敷居を下げてみよう、

というテーマで進めてみます。

Page 4: Windowsで始めるウェブ制作 ~開発環境 構築編~

2. パッケージ管理ソフト Chocolatey

Chocolateyとは?

Windowsソフトの「検索」「ダウンロード」「インストール」

「更新」などを、まとめて行なってくれるソフト。

公式サイトは https://chocolatey.org/

コマンドプロンプトを管理者モードで立ち上げ、公式サイトの

トップに書かれたコマンドを入れるだけで、インストール完了。

C:¥> @powershell ‐NoProfile ‐ExecutionPolicy unrestricted ‐Command "iex ((new‐object net.webclient).DownloadString('https://chocolatey.org/install.ps1'))" && SET PATH=%PATH%;%ALLUSERSPROFILE%¥chocolatey¥bin

C:¥> @powershell ‐NoProfile ‐ExecutionPolicy unrestricted ‐Command "iex ((new‐object net.webclient).DownloadString('https://chocolatey.org/install.ps1'))" && SET PATH=%PATH%;%ALLUSERSPROFILE%¥chocolatey¥bin

Page 5: Windowsで始めるウェブ制作 ~開発環境 構築編~

2. パッケージ管理ソフト Chocolatey

どんなソフトがインストールできるの?

海外製のソフトを中心に2380種類(2014/11/25現在)

ChromeやFirefoxなどのブラウザ、SublimeTextなどのエディタ、

その他、有名なソフトはだいたい揃っている。

C:¥> cinst firefoxC:¥> cinst firefox

たとえば、Firefoxを入れてみよう

たったこれだけでインストール完了。

ソフトの更新や削除するときも、

コマンドを1行だけ入力すればOK!

Page 6: Windowsで始めるウェブ制作 ~開発環境 構築編~

2. パッケージ管理ソフト Chocolatey

なぜパッケージ管理を使うのか?

あるソフトの導入に必要な、別のソフトなども同時にインストー

ルしてくれる(依存関係の解決)

環境変数(PATH)の設定も自動で行われる

設定ファイルを作っておけば別のパソコンへの環境構築も簡単

次ページ以降では、

ソフトのインストールにChocolateyを実際に使ってみます。

Page 7: Windowsで始めるウェブ制作 ~開発環境 構築編~

3. ターミナルエミュレータ ConEmu と PuTTY

ターミナルをすべてタブで開けるConEmu

コマンドプロンプトやPowerShell や Git Bash などをすべて1つ

のウィンドウで開けて、見た目も細かくカスタマイズできるのが

ConEmuです。

C:¥> cinst conemuC:¥> cinst conemu

書き忘れていましたが……

cinstというコマンドは

chocolatey install の

省略形です。

Page 8: Windowsで始めるウェブ制作 ~開発環境 構築編~

3. ターミナルエミュレータ ConEmu と PuTTY

WinSCPと連携させれば便利なPuTTY

WindowsでSSH接続するためのソフトPuTTYは、WinSCPで開い

ていたSFTPやSCPのセッションを引き継ぐことができます。

C:¥> cinst winscpC:¥> cinst puttyC:¥> cinst winscpC:¥> cinst putty

Page 9: Windowsで始めるウェブ制作 ~開発環境 構築編~

3. ターミナルエミュレータ ConEmu と PuTTY

PuTTYには、たくさんの派生版があります

フォントのレンダリングが綺麗なD2D/DW PuTTYがおすすめで

すが、その他にもたくさんの派生クライアントがあります。

こちらのブログ記事には、国内や

海外で開発された、たくさんの派

生版がまとめられています。

私的Puttyまとめ -どんごどんご

http://d.hatena.ne.jp/OKIIZO/2

0100401

Page 10: Windowsで始めるウェブ制作 ~開発環境 構築編~

4. ローカルでWordPressが動く XAMPP

もちろんXAMPPだってChocolateyで入ります

WordPressテーマを開発している皆様にはおなじみのXAMPPも、

Chocolateyからのインストールや、最新版への更新ができます。

C:¥> cinst xamppC:¥> choco update xamppC:¥> cinst xamppC:¥> choco update xampp

但しChocolateyからXAMPP最新版へ更新するとき、各種設定や

データが正しく引き継がれるか、僕は確認していません。

念のためバックアップを取ってからの作業をおすすめします。

Page 11: Windowsで始めるウェブ制作 ~開発環境 構築編~

5. とりあえず入れておきたい Git や Ruby

そろそろ時間もなくなってきたので……インストールだけ

C:¥> cinst rubyC:¥> cinst ruby

C:¥> cinst gitC:¥> cinst git

C:¥> cinst sourcetreeC:¥> cinst sourcetree

Page 12: Windowsで始めるウェブ制作 ~開発環境 構築編~

6. その他、あれば便利なソフトなど

テキストエディタNotepad++に、

様々なプラグイン(Emmetなど)を入れる話や、

先日発表されたVisual Studio Communityの話もしたかったのですが……

詰め込みすぎなので(^^;) 次回のテーマに回したいと思います。

Windowsでウェブ制作されている方、

効率のよい方法や、便利なソフトなどをご存知でしたら、

是非とも情報共有していきましょう!

Page 13: Windowsで始めるウェブ制作 ~開発環境 構築編~

ありがとうございましたm(_ _)m