ブログみほうプログラミング活動記録この広告は、90日以上更新していないブログに表示しています。3週目が終わりました。ミニアプリ発表会も終了し、満足のいくものが作れました。前回の記事*1の設計案にある構想はbootstrapに詳しい先輩やインターネットサイト、特にbootstrap移行ガイドの助けもあり、実現できました。今回は以下の内容についてに書いていきます。・現状の課題と今後ミニアプリの感想が多いので、ミニアプリと応用カリキュラムで2記事に分けます。やってきたことの振り返りになりますので、復習になります。結論から言いますと、Railsでアプリケーションを作成する流れを振り返ることができ、bootstrapを用いた基礎的なレイアウトができて楽しかったです。bootstrapを使うことに決めたのか?きっかけは先輩の話です。冒頭に出てきました先輩とは違う人です。1週目ぐらいにその先輩と今日学習したことについて発表しあった後に、アプリケーションを見せてもらい、どうやってこのレイアウトを作っているのか聞いてみたんです。ミニアプリの構想が決まってなくて、参考にしたかった。するとbootstrapを使って作ってると返ってきました。bootstrapはサイトを作りやすいためポートフォリオに役に立つとも聞いて興味を持ちました。言うわけでミニアプリ制作ではbootstrapに挑戦してみようと思い至ったわけです。Desktop」でブランチを作成。install」でgemをインストールし、必要なファイルをassetsに入れる。修正ごとにでコミットを行い、アプリ作成完了後、プルしてプルリクエストからマージを行って、ミニアプリ提出フォームを提出こんな感じでした。3と7の内容については応用カリキュラムの進み具合にもよりますが、GitHubが提出の時に必要になるため入れました。bootstrap.css)については不要で、それ以外を入れました。当初は気付かず入れており、先輩の指摘で削除しました。'bootstrap'に元々入っているためです。*2実際に作ってみて最初はどうやってやるんや?ってなりました。それからサイトでbootstrapのレイアウト作成法を調べていき、実際に取り入れて表示を確かめて、楽しいなと思いました。色を青にするならtext-primaryと言うクラスで青にできます。サイトのレイアウトについてはd-flexやmx-autoと言うクラスで横並びにしたり、中央揃えにしました。クラスで調整でき、それがすぐに反映されたのは楽しかったです。そのレイアウト調整でかなり時間を食ったわけですが、containerで大枠を作り、そこにカードやジャンボトロンなどで調整して、なんとなく使い方を覚えました。サイトのレイアウト調整法についてはこのサイトが理解しやすいと思いました。*3使ってみたメリット・classで簡単にレイアウトができる。・内部にリセットCSSが入っているため各種ブラウザやスマートフォンでも表示が崩れない。デメリット・どのようにしてカスタマイズするのか学ばないとテンプレート通りになり独自性がなくなる。挑戦してみて良かったと思いました。個人アプリの構想は決まっておりませんが、同じくbootstrapを使っていきたいと考えています。その際は今回とは別のテンプレートを使い、このミニアプリで用いてなかったクラスも使います。トップページと他のビューについてトップページ「ようこそ」のところに背景画像を入れ、ツイートについてはカードを用いてレイアウトしました。ボタンも色をつけてわかりやすくしました。マイページボタンからユーザーごとのマイページに行き、ログアウトボタンからログアウトします。ログアウトしているときはヘッダーにあるボタンが「ログイン」と「新規登録」になり、新規登録ボタンからユーザー登録ができます。新規投稿画面フォームについてはform-groupと言うクラスを使っています。中央寄せについては前述のmx-autoを用いました。このページから画像とツイートを投稿できます。3行目がform_tagになっていましたが、今回はform_withとしています。trueとすることで普通のページに移動することができます。入れないと非同期でフォームを送信することになります。画像の横に編集と削除ボタンがあり、ここから編集と削除ができます。コメント機能についてはpictweetでは送信ボタンの下にコメント一覧と出るようになっていましたが、これについてはd-flexと言うクラスで横並びに変更しています。フッターについては調整忘れです。今回重要ではありませんが、時間がある時に直します。ミニアプリ面白かったです。個人アプリではより一層の挑戦をしていきます。ありがとうございました。1週間行ってみた感想2019-04-12技術論よりも「人」である。MihouTechPeak51プロフィールはてなブログをはじめよう!MihouTechPeakさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。