【ルービックキューブのタイマーを作る】第9回 キューブの展開図にスクランブル情報を適用させる回

プロジェクト【ルービックキューブのタイマーを作る】の最終回となります。ここまで閲覧して頂いた方、本当にありがとうございます。今回はコレ! スクランブルに合わせて、展開図のカラーリングを変化させようという作業です。 目次1 一旦かるく現在の仕様を・・・1.1 スクランブル文字列(F’ R2 B・・・)1.2 […]
プロジェクト【ルービックキューブのタイマーを作る】の最終回となります。ここまで閲覧して頂いた方、本当にありがとうございます。今回はコレ! スクランブルに合わせて、展開図のカラーリングを変化させようという作業です。 目次1 一旦かるく現在の仕様を・・・1.1 スクランブル文字列(F’ R2 B・・・)1.2 […]
第7回目の今回は、保存したデータを表示してみる回です。とりあえず、今回は、登録した全件を取得して表示するということを目標にやってみようと思う。 目次1 実装1.1 public/js/database.js1.2 resources/js/list.js1.3 resources/views/list.blade.ph […]
第6回です。今回は前回のテストを踏まえて、実際に記録を保存する機能を作成してみる。 目次1 ざっくりとした見通し2 実装2.1 public/js/database.js2.2 resources/js/timer.js2.2.1 64行目 スクランブルの再表示処理を追加2.2.2 117行目 timerStore処理 […]
もうシリーズも今回で5回目。今回は、テスト的にIndexedDBを使ってみようと思う。個人的に使ったことがないので。テスト回なのでソースコードは微妙なところが多々ありますが、お許しください。 目次1 IndexedDBとは2 基本の使い方は?3 配列をそのままつっこんでみる4 やっぱり1件ずつデータ登録したい気がする5 […]
今回はスクランブル情報をAPI経由で取得できるようにしてみる。 目次1 API化について1.1 app/Http/Controllers/CubesApiController.php1.2 routes/api.php1.3 ブラウザでアクセスしてみる2 仕様2.1 GET /api/scramble2.2 POST […]
今回はスクランブルを表示してみる。 目次1 スクランブルとは?2 スクランブル表示の記号は?2.1 回転面の記号2.2 「’」は逆回転2.3 「2」は180度回転3 仕様3.1 同じ面の記号を連続しない3.2 前々回と前回が向かい合う面の場合、前々回と同じ回転方向にはならない3.3 ある一定回数回すことを目 […]
今回は本アプリの急所のタイマーを作っていく。 目次1 簡単な仕様説明2 長押し機能2.1 index.blade.php2.2 timer.js2.3 スペースキーを長押ししてみる2.4 解説2.4.1 init関数でキーが押された時と、キーが離された時に、イベントが発生するように設定2.4.2 ステータス管理を細かく […]
なにはともあれ、ざっくりとした見た目をまずは作ってみる。見た目がざっくりでも出来ると、開発のテンションがあがりますよね。 とはいえ、見た目に関しては大して説明するところもないので共有になります。 作成したもの こちらです。 細かい調整はおいといて、Flexboxベースでこのような配置にしてみました。いい感じです。 共有 […]
Laravel Jetstreamを使ったことがないので、主に自分用のメモとして残します。 #Laravel Jetstream Laravel Jetstream is a beautifully designed application starter kit for Laravel and provides th […]
何か作ろうと思った時に、ユーザー側にせよ、管理者側にせよ、8割方ログイン機能は欲しくなるものです。LaravelにはスターターキットとしてBreezeというものが備わっているので、それを見ていく。 今回のLaravelのバージョンは9.5.2を使用しています。 目次1 Breezeの使い方2 自動生成された画面やファイ […]