読者です 読者をやめる 読者になる 読者になる

ふんわりした生活

本を読んだり仕事でやってみたことなどの日常から、ふんわりと気づきなどを書いていきます

快適な執筆環境としてのGitBookはイマイチ使いづらい

今回は久しぶりにTyporaでエントリを書いている。それは、あまりに同じものばかりつかっていると飽きてしまうし考えることも狭くなると考えているからだ。ということで、今回はTyporaだ。

以前からGitBookで少しづつPowerShellの入門書を書いてはアップしていたのだが、いまは停滞している。というのも、すでにPowerShellに対して特別視するほどの情熱がなくなっているからだ。いまとなってはVBScriptと同格に考えられるくらいにマルウェアとして活用されてしまっている。WSHと同様、PowerShellWindows操作という面ではパワフルすぎるのだ。

さらに、GitBookの専用エディタをつかって書いていくと、あまりに高機能すぎて嫌気がさしてくる。日本語の見出しをつけようと思うとおかしなことになるので、一度英語でつけて(これがファイル名になるわけだ)ファイルが確定してから日本語に変更するというオペレーションも信じられないほど面倒に感じるようになった。そういうことなら1ファイルでずっと書いていったほうがいいんじゃないだろうか!?と勘違いしてしまうほどだ。もちろん、分割したほうが後々の推敲で便利なので分割せざるを得ないのだが。

GitクライアントとしてのGitBook

保存ボタンを押すと、自動的にコミットされる。コミットメッセージを書くことすらできずにコミットされてしまう。あとから別の方法でメッセージをつけなおすことを考えたらVS Codeで書いたほうがいい。CLIのGitBookは便利だし、これで手元にローカルGitBookサーバーを立ててプレビューできるのでいいのだが、編集はお好みのエディタでやったほうが絶対にいい。

ePub作成のためのGitBook

GitBookでもePubを出力することができる。もちろんTyporaでもできるが、それは同梱されているPandocのおかげである。Pandocなら自前で用意することもできるうえ、オプションをつければコードハイライトも自動でやってくれる。お好みの配色というものがあると思うが、電子書籍リーダー(特に白黒のもの)次第なのであまり凝った配色にしてもほとんど意味をなさないどころか、かえって読みづらくもなる。標準のもので出力するのが一番よいとわたしは考えている。

導入についてもPandocだとインストーラWindowsでもインストールできる。一方でGitBookはCLIをインストールして、そのうえで必要になるライブラリもある。ePub形式にするところを自動化することを考えているのであれば非常によい選択肢なのだが、ちょっとやるにはヘビーすぎる。Pandocだと基本的なオプションさえ覚えておくかバッチファイル、シェルにしておけば簡単にePubにできる。

pandoc -f markdown -t epub3 chapter1.md -o sample.epub

kindle用にmobiにしたい?してもいいが、Amazonで出版する分にはmobiにする必要は一切ない。Word、PDF、mobiのほかにePubもOKだ。どうしてもmobiに自動的に変換したいのであればGitBook CLIで一撃だ。逆にPandocでepubにしたものをmobiにするならkindlegenツールをつかうとやってくれる。Microsoft Edgeが先日のWindows10のCreaters updateでアップデートされ、ePub形式が関連付けされた。正直言って、手元のkindleへ送る必要がなければこれで十分すぎるだろう。

クライアントアプリとしてのGitBook

とりあえず面倒に感じてしまう。このクライアントアプリはElectronでできていて、Windowsでもmacでも動作する。それに中央リポジトリとしてGitBookが存在するので、認証しさえすればどこでも同じ環境で執筆することができる。ただし、動作は快適ではない。どうしても性質上、オンラインでいる必要がある。完全にオフライン環境で執筆できるほうが快適だ。そう考えればお好みのエディタでオフラインであっても、執筆してGitBookへコミットだけするというほうが使い方としては妥当だ。

はじめてGitBookで出版したいと思っているなら

