初めてのWEBアプリ作成(1)


はじめに

 初めまして、RHEMS技術研究室所属の白瀬です。
今回は初めてWEBアプリ作成としてTrello風ToDoリストを作成するまでの工程を投稿していこうと思います。間違った点がありましたらご指摘いただけると嬉しいです。
環境はmacのdocker,iTerms2を使用しています。

コンテナ構築

 nginx・PHP・MYSQLのコンテナの構築をdockerで行いました。!
今回はnginxとPHPの連携させずに作って行きます。

全体のディレクトリ

├── docker-compose.yml
├── nginx
│   └── nginx.conf
├── php
│   ├── Dockerfile
│   └── php.ini
├── mysql
│   └── data
└── www
    └── html
        └── index.php

コマンド

docker-compose.yml

version: '3'
services:
  nginx:
    image: nginx:latest
    ports:
      - 8080:80
    volumes:
      - ./nginx/nginx.conf:/etc/nginx/conf.d/default.conf
      - ./www/html:/var/www/html
    depends_on:
      - php

  php:
    build: ./php
    volumes:
      - ./www/html:/var/www/html
    depends_on:
      - db

  db:
    image: mysql:5.7
    ports:
      - 13306:3306
    volumes:
      - ./mysql/data:/var/lib/mysql
    environment:
      MYSQL_ROOT_PASSWORD: secret


nginx.conf

server {
    listen 80;
    server_name _;

    root  /var/www/html;
    index index.php index.html;

    access_log /var/log/nginx/access.log;
    error_log  /var/log/nginx/error.log;

    location / {
        try_files $uri $uri/ /index.php$is_args$args;
    }

    location ~ \.php$ {
        fastcgi_pass php:9000;
        fastcgi_index index.php;    
        fastcgi_param SCRIPT_FILENAME  $document_root$fastcgi_script_name;
        include       fastcgi_params;
    }
}

Dockerfile

FROM php:7.2-fpm
COPY php.ini /usr/local/etc/php/

php.ini

date.timezone = "Asia/Tokyo"

index.php

<h1>Hello WORLD</h1>

すべて書き終えた後docker-compose.ymlがあるディレクトリまで移動し下記のコマンドを実行

docker-compose up -d

実行し終えたらlocalホスト(http://localhost:8080/)に接続して画像のようになりました。

残りはこれをToDoリストように書き換えていくだけだと思っています。

あとがき

自分がWEBアプリを作ってみてくれ言われ何をしたらいいか分からずdocker trello 作成などといった検索をかけていましたが的はずれなことをしていました。
誰でもはじめはわからないことばかりなので皆さんも人に聞きましょう。
自分は4日ほど悩んでました…