KONNO Kiyotaka

XamarinのXAMLのデザイナー

Xamarinも楽ではないですなー Xamarinのチュートリアル https://docs.microsoft.com/ja-jp/xamarin/xamarin-forms/get-started/hello-xamarin-forms/quickstart?tabs=vswin で、最初のとっかかりは良かったのですが、構成がいまいちまとまりきっておらず、内容もビデオを見たりするのが多いのでちょっと進めにくい。 ということで、こちらをやってみようと思います。 かずきのXamarin.Forms入門 posted with カエレバ 大田 一希 2016-12-29 Amazon 楽天市場 7net (もうすこし画像何とかすればよいのにと思いますが。もったいない・・・) 16ページ StackLayout.Children 省略可能となっているが、そもそも廃止されてないかな?? デザイナが使えない 19ページ グリッドの画面を作ってみるというところで、ここはデザイナを使ってみるか、と思ったわけですが。 Xamarin.formsのデザイナは提供されていない? しかし、こんなページもあるので、ないことはないのでは?? https://docs.microsoft.com/ja-jp/visualstudio/designers/creating-a-ui-by-using-xaml-designer-in-visual-studio?view=vs-2017 Blendならもしかしたら、と思いさらに頑張って10GB空けてインストールしたが、そもそもXamarinのテンプレートがない。 https://marketplace.visualstudio.com/items?itemName=mohamedalinouira.XamarinFormsTemplates をインストールしてみるがダメ。 https://developercommunity.visualstudio.com/content/problem/272117/xamarin-designer-not-working.html を見てアルファ版のフィックスも入れてみたがダメ。 よくよく見てみると、デザイナの説明は、Xamarinの説明ではない! Windowsユニバーサルとか、デスクトップアプリケーションをxamlで作る場合はデザイナが使えるけど、xamarinのxamlではデザイナは使えないというお話でした。 プレビュー機能は提供されているので、こんな感じになります。

この画面でいうと、左側のxml記述に、一番左のツールボックスからドラッグアンドドロップはできます。 これで頑張るしかないのですね。 なお、Windowsユニバーサルの方で作成したXamlからコピペできるかなと思ったら、色々違うようでそれもできず。 厳しい!


とりあえずxamarinチュートリアル中(初心者の超入門編)

