環境構築 アーカイブ - nyanblog ~にゃんぶろぐ~ https://nyanblog2222.com/tag/環境構築/ ちょっとしたことを調べているよ Tue, 10 Oct 2023 06:06:03 +0000 ja hourly 1 https://wordpress.org/?v=6.7 https://nyanblog2222.com/wp-content/uploads/2021/09/cropped-favicon-32x32.png 環境構築 アーカイブ - nyanblog ~にゃんぶろぐ~ https://nyanblog2222.com/tag/環境構築/ 32 32 【簡単】DockerでPHPとMySQLの環境構築【コンテナ仮想化】 https://nyanblog2222.com/programming/cmd/5184/ https://nyanblog2222.com/programming/cmd/5184/#respond Sun, 26 Mar 2023 09:28:33 +0000 https://nyanblog2222.com/?p=5184 目次 DockerとはDockerをインストールファイル構成ファイル作成docker-compose.yml ファイルコンテナ[php]：Dockerfile コンテナ[mysql]：Dockerfile index.p […]

投稿 【簡単】DockerでPHPとMySQLの環境構築【コンテナ仮想化】 は nyanblog ~にゃんぶろぐ~ に最初に表示されました。

]]>

Dockerとは

Dockerはコンテナ仮想化を使ったアプリケーションを開発・配置・実行するためのオープンプラットフォームです。

簡単に利点をいうと、
・環境構築ファイルを共有することで簡単に同じ環境を提供可能
・環境の流用や変更が簡単
・軽量で高速に起動、停止が可能

みみねこ
みみねこ

詳しいことが知りたい方は色々調べてみてください♪
（気が向けば別記事で書きます）

Dockerをインストール

Dockerをインストールします。
以下のリンクからダウンロードしてインストールを行ってください。

Dockerのダウンロードはこちらから

コマンドプロンプトやVSCodeのターミナルなどで
バージョン確認のコマンドを実行し、インストールされていることを確認できます。

■コマンド – バージョン確認
docker -v

■コマンド結果
このようにバージョンが出てきたらOKです。

> docker -v 
Docker version 20.10.13, build a224086

ファイル構成

今回は以下のファイル構成で環境構築しています。
慣れたら自分の好きなファイル構成にしていただいて構いません。

□：ディレクトリ名
・：ファイル名

□app
├□docker
││
│├□mysql
││├□data
││└・Dockerfile
││
│└□php
│  └・Dockerfile
│
├□html
│└・index.php
│
└・docker-compose.yml

※1 mysql\dataディレクトリの中身は空で作成してください。

ファイル作成

各ファイルの内容を載せています。

docker-compose.yml ファイル

version: '3'
services:
  php:
    build:
      context: ./docker/php
      dockerfile: Dockerfile
    volumes:
      - ./src:/var/www/html
    ports:
      - 8080:80
    depends_on:
      - db

  db:
    build:
      context: ./docker/mysql
      dockerfile: Dockerfile
    volumes:
      - ./docker/mysql/data:/var/lib/mysql
    ports:
      - 3306:3306
    environment:
      - MYSQL_ROOT_PASSWORD=pass
      - MYSQL_DATABASE=app
      - MYSQL_USER=user
      - MYSQL_PASSWORD=root

ぱっと見分かる箇所は説明抜いてます。

volumes:
　右側：ローカル上のディレクトリパス（docker-compose.ymlからの相対パス）
　左側：永続化したいサーバーフォルダ

build:
　context：build実行パス
　dockerfile：Dockerファイル名

depends_on:
　db：dbコンテナを先に起動

コンテナ[php]：Dockerfile 

FROM php:8.0-apache

RUN apt-get update && apt-get install -y libonig-dev && \
    docker-php-ext-install pdo_mysql mysqli

コンテナ[mysql]：Dockerfile 

FROM mysql:8.0.20

index.php ファイル

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>環境構築</title>
</head>
<body>
    <p><?php print ("Hello World!");?></p>
</body>
</html>

localhostに接続して表示する内容を記載しています。

動作確認

localhostに接続

■コマンド – コンテナ起動
（-d）はバックグラウンドで実行

docker compose up -d

■ローカル環境にアクセス
http://localhost:8080

「Hello World!」と画面に表示

http://localhost:8080に接続

■コンテナ名を変更したとき
変更前のコンテナが残っているので、一度削除しておく
※ 削除せずにコンテナ起動すると警告が出る

docker compose down --remove-orphans

コンテナ内に入ってphp実行確認

phpコンテナに入ってphpファイルを実行確認する場合

■phpコンテナに入る
docker compose exec php bash

■phpファイル実行
php index.php

ファイルを実行します。
[index.php]ファイルの中身を
[echo Hello World!]だけにした方が分かりやすいかもしれません。

■bash終了
exit

MySQL接続、SQL実行

■MySQLコンテナでMySQL接続
docker compose exec db mysql -u root -ppass

みみねこ
みみねこ

