git、githubについてあまり分かってないまま学習してきたので、かなり初歩的な内容になると思いますがまとめてみます。 gitとは gitとは分散型バージョン管理システムのことです。 分散型と集中型がありますが集中型についてはここでは扱いません。 バージョ…

今回はJavaScriptのDOM操作を練習してみます。 DOMとは DOM (Document Object Model) とは、すべての HTML または XML 文書を表現・操作する API です。 DOM はブラウザーで文書構造をノードのツリーとして読み込み、それぞれのノードを文書の一部 (例えば要…

メニューリストとかで現在のページに応じて色がついてたらサイトが見やすくなりますよね。 Boardsページにいる時 Usersページにいる時 こんな感じにしたいです。 今回はこれを実装していきます。 前回作ったアプリにBootstrapを導入してBoardのCRUD機能をつ…

今回はgem ransackで検索機能を実装します。 以前の記事でフリーワード検索を実装したのですが、今回は作成日での検索とセレクトボックスでの検索を実装していきます。 1つ前の記事で作ったscaffoldアプリを元にやっていきます。 このアプリではi18n、enum、…

制作中の掲示板アプリにenum_helpを導入しました。 ちゃんと定着させるためにもう一度実際に手を動かしながらやってみようと思います。 今回やりたいのは フォームにセレクトボックスを作り選択肢を日本語で表示する です。 こんな感じの作ります。 i18n、en…

今回はAdmin-LTEを使って管理者用ページを作りたいと思います。 Admin-LTEとは管理画面に特化したBootstrapベースのCSSフレームワークです。 管理者用なので凝ったデザインにする必要はないですよね。なのでフレームワークを使ってサクッと作ってしまいたい…

ユーザー登録ができるサービスには必ず付いていると言っても過言ではないであろう機能、パスワードリセット機能を実装していきます。 今回はgem sorceryのモジュールであるreset_passwordを導入します。sorceryの導入を前提で進めていきます。 パスワードリ…

form_withってよく使うけど曖昧なままきてるなあ、と思ったので振り返ってみます。以前にも一度記事にしたので2回目です。 色々やってくれる優秀なform_withですが、model渡したりurl渡したり、結局どんな動きしてるの？ form_withとは 情報を送信するための…

今回は検索フォームを実装したいと思います。 こちらが完成品です。 掲示板のタイトルか本文にワードが含まれていたら検索結果を一覧で表示させるようにします。 ransack ransackとは簡単に検索機能を実装できるgemです。 インストール まずはGemfileに gem …

今回はコンテンツの一覧表示画面なんかでよく見る これを実装します。 Googleの検索結果表示画面とかでも(デザインは違うけど)使われてるこれですがページネーションと言います。 一覧ページの表示件数が多くなるとこのページネーションか、TwitterやYouTube…

ルーティングの設定をする際、脳死でresourcesを使っていてresourceとの違いがよく分からなかったので2つの違いやどう使い分けるかを調べてみました。 違い resourcesは7つのアクションのルーティングをid付きで生成する resourceはindex以外のルーティング…

作成中のCRUDアプリの一部機能をAjax化させました。Ajax化には①「form系のヘルパーメソッドにremote: trueを設定して実装する方法」 ②「jQueryの$.ajax()などで実装する方法」の2つがあるそうです。①は簡単な処理に対応でき、②は複雑な処理になる場合に使う…

Ajaxってよく聞くけどどういうものなのか、かなりざっくりした説明になってしまいますが自分なりにまとめてみました。 同期通信と非同期通信 Ajaxを知るためにまずは非同期通信、そして対になる同期通信について知る必要があります。 同期通信 通常の通信方…