Git Product home page Git Product logo

kadai-app's Introduction

初回のみやること

このリポジトリ(徳永のアカウントにあるリポジトリ)を自身のアカウントにフォークして課題を進めること。

フォーク手順

  1. https://github.com/cadenza-system/kadai-app/fork にアクセス

  2. Ownerが自分のアカウント、Repository nameがkadai-appになっていることを確認

  3. 画面下のCreate fork(緑のボタン)を押下

  4. 自身のアカウントにコピーされるので以降、そこに作ったものをpushしていく

環境構築

1. 準備

  1. 自身のgithubアカウントからリポジトリをcloneしVSCodeで開く

  2. VSCode上で[ctrl + @]でターミナルを開く(以降コマンドはここで入力する)(コマンドプロンプトでも可)

2. プロジェクトのアップデート

コマンドを実行

composer update

3. データベースの構築

  1. xammpのコントロールパネルからapacheとMySQLを起動

  2. xammpのコントロールパネル -> MySQLのAdminを押下しPHPMyAdminを起動

  3. データベースのマイグレートコマンドを実行

php artisan migrate

実行すると下記のようにデータベースを作るか確認されるので yes と入力

   WARN  The database 'kadai-app' does not exist on the 'mysql' connection.

  Would you like to create it? (yes/no) [no]

  > yes <=入力
  1. データベースに初期データを挿入
php artisan db:seed

4. アプリケーションの起動

起動

php artisan serve

アクセスURL

localhost:8000

課題


問題1

以下の5つのバグを修正しなさい。


Bug1

内容: ユーザーを押下してユーザー画面に遷移しても別のユーザーの画面に遷移してしまう。 修正: 正しいユーザーの情報が表示されること。


Bug2

内容: 投稿詳細画面( /post/detail/{id} )での右下の削除ボタンを押下しても投稿が削除されずに残っている。 修正: 削除した投稿がタイムライン等に表示されないようにすること。


Bug3

内容: 画面右上のログアウトボタンを押下しログアウトしてもログイン情報が残ってしまっている。 修正: ログアウトするとログイン情報がブラウザから削除されること。


Bug4

内容: 投稿画面( /post )で投稿する際、内容が0文字または140字より多い場合エラーが発生する。 修正: 文字数が1~140文字の場合のみ投稿処理を行うようバリデーションを追加すること

備考1: バリデーションはJavaScriptとLaravel(○○Controller内)の両方で実装すること 備考2: JavaScriptのバリデーションではアラートを表示し、Laravelのバリデーションでは投稿ボタン下部にエラーメッセージを表示すること


Bug5

内容: 投稿詳細画面( /post/detail/{id} )でログインしているユーザー以外の投稿(他人の投稿)も編集できてしまう。 修正1: 編集処理のContolloerで対象の投稿が他人のものでないか確認し、他人のものであった場合はホーム画面にリダイレクトすること 修正2: 他人の投稿詳細画面では「編集」「削除」のボタンは表示しないこと

Tips: ボタンの表示を消すだけでは直接URLにリクエストを投げることで編集処理ができてしまうため、Controller内部でも不正な処理が行われないかチェックする必要がある。



問題2

新規登録画面を実装すること


ログインしていない状態ではヘッダーに新規登録ボタンが表示されている。 ボタンを押下すると新規登録画面に遷移するのでそこに新たに新規登録機能を実装すること。


新規登録画面要件

画面には以下のパーツが存在する。

  • メールアドレス入力フォーム
  • パスワード入力フォーム
  • 新規登録ボタン

※実装や画面レイアウトはログイン画面を参考にするとよい。


機能概要

メールアドレス、パスワードを入力した状態で「新規登録」ボタンを押下すると登録処理が開始する。 登録処理が成功した場合は、そのアカウントにログインしたうえでホーム画面にリダイレクトする。

【注意】 メールアドレスはほかのユーザーとかぶってはならないため、データベースに登録する前にすでに存在していないかチェックすること。すでに登録されているアドレスの場合は「新規登録」ボタン上部に「このメールアドレスはすでに使用されています」と表示すること。


バリデーション

下記ルールにしたがってバリデーションを実装すること JavascriptとLaravel(○○Controller内)の両方で同じバリデーションを設けること

メールアドレス

  • ●●●@×××の形式になっていること
  • 半角英数、記号のみを許容すること

パスワード

  • 半角英数、記号のみを許容すること
  • 8文字以上であること

kadai-app's People

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.