Category: 未分類

  • チュートリアル:画面表示

    前提知識 以下の前提知識が必要となります。わからない技術がある場合、事前に調べてから取り組んでください。 タスクの進め方 開発内容 http://localhost:8080/tutorial/ にアクセスした際、以下のような画面を表示してください。 開発用ブランチの作成と切替 Git Flowに従いブランチを切って開発を行ってください。 VS Codeの左下にブランチ名が記載されています。そこをクリックすることでブランチの作成や切り替えが簡単に行えます。ブランチ切り替え後は切り替えたブランチ名が表示されるので確認してください。 ※今回はVS Codeを使用してブランチの作成および切り替えを行っています。 コマンドラインでブランチの作成と切り替えを行う方法も確認をしてください。 チュートリアル用ブランチで開発 上記手順と同様に「feature-tutorial」という名前のチュートリアル開発用ブランチを作成し、ブランチの切り替えまでを行ってください。 Viewの作成 ブランチの切り替えまでができたら、Viewの作成から行います。 /workspace/src/main/resources/templates 配下に「tutorial」フォルダーを作成してください。 次に、/workspace/src/main/resources/templates/tutorial 配下に「index.html」ファイルを作成してください。また、ファイルには「Hello World!」と記載してください。 Controllerの作成 先ほど作成したViewを画面表示する処理を作成します。 /workspace/src/main/java/com/digitalojt/web/controller 配下に「TutorialController.java」ファイルを作成してください。 次に、「TutorialController.java」ファイルを下記の通り編集を行ってください。 動作確認 作成したファイルをすべて保存し、Dockerイメージを再起動してください。再起動はターミナル上で「control + C」でDockerを止めた後、「./gradlew bootRun」で再起動できます。 再起動後、http://localhost:8080/tutorial/ にアクセスした際、以下のような画面が出ることを確認してください。 Viewの編集 次に、表示する画面のレイアウトの編集を行います。 /workspace/src/main/resources/templates/tutorial 配下に作成した「index.html」ファイルを以下の通り編集してください。 動作確認 作成したファイルをすべて保存し、Dockerイメージを再起動し、http://localhost:8080/tutorial/ にアクセスした際、以下のような画面が出ることを確認してください。 変更ファイルのコミット 今回の変更内容を feature-tutorial ブランチに対してコミットを行います。 まずはVS Codeのソース管理より、コミットしたいファイル(変更したファイル)を選択してください。 下記2つのファイルが選択完了後、メッセージに「feature tutorial」を入力後、「コミット」ボタンを押下してください。 プルリクエストの作成 今回の変更内容を feature-tutorial ブランチに対してプルリクエストの作成を行います。下図の赤枠部分を押下し、プルリクエストの作成を行ってください。 この際、PR文の修正を行ってください。修正が完了したら「Create」ボタンを押下してください。 レビュー依頼…

  • チュートリアル:画面遷移

    前提知識 以下の前提知識が必要となります。わからない技術がある場合、事前に調べてから取り組んでください。 タスクの進め方 開発内容 ナビゲーションバーの「Hello World」を押下した際、http://localhost:8080/tutorial/ に遷移するように修正を行ってください。 Viewの編集 workspace/src/main/resources/templates/layout 配下の「navbar.html」ファイルを以下の通り編集してください。 動作確認 作成したファイルをすべて保存し、Dockerイメージを再起動してください。http://localhost:8080/tutorial/ にアクセス後、ナビゲーションバーの「Hello World」押下した際、以下のような画面が出ることを確認してください。 レビュー依頼 前回タスクと同様に変更ファイルのコミットおよびプルリクエストの作成を行ってください。 作成したプルリクエストのURLをコピーし、メンターに完了報告およびレビュー依頼を行ってください。

  • 出庫申請一覧画面:詳細設計

    前提知識 以下の前提知識が必要となります。わからない技術がある場合、事前に調べてから取り組んでください。 タスク詳細 出庫申請一覧画面で出庫の申請ができる機能、申請に対して更新/削除ができる機能を追加で開発を行ってください。 前回使用した詳細設計書に、追加で開発する内容を反映し、レビュー依頼を行ってください。 テーブルの構造を更新する場合、下記を参照ください。テーブル更新手順書 仕事の進め方

  • スケジュールの共有

    前提知識 以下の前提知識が必要となります。わからない技術がある場合、事前に調べてから取り組んでください。 スケジュール 以下、WBSのスケジュールに従い開発に取り組んでください。 【開発コース】在庫管理システム開発_WBS