kouの技術的メモ

学習した内容の定着やアウトプット用に開設しました

成果物の作成

成果物の作成2作品目⑩ 全体の微調整と、readmeファイルの追加、そして完成。

ついに今回で完成です! 今回は全体のコーディングを整えたり、文章を読みやすくしたり誤字脱字を修正したり。 一週間ちょいぐらいしか掛かってないはずなのに、自分で考えるたり、問題を解決したりする時間が多かったせいか、凄く長く感じた気がします。 モ…

成果物の作成2作品目⑨ 予定管理サービス  インテグレーションテスト実装

今回は全体のインテグレーションテストを作り込んでいきます。 まずはヘッダーレイアウトのインテグレーションテストです。 omniauthを使ったログイン部分を実装していきます。 minitestでテストを書いているのですが、日本語で検索してもomniauthのテスト方…

成果物の作成2作品目⑧ 予定管理サービス  コントローラのbeforeアクションの追加、全体のテスト実装

今回は細かいバグを取り除くために、コントローラのbeforeアクションとテストを書いていこうと思います。 minitestを使っています。 beforアクションの追加 今のままだと未ログイン状態でも誰がログインしていようと、お構いなしにいろんなURLにアクセスでき…

成果物の作成2作品目⑦ 予定管理サービス ユーザー一覧のページネーション機能追加、それに対するテスト。

今回は登録ユーザー数が増えても大丈夫なようにユーザー一覧のページネーション機能追加、 それから、好き勝手にアクセス出来ないように、コントローラのbeforeアクションの追加を行っていこうと思います。 ページネーション まずgemの追加とbundeleインスト…

成果物の作成2作品目⑥ 予定管理サービス 全体のレイアウトを整理、そしてバグの改善

前々回のモデル作成は3回ほど作り直したり、グラフ部分の作成もも試行錯誤の連続で結構時間が掛かかったのですが、 今回は表示部分なので、割とサクサク進められました。 今回はフォーム画面とスケジュール画面が雑多、かつ不必要な情報も多かったので、整え…

成果物の作成2作品目⑤ 予定管理サービス スケジュールのグラフ表示

グラフ表示部分の導入です。 ライブラリはchartkickを使おうと思います。 公式サイトを見ながら勧めていきます。 https://chartkick.com/ 表示するグラフのタイプは選べるのですが、何がいいかは試行錯誤しながら決めていきます。 おそらくtimelineかpie cha…

成果物の作成2作品目④ 予定管理サービス スケジュール関係のモデルの作成

スケジュール関係のモデルの実装です。 今回もissueを作ります。 DBモデル作成 モデルですが、これがかなり悩んで紆余曲折試行錯誤した結果以下で行くことにしました。 Userモデル(登録ユーザ情報)omniauth-twitterに合わせて中身を作ります。 主キー 名前…

成果物の作成2作品目③ 予定管理サービス ユーザーページとスケジュールページの作成

まず、ログインした後にリダイレクトされるスケジュールページを簡単に作り、ユーザーページの原型も作っていきます。 まず、githubにissueします。 #○と番号が出ますので、 ローカルリポジトリと紐付けるために開発環境でgit checkut -b #〇でその番号と同…

成果物の制作2作品目② 予定管理サービス twitter認証の実装

方法はいくつかあると思いますが、今回はgemのomniauthでツイッター認証しようと思います まずgemファイルを追加 gemfile gem 'omniauth' gem 'omniauth-twitter' そしてbundle install ツイッターで開発するアプリをここのCreate New Appで作成します。 htt…

成果物の作成 2作品目 予定管理サービス ざっくり要件定義と構想

オリジナルアプリ2作目です。 独学だと自己管理が大変だったので、自作の予定管理サービスを作りたくなり、作ってみました。 現在の目標 ユーザー登録機能(ツイッターoauth認証) ログイン、ログアウト機能 ログインしたユーザーは自分の一日のスケジュールを…

成果物の作成11 投稿記事に対するコメント機能のAjax化

せっかくなので、投稿に対するコメント機能をAjax化してみました。 まずコントローラ側を作ります。 今までは単にfallback_location: root_pathにより、リダイレクトで再描画していたのですが、 respond_toでAjaxを扱う部分を実装します。 その際、JavaScrip…

成果物の作成10 投稿記事に対するコメント機能の追加

今回はコメント機能を追加していこうと思います。 独自にComentモデルを作り、PostデータとコメントするUserモデルとの関係性も記述しなければならないので、少し難易度が高いです。 どんなモデルを作るか コメントはさほど長い文章で無くても構わないと思う…

成果物の作成9 ユーザ画像登録機能、表示機能の実装

ユーザーページに画像が表示されておらず少し寂しいので、 ユーザー登録画面で画像をアップロードし、プロフィールページや、記事の投稿で表示できるようにします。 carrierwaveを利用し、 画像アップロードは ユーザー画像登録部分の追加 ユーザー新規登録…

成果物の作成8 表示部分の実装の続き

今回は表示部分。 ルートページにてログインユーザーだけでなく、未ログインユーザーでも見れるように改善しました! 表示は投稿時間の降順です。 /blog/app/views/static_pages/home.html.erb <div class="center jumbotron"> <h1>Kohei's blog</h1> <h2> Koheiの記事投稿サービスにようこそ! </h2> </div> <div class="container-fluid"> <% if</div>…

成果物の作成7 投稿とその表示部分の実装

ここからは自作の要素が強くなるので、じっくり作っていきたいと思います。 投稿モデルの作成 投稿部分は、タイトルと本文を収納したオリジナルモデルを作ります user_idを外部キーとし、本文部分は文字数に長文を投稿できるようにtext型にします。 また、タ…

成果物の作成6 登録ユーザー情報の更新、一覧画面、情報の破棄部分の実装

railsチュートリアル10章で今まで良くわからなかった部分があるのですが、 新しいアプリ作成を通して分るようになりました。 ユーザー情報の更新で has_secure_password validates :password, presence: true, length: { minimum: 6 }, allow_nil: true パス…

成果物の作成5 新規ユーザー登録機能とセッションの実装

ユーザ登録周りは一回やっているので割とスムーズに作れました。 業務ではチーム開発になると思われるので、作業用ブランチからプルリクを出して、Githubでマージする、という手法を試したのですが、 途中ででやらかして、マージの時にコードが消えちゃうや…

成果物の作成4 Userモデルの作成

ログイン機能や、投稿者にユーザ名を表示するのに使います。 とりあえず制作するUserモデル ID name email created_at updated_at password_digest 1 hoge foo@.bar.com 作成日時 更新日時 暗号化パスワード 後々付け足していきます。 emailに関しては一意性…

成果物の作成3 bootstrapの導入

スタイルの導入です。 bootstrapを導入するためにgemgfileにbootstrap-sassを加えます。 これを使うためにはscssファイルが必要なので、app/assets/stylesheets/custom.scssを作ります。 ルートページや、aboutページ、contactページ、signupページ、フッタ…

成果物の作成2 開発環境の立ち上げ

まずcloud9に新しいenvironmentを立ち上げます 次にRailsのインストール GitとGithubの登録 herokuの設定とデプロイテスト を済ませます。 まずHomeページの制作から入っていきたいと思います。 まずヘッダーに表示させたいページは ログアウト時はHome、Abo…

成果物の作成1 ブログwebサービスの構想

どんなwebサービスを作るか まず、どんなwebサービスを作るか考えたのですが、 前々からきちんとしたメディア系のサービスが作りたいと思っていたのと、 だいたいどのweb系の会社でもメディア系サービスのような媒体は持っているらしいので、仕事として需要…