zoukankan      html  css  js  c++  java
  • 本地开发环境搭建(windows)

    一。虚拟器安装

    1.概念

    ・为什么要搭建搭建模拟环境

    在租借服务器前用手中的PC模拟一个服务器的环境,可以打包与团队人员分享

     ・什么是Vagrant

    https://segmentfault.com/a/1190000008729625

    VirtualBox は直接扱わないので実態が見えにくいのですが Vagrant のコマンドを通して裏で VirtualBox が動いている、というイメージを持っておくといいでしょう。

    2.安装VirtualBox(环境)

    https://eng-entrance.com/virtualbox-installのVirtualboxのセットアップ

    3.安装Vagrant (工具)

    http://weblabo.oscasierra.net/install-vagrant-onto-windows/

    4.各个文件夹的关系与顺序

    MyVagrant 放整个虚拟环境的所有文件(为了把所有虚拟服务器放在一起管理)

    MyCentOS,MyProject每建一个虚拟服务器就需要建一个文件夹(为了让Vagrant 工具区分)

    Vagrantfile存放每个服务器中的设定,给Vagrant 工具读

    5.启动虚拟机并制作文件夹

    启动windows powershell⇒输入以下命令

    # vagrantの便利なプラグインを導入
    vagrant plugin install vagrant-vbguest
    # 今後複数の仮想マシンを作ることを想定して、それらをまとめるフォルダ(MyVagrant)を作る
    mkdir MyVagrant
    # MyVagrantに移動する
    cd MyVagrant
    # 仮想マシンを作るフォルダを作る(MyCentOS)
    mkdir MyCentOS
    # MyCentOSに移動する
    cd MyCentOS
    # 仮想マシン設定用のVagrantfileを作る
    vagrant init bento/centos-6.8
    # Vagrantfileを編集して仮想マシンのIPアドレスを192.168.33.10にする,去掉注释符号
    # 仮想マシンを起動する(少し時間かかります)
    vagrant up
    # 仮想マシンの状態を確認する
    vagrant status

    ※Lavasoft、スパイウェア・マルウェア対策ソフト「Ad-Aware 10.5」を公開 - 窓の杜 http://forest.watch.impress.co.jp/docs/news/588340.html

    もしインストールされていたらそのソフトが影響している可能性がありますので一旦アンインストールしてみてください。

    二。安装putty

    1.在启动模拟机的状态下安装putty工具

    先在windows powershell输入exit退出(退出后模拟机仍为启动状态)

    2.安装putty(接口连接软件)

    https://www.adminweb.jp/web-service/ssh/index2.html

    3.设置putty

    https://support.clara.jp/use/web/upload/ssh/putty.htm

    4.在putty中输入以下命令,导入PHP和Puby

    # OSを最新状態にアップデート(時間かかります)
    sudo yum -y update
    # スクリプトを入手するためのgitをインストール
    sudo yum -y install git
    # gitを使ってアプリケーション設定用のスクリプトをダウンロード
    git clone https://github.com/dotinstallres/centos6.git
    # centos6フォルダができるのでそちらに移動
    cd centos6
    # スクリプトを実行(時間かかります)
    ./run.sh
    # もろもろの設定を反映
    exec $SHELL -l

    5.安装cyberduck

    https://jingyan.baidu.com/article/95c9d20d48dd24ec4e7561b5.html

    6.设置阅览器

    エクスプローラーを開いて

    ファイルメニューから「フォルダーと検索のオプションの変更」を選んであげてください。2箇所ほど確認してほしいのですが、表示タブの下にある「ファイルとフォルダーの表示」で、2 つチェックボックスがありますが、上の「隠しファイル、隠しフォルダー、および隠しドライブを表示する」になっていることを確認しておいてください。箇所ほど確認してほしいのですが、表示タブの下にある「ファイルとフォルダーの表示」で、2 つチェックボックスがありますが、上の「隠しファイル、隠しフォルダー、および隠しドライブを表示する」になっていることを確認しておいてください。それからもう 1 つ、「登録されている拡張子は表示しない」のチェックが外れていることも確認しておくといいでしょう。

    7.设置cyberduck 

    こちらで設定をしていきたいのですが、「編集」メニューの「環境設定」を選んであげましょう。

    いくつか設定していきたいのですが、「ブラウザ」タブの「'.'で始まるファイルを表示」と「ダブルクリックしたファイルを外部エディタで開く」をチェックしておきましょう。

    外部エディタの設定をしたいのでこちらに行ってあげて、今回は Atom を指定していきたいと思います。

    Atom を指定する場合、隠しフォルダーを見ないといけないので…、次のように操作していってください。

    まずは PC の C ドライブに行ってあげて、「ユーザー」フォルダー、自分の名前のフォルダー、そして AppData、そして Local、その後に atom、bin の下の atom.cmd を選んであげてください。

    リストには何も表示されていませんが、ちゃんと選択できているので、心配しないようにしましょう。

    「常に省略時エディタを使用」にチェックしておいて、常に Atom を立ち上げるようにしましょう。

    では閉じてあげて…、今の設定を反映させるには Cyberduck を一度終了させる必要があるので、こちらで閉じてあげましょう。

    8.使用cyberduck设置模拟机

    さて、Cyberduck の設定ができたはずなので、Cyberduck を使って仮想マシンに接続していきましょう。
    では起動してあげます。
    仮想マシンに接続するには、まず「新規接続」を選んであげてください。
    そうするといろいろな設定があるのですが、まずはこちらのプロトコルを SFTP にしてあげてください。
    他のツールでも似たような選択肢が並んでいるのですが、SFTP や SSH と書かれたものを選んであげるといいでしょう。
    サーバは今回、192.168.33.10 なので、そのように書いてあげます。
    ユーザー名、パスワードは PuTTY のところでも見た通り、vagrant、vagrant としてあげればいいので、そのように打ち込んであげてください。
    「接続」とすると、「そのホストは現在システムに認識されていません、許可しますか」と出てきているので、許可してあげましょう。
    何度も聞かれたくない場合は、「常に」にチェックを入れてあげれば OK です。
    これでうまくいったはずです。
    このあたりのファイルは、アプリケーションの設定をしたときや OS をインストールしたときに出てくるファイルなので、あまり気にしなくても OK かと思います。
    それから、今いるフォルダーなのですが、home フォルダーの下の vagrant フォルダーになっています。
    これは「vagrant ユーザーのホームフォルダー」と呼んだりするので、覚えておいてください。
    これからいろいろな勉強をしていくかと思いますが、大抵の場合はこちらにフォルダーを作ったり、ファイルを作っていってあげれば OK です。
    では、こちらの接続をブックマークとして保存しておいてあげます。
    こちらの「ブックマーク」メニューから、「新規ブックマーク」を作ってあげましょう。
    名前をつけることができるので、MyCentOS としてあげましょう。
    設定完了したら右上の×で設定画面を閉じる。
    9.做第一个php文件
    在cyberduck的ファイル一览中新建一个php_lessons文件夹,在文件夹中再新建一个index.php 文档
    大抵のレッスンでは、vagrant のホームフォルダーにファイルを作っていくかと思うので、こちらにフォルダーを作っていきます。
    右クリックするとこういったメニューが現れるので、では今回 PHP を勉強していると仮定して、php_lessons というフォルダを作ってあげましょう。
    今 Atom で開いたはずなので、こちらで命令を書いていきます。

    <?php

    echo "hello!";

    こういった形に書いてあげれば OK かと思います。
    せっかくなので、これをブラウザのほうで確認してみましょう。
    まず Ctrl + S で保存をしてあげてください。
    その後に Web サーバーというものを立ち上げないといけないのですが、こちらの PuTTY のほうから操作していきます。
    今 centos6 というフォルダにいるのですが、vagrant のホームフォルダに戻るには単に cd と打てばいいので、まず戻ってあげてください。
    その下に php_lessons というフォルダを作ったので、まずはそちらに移動してあげましょう。
    このあたりは PHP のレッスンを見てほしいのですが、php -S 192.168.33.10:8000 とすると Web サーバー を立ち上げてくれるはずです。
    そうするとここにアクセスしなさいよと言われるので、これをコピーしてあげましょう。
    単にこのようになぞってハイライトするだけで PuTTY ではコピーができるので、それも覚えておくといいかと思います。
    ではブラウザを立ち上げたいので、こちらで立ち上げてあげて、そのまま貼り付けてあげれば OK でしょう。
    hello!在浏览器上显示出来
    もしくは別の命令を試したかった場合は、Atom で書き換えてあげて、また Ctrl + S で保存してあげて、さらにブラウザでリロードしてあげると…こうですね、ちゃんと反映されているのがわかるかと思います。
     
    10.关闭开发环境
    ①阅览器,文字编辑器,文件转送工具(cyberduck)可以直接关
    putty  按Ctrl+C 回车⇒exit 回车
    打开windows powershell 进入到mycent os文件夹后 用命令vagrant suspend回车停止虚拟机,稍微需要一点时间。完成以后exit回车退出
     
     
  • 相关阅读:
    WebApp触屏版网站开发要点
    Web前端开发规范手册
    Web页面切图和CSS注意事项
    javascript中的一些基本方法收藏
    浅谈浏览器兼容性问题
    html 5 标签分类
    前端meta知多少
    浏览器内核信息整理
    Javascript中的undefined、null、""、0值和false的区别总结
    JQUERY中的AJAX应用
  • 原文地址:https://www.cnblogs.com/loverain/p/6932596.html
Copyright © 2011-2022 走看看