❗ErrorStocker

ErrorStockerとは、文字通りエラーを保存する為のアプリケーションです。『エラーが生じた際に、情報を探して解決に導く』この作業を短縮できればより多くのタスクをこなすことができると考えました。一度経験したエラーや勉強した内容等を一つの場所に集めておけば見直すことができるのでそれを形にしたものです。

🌐 URL

URL: http://error-st.com

使用方法は閲覧用とログインして使用できる２パターンがあります。閲覧用は、閲覧Buttonをクリックすると使用できます。ただ、投稿することはできません。投稿する場合はログインしてからしかできません。投稿をする際は、タイトル・タグ（任意）・写真（任意）・内容を投稿することができます。内容を記述する際は、markdown記法で投稿できるようにしてます。

👤 テストアカウント

名　前	メールアドレス	パスワード
test	test@test.com	testtest

💭 制作背景

エラーが生じた際にリファレンスサイト・Qiita等から解決策を探して解決に導くこの流れで開発に励んでいました。 一度エラーを解決した内容や勉強した内容等をGoogleのブックマークやQiitaでストックしておりましたが、どこにその情報を入れたかといった自体がありました。 そこで、不便に感じていた箇所をより楽にすることを目指して具現化したものがこのサイトです。 他の人が投稿した発信やその他質問の回答を自分のファイルに入れていく感覚で使用したと考えたため作成に至りました。これを使用することで時間の短縮につながると考えております。

📂機能動作

新規投稿	投稿一覧

投稿詳細	マイページ詳細

検索画面	コメント画面

スマホ対応画面一覧

投稿一覧	投稿詳細	検索画面

📗機能一覧

ユーザー機能

• ユーザー登録（投稿用ログイン）
• ゲストログイン（閲覧用ログイン）
• マイページにて以下の投稿の一覧表示
  • 自分の投稿内容

投稿機能

• エラーのストックをログインアカウントが投稿・編集・削除
• 一覧表示、詳細表示
• 投稿一覧表示で10個の投稿数をページネーションを実施
• 写真投稿及び圧縮（intervention/image）
• タグ付け（タグ検索）
• キーワード検索（タイトル・内容）
• 投稿内容にマークダウンを採用（cebe/markdown）

コメント機能

• 投稿にコメントを投稿・編集・削除
• 投稿詳細ページにコメント一覧表示
• コメント内容にマークダウンを採用（cebe/markdown）

📓使用技術

フロントエンド

• HTML / CSS / Bootstrap

バックエンド

• PHP 8.0.2
• Laravel 8.28.1

データベース

• Mysql 8.0

開発環境

• Docker 20.10.2
• docker-compose 1.27.4

本番環境

• AWS(VPC、EC2、S3、Route53)
• Nginx

📕ER図

📙インフラ図

💡今後の課題

• Vue.jsの導入
  • 検索機能の非同期通信
  • コメント機能の非同期通信
  • 新規投稿画面にプレビュー画面導入
• フォロー機能の導入
• テストコードの導入
• マイページのみの検索機能導入
• ストック機能の導入
  • 自分が投稿した情報と他者の投稿内容をストックする機能
• CircleCiの導入

📚見てほしいPOINT

2月6日〜3月8日までの30日間でPHPの勉強及びdockerの勉強・Laravelの勉強を行い、ポートフォリオ作成に移りました。 2月6日までは、Ruby・Railsの勉強を行っており初めて触る言語で作成いたしました。 スケジューリングとしては、以下の写真のとおりです。

2月6日〜2月8日	2月9日〜15日	2月16日〜2月22日

2月23〜3月1日	3月2日〜8日

• PHP基礎勉強に費やした時間：31時間11分（2月6日〜2月11日）
• Docker勉強に費やした時間：8時間10分(2月7・11・12日)
• Laravel基礎勉強（動画見ながらのハンズオン）に費やした時間：31時間24分(2月11〜18日)
• ErrorStocker作成に費やした時間：111時間4分(2月18日〜3月8日)
• 合計時間：183時間