Webアプリ、テクニック
GitHubへの問い合わせ機能を使う JekyllとGitHub Pagesを連携させるとします。 GitHubに情報を問い合わせ、GitHubのレポジトリの一覧を表示する方法について書こうと思います。 ポイントは2点あって、 jekyll-github-metadata gemを使う データ（_dataディレ…
多言語のウェブサイト構築 Jekyllの勉強を兼ねてブログを書いたおかげで、だいぶ分かってきました。 それをまとめた「はじめてのJekyll + GitHub Pages」が出来上がり、一区切りですが、これからはその続編を書こうと思っています。 前回が入門編でしたので…
GitHubレポジトリのブログ更新 久しぶりにレポジトリ・ブログの更新をしました。 このブログは作ってはみたもののあまり更新せずにいました。 実はJekyllを使ったサイトです。 このサイトを作った頃はまだJekyllがよく分かってなくて、あまり深入りせずにい…
このブログの「Jekyllを勉強中」をもとに、内容を整理し、より分かりやすく書き直したチュートリアルが完成しました。 トップ画面のイメージです。 Jekyll tutorial for beginners ブログとチュートリアルの違い ブログとの違いは4つです。 内容の順を変えて…
長くJekyllのことを書いてきましたが、今回で最後です。 今回は、Jekyllでサイトを作る上で中心となるLiquidのポイントを説明します。 Liquidには簡潔なドキュメントがありますので、参考にしてください。 Liquidの基本 オブジェクト タグ フィルター Jekyll…
今回はブログの作り方です。 ブログの仕組みの作り方 Leap daysはデフォルトでブログ機能をサポートしていないので、自分で仕組みを作らなければなりません。 といっても、それは大変な作業ではありません。 デフォルトのテーマminimaがブログをサポートして…
追記 2022/8/23： コレクションの名前に「documents」を使っていましたが、この名前はJekyll自身が別の意味で使う変数になっていたので、「chapters」に変更しました。 また、_config.ymlの中で使っていたsort_byキーはJekyll4.0以降で可能ですが、GitHubのJ…
今回は、Leap-dayテーマのレイアウトを説明し、index.htmlを作ってみます。 レイアウトファイルの置き場 Jekyllではレイアウトファイルの置き場は/_layoutsです。 ただし、最初のスラッシュはJekyllのソースファイルのトップディレクトリです。 Linuxのルー…
今回は、github-pagesというgemについて書きます。 Gemfileの利点 前回（「Jekyllを勉強中（４）」）Gemfileを使ってJekyllを動作させる上で必要なgemを指定しました。 実際に追加されるgemはGemfileに書いたものより多く、10以上のgemが追加されることが多…
前回のブログで、ローカルのgitとGitHubとでHTTPSプロトコルを使って通信する方法を書きました。 SSHプロトコルを使う方法もあります。 今回はそれを話題に取り上げたいと思います。 この記事を読む前に注意していただきたいこと SSHについて 鍵の生成 GituH…
作成したGitHubのレポジトリをローカルにクローンして、Jekyllでテストすることを説明します。 あわせて、Gitについても簡単に触れます。 GitはJekyllに限らず、開発では必須のアプリです。 Gitについて インストール Gitの使い方 初期設定 GitHubのレポジト…
Jekyllはプログラム名ですが、読み方が難しいです。 Jekyllは小説「ジキル博士とハイド氏」のジキルと同じスペルで、英語の発音は「ジェクル」または「ジークル」らしいです（辞書で確認）。 前回のブログに貼り付けたユーチューブのプレゼンターは「ジェキ…
引き続きJekyllの勉強中です。 2つに分かれるJekyllのユーザ・タイプ Jekyllのウェブサイトのドキュメントはほぼ読み終わって、全体的な感じがつかめてきたところです。 その中で見えてきたことは、Jekyllを使う2つのタイプのユーザを分けて考えることが重要…
追記 2022/8/23： このブログの9回シリーズ「Jekyllを勉強中」の内容をもとに、「はじめてのJekyll + GitHub Pages」をGitHub Pagesに作りました。 ブログの内容をさらに検討してより整理され、分かりやすくなっています。 Jekyllを勉強したい方は、ブログよ…
上級編では、ブログをより分かりやすく、楽しくする技術を紹介します。 はじめてMarkdown記法を勉強する方は「入門編」から読んでください。 目次 上級編 目次を作る 表を作る リンクをお洒落にする 数式を表示する 脚注 HTMLのspanタグとスタイルシートを使…
（追記）「強調」のところに誤りがありましたので訂正しました（2022/7/13、7/19）。 この記事は、はじめての「はてなブログMarkdown」（中級編）です。 Markdownを始めて勉強する方は、「入門編」から読み進めてください。 目次 中級編 リスト（箇条書き） …
この記事は「入門編」の続編です。 Markdownをはじめて勉強する人は「入門編」からお読みください。 目次 初級編 画像の入れ方 新規画像をアップロードし記事に挿入する方法 アップロード済みの画像を記事に挿入する方法 画像のプレビューと調整 リンクの貼…
本稿は、Markdownを全く知らない人を対象とした、はてなブログにおけるMarkdownモードのチュートリアルです。 また、学習の段階を4つに分けて、ビギナー向けの「入門編」、入門編の次の段階の「初級編」、さらに「中級編」、「上級編」を設けました。 読者は…
「とほほのwww入門」を推薦する記事を書こうと思います。 ウェブサイトはこちら。 とほほのWWW入門 「とほほのwww入門」は1996年に作られたウェブサイトです。 私は、2000年頃にホームページを作っていて、「とほほのwww入門」には大変お世話になりました。 …
Rails(Ruby on rails)は有名なウェブアプリ・フレームワークです。 クックパッドが有名ですが、それ以外にもRails上のウェブサイトを持っている会社はたくさんあると思います。 今回は、Railsを知らない人が、どのように学んでいけば良いのかを解説します。 …
Google サイトを試してみました。細かい設定はできませんが、簡単にウェブページを作れるのがとても良いと思いました。これならば HTML を知らない人でも無理なく作ることができます。写真を貼り付けたり、リンクを設定したりするのも簡単です。しかし、複数…
先週、WNoteのバージョンアップをした。前回のアップロードでは、Rrailsのバージョンは5で、Bootstrapも3だった。それが、現在はRailsは7でBootstrapは5になっている。 バージョンアップの作業は大体一週間ぐらいで終わった。作業の多くはBootstrapの修正だ…
最近音声入力にハマっている。既に知っている人からは今更何を言ってるんだと思われるかもしれない。しかし自分は最近になって音声入力を始めたので、仕方がないのだ。 音声入力は二つあって、一つはコンピューターの音声入力で、Chromeを使って入力する（Fi…
WNoteのテスト版ができました 最近立て続けにGitHubにアップロードしていたWNoteがバージョン0.9のテスト版になりました。これは、正式リリース前のテスト版で、テストが終了すればバージョン1.0の正式リリースになります。 WNoteの稼働版 WNoteのテスト版は…
WNoteに画像サポートを加えました WNoteに画像サポート機能を加えました。クリックしてWNoteの画面をご覧ください。城ヶ崎海岸の写真が貼られています。Bootstrapをサポートしているので、サークルでトリミングするなどの表示も可能です。 インプリメント方…
WNoteの改訂 WNoteは「Web Note」の意味で、ウェブ上でノートのようなものを実現することを目指して作りました。2年位前に作り始め、1年くらい前まで開発して、しばらくそのままになっていました。この「おもこん」にも紹介したことがあったと思います。有名…
横書きの段落開始は１文字あけるか インターネットのある記事で、「ブログでは段落の開始が１文字下がっていないものが多い。日本語の横書きでは段落の開始を１文字あけるべきか、あけなくてもよいのか」ということが取り上げられていました。このブログでも…
改行コードについて 少し前に文字コードについて書きましたが、改行コードについても気をつけなければいけない点があります。簡易掲示板のスクリプトでも、改行コードにを神経を使っています。 改行コードの歴史 現在はPCからユーザへの出力はディスプレイを…
時刻について perlの時刻を扱うモジュール perlには時刻を扱うモジュールが複数あるそうです。その中で標準となるものを調べてみたのですが、今ひとつはっきりしませんでした。それで、今回は古い方法を取り入れることにしました。使いやすいとは思わないの…
プログラムに誤りがありましたので、一時的に問題部分を削除しました 後ほど修正版をアップします。 データファイルについて POSTデータの改行コード TEXTAREAタグで入力されたデータには改行が含まれる可能性があります。この改行がどういうコードで送られ…
