Re: ゼロから始めるアプリ開発

この記事の概要 mechanaizeというgemを使って、webスクレイピングを試してみました。 目次 この記事の概要 目次 注意 やってみよう 参考文献 注意 スクレイピングをするサイトによっては、意図的にサーバーダウンを起こすことにも繋がり、場合によっては逮捕・起訴されることもあります。また、著作権などを著しく侵害する場合もあるので、基本的には自己責任でWebスクレイピングをやるようにしてください。事件になった例について、詳しくは 岡崎市立中央図書館事件 などを参照されるといいと思います。 やってみよう 事前準備編 まず[rails new]コマンドで、sampleAppという名前のアプリケーションを作成します。  $ rails new sampleApp  その後cdコマンドでディレクトリを移動して、  $ cd sampleApp  クラスを作ります。今回はclassという名前のControllerを作りたいので、第4引数に[Class]を指定してあげます。  $ rails g controller Class  controller編 [app] > [controllers] > [class_controller.rb]に移動します。 デフォルトで、こう書いてあると思うので class ClassController < ApplicationController end class ClassController < ApplicationController     def index        agent = Mechanize.new         page = agent.get("https://www.yahoo.co.jp/")         @elements = page.search('h1') # h1要素を検索     end end こう修正します。 今回はYahoo!のトップページからスクレイピングを行いたいので、pageのagent.getの引数にはYahoo!のアドレスで

この記事の概要 BootstrapをCDN経由でインストールしたら、CSSがおかしくなって、デザインが大幅に変わったという話。この場合はCSSの優先順位を確認しよう。 目次 この記事の概要 目次 Bootstrapとは？ Bootstrapのインストール方法 発生した問題 解決法 参考文献 Bootstrapとは？ BootstrapとはTwitter社のMark Otto, Jacob Thorntonによって、2011年に開発されたCSSフレームワークであり、モバイルとWebのメディアクエリの設定が容易かつデザインのオシャレさにも定評があるため、世界で最も人気のあるCSSフレームワークとして世界中のWebデベロッパーから利用されている。 以下、公式ページより抜粋。 世界で最も人気のあるフロントエンドコンポーネントライブラリを使用して、レスポンシブなモバイルファーストプロジェクトをウェブ上に構築します。 Bootstrapは、HTML、CSS、およびJSで開発するためのオープンソースのツールキットです。 Sassの変数とミックスイン、レスポンシブグリッドシステム、豊富なビルド済みコンポーネント、jQueryで構築された強力なプラグインを使用して、アイデアをすばやくプロトタイプ化したり、アプリ全体を構築したりできます。 Bootstrap公式ページ  https://getbootstrap.com/  より  Bootstrapのインストール方法 Bootstrapをインストールするには2種類方法があり、1つ目は公式からテンプレートをダウンロードして、ローカルフォルダに展開する方法。そしてこのページでは、CDN経由でBootstrapを読み込む方法を解説する。 BootstrapをCDN経由でインストールするメリットとしては、無駄なファイルをネットワーク経由でインポートする必要がないため、前者の方法と比較して、フォルダの容量を軽くすることが出来る点などがある。 注意だが、Bootstrapはそのバージョンによってコード・できることに差異があるので、主流な3系と4系を比較して、どちらのフレームワークを採用するかを考えないといけない。 続いて、ダウンロードする方法は以下の通り。 今回はこの

この記事の概要 簡単なサンプルアプリを通して、SwiftUIにおけるListの使い方をおさらいします。 目次 この記事の概要 目次 作るもの プロジェクトを作る 完成形 まとめ 参考文献 作るもの 週刊少年ジャンプ連載中の漫画・ハイキュー!!に登場するキャラクター5人の情報をリスト形式にまとめたアプリを作りながら、Listの使い方をまとめようと思います。 完成イメージはこんな感じです。 [図1] 完成イメージ プロジェクトを作る ページ上部のナビゲーションメニューの[New]>[File]より、[SwiftUI View]を選択し、ファイル名を指定。自分の場合は[ListSampleView]と設定します。 [図2-1]  [図2-2] まずキャラクタークラスを定義してあげます。大事なのはCharacterクラスの型をIdentifiableにしておくこと。今回は、背番号（player_number）と氏名（name）、そしてポジション、CV(声優)の4つのプロパティを用意してあげます。idはリストの項目固有のidである、くらいの認識で大丈夫です。 struct   Character :  Identifiable {      var   id :  Int //リストアイテム固有のID      let   player_number :  String //背番号      let   name :  String //名前      let   position :  String //ポジション      let   CV :  String //声優 } それが出来たら、今度はListSampleViewの中に今回用意する配列を書きます。実務であればここの配列はAPIなどから値を取ってくるコードになるのですが、難しくなるので今回は省略します。また機会があればFirebase等との連携verも書きたいですね。 struct   ListSampleView :  View  {      //データベース（配列）の用意      let   charas : [ Character ] = [