Amazon楽天Koboなんかへ出版するようなものでもない、マンガなんかでもない、そうなったらホスティングして・・・ということを考えるかもしれない。GitBookはホスティングしてくれるので特に考えることはない。しかも見た目はインストールを少しがんばればローカルで確認することもできる。

そうは言っても、ホスティングするだけでは読んでもらうことができない。自身のSNSやブログなどで本へのURLを貼って、流れ込んでもらえるようにしたほうがいいだろう。Trafficでどのくらいのひとが読んでくれているかが少しはわかるようになっている。お金にしたいのであれば、間違いなくGitBookではなくepubなどへ出力してAmazonのKDPへ登録したほうがいい。さらに、他へ出版したことがない、あるいはしない本であればKDPセレクトに登録することができる。こうするとロイヤリティが7割になるうえ、読んだページ数に応じて売りあがるようになる。

GitBookを利用するのであれば、無償提供するつもりのものにしたほうがいいだろう。

他にないのか

使いにくさという意味では個人的にはトップレベルなのだが、ブクログのパブーというサービスがある。このサービスだとGUIでマークダウンなんて知らなくてもブログエディタのようなエディタも用意されているし、そのままパブー内で配信することもできる。そして、有料にすることもAmazonなどへ出版することもできる。ブラウザだけで完成させることができるので、何にもセットアップしたくないという場合には大変おススメだ。いつのまにかkindleへ送信できるようにもなっているので、さらにいいかも。

他にもいろいろあるが、どうしたらいいか迷ったらテキストエディタを探さないでMS WordかGoogleドキュメントで作成したdocxをKDPへアップするか、macのPagesでePubやPDFに書き出しができるのでそちらをアップすればいいだろう。ブログの出版サービスを使うというのもひとつの選択肢だ。

いずれにしても、無理しないことだ。やりたいことだけに注力したほうがいい。

専門知識がいらないKindle電子書籍出版マニュアル2017 年度版

専門知識がいらないKindle電子書籍出版マニュアル2017 年度版

Fire タブレット 8GB、ブラック

Fire タブレット 8GB、ブラック

Windows10にSmallBasicがストアアプリとしてやってきた

先日、窓の杜だったか(いや、Microsoftのブログだったかも)でSmallBasicがWindows10のストアアプリとしてリリースされるというのを見た。実際にストアで見てみるとSmallBasicがそこにあった。

forest.watch.impress.co.jp

channel9.msdn.com

かなり以前に、もう5年以上前だったと思うが何かに利用できないかと思って調査のためインストールして使ってみていたことがあった。そこで、子供向けにプログラミングを学ぶためのツールとして最適だったりして、と思い早速Windows10のストアアプリ版をインストールしてみた。

www.microsoft.com

ストアアプリなので、ストアからインストールすればいきなり利用できる。昔は単独のインストーラをダウンロードしてきてからインストールしていたので、Windows10ならめちゃくちゃ簡単になっている。なお、以前のSmallBasicをインストール済みの場合はアンインストールするように書いてあった。なにかしら競合するのだろう。

起動してみると、そこには昔と変わらない姿のSmallBasicのIDEがあった。なんだ、見た目が昔のままかよ…

久しぶりに起動してみたので、satoyama-editorをSmallBasicでつくってみた。 f:id:m0t0k1m0t0k1:20170413004927j:plain こういうなんの機能もないアプリだと環境が変わってもガンガンつくることができるので、ちょっとやってみるのにとてもいい。

GraphicsWindow.CanResize = 0
GraphicsWindow.FontName = "Meyrio UI"
GraphicsWindow.FontSize = 16
title = "satoyama editor"
Init()
button = Controls.AddButton("clear", GraphicsWindow.Width - 140, GraphicsWindow.Height - 60)
textbox = Controls.AddMultiLineTextBox(20, 48)
Controls.SetSize(button, 120, 40)
Controls.SetSize(textbox, 540, 320)

