react-lumen-board_yux2's Introduction

Dockerを用いたReact + Lumenの掲示板

概要

Dockerを使ってローカルの環境内で簡易的な掲示板を作成

フロント部分 : JavaScriptライブラリのReact

バックエンド部分 : LaravelをベースとしたマイクロフレームワークのLumen

使用したDockerImage

・ php7.4_apache

・ mysql:8.0

・ phpmyadmin

ReactのJSXファイルをLumen側で読み込ませるためにwebpackを使用

(backend/lumen/public/js/src配下に書いたJSXファイルをbuildしたものをLumenのmain.blade.phpで読み込む)

実装した機能

・ユーザーのログイン/ログアウト機能

・新規のユーザー登録時にはメール認証を行う

・自分が投稿したコメントは編集と削除が可能

・メールが送信されるまでの間は「送信中」の画面が出る

DEMO

新規ユーザー登録とメール送信

ユーザー情報の登録、ログイン、コメント、ログアウト

Dockerがあれば

「Download ZIP」からファイルをダウンロード

↓

backend/lumen配下に下記の.envファイルを追加

↓

APP_KEYとメール関係の部分を自分の設定に変更

↓

buildとコンテナの立ち上げ

$ docker-compose build
$ docker-compose up -d

↓

http://localhost:8080/board/login にアクセス

.envファイルの設定

APP_NAME=Lumen
APP_ENV=local
APP_KEY=your_app_key
APP_DEBUG=true
APP_URL=http://localhost
APP_TIMEZONE=Asia/Tokyo

LOG_CHANNEL=stack
LOG_SLACK_WEBHOOK_URL=

DB_CONNECTION=mysql
DB_HOST=mysql
DB_PORT=3306
DB_DATABASE=lumen_db
DB_USERNAME=dbuser
DB_PASSWORD=dbpass

CACHE_DRIVER=file
QUEUE_CONNECTION=sync

MAIL_MAILER=smtp
MAIL_HOST=smtp.gmail.com
MAIL_PORT=587
MAIL_USERNAME=your_mailaddress
MAIL_PASSWORD=your_password
MAIL_ENCRYPTION=tls
MAIL_FROM_ADDRESS=your_mailaddress
MAIL_FROM_NAME="your_mail_name"

Recommend Projects