Code4Startup xamarinの選択 Code4StartupはここからSwiftによるモバイルアプリ開発に入ります。 とっかかりの部分の講座を見てみましたが、やはり画面デザインから入りますよね。 さて、Windows上にswift環境は用意したつもりだったのですが、Ubuntu上でSwiftが動くというのは、言語自体が動く、コンパイルが動くというだけの話のようです。 しかし、Swiftを使う目的は基本的にはiOSアプリを作るためであり(勝手な想像)、画面を作れないのであれば10割がた意味がないのではないかと思うのです。 というわけで、改めてiOSアプリをどう作るか考えます。Monacaも経験したので当然それは考えるのですが、やはりまだ馴染めきれない。 今後メジャー化していくと思われるFlutterもまだ早いような気がする。 結局以前考えたxamarinに戻ってしまいました。 やはり、慣れ親しんだ.NET(と言っても私の主戦場はVB.NETであり、C#はほぼ素人ですが、それでも)なら、他よりも生産性も高く進められるのではないかと思うのが大きな理由です。 Visual Studio 2017 さて、そう思った段階でインストールされていたVisual Studioは2015でした。 ただ、xamarinはインストールされていなかったので、入れようとしたら20GBくらい必要と言われます。 きついぜ!と思いつつ、一生懸命不要ファイルの掃除をして、インストールしました。我が家のネットワークは不安定なのか、一晩たっても終わっておらず、その日帰って確認できたという、丸一日作業になってしまいました。 ところが、いざ始めようとしたときに目についたのが、2017ならCommunity版でiOS リモート シミュレーターが使えるようになったという情報。iOSアプリを作りたいがためにこんなに悩んでいるのに、これを使わない手はないでしょう。ということでインストールし直し。 2015を完全に削除するためには、膨大な手間がかかるということで、MS謹製の削除ツールを使用して削除しました。これも、朝起きたら1段階目が終わったような状態で、再度ツールを実行する必要があり、結局丸一日。 インストール自体は順調に終わりましたが、なかなか手ごわいです。 xamarinチュートリアル では、何はともあれチュートリアルということで、 https://docs.microsoft.com/ja-jp/xamarin/xamarin-forms/get-started/hello-xamarin-forms/quickstart?tabs=vswin から始めてみます。 最初はエミュレータで画面表示するのが目的ということで、ソースはコピペ。 初回起動だけなのか、かなり時間がかかりましたが、Andoroid版画面はプレビューできました。 問題はiOSです。 結論としては、やはりMacOS機=XCode機が必要ということです。 Xamarin.iOS 開発のために Mac とペアリングする そうか、ということでちょっとがっかり。 ほぼほぼの開発はWindows機で行って、リリース時の手続き的なところだけMacがあればよいのかと勘違いしていました。 最近はMacを貸し出してくれるところもあるので、最後はそこを利用しようとしていたのですが、ちょっと方針が変わります。 けど、Mac買うならSwiftでいいじゃんとなりますしね・・・ (と言いつつMacBook欲しくなりつつある・・・ 買うなら、0.92kgが魅力のこれ) MacBook (12-inch/1.1GHz Dual Core Intel Core m3/256GB/8GB/802.11ac/USB-C/ローズゴールド) posted with カエレバ アップル 2016-04-20 Amazon 楽天市場 7net とりあえず、xamarin勉強を進めてみます。   Essential Xamarin ネイティブからクロスプラットフォームまで モバイル.

Code4StartUp ~ UberEatsを作ろう ~ Stripeの使用

Code4Startup 自作サービスの決済手段として何を使うか、PayPalは開発者にやさしいなと思っていましたが、Stripeも十分良さそうです。 [][1]トップメニューに「開発者」があり、このサービスの向き先が伺える ちなみに、日本のサービスで、申込・審査を行わずに利用できるサービスはあるでしょうか?? ちょっと違うんだよなーと思ってしまいます。 もちろん、そういうビジネスはそれでありなのですが、違うビジネスが展開されないのはなぜだろう、ということです。 そして、PayPal。 開発者向けサービスも充実しているし、無料でテストサイトでの決済を確認することもできるし、実際に運用する際の手数料も安いとは思いませんが(弱小サイトを前提とする場合)許容できるのではないかと思いますし、非常に使いやすいと思います。 [][2]PayPalも開発者にやさしい ただ、唯一最大の問題が、決済サービスをしようとするためにはpaypalの会員登録が必要ということ。 私のように一度登録してしまっている人としては、そういうものだと分かって使うのでよいのですが、paypalに縁のなかった人がいきなり支払いを行おうとしたらpaypal会員登録から始まってしまうというのは、ちょっとハードル高いのではないかと思われます。 それに対して、Stripe。 普通にクレジットカード情報を送信することにより(実際は端末にStripeのトークンが返されて、これをサービスに送信することで、サービスがそのトークンとサービスのAPIキーを紐づけて)決済されるので、違和感なしで決済完了できるということです。 なお、開発中のアプリでは、ユーザ認識にユーザトークンのやり取りをしているので、トークントークン言われて分からんわ、という感じになりそうですが(実際それを間違えて送信しているというコーディングミスをしたり)、冷静になれば特に問題はありません。 なお、開発者向けドキュメントの中でデモ機能が用意されていて、そこでダミーのカード情報を送信することによりStripeのトークンを取得できる(そして、それを使って開発サービスのテストができる)わけですが、講義の中で紹介されているURLは既に変わってしまっており、stripe docs→Payments→Stripe.js and Elements→Quickstart (Card Element Quickstart) https://stripe.com/docs/stripe-js/elements/quickstart から利用できるようになっています。 これは、別件のWordpressからの決済でも使ってみたいと思います。

Code4StartUp ~ UberEatsを作ろう ~ Chart APIなど

Code4Startup Task14までdone。 途中結構長い時間はまったのが、 Order.objects.filter・・・ とすればよいところを OrderSerializer(Order.objects.filter・・・ としてしまったために、発生したエラー。 他からのコピペで無意識についてしまったわけですが、これを探りながらの他のバグにも気づいたし、まあよいか。 Task14ではレポート画面と言ことで、グラフを出力するために、 Chart.js を使います。 これはこれでよいなと思いますが、 Google Charts もあるからね、とは思ってしまいます。 そして、いよいよTask15でPythonは終了となりますが、一つの山場と考えているStripe連携。 ここまで連休中に終わらわせておいて、Swiftに入りましょう。

AWS Loft vs YAHOO LODGE

AWSオープンということで、早速行ってきましたので、YAHOO LODGEとライバル比較! AWS Loft https://aws.amazon.com/jp/start-ups/loft/tokyo/ 目黒駅前(目黒セントラルスクエア) 平日のみ(平日(月〜金) 10:00 〜 18:00) 入館時に、AWSアカウント ID(12桁数字)記入が必要  YAHOO LODGE https://lodge.yahoo.co.jp/ 永田町、赤坂見附など(東京ガーデンテラス) 休日も入館可能(9:00-21:00 休館日:年末年始、毎月第一日曜日、不定休) 身分証で入館 所感 どちらも、館内のきれいさ、景色の美しさは申し分なし。 土日もやってくれてるという点で、LODGEのほうが助かりますが。 また、LODGEの下2階のファミマ!!が、素晴らしいので、ダブルで作業できるという点でも、強い。 しかも、成城石井もあるので、お弁当ラインナップは個人的には最強。 ※2018/10時点の情報です。 AWS [][1]エレベーターから雰囲気を醸し出すのがさすが [][2]ガラス面積が大きく快適 [][3]カフェも格安で提供 [][4]段ボール感

LODGE [][14]これまであまり意識していませんでしたが、意識高い系書籍もいろいろ [][15]赤坂の景色も負けていません [][16]1g2円で好きに詰められる(詰め方のセンスはしかたないです) [][17]カフェというかレストラン おまけのファミマ!! [][18]ここの文具がまた侮れない(多分季節ごとに入れ替え)


Code4StartUp ~ UberEatsを作ろう ~ Postmanのはまりポイント

Code4Startup Task11で、27分の長丁場のレッスンがあります。 いったん全部見てから、書いてみたのですが、途中ではまりました。 「AccessToken matching query does not exist.」 これは、結構な人がはまっているようなのですが、なかなかまともな回答がついていないように思われます。 正しい回答はこちら。 https://uploads.disquscdn.com/images/bcf707b4c65186dcfcc293547fc57bbae63e2fa0fbddc89aa6b82dbdb7418f69.png Postmanのパラメータ指定時に、Body→form-dataを指定する必要があります。 そうしないと、request.POST.get(“access_token”)がNoneになってしまうのでした。 改めて、ビデオを見返すと、ちゃんと説明してくれてますなぁ>< そして、同じ質問が、teratailに上がっていたので、初めて回答してみました。 もう少し飛ばしていきたいのですが、必ずどこかではまりますね・・・

Code4StartUp ~ UberEatsを作ろう ~ 久しぶり

Code4Startup 色々並行ででやっていると、再開方法を確立しておかないと忘れますね。 source myvirtualenv/foodtasker/bin/activate cd foodtasker/ python manage.py runserver xxx.xxx.xxx.xxx:8000 これでhttp://xxx.xxx.xxx.xxx:8000/が動くようになる、という感じですね。 ということで、Task10まで終わらせました。 とありあえず、Task15まで一気に進めて、Tsk16からのSwiftによる顧客向けモバイルアプリ作成を早く試してみたい。  ちなみに、Pythonやってるなら、こちらも面白そうですね。 Pythonで学ぶ『ブロックチェーンプログラミング入門』が良すぎた話  関連記事 Code4StartUp ~ UberEatsを作ろう ~ Swift環境 Code4StartUp ~ UberEatsを作ろう ~ 淡々とページ追加 https://www.programmers-office.ml/?s=code4

Magentoのベースページの仕組み

自分で作成したウェブサイトにWhat’sNewを出そうと思いましたが、それを調べる過程で、ベースページの仕組みが分かってきたので先にそちらを確認。 1.自分で作成したウェブサイトのホームページをドキュメントルートにする 現在、元々のサンプルデータのウェブサイト http://example.com/magento/ と 自分で作成したウェブサイトhttp://example.com/aaa/ がある想定で、自分で作成したウェブサイトを http://example.com/aaa/ ではなく http://example.com/ にしようという話です。 これは新しいウェブサイトを表示できるようにしたのとやり方は同じで、店舗>設定>設定 の画面で、左上の「ストアビュー」を、自分で作成したウェブサイト(ストアビューではなくウェブサイト)に変更し、その状態で、左メニュー「Web」の「ベース URLs」等をhttp://example.com/にします。さらに、サーバにて cd /opt/bitnami/apache2/htdocs/magento cp .htaccess .. cp index.php .. cd .. ln -s /opt/bitnami/apache2/htdocs/magento/app/ app ln -s /opt/bitnami/apache2/htdocs/magento/lib/ lib ln -s /opt/bitnami/apache2/htdocs/magento/pub/ pub ln -s /opt/bitnami/apache2/htdocs/magento/var/ var mv index.html xindex.html とやって、index.phpをを同じように修正するだけです。サンプルウェブサイトも生きています。 2.店舗ページの作り方 そして、この下に、各店舗のページを作ろうと思います。 すなわち、ドキュメントルートは自分が作成するサービスのトップページにして、その中で複数店舗の商品を使うこととし、各店舗のページも作成する、ということです。 これも、同じようにやろうとしたらうまくいきませんでした。 PARAM_RUN_TYPEの設定値は、ウェブサイトの場合は「website」でしたが、店舗の場合は「store」とのことです。 ところが、その方法で、要するに店舗用ウェブサイトを作るようなイメージですが、元々のサンプルサイトにリダイレクトされてしまいます。 そこで、またSQLを解析しようと思いますが、今回は、昨日教えてもらった技を使います。 bin/magento dev:query-log:enable これにより、実行ログを出力してくれます。 いちいちmy.cnf編集しなくて良いし、/opt/bitnami/ctlscript.sh restart mysql しなくてよい。 ただ、そのクエリの呼び出し元情報も含めて大量のログになるので、ちょっと醜いのですが、対処としては、 (Magentoインストール先配下の)var/debug/db.log を「SQL: 」でgrepします。 で、見てみたのですが、今回は空振りで、たいしたログは出ていませんでした。 ここで、ちょっと軌道修正。 http://example.com/shop_a を見ようとしていたのですが、普通にページを作って、それを見ることにします。 そうすると、http://example.com/shop_a/new_page という形で表示される。

Magento ウェブサイトの切り替え

今やろうとしているのは、Magentoのサンプルのウェブサイトはアパレル業的なサンプルになっているので、これはこれで置いておいて、別の飲食業的なサイトを作ることです。 Magento ホームページカスタマイズへの道 まず、とっかかりの部分を作りました。 MagentoのSQL解析 商品の登録のされ方を分析し、商品属性、特に在庫状況が重要だと知りました。 続いて、ウェブサイトを分けてみたいと思います。 1.Magentoの商品のカテゴリ分け そもそもなぜ、このタイミングでウェブサイトを分けるかというと、商品登録の正しさが確認できないからです。 サンプルとして登録されているアパレル商品とは別に、ピザを登録し、それをピザ用のページに出したいと思います。が、これがまた難しい。 最初にやったように、ウェブサイト、店舗、ストアビューは作っておきます。 そして、店舗でルートカテゴリを選択するので、ルートカテゴリ(カタログ>カテゴリ)を作ります。 で、例えば、この店舗用のWhat’sNewを作ります。そして、サンプルのWhat’sNewに表示される商品はどのようなものか見てみると、 SELECT mg_url_rewrite.* FROM mg_url_rewrite WHERE (request_path IN (‘what-is-new.html’, ‘what-is-new.html/’)) AND (store_id IN (‘1’)) というようなSQLが実行されていることが分かります。 そして、表示したいページをIN句を変えて見てみると表示されませんので、最後のAND条件を外してみてみると、store_idが1以外で登録されていることが分かります。 では、どのようにstore_idを変えるのだという話になります。 2.Magentoにおける複数店舗(というかウェブサイト)の登録方法 ところが、多くの情報ではウェブサイト、店舗、ストアビューを登録できる、という話で終わってしまって、なかなか複数店舗を実際にどのような設定で表示させるのか、という情報が見つかりません。 と言いつつ、割と初期の段階で、公式情報のドメインを分けるみたいな話は出てくるのですが、いや、そこまでやらなくてよいから引数透とかで分けられるんじゃないの??みたいなところでもがきます。 例えば「___store」を使うみたいな話です。 しかし、結論でいえば、それは無理で、おそらく簡単なのは、ディレクトリ自体を分ける方法です。 例えば、サンプルのウェブサイトをhttp://example.com/magento/ で作っていたら、http://example.com/aaa/ のようにするということです。 参考はこちらとこちら。 https://docs.nexcess.net/article/how-to-configure-magento-2-storefronts.html https://magento.dekirumonn.com/forums/topic/multi-store-%E3%83%89%E3%83%A1%E3%82%A4%E3%83%B3%E8%A8%AD%E5%AE%9A%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6/ apache素人なのでちょっとビビっていたのですが、これについて言えばそんなに難しくはなく、index.phpと.htaccessをコピーして、index.phpを一部書き換えましょう、ということ(書き換えサンプルは実はindex.phpの一番先頭に書いてあります)。 そして、app、lib、pub、varへのシンボリックリンクを、元インストールしたディレクトリの方に張っておきましょう、ということです。 bitnami環境だと、 ln -s /opt/bitnami/apache2/htdocs/xxx/app/ app ln -s /opt/bitnami/apache2/htdocs/xxx/lib/ lib ln -s /opt/bitnami/apache2/htdocs/xxx/pub/ pub ln -s /opt/bitnami/apache2/htdocs/xxx/var/ var

MagentoのSQL解析

自分で作成したページ・ウィジェット・ブロックに思うように商品が表示されない。 ならば、どのようなSQLが流れていて、何が引っかかって表示されないのか調べてみよう、という活動です。 1.環境整備 (1)SSH接続用ターミナルソフト Tera TermでもPuttyでも、お好きなものをどうぞ。 ではあるのですが、AWS内bitnamiで構築した環境のMy SQLに接続する、という観点で。 Puttyでは、Host Nameにユーザ名@xxxを記載しますが、bitnamiで構築した場合は、 ubuntu@xx.us-east-2.compute.amazonaws.com というようになります。 そして、Connection>SSH>Auth でPrivate keyにppkファイルを登録します。 この接続状態をそのまま保存しておいて、次回からはSaved Sessionから呼び出すだけなので、現在は基本的にはPuttyを使用しています。 Tera Termでは、ホスト欄にxx.us-east-2.compute.amazonaws.comを入力しOK、ユーザ名にubuntu、「RSA/DSA/ECDSA/ED25519鍵を使う」で、ppkファイルではなくpemファイルを指定する、という形になり、ホスト名以外は次回に覚えてくれていないので、ちょっと面倒だなと思っています。ターミナル上での見た目はTeraの方がきれいなので好きなのですが。 (2)WinSCP ファイルのアップ・ダウンロード用にはこちら。 SFTPで、ホスト名はxx.us-east-2.compute.amazonaws.com、ユーザ名はubuntu、設定>SSH>認証の秘密鍵にppkファイルを指定します。 これも、保存しておけば、次回以降の接続はリストから選択するだけなので、よいです。 (3)A5 : SQL Mk-2 これが本日のポイント。 https://a5m2.mmatsubara.com/ DB接続ツールは色々ありますけど、個人的にはこれが最強だと思っています。 特に、最強なのがSQL整形機能。今回のように、ログからSQLを取り出して解析しようと思う時に、Ctrl-Q一発でSQLを見やすくしてくれるのは、非常に助かるので、普段の会社の仕事でも使っております。 これの接続は、ちょっとばかり難しいです。トンネリングでの接続になります。 A5 : SQL の接続を作成する際にはMySQL/MariaDBを選択できます。その中の設定で、SSH2トンネルの指定ができます。 「SSH2トンネル」タブのSSH2ホスト名をxx.us-east-2.compute.amazonaws.com、ユーザーIDをubuntuにして、秘密鍵ファイルにpemファイルを指定します。 その上で、「基本」タブのサーバー名にはSSH2サーバーから見たサーバー名を指定するので、初期の状態ならlocalhostを指定します。Magento用に作成したユーザーID、パスワードを指定しますが、 grant select on . to home; が必要だったように思います(記録し忘れている)。 ということで、この3点セットがそろうと、割と自由にDBもいじれるかと思います。 2.MySQLのクエリトレース 普段はSQL Serverが主戦場なので、トレース取得はProfilerを便利に使用させていただいています。 ではMySQLはどうかということで、こちらを参考にさせていただきました。 http://blog.szmake.net/archives/496 my.cnfはどこにあるかというと、これはbitnami特有で、/opt/bitnami/mysql/ にあります。 また、my.confを編集した後、MySQLをリスタートするのですが、これもbitnami特有で sudo /opt/bitnami/ctlscript.sh restart mysql となります。 bitnamiでは、/opt/bitnami 配下に色々なものが存在する、ということを認識しておくだけでもいろいろはかどるかと思います。 3.Magentoで実行されるSQL で、トレースを取ってみた結果です。 例えば、 SELECT mg_store_website.* FROM mg_store_website ↓ website_id code name sort_order default_group_id is_default