Controls.ButtonClicked = OnClick
Controls.TextTyped = CountChar
Timer.Interval = 600 * 1000
Timer.Tick = OnChime

Sub OnChime
  Sound.Play("C:\Users\path\to\chime.mp3")
EndSub

Sub OnClick
  if Controls.LastClickedButton = button then
    Controls.SetTextBoxText(textbox, "")
    Init()
  EndIf
EndSub

Sub Init
  GraphicsWindow.Title = title + " - chars: 0"
EndSub

Sub CountChar
  If Controls.LastTypedTextBox = textbox Then
    editor = Controls.GetTextBoxText(textbox)
    count = Text.GetLength(editor)
    GraphicsWindow.Title = title + " - chars: " + count
  EndIf
EndSub

いま数えてみたら、40行ないくらいで記述することができた。めちゃくちゃ短い。

特徴

このSmallBasicの良いところは3つある。ひとつめは、Basicっぽい構文だけどかなり簡略化してあって覚える必要がほとんどないところ。ほとんどはIDEが自動補完してくれるのでビジュアルプログラミングのごとく内容にだけ集中することができる。

ふたつめの良いところは、このままコンパイルして実行形式にすることができるというところ。一度実行しておけば実行形式ファイルが完成するのでSmallBasicライブラリ「SmallBasicLibrary.dll」と一緒に配布したら利用できる。それにウェブへパブリッシュすることもできる。

三つ目の良いところは、なんだかなーと思ったらVisualStudioへ昇格することができるということ。もっと込み入ったことがしたくなったらということだが、かなりのことはSmallBasicでできる。

つらいところ

久しぶりにつくってみて、こんなのだったっけ??と戸惑ったところも結構あった。.Netのつもりで使おうとすると圧倒的に利用できるメソッドが限定されているということ。もっと細かいのできないんだろうかーと思うが、入門者向けでなくなるから排除してあるのだろう。それから、ラベルコントロールがないということ。テキストボックスコントロールはあるが、読み取り専用にできない。グラフィックウィンドウというフォームオブジェクトがあるが、ここへ直接文字を書くと変更するときにフォームの内容を消去する必要があるのでつらい。結果的にウィンドウのタイトル部分を利用するということにしてしまった。

しかし先ほどのコードだとかなりの確率でクラッシュします。どうもタイマーまわりのようなんだが、Timerには制御できるものがあまりないのでどうしたものやら。タイマーで音を鳴らすようにしているのがまずいのかもしれないけど。

そういえば、数秒ごとの保存は実現できていない。書き出しする機能があったっけ??

SmallBasicでタートルをつかったお絵かきも楽しんだので、実務用というよりはプログラミング学習用ということでつかいましょう。タイマーが同時に2つや3つ使えないのも意外とつらかったし。

オフラインでhtmlの練習ができるもっといいものがあった - WebMaker

なんだ、そんないいものがあったのか、という気持ちでいっぱいです!

m0t0k1m0t0k1.hatenablog.com

小学生向けにhtmlを教えるとき、エディタによる補完とかの補助を受けたいけどインターネットに接続されてなくても使えるものがないかと探していた。そこで、簡易なエディタを以前につくりかけていたのだが…

もっといいぞ

偶然に他の調べ物をしていると、Google Chromeのアドオンとして動作する「Web Maker」というものを見つけた。これならWindowsパソコンだろうがmacだろうが、関係ない!やった!

webmakerapp.com

使ってみたところ、ブラウザ内でサーバーが動作しているのか、ライブプレビューされる。CodePenやJSBINのようにhtml、cssJavaScriptの3つのペインで記述することができて、プレビューへ結構すばやく反映されていく。それぞれのペインはhtml固定というわけではなく、次のように設定で切り替えすることができる。

htmlペイン cssペイン JSペイン
html css JavaScript
markdown scss CoffeeScript
pug sass ES6(Babel)
LESS TypeScript
Stylus

