Udemy のセールがアメリカ時間だったから。
強いていえば日本時間の12日の午後くらいまで大丈夫のようです。
これが終わってもまたセールの時はあると思いますが、結構急にセールになるからね。
よかったら滑り込みで買ってみてくださいw
私はSwift4やっとXcode9インストールできてはじめました。今日も続きやります♪
Udemy のセールがアメリカ時間だったから。
強いていえば日本時間の12日の午後くらいまで大丈夫のようです。
これが終わってもまたセールの時はあると思いますが、結構急にセールになるからね。
よかったら滑り込みで買ってみてくださいw
私はSwift4やっとXcode9インストールできてはじめました。今日も続きやります♪
やっとこ手をつけられました、先日Udemy で購入したSwift4のコース。iOS11アプリ開発オンライン講座
なぜ、数日間が空いたかというと。。
OSのアップデートでAppleIDのパスワードが合致しなくてwうまく行かなかったのです。
というわけで準備完了です。
寝る前にダウンロードしてればもっと時短できたんですが。
講師の井上先生の声は前に買ったコースでも知っていましたが、めちゃ聴きやすいです。
Udemyはいろんな先生がいるのですが
コースによっては「この人の声、聞きずら〜い」ってのもたくさんあります!
なので購入の際は一度無料でみれる部分のデモ部分を観てからの購入をオススメします。
教材の内容も大事ですが、耳から入る音ってものすごく快不快があるので
やはり気持ちよく勉強を進めるには自分にとって心地いい声と喋り方の先生でやったほうがいいと思います!
Xcodeはダウンロード以前からしていたものの、あまり使ったことが無く
まだちょっとやりにくいところはありますが、Swift4の他の言語と違うところは
でも確かに空いてる方が読みやすくすっきりとしたコードにはなりますね。はい。
あとはRubyの場合は#ですが、コメントアウトは//でしたりってとこでしょうか。
変数の宣言はvar だったり。変える必要がないものに関してはlet で宣言する。など。
まだ文法的なことはそれほどやっていませんが
考え方自体はプログラミングって共通だと思うので、ルールさえ理解できればきっと文法自体はすぐわかるかなと思ってます。
とにかくRailsで難しくてなかなか進まない時やエラーが出ていや〜〜!ってなることが最近は多かったので初歩的な部分ですが全く違うことを始めると気分転換になりますし、楽しいです。
あまりいろいろやりすぎるとごちゃごちゃになるかもしれないけれど
プログラミングに限らず、行き詰まった時なんかは全然別のことをやってみたり
他の興味の沸いたことを手にとってみたりして上手く気分転換するといいですね。
Rubyも楽しいけれど、とりあえずこのコースをやってみようと思います。
6日間でアプリができるかな??
プログラミング独学者のみなさん、新年から勉強は進んでいますか?
Railsチュートリアルをやっていたのですがほぼほぼ終わり。(というか本当のところは年末に終わらせるはずだったんだけど)
セールがもう直ぐで終わるのでUdemy で気になっていたやつを買っていまいました。
1200円が最安値で出るので、またの機会でもいいのですが。。
気になっていたswiftのレッスンを買いました!
このレッスンは20個のアプリを6日間で作るというもの。
[swift 3.0対応] iOS10アプリ開発完全マスター人気講座
地図検索, カメラ投稿, タイマー, 日出時刻検索, ARアプリ, AIアプリなど実用アプリを20個以上作って学びます。CoreNFCなどiOS 11新機能も順次収録・追加中。Xcode 9, Swift 4を初心者が基礎から学べます。
飽き性の私としてはあまり膨大な量や期日よりもわかりやすい数の方がいいなと思ったのと、以前この井上先生のレッスンを買ったことがあり、声が聞き取りや使ったのも
購入の決め手です。(その他のレッスンの先生はちょっと声が聞き取りにくかったりした)
音声付きのレッスンって、絶対声の好き好きとかも大事だと思うw
またレビューなどしてみようと思いますが、11日まで1300円なので興味を持った方は今のうちに!(定価が10800円)
私はSwiftについては全く無知なのですがRubyとJavaは少し理解できます。なのでどのくらい時間がかかるでしょうか。。。楽しみです。
オンラインの学習サービスUdemy 私も好きでよく買います。
新年のセールで1月11日まで1300円!
24000円のが1300円とか。
ちなみに私昔はセールがあるの知らなくて9800円くらいで買ったものもあります。。ボリューム的には1万円でも全然お得なくらいの量のものでしたがここまで金額下がるなんて知らなかったからちょと損した気分でした。。
Udemy はビデオレッスンで買いきりなのでいつでも見返すことができます。先ほどジュンク堂に技術書を見に行ってきたのですが技術書ってだいたい2000円以上するんですよね〜。あと分厚い。。 なので持ち運びが結構しんどいんですよ。
もちろん書籍の良さもあるとは思うのですが。。
Python系の言語の講座も90%offだし私もいくつか買おうと思います。
ちなみにスマホでも学習可能なので語学系の講座だと通勤、通学中に勉強することができます。プログラミングやデザインなどweb系のものだとどうしてもPCが必要にはなってくるのでスマホだとちょっと不便かもしれませんがコードの復習をすることはできます。以外とぼんやりとスマホで動画見てる時に「あ、そういうことか!」って理解できるときとかありますしね。
私は寒いのがいやで、基本必要以上は外に出たくないのでUdemyは助かります。
引きこもりがちな人は是非、Udemyで何か新しいことにチャレンジしてみるのはいかがでしょうか?
ちなみに私が購入予定なのはこちら!
[swift 3.0対応] iOS10アプリ開発完全マスター人気講座
iOSの開発が気になるので。。。こっち系を買っておこうかと思ってます。
あ、私が買ってよかったなと思う講座はこちらでした
デザインの方が勉強が止まっていて面白かったんですけど。だけどいつでも復活することができるから時間作ってまた再開したいと思います。
オススメです、ボリュームめっちゃあって大変だけどw書籍でいうと10冊分くらいあるかも。。。
あけましておめでとうございます!
数日間こっちのブログはアップしてませんでしたが、チュートリアルは進めていました。
ただ年内にやり終えようと思っていたのですが思いの外ボリュームが多く
年明け持ち越しとなりました。できれば今日明日中には仕上げたい。
エラーがその間、出てしまってなかなかうまくいかなかったり
rails testのエラーの意味が調べてもわからなかったりしたのでその場合はどうしたかというと。。。
実際の開発ではそんなことは無理〜だと思いますが、エラーが出てググっても質問してもなんかわからない時は。。。
飛ばす!
とにかく次に進みます。
実際非常に稀に最初の方のコードが間違えていても
後の方に出てくるコードをコピペしたら、あれ、エラー消えてる。
と言う場合もある(あった)
ので手詰まりそうになったら、無視して進む。
あとわからなくても、最初のうちはなんとなくの理解でいいと思う。
(理解ここでできなくても大丈夫って行ってくれる本もあるから)
100%理解するなんて多分相当無理だと思うんですよ。
htmlをちゃんと書いているはずなんだけど、エラーは出なくても画面にAccountの表示が出ない。コードはちゃんとかけている、なぜだ。
rails testをするとレイアウトのところでエラーが出ているのだけれど、調べてもどうも違う。うーん。
と言う手詰まりがありましたが。。。
無視しました。そして進みました。
本当はちゃんと理解した方がいいとは思いますが何が原因だったのか。。。
usersページを表示したらアカウントページがちゃーんとできてました。
多分プログラマーのお友達に聞けば全部答えてくれそうだけど。。。最近勉強時間取れなかったから聞くの憚られる。。
私はエンタメ業なので結構年末年始は仕事何ですが
サービス系以外の仕事の方はお正月とかおやすみな方多いと思います。
きっと親戚付き合いとかある方もいるとは思いますが
ここはやぱりお正月だからといってだらけないで
逆にお正月休みの間にこれやりきる!みたいなの作った方がいいと思うのです。
お勧めはUdemy のビットコイン自動売買アプリ作成のやつです。今はやりのビットコイン!
私でも数日で作ることができましたし
少額であれば試しにやってみるのもいいと思います。
Udemy はかいきりタイプのビデオレッスンですので何度でもやり直せますし書籍1冊分のお値段でお得です。 あとプログラミング系のレッスンだと質問した時の回答がとっても早い気がします(デザイン系のもので質問した時はなかなか返信がこなかった。。
そんな感じで
「正月暇だわー人混みに出て行くのもしたくないし。。」って思ってパソコンでネットサーフィンしてるそこの貴方!Udemy をポチってアプリ開発 しましょう!
or equal と言う代入演算子について。出てきて気になったのでメモに記しておきます。
以外とこれについて書いてるブログとかが少なくて。
以下引用します。
この「||=」(or equals) という代入演算子はRubyで広く使われているイディオムであり、Ruby開発者を志すならこの演算子に習熟することが重要です。or equalsという概念は一見不思議にみえますが、他のものになぞらえて考えれば難しくありません。
多くのコンピュータプログラムでは、次のような記法で変数の値を1つ増やすことができます。 x = x + 1 そして、Ruby (およびC、C++、Perl、Python、Javaなどの多くのプログラミング言語) では、上の演算を次のような短縮形で表記することもできます。 x += 1 他の演算子についても同様の短縮形が利用できます。
$ rails console >> x = 1 => 1 >> x += 1 => 2 >> x *= 3 => 6 >> x -= 8 => -2 >> x /= 2 => -1 いずれの場合も、●という演算子があるときの「x = x ● y」と「x ●= y」の動作は同じです。
Rubyでは、「変数の値がnilなら変数に代入するが、nilでなければ代入しない (変数の値を変えない)」という操作が非常によく使われます。4.2.3で説明したor演算子 || を使えば、次のように書くことができます。
>> @foo => nil >> @foo = @foo || "bar" => "bar" >> @foo = @foo || "baz" => "bar" nilの論理値はfalseになるので、@fooへの最初の代入「nil || "bar"」の評価値は"bar"になります。
同様に、2つ目の代入「@foo || "baz"」("bar" || "baz"など) の評価値は"bar"になります。
Rubyでは、nilとfalseを除いて、あらゆるオブジェクトの論理値がtrueになるように設計されています。
さらにRubyでは、||演算子をいくつも連続して式の中で使う場合、項を左から順に評価し、最初にtrueになった時点で処理を終えるように設計されています。
なお、このように||式を左から右に評価し、演算子の左の値が最初にtrueになった時点で処理を終了するという評価法を短絡評価 (short-circuit evaluation) と呼びます。論理積の&&演算子も似たような設計になっていますが、項を左から評価して、最初にfalseになった時点で処理を終了する点が異なります。
上記の演算子をコンソールセッション上で実際に実行して比較してみると、@foo = @foo || "bar"はx = x O yに該当し、Oが||に置き換わっただけであることがわかります。
x = x + 1 -> x += 1 x = x * 3 -> x *= 3 x = x - 8 -> x -= 8 x = x / 2 -> x /= 2 @foo = @foo || "bar" -> @foo ||= "bar" これで「@foo = @foo || "bar"」は「@foo ||= "bar"」と等価であることが理解できます。この記法をcurrent_userの文脈で使うと次のような簡潔なコードになります。 @current_user ||= User.find_by(id: session[:user_id]) お試しあれ。 補足: 技術的には、「@foo || @foo = "bar"」と書いた場合、Rubyの内部では実際にすべての項が評価されます (||が左辺にある点に注意)。これは@fooがnilやfalseでない場合に、無駄な代入を避ける必要があるためです。しかしこの式の動作では||=記法の動作と同じにならず、説明上不都合なので、上の解説では@foo = @foo || "bar" という式を用いて説明しました。
以上参考にさせていただきました。
英語の文章がサラサラ読めたらもっと情報が得られるのですが。。
今日はログイン機能を作っていきます。
ログインの基本的な仕組みとは、ブラウザがログインしている状態を保持し、ユーザーによってブラウザが閉じられたら状態を破棄するといった仕組み (認証システム (Authentification System))です。この認証システムの基盤が出来上がったら、ログイン済みのユーザー (current user) だけがアクセスできるページや、扱える機能などを制御していきます。なお、このような制限や制御の仕組みを認可モデル (Authorization Model) と呼び、例えば本章で実装するログイン済みかどうかでヘッダー部分を切り替える、といった仕組みもこれにあたります。
ユーザーログインの必要なWebアプリケーションでは、セッション (Session) と呼ばれる半永続的な接続をコンピュータ間 (ユーザーのパソコンのWebブラウザとRailsサーバーなど) に別途設定します。セッションはHTTPプロトコルと階層が異なる (上の階層にある) ので、HTTPの特性とは別に (若干影響は受けるものの) 接続を確保できます。
$ rails generate controller Sessions new
(rails generateでnewアクションを生成すると、それに対応するビューも生成されます。createやdestroyには対応するビューが必要ないので、無駄なビューを作成しないためにここではnewだけを指定しています)
config/routes のファイルにルーティングを書きます
get log inとpost login とdelete logoutの3行を追加しました。
そしてtest/controllers/sessions_controller_test.rbに新しいログイン用の名前付きルートを使うようにする必要があります
これでルーティングはできたようです。
見た目部分を整えます。ログインフォームの見栄えを作っていきます。
ログインフォームの見た目は最初の登録フォームの見た目とほぼ変わりなく。
emailとパスワード入れる欄、createボタンの代わりにlog inボタンがあり、
新規登録の場合は登録画面に移動するリンクが作られているようなものにします。
app/views/sessions/new.html.erbのコードを登録フォームの時と同じようにformforヘルパーを使って書きます
サーバーを立ち上げてloginアドレスに変えて表示してみると
こんな感じで2つ(email.password)ラベルと ログインボタン、リンクが生成されました。
続く!
全然関係ありませんが、今出張中で昨夜(クリスマス)仕事から帰ってきてこんなのを食べながらブログを書いてました。
でも。脳にいいのかちょっとよくわからない。どちらかというと細かくて食べにくかったですwただ、糖質を取るよりも眠気冷ましになるかとは思います。ローソンでかいました。味は三種類ですがわさび目が覚めそうで買ってみました。(地方限定かも)
なんとか年内にチュートリアルを終わらせたいと思っています。
今日はユーザー登録のところです。
現時点ではこんな画面です。
これをちゃんと登録できるように設定します。
ユーザー登録ページで重要な点は、ユーザー登録に欠かせない情報を入力するためのformです。Railsでform_forヘルパーメソッドを使います。このメソッドはActive Recordのオブジェクトを取り込み、そのオブジェクトの属性を使ってフォームを構築します
Userオブジェクトの作成:まずインスタンス変数@userにUser.newを代入する
Scssで見栄えを整えると
sign up画面がこんな感じですっきり見やすく登録画面ができました。
ただし、まだ登録ボタンを押しても
このようなエラーが出ます。
コントローラにcreateするアクションが見当たらないとなっています。
まだ作ってないので当然ですが。
なのでこのcreateアクションを作っていきます。
そうしてもう一度ユーザー登録をすると今度は
となります。
今度はcreateアクションの下に外部から使えないようにprivateアクションも追加します。
そしてユーザー登録に失敗した際のエラーメッセージも追加します。
<%= render 'shared/error_messages' %>
’shared/error_messages’というパーシャルをrender (描画)と云う意味。
sharedというディレクトリを作ってファイルを作ります。app/views/shared/_error_messages.html.erb
そこでエラーメッセージを表示することが可能になります。
もし空欄でcreateボタンを押した場合このように
上部に赤字でエラーメッセージが表示できるようになりました。
エラーの処理ができたのでconfig/routes.rbに post '/signup', to: 'users#create'(postリクエスト)を追加する。
しかし、この状態だとcreateしようとsubmitボタンを押しても送信されません(フリーズする)
コントローラに追加をします。
redirect_to @user
flashメッセージについてはちょっと割愛します。
Railsの一般的な慣習に倣って、ユーザー登録に成功した場合はページを描画せずに別のページにリダイレクト (Redirect) するようにしてみましょう。具体的には、新しく作成されたユーザーのプロフィールページにリダイレクトしてみようと思います (場合によってはルートURLにリダイレクトするのも1つの選択肢でしょう)。
無事にuserをcreateすることができました!
長くなるので
今日はここまで!
1日一記事更新するぞ!と思っていたのだけれど、昨日は練習やら出張準備やらで勉強できなかった。。
今日は合間にやっていく予定ですがやっと後半戦に突入。
目標は年内に復習を終わらせて来年は違うのやりたいです。
以前やっていたものの、ザーーーーーっと流したので細かく見ていくとかなり理解していなかった部分がたくさんあった。
多分今もあまり理解できてないんだろうけど。
今日から6日間出張に行ってきます!
出張の合間にできるところはやりたいですが。。どれくらいできるかな。7章以降は難しくなるのでわかりませんが。。
デバッグについて、いつもさらっとここも流していたので少しゆっくりやりながら進めていこうと思います。
Railsチュートリアルでいうと7章のところです。
デバッグ(debug)とは、コンピュータプログラムや電気機器中のバグ・欠陥を発見および修正し、動作を仕様通りのものとするための作業である。サブシステムが密結合であると、1箇所の変更が別の箇所でのバグを作り出すので、バグの修正がより困難となる
http://wa3.i-3-i.info/word1419.html
バグ→プログラムのおかしいところ
デバッグ→そのおかしいところを取り除く作業
デバッガー→バグの原因を見つけてくれるお手伝いをするソフトウェアの事orその仕事をする人
layout/application.html.erbに <%= debug(params) if Rails.env.development? %>を追加する
本番環境に展開したアプリケーションではデバッグ情報を表示したくないので if Rails.env.development?となる。
環境開発のみで行うべきで本番環境やテスト環境ではデバッグ情報は表示されないようにする。
デバッグの出力を綺麗にするためにCSSを追加します。
@mixin box_sizing {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.#ここでSassのミックスイン機能 (ここではbox_sizing) を使っています。ミックスイン機能を使うことで、CSSルールのグループをパッケージ化して複数の要素に適用することができます。
.
.
/* miscellaneous */
.debug_dump {
clear: both;
float: left;
width: 100%;
margin-top: 45px;
@include box_sizing;
}
Railsサーバーを立ち上げるとこんな画面になります。
デバッグ出力には、描画されるページの状態を把握するのに役立つ情報が含まれます。
これはparamsに含まれている内容で、YAML5という形式で書かれています。YAMLは基本的にハッシュであり、コントローラとページのアクションを一意に指定します。
YAMLとは
構造化されたデータを表現するのに便利な、ファイルの書き方ルール(の1つ)
です。
です。
http://wa3.i-3-i.info/word13801.html
Rubyist Magazine - プログラマーのための YAML 入門 (初級編
とりあえず7章からは難しいらしいです。しかもつぎからつぎへと知らない単語や知っているけどよくわからない単語、説明に困る単語が出てきます。
覚書なので意味のわからないところは多いブログではありますが、引き続きやっていきたいと思います。
続く。
今日は夜仕事なので家でプログラミングしています。
チュートリアルの内容をupdateしようかと思ったのですが、
普段よく、プログラミングする場所ってどこが最適なのか?と。
あ、独学してる人にとって。
私の場合メインはカフェか自宅なんですが家だとだらだらしちゃってなかなか進まないんですよね。。
個人的にはお勧めはファミレスです。
電源がないところが多いのですが、まず
というところです。
繁華街だと結構うるさいのでお勧めできないのですが。
住宅地なんかだといい感じに人がいないので
集中できるし。
なんだったら食事もできますし。リーズナブルなところが多いので。
カフェって机が小さいところが多いので
結構作業がしにくいです。
パソコンだけおければいいのかというと、手元にメモだったり、勉強中の本だったりをおきたい場合スタバやベローチェだと結構机不足。
ただ、電源があるところはかなり利用しがいがあります。
都心だと作業できるようなカフェも結構あるんですがうちの近所は以外とないんですよ(都会のくせに)
渋谷のbowling cafeは地下で繁華街ですがかなり静かでお勧めです。
テーブル広い!
以前Rubyの環境構築手伝ってもらう際に利用しました。
渋谷なのに空いてる確率が高く(地下だからかな?)wifiもあるし。静かなことが多いぽい。
帰ったらお酒飲んでアマゾンプライムだらだら見ちゃうから、とりあえず渋谷でコーヒー飲みながらチュートリアルやってプログラミングblog書いた。最近Canvaを使うのがお気に入り。 pic.twitter.com/lFKzwqf4Ri
— U-ki@逆立ちする人 (@acro_y) 2017年12月19日
ちなみに昨日は渋谷のilly のカフェを使いました。テーブルはちょっと狭かったけど2F席は結構空いてた。
自宅だとついいろいろ違うことをやってしまうんですが
コツはできるだけその日のタスクを決めてしまうこと
何時から何時までやってこれくらいは休憩。という感じで休憩もちゃんと時間を取ってあげること。
ある程度タイムスケジュールを組んでしまうといいのかもしれません。
ただ、ゲームとかテレビの誘惑が多い人はやっぱり自宅でやるのは控えた方がいいかもしれませんね。。
後、プログラミングやってて思うのですが、本当に人と喋らなくなるんですよね。。(私だけじゃないはず)
それが辛い人は店員さんと触れ合えるからやっぱり外でプログラミングした方がいいのかな。。
今日はデータベースのところで以前全然スルーしていたところです。
Railsはデータを保存する際にデフォルトでリレーショナルデータベースを使います。リレーショナルデータベースは、データ行で構成されるテーブルからなり、各行はデータ属性のカラム (列) を持ちます。
まずUserモデルを作るためにコマンドに
$ rails generate controller Users new
します。
そうするとファイルがいろいろできてきます。
この中にマイグレーションという新しいファイルが生成されます。
マイグレーションは、データベースの構造をインクリメンタルに変更する手段を提供します。それにより、要求が変更された場合にデータモデルを適合させることができます。このUserモデルの例の場合、マイグレーションはモデル生成スクリプトによって自動的に作られました。
マイグレーションファイルのファイル名には先頭に生成された時間のタイムスタンプがつきます。
マイグレーション自体はデータベースに変更を与えるchangeメソッドの集まり
changeメソッドはcreate_tableというRailsのメソッドを呼びユーザーを保存するためのテーブルをデータベースに作成します。
↓
create_tableメソッドはブロック変数を1つ持つブロック を受け取ります。
↓
ブロックの中でcreate_tableメソッドはtオブジェクトを使って、nameとemailカラムをデータベースに作ります モデル名は単数形 (User) ですが、テーブル名は複数形 (users) です(これはRailsで用いられる言葉の慣習を反映)モデルはひとりのユーザーを表すのに対し、データベースのテーブルは複数のユーザーから構成されます。
↓
ブロックの最後の行t.timestampsは特別なコマンドで、created_atとupdated_atという2つの「マジックカラム (Magic Columns)」を作成します。これらは、あるユーザーが作成または更新されたときに、その時刻を自動的に記録するタイムスタンプです
↓
$ rails db:migrate
マイグレーションを実行します。
↓
db:migrateが実行されると、db/development.sqlite3という名前のファイルが生成されます。これはSQLite5データベースの実体。
データベースの構造を見ることができるツールがdevelopment.sqlite3ファイルを開くためのDB Browser for SQLiteというものがあります。
↓
ダウンロードして、開くとこのように構造を見ることができます!(これ、前回やってませんでした多分)
データベースのところはちょっとかじってはやめ、かじってはやめ、、、で理解が全然できていないのでこれを機会にちゃんと理解したいなと思ってます。
続く!
footerを追加しました。
どうも単語だけが一人歩きしている感が否めない(私の中で)
アセットパイプラインについて今日は調べながら進めていきたいと思います。
すごく完結に書かれている記事がありました。
Ruby on Railsにはアセットパイプラインという機能が実装されています。その役割をひと言で説明すると、「Web画面上の色塗りを楽にする機能」です。
比喩として”色塗り”と言っていますが、具体的にはWebブラウザに画面のデザインを認識させるためにHTMLに紐付くCSSやJavaScript、Imageファイルを記述・作成することです。
アセットパイプラインとはWebの画面上の色塗り(CSSやJavaScript、Imageファイルを記述・作成)を楽にする機能ということですね!
Railsのアセットパイプラインでは、静的ファイルを目的別に分類する、標準的な3つのディレクトリが使われています。
app/assets: 現在のアプリケーション固有のアセット
lib/assets: あなたの開発チームによって作成されたライブラリ用のアセット
vendor/assets: サードパーティのアセット
静的ファイル (アセット) を上記の場所へそれぞれ配置すれば、マニフェストファイルを使って、それらをどのように1つのファイルにまとめるのかをRailsに指示することができます。なお、実際にアセットをまとめる処理を行うのはSprocketsというgemです。また、マニフェストファイルはCSSとJavaScriptには適用されますが、画像ファイルには適用されません。
必要なアセットをディレクトリに配置してまとめた後、Railsはさまざまなプリプロセッサエンジンを介してそれらを実行し、ブラウザに配信できるようにそれらをマニフェストファイルを用いて結合し、サイトテンプレート用に準備します。Railsはどのプリプロセッサを使うのかを、ファイル名の拡張子を使って判断します。最も一般的な拡張子は、Sass用の.scss、CoffeeScript用の.coffee、埋め込みRuby (ERb) 用の.erbです。
いやー、読んでるだけでは結構意味不明で眠たくなってきました。なのでコードを書きながら理解していこうと思います。
ただ、前になんとなくザーッとやっていた時よりも
コードを書きながら説明を読みながらじっくりやっていくとちょっとずつではありますが紐解けてきた部分もあるのかな。。
言語化するのが難しいです。
続きます。
今日もデザインの部分です。
Bootstrapについて少し触れていきます。
Udemyで今年最大のセール実施中。対象のオンラインコースが全て¥1200!学ぶなら今!
BootstrapはウェブサイトやWebアプリケーションを作成するフロントエンドWebアプリケーションフレームワークである。 タイポグラフィ、フォーム、ボタン、ナビゲーション、その他構成要素やJavaScript用拡張などがHTML及びCSSベースのデザインテンプレートとして用意されている。
まずはgemfileに
gem 'bootstrap-sass', '3.3.7'
を追加します。
そして$ bundle install してBootstrapを読み込みます。
カスタムCSSファイルを作るためにコマンドに
$ touch app/assets/stylesheets/custom.scss を打ち込んでファイルを作ります。
ファイル内に
@import "bootstrap-sprockets";
@import "bootstrap";
を記述。
サーバーを起動させると前回はこれ↓
からの↓
とBootstrapを読み込むだけでずいぶんサイトらしくなりました。
CSSファイルは最終的にこういう感じ。↓
@import "bootstrap-sprockets";
@import "bootstrap";
/* universal */
body {
padding-top: 60px;
}
section {
overflow: auto;
}
textarea {
resize: vertical;
}
.center {
text-align: center;
}
.center h1 {
margin-bottom: 10px;
}
/* universal */
body {
padding-top: 60px;
}
section {
overflow: auto;
}
textarea {
resize: vertical;
}
.center {
text-align: center;
}
.center h1 {
margin-bottom: 10px;
}
/* header */
#logo {
float: left;
margin-right: 10px;
font-size: 1.7em;
color: #fff;
text-transform: uppercase;
letter-spacing: -1px;
padding-top: 9px;
font-weight: bold;
}
#logo:hover {
color: #fff;
text-decoration: none;
}
ロゴを設定しボタンを中央寄せになりました。
今日は短いけど、これだけ!(出先でwifiの電池がやばい)