[スタッフコラム]モテる秘訣は作業環境にアリ Vol.2

Put your hand in the air!!

どうも、STRIXディレクター「DJよろずや」です。

上のサムネイル画像見ましたか?気づいちゃいましたか?

そう!

“DJよろずや”の 【ロゴ】 作っちゃいました!!が!!
一応デザイナーの肩書あるので、、サムネも毎回作ってるよ、、

前書きとかもういいですよね?

気になって仕方ないですよね?

今回の本題のモテる秘訣

ローカル環境編

お教えいたしましょう。拍手

はじめに

そもそもローカル環境とはなんぞや?と思う方もいらっしゃるかと思いますが、
それは各自で調べてください。
簡単に言うと

  • 自分のパソコン内でPHPやWordpressなどを動かす
  • 相対パス以外にルートパスを使用する

とかができるって話です。
詳しくは説明しません。

さて、今回紹介するソフトはPreprosLocal by flywheelの2つです。

なお、前回のエディタ編はこちらから

Prepros

PreprosはWindowsとMacに対応しており、無料ですべての機能が使用可能です。
購入すると、定期的に出る「よかったら買ってね!」というポップアップが表示しなくなります。
また、Macの場合ですとCodekitもおすすめですが、有料です。

Your Friendly Web Development Companion

主な機能

  • 指定したフォルダをルートとしてルートパスが使用可能
  • Sass、Less、Pug / Jade、Slim、CoffeeScriptなどがコンパイル可能
  • コード内のエラーログが出力される
  • エディタ保存時に自動的にページがリロードされる
  • CSSやJSのminifyや整形及び、画像の最適化
  • 複数のデバイス間でブラウザーを同期
  • スマホで表示した画面のリモートデバッグが可能
  • ビルドとデプロイ

他にもいろいろ機能がありますが、公式サイトや自分で使ってみてください。
そして例のごとくインストール方法や操作方法は割愛します。

おすすめ設定

おすすめの設定をお教えしたいところではありますが、正直人によって設定はまちまちですので、割愛します。
とりあえず私の変更した個所をお教えします。

①やっぱりテーマはダークモードです。

②コンフィグファイルは邪魔なのでエクスポートしません。
③システムファイルなどは表示してほしいのでチェックは外します。

PreprosではPHPが使えないので、Local by flywheelを使用して仮想サーバーを立てます。
 ここから設定するとPHPが使用できるようになります。

⑤複数ブラウザ、端末で動きを同期したいときはチェックを入れます。
 たまにめんどくさいのでチェックを外します。

⑥FTPにデプロイしたいときはここで設定します。

⑦SCSSからCSSにコンパイルする際に、プレフィックスを自動でつけてほしい時は、チェックを入れます。
 この際、Can I Useをベースにプレフィックスが付与されます。

Local by flywheel

Local by flywheelもWindowsとMacに対応しており、無料で大体の機能が使用可能です。
有料プランにすると、様々な機能が使用可能になります。
無料でも申し分ないので、無料でも大丈夫です。
むしろ有料プランだと持て余します。

Local | Local WordPress development made simple
Local is a free local development environment designed to simplify the workflow of WordPress developers and designers. Download it for free today!

主な機能

  • パソコン内にワンクリックでWordpress環境が構築可能(むしろこれがメイン)
  • SSLを使用してローカルサイトのテストが可能
  • PHP Version、Web Server、MySQL Versionが選択および変更が可能
  • ログファイルの出力
  • 本番環境、ステージング環境へのデプロイ
  • 本番環境をクローンしてローカル環境にサイトを復元

こちらも他にもたくさん機能がありますが、公式サイトや自分で使ってみてください。
そしてもちろんインストール方法や操作方法は割愛します。

おすすめ設定

Local by flywheelについては特におすすめ設定はありませんので、
自分が作りたいローカル環境に応じて設定を変更してください。

また、先ほどPreprosではPHPを使用できないとお話ししましたが、一度Local by flyfheelでWordpress環境を構築した後、Wordpress本体を削除すれば中身が空のローカルサーバーとして使用することが可能です。

この構築した環境をPreprosのCustom Serverとして設定することでPHPが使用可能となります。

おわりに

いかがでしたか?(いつもの)
コーディングにおいて、ローカル環境は必須と言っても過言ではありません。
XAMPPMAMPPは有名ですが、hosts設定などがあるため、初心者にはあまりお勧めできません。

やはりGUIで簡単に環境を構築できることが、作業効率化において重要となります。
是非PreprosLocal by flywheelを使用してくださいね。

Have a nice cording day!!

トップへ戻る