以下が使ってみた、非常に面白くないサンプル。 f:id:m0t0k1m0t0k1:20170407123314j:plain 外部ライブラリもインポートしてくれるので、主なところはこれだけでサクッとなにかつくれそう。

f:id:m0t0k1m0t0k1:20170407123410j:plain Chromeさえ動いてくれたらなんとかなりそうというのが非常に素晴らしい。中古のPCでもなんとかなりそうな予感があたりに満ちてきた。

個人的に素晴らしいと思うところ

標準でエディタでインテリセンスが有効になっていること、そして構文ハイライトがされるところが素晴らしい。それに、もっと大事なこととして、ハイライトのテーマを選択することができるようになっている!!!さきほどのスクリーンショットではmonokaiだが、Solarize Darkなど、わたしの好きなテーマも入っている。VisualStudio系のものも入っていると良かったんだけどね… f:id:m0t0k1m0t0k1:20170407123331j:plain フォントサイズも変更できる。フォントは変更できないが、見やすいので問題ないだろう。

マークダウンではテーブルも問題なさそう。どういうフレーバーなのかわからないけど、それはまた後で調べてみる。 f:id:m0t0k1m0t0k1:20170407123458j:plain

アプリ内に保存することもできるが、ファイルへのエクスポートやインポートも装備されているので、困ることは少なそうだ。スクリーンショットを撮ることもできるので、サンプルをつくって他人へ見せるというのもオフラインでできるので便利すぎる。

気になるとしたら、日本語メニューでないので避けたいと思う方がいくらかはいそうだ。それに、Chromeアプリっていつまで続くんだろうね。あとは、これでマークダウンを書き続けることはしんどいので、やはりスニペットくらいの利用になるとは思う。

次回、htmlを教えるときにはこれを使うかな。

Kindleアプリストアに公開したアプリを使ってエントリするテスト

これはテストです。

m0t0k1m0t0k1.hatenablog.com

昨日エントリした記事で、App Inventor2をつかって作成したAndroidアプリをKindleアプリストアへリリース申請していた。ものすごくあっけなく審査は通過して、いまそのあぷりをつかってこのエントリを書いている。さすがにKindle Fireから記事をそのままフリックで入力していくのは非常にツラいので、キーボードを繋いで使用している。

Satonaka Editor

Satonaka Editor

使い勝手は悪くない。しかし、いちいち予測変換が表示されて見辛い。それに自分でクリアをタップしてしまうことがあるので、そこは改善の余地がある。

画面が小さいのは気にならない。それよりもむしろAmazon Driveへの下記だしをサポートするべきだったことに気がついた。やはりきちんとつくったほうがいいな、というのが最大の反省点であろう。

もちろん、App Inventorでもファイルの書き出しはサポートされているので、それを利用すればファイル書き出しは簡単に行うことができる。あら?むしろAmazon Driveを直接使うのではなくて、その方がいいのかな?どこへ保存したいのかはゆーざーに任せたほうがいいのか、そこが流儀がデスクトップと違いそうだというところが気になるものではある。

一応スクリーンショットも撮ってみた。横向きにしても使えるので、小さいディスプレイのように利用するといいだろう。 f:id:m0t0k1m0t0k1:20170406124855p:plain

今後について

このアプリはテスト用につくってみたものだが、ファイル保存くらいはサポートするように改修しても個人的にも良いように感じるので、いずれアップデートしようとおもう。

また、デスクトップ用につくっていたsatoyama editorとの使用感の違いが一点あることにも気づいた。10分経過で鐘の音が鳴るのは同じなのだが、ダイアログを表示して一度手を止めさせるということをさせていなかった。これもアップデートしたいところではある。

それにしてもモバイルのOperaからのはてなブログは投稿しにくい。

はてなブログ Perfect GuideBook

はてなブログ Perfect GuideBook

これなら小学生でもAndroidアプリを開発できる!App Inventor2をつかってkindle fire用アプリを申請した話