db[コンテナ名]
pass[MYSQL_ROOT_PASSWORD]
は[docker-compose.yml]で設定した値です。

> docker compose exec db mysql -u root -ppass
Welcome to the MySQL monitor.  Commands end with ; or \g.
・・・
mysql>

上記のように
mysql>とSQLが入力できる状態であればOKです。

SHOW DATABASES;
などSQL文を実行して試してみてください。

これで環境構築は完了です。

これから色々試してみる予定なので、
phpのiniファイルを追加したりcnfファイルを追加した
よかったら参考にしてみてください。

みみねこ
みみねこ

いやぁ…。色々はまりました。
はまった点を記載すべきなのですが、開発環境も異なるため解決方法も異なる可能性が高く一つ一つネットで調べるのが速いと思います。

投稿 【簡単】DockerでPHPとMySQLの環境構築【コンテナ仮想化】 は nyanblog ~にゃんぶろぐ~ に最初に表示されました。

]]> https://nyanblog2222.com/programming/cmd/5184/feed/ 0 Visual Studio Codeのインストールや日本語化設定 https://nyanblog2222.com/programming/javascript/5187/ https://nyanblog2222.com/programming/javascript/5187/#respond Sat, 25 Mar 2023 15:12:41 +0000 https://nyanblog2222.com/?p=5187 本記事ではVisual Studio Codeの環境構築を行います。 目次 Visual Studio Code（VSCode）とはVisual Studio CodeのインストールVisual Studio Codeに […]

投稿 Visual Studio Codeのインストールや日本語化設定 は nyanblog ~にゃんぶろぐ~ に最初に表示されました。

]]>

本記事ではVisual Studio Codeの環境構築を行います。

Visual Studio Code（VSCode）とは

Visual Studio CodeはMicrosoftが開発している
Windows、Linux、macOS、webで無料で提供されているソースコードエディタです。

調べるときに良くVSCodeとも出てきます。

最大の特徴は拡張機能が豊富にあり、
・英語・中国語・日本語表示
・各開発言語の開発効率を向上させる機能（ソースコード入力補助等）
様々あるため、現在最も多く利用されているエディタといわれています。

みみねこ
みみねこ

なにより多くの機能が無料で使える！
これに尽きます。

Visual Studio Codeのインストール

さっそくVisual Studio Codeをインストールしていきます。
まずはVisual Studio Codeのページから赤枠をクリックし、ファイルをダウンロードします。

VSCode　ダウンロード

ダウンロードしたファイル「VSCodeUserSetup-x64-[ver名].exe」をダブルクリックし
インストールを開始します。

セットアップ画面が開いたら
「同意する」にチェックをつけて、「次へ」をクリックします。

VSCode セットアップ

インストール先を指定します。
特に変更する必要がなければそのまま「次へ」をクリックします。

VSCode セットアップ

スタートメニューにショートカットを作成します。
特にこだわりがなければ、このまま「次へ」をクリックします。

VSCode セットアップ

ここでは、インストール時の追加要素を選択することができます。

今回は変更していませんが、おすすめは以下の3つです。

・エクスプローラーのファイル　コンテキストメニューに[Code で開く]アクションを追加する
・エクスプローラーのディレクトリ　コンテキストメニューに[Code で開く]アクションを追加する
・PATHへの追加

他のサイトでよくインストール作業の内容に関して、環境変数に設定する内容が記載されていますが、ここでPATHへの追加にチェックを入れておくと自分で作業する必要が無くなります。
そのため、チェックをつけた状態で「次へ」をクリックしましょう。

VSCode セットアップ

インストールの確認前画面です。
内容に問題なければ「インストール」をクリックしてください。

VSCode セットアップ

インストールが完了したら「完了」をクリックし、セットアップ画面を閉じてください。
これでVisual Studio Codeのインストールが完了です。

VSCode セットアップ

Visual Studio Codeに拡張機能をインストール

拡張機能でインストールする方法を紹介します。
まず使うであろう「日本語化」の拡張機能をインストールします。

Visual Studio Codeを開きます。

左側のアクティビティバーにある、赤枠「拡張機能」をクリックします。

Visual Studio Code

「Marketplace」に「Japanese」と入力してください。

「Japanese Language Pack for Visual Studio Code」
のインストールを行ってください。

locale.jsonで日本語に設定します。
「Ctrl」+「Shift」+「P」でコマンドパレットを起動します。

「configure」と入力すると予測変換が出てくるので
「Configure Display Language」をクリックします。

Visual Studio Code　日本語

「ja」(japanese)をクリックします。

Visual Studio Code　日本語

再起動するか確認するメッセージボックスが出ますので、「Restart」をクリックしてください。

Visual Studio Code　再起動

これで日本語化の完了です。

投稿 Visual Studio Codeのインストールや日本語化設定 は nyanblog ~にゃんぶろぐ~ に最初に表示されました。

]]> https://nyanblog2222.com/programming/javascript/5187/feed/ 0