こども向けにプログラミング教室のようなことをはじめようと考えてCode Studioのカリキュラムを実際にやっていっていたところ、おもしろいものを見つけた。どうやら5年以上前から存在していたようなのだが、いまさら知ったというところ。それが、App Inventorだ。

App Inventor

どうやら調べてみたところ、最初はGoogleが行っていたプロジェクトのようで、数年前にオープンソース化されているようだ。現在はMIT(マサチューセッツ工科大学)の方がメンテナンスしているらしい。MITと聞くとやはりScratch・・・と思うのだが、まぁだいたい同じような感じ。ビジュアルプログラミング環境で、ブロックを組み合わせてアプリを開発することができる。しかもエディタはブラウザ内にある。

ところが、Scratchとまったく異なるところがある。それは、これ単独でAndroidアプリを開発することができるという点だ。Code Studioにもブロックを組み合わせてJavaScriptを記述してアプリをつくることができるエディタがある。これはアプリの表示もブラウザ内で行われるのだが、こいつは違う。ブラウザからビルドをしてapkファイルを作成することもできる。コンパニオンアプリをスマホやパソコンに導入すれば、そのままデバッグも行うことができる。恐ろしい。Javaなんか必要なかったんだ!!!

とはいえ

もちろん当たり前だが、良いことばかりではない。見た目はあらかじめ用意された部品から選択するようになるので、デザイン的なカスタマイズ性は低い。できることもかなり限られているので、込み入ったアプリをつくるのはかえって難しい。それでも、手元に実機のAndroidがあれば自分で開発したアプリを自分のスマホタブレットで動作させてみることが比較的かんたんにできるというのは夢があっていいな。

Androidアプリにビルドできるというので、いまこのエントリを書いているHTMLベースのsatoyama-editorをアプリにしてみようと考えた。実に浅はかな考えではある。だが、以前からモバイルのOperaでは音声の再生がうまくいかないという問題があったうえ、いくらElectronアプリにしてもタブレット内で動作するわけではない。そういうことで、このApp Inventorがどの程度つかえそうなものなのか遊んでみようと思い、実際にアプリにしてみた。 f:id:m0t0k1m0t0k1:20170405133158p:plain

アプリをつくる

App Inventorは現在バージョン2のようだ。ブラウザベースで動作する。最初はGoogleアカウントでログイン認証が発生するので、Googleアカウントを持っていないこどもには少々ハードルが高い。やってみるならお父さんお母さんのGoogleアカウントでログインするようになるだろう。

MIT App Inventor | Explore MIT App Inventor

このページの「Create apps!」というボタンらしきものをクリックするとエディタが登場する。なお、以下が今回つくった「Satonaka Editor」のプロジェクトである。 f:id:m0t0k1m0t0k1:20170405132843j:plain ご覧いただくとお分かりのように、画面左側に部品の一覧があり、中央がデザイナー、左がプロジェクトの内容をツリー上に見ることができるビューア、そして部品ごとのプロパティ画面というようになっている。古来より利用されているVisualBasicなどの開発環境に慣れた方なら「はいはい」というように部品をデザイナーへもっていっていろいろすることができる。

部品がそろったら、いよいよコードだ。コードは先ほども言ったようにビジュアルプログラミングすることができる。対象となる部品を一覧からクリックすると、それに関するイベント、プロパティやメソッドが配置されたブロック一覧が表示される。

f:id:m0t0k1m0t0k1:20170405133010j:plain あとはこれをエディタ部分へドラッグ&ドロップすればコードを書いていくことができる。なお、以下が今回のコード。ブロックがやたらたくさん見えるのでごちゃごちゃしているが、今回は関数定義などを試してみていないのでちらかっているということと、変数が面白いのでということがある。 f:id:m0t0k1m0t0k1:20170405132907j:plain 変数の何が面白いかというと、Scratchとは異なる考え方でつくられているということだ。Scratchでも現在のブラウザベースで動作するバージョン2からはスコープが明示できるようになった。しかし、どれがそうなのかといったことは見た目にわかりにくい。App Inventorでは見た目がごちゃごちゃしそうなところなのに、あえて変わったアプローチをとったようだ。

f:id:m0t0k1m0t0k1:20170405132924j:plain 何が違うのか?それはスコープ、変数の存在範囲がブロックの形状ではっきり視認できるというところだ。変数を宣言すると、そこから変数が作成される。そのとき、何をあらかじめセットしておくかを明示的にブロックで表現できるだけでなく、この変数がいつまで使えるのかということも囲まれている範囲で見てわかるというところが面白い。

最初は「は?どういうこと??」と感じたわけだが、わかれば「なるほど・・・」とうなずくばかり。こういう考え方もある。

便利な部品

アプリをつくってみると、ほんとうにちょっとした細かいことができない。クリップボードへテキストボックス内のテキストをコピーしたりはできない。テキスト内の部分を選択することもできない。このあたりの操作はユーザーにゆだねられている。キータイプしたイベントは発生しないため、タイマーで常時監視させるという方式を採用せざるを得ないなど、「そういう感じになるかー」といったところ。

ただ、便利なものもある。たとえば、TinyDBという部品。これは目に見えない部品なのだけど、利用することができる。satoyama-editorではブラウザのローカルストレージを利用してテキストを保存したり、アプリ起動時に保存されている内容を呼び出したりしていた。これとほぼ同様のことをデータベース操作なしで利用することができる。どうやっているのかまでは調査していないが、使い勝手はどう見てもローカルストレージと同じに見える。なお、TinyDBのWeb版もある。おそらくクラウドストレージという感じに変わるだけであろう。これはこれでデバイス間を同期するような場合には便利だろう。

このほか、センサーも利用することができる部品がたくさんある。タイマーはこのセンサーのグループに所属している。カメラ機能もメディアのグループ内に写真を撮るもの、ビデオを撮るものが用意されている。音声認識の部品もある。もちろんボイスレコーダーもつくることができる。

ちょっと恐ろしいがコンタクトやEメール、電話番号にもアクセスできる。Twitterには専用の部品も用意されている。さらに、レゴマインドストーム用の部品もあるので、androidバイスマインドストームに接続して操作するということもできるようになっている。

もちろんウェブへの接続やBluetooth接続も可能なようだ。実験的なものとしてFireBaseデータベースも利用できる。ここまできたら本格的な機能をもったアプリも開発しようと思えばできる。細かな操作は難しいとしてもだ。 f:id:m0t0k1m0t0k1:20170405133023j:plain

そして申請へ

はじめてモバイルデバイス用のアプリ申請をしたのだが、まさかそれがkindle用になるとは夢にも思わなかった。しかもそれはJavaで書いたものではなくて興味本位で手を出したApp Inventorをつかったものだったとは。申請は明日までかかるような見込みだと表示されているが、あんなになにもできないアプリにそんなに審査がかかるものなのか、よくわからないところではある。

便利なのはapkさえアップしてやればkindleでも動作するのか簡易チェックしてくれるというところ。アプリ内課金などGooglePlayに関するような操作は一切しないので、簡易チェックがOKになるのは当たり前といえば当たり前なのだが。

おススメはしないが、野良apkを動作するようにリスキーな設定をしておけば別にストアにアップしなくても大丈夫。USBなどなんらかの方法で送り込むことができれば動かしてみることはたやすい。しかしそれにしてもモバイルアプリはデスクトップアプリに比べてかなりの数になっているはずなのだが、あえてガンガンつくっていこうという気持ちにはあまりなれなかった。こんなに簡単なのに。

審査が通ったらまたここにエントリしようと思うが、落ちたら落ちたエントリでも書くかな。

小学生からはじめるわくわくプログラミング2

小学生からはじめるわくわくプログラミング2

親子で楽しく学ぶ! マインクラフトプログラミング (ぼうけんキッズ)

親子で楽しく学ぶ! マインクラフトプログラミング (ぼうけんキッズ)