アシアル鴨田です。 とあるプロジェクトで、AMP(Accelerated Mobile Pages)を使用したWebサイトを作成しており、その中で得た知見を少しお話したいと思います。 AMPに関する基本的な説明は省きますので、「AMPとは」みたいな検索で概要を把握しておいていただければと思います。 「AMPとは」Google検索結果 CSSのサイズに気をつけろ AMPでは、CSSのサイズ上限が決まっています。以前は50,000Byteまででしたが、現在は75,000バイトまでと、若干ではありますが緩くなりました。 AMP HTML 仕様 実際、プロジェクト中に50,000Byteの壁に悩まされたので、75,000Byteまで増えたのは本当にありがたかったです。 もし、CSSサイズでバリデーションが通らなかったときは、以下のような対策はいかがでしょうか。 Vueを使用していて、かつ、Scop

こんにちは、渡辺です。 先日(7月23日)、組織改善プラットフォーム「wevox」を手がけるアトラエ社で行われた 「エンゲージメントを高めるチームづくり」というセミナーに参加してきました。 wevox.io セミナーでは、組織改善を考えるマネージャーや人事担当者が利用する「wevox」を活用し、 どのようにエンゲージメントを高めるのかという話が中心でした。 このエンゲージメントの話は、私の担当する開発チームにも反映できるのではないか、という気づきがありました。 ja.monaca.io 現在、私は自社サービス「Monaca」の開発・運用をしています。 開発チームは、少数メンバーでサービスを運営していることもあり、 通常のチケット化された開発タスクはもちろんですが、 その他に中長期的な視点でプロダクトの改善やサービス運用方法なども、 自発的にチーム内で話し合い、プロダクトオーナーやマーケティ

こんにちは、MonacaチームでMonacaの安定運用のために、いろんな検証をしている小田川です。 Monacaでは、MonacaクラウドIDEをはじめ、たくさんのサービスが提供されています。 Monacaで開発したアプリをモバイル端末上で動作確認するためには、ビルドをしてインストール用のファイルを作成する必要があります。 そのため、Monacaが提供しているサービスの中で、リモートビルドサーバーは、非常に大きな役割を担っているサービスになります。 そんなビルドサーバーの検証の一つに、Cordovaプラグインが正常にビルドできるか というのがあります。 アプリの開発中は、ビルドをしてもビルドが失敗してしまうケースも多いと思います。 ビルドが失敗するケースの多くは、サードパーティー製Cordovaプラグインが関係しています。そのため、ビルドが失敗する原因がビルドサーバー側にあるのか、それとも

アプリ開発ツール『Monaca Education』が和歌山県の高等学校プログラミング教育で全県公式採用　～全国に先駆けて本年度から県内全ての公立高校で開始～ 教育 Webシステム開発及び教育事業を手がけるアシアル株式会社（本社：東京都文京区、代表取締役：田中正裕、以下『アシアル』）が提供する、モバイルアプリ開発クラウド『Monaca』の教育機関版『Monaca Education』が、和歌山県のICT教育『きのくにICT教育』における高校プログラミング教育で、プログラミング学習ツールとして県内の公立高校で採用されました。 『Monaca Education』アプリ制作画面 プログラミング教育採用テキスト ■プログラミング学習ツール『Monaca Education』について 『Monaca Education』は、HTML5やJavaScriptといったWeb標準言語でスマートフォンアプ

こんにちは。小林です。 最近、チーム力について改めて考える機会があり、今回は、その内容の一部を記載したいと思います。 アシアルの理念と事業 アシアルは、革新的なアイディアと確かな技術をもとにした価値創造、すなわち「クラフトマンシップ」を重視しています。 現状、アシアルの事業は、 MonacaやOnsen UIなどのプロダクト事業 教育機関向けのエデュケーションやプロエンジニア養成などのスクール事業 Webシステムやアプリ開発などのサービス事業 から構成されています。 さまざまな事業を展開していますが、当然、どの事業も、その目的を達成するのに必要な、様々な専門性をもつ多様なメンバーが集まってチームを形成し、プロジェクトを進めています。 ますます高まるチーム力の重要性 価値創造が行われるためには、新たな価値を創造できるチームが必要で、個々の専門性を最大限に活かし、チームとしてそれを掛け合わせた

WWDC2018のDesigning Fluid Interfacesのスライドでは、石斧とiPhoneXを持ったスライドが並んで表示されている。 道具は使い慣れてくると身体の延長線と捉え、使い心地の良いものとなる。 Via: https://developer.apple.com/videos/play/wwdc2018/803/ デザインチームの雑談の中で、マウスの使いやすさは大きさ、手につつんだにぎりごごち、調度いい標高（高さ）などが関係するのでは ? という話がでました。magic mouseは高さが低いので手首をてこにする事に、関係があるかもしれません。ですが、マウス全体が一つのボタンになっており人指し指以外でのスクロールやページ間をスワイプするのに慣れてしまった今では、その機能無しでは作業が進まない体になってしまい…。 support.apple.com 回避するために_2　フ

PHPer(ぺちぱー)エンジニアの笹亀（ささがめ）です。 プロジェクトマネージャーがメインですが、根っこの部分はエンジニアですｗ AWSのLambdaでもPHPが利用できるようになったというのを練馬で今年の春に行われたPHPerkaigiにて知りました。 phperkaigi.jp PHPでもサーバレスで実施できるということで「PHPerなら試してみないとね！」っと自分に言い聞かせながら、使い勝手など把握をしておきたく、実際に勉強会のLTなどでもお話もさせていただいたので、せっかくなのでブログにも書きました〜 ■目次です サーバレスでPHP Lambda PHPの概要 Lambda PHPで必要なもの Lambda PHP関数のディレクトリ構成とファイル構成 template.yaml index.php php.ini Lambda PHP関数をデプロイする Lambda PHPの動作確

1. Sports × Team 勝つチームの特徴 岡田 武史氏：株式会社今治.夢スポーツ 代表取締役会長 中竹 竜二氏：日本ラグビーフットボール協会 コーチングディレクター 島田 慎二氏：株式会社千葉ジェッツふなばし 代表取締役社長 西村 卓朗氏：株式会社フットボールクラブ水戸ホーリーホック 強化部長 リーダーシップ 監督の指示を実行することで勝つことはできるが、選手を育てているのかという疑問があった(岡田) 強烈なリーダーシップを発揮するだけ、ただ見守るだけのどちらもよい監督とは言い難い、その中間くらいがいい(中竹) 追いかけているときは自然と一体感を持って取り組めるが、1番になってからのモチベーション維持が難しい(島田) チームビルディング チームの育成時期によって、組織の在り方は変わっていく＝組織生物論(岡田) 連続して勝ち続けようとするとき、「勝つ」というメッセージではダメで、「

こんにちは。アシアルでインターンをしているGedasです。 アシアルの英語ブログ（The Web Tub)で記事を書いたので、皆さんに共有したいと思います。 この記事では、クロスプラットフォームアプリケーションを開発するためのCordovaとElectronの組み合わせについて説明します。 概要は次のとおりです。 – CordovaとElectronについての説明 – Cordova Electronプラットフォームを使用するメリット – Electronの機能の紹介 – ステップ・バイ・ステップでCordova Electronプラットフォームのデモアプリケーション作成 – 同じコードを利用してAndroid用アプリケーションを作成 – モバイルデバイスにアプリをインストールして、機能の確認 medium.com

A-Frameはゲーム開発でよく利用される、エンティティ・コンポーネント・システムを採用しています。 シーン（VR内の世界だと思ってください）に存在する全ての実態オブジェクトをエンティティ、振る舞いを記述して定義したものをコンポーネントと呼び、役割や必要に応じてエンティティに対してコンポーネントを付与する形を取ります。 例えば、次の例では空間上に平面と箱が存在するだけですが See the Pen A-Frame 物理演算の付与前 by komi_asial (@komi_asial) on CodePen. ライブラリを読み込み、平面と箱のエンティティに対し物理演算コンポーネント（dynamic-body、static-body）の記述を追加するだけで・・・ See the Pen A-Frame 物理演算の付与後 by komi_asial (@komi_asial) on CodeP

【セミナー動画】アシアル技術セミナー Vo.2「 Webフロントエンド開発最前線 ～SPAおよびPWA開発プロジェクトの現場から～」開催レポート

【セミナー動画】アシアル技術セミナー Vo.2「 Webフロントエンド開発最前線 ～SPAおよびPWA開発プロジェクトの現場から～」開催レポート こんにちは、アシアルの塚田です。 先月に東京のITS大久保健保会館にて アシアル技術セミナー Vol.2 「 Webフロントエンド開発最前線 ～SPAおよびPWA開発プロジェクトの現場から～」 を開催いたしました。 今回は、SPAとPWAを題材に、実際に弊社で手掛けたプロジェクトを通じて得たノウハウや知見をご紹介させていただきました。 当日は約60名の皆様にご参加いただき大変多くのご質問などもいただき、大変盛会でした。 前回にひき続き当セミナーの動画及び発表資料を公開いたしますので是非ご覧ください。 第1部：Vue.jsでのSPA開発の実際 最近弊社の案件でもVue.jsを用いたSPA（Single Page Application）開発が増えて

はじめに エンジニアの平山です。 本記事ではvueのデフォルトアプリをandroidとiosのスマートフォンで動かし、jestを使ってデフォルトアプリの単体テストを実施する方法をまとめています。 なお、単体テストの書き方は割愛します。

こんにちは。エンジニアの小椋です。 最近になって初めてTypeScriptを使う機会があり、TypeScriptもっと使おう！😠😠😠と思ったので、今回はVue.jsでTypeScriptを使う方法を紹介したいと思います！

初めまして。 アシアルブログ初投稿のエンジニア小椋です。 本日、当社の技術セミナーでPWAについて紹介する機会がありました。 speakerdeck.com 初めて多くの方の前で登壇しまして、とても緊張しましたが楽しかったです。 実際にPWA開発に取り組まれている方から質問などもいただき、大変勉強になりました。 今回はそれに絡めて、（技術ネタではないんですが）プレゼンの資料作成について書きたいと思います。 セミナーに向けてデザイナーさんと一緒にプレゼン資料を作成して学ぶことが多かったので、私が普段スライドのビジュアルを作成する上で気をつけていることと合わせて紹介します。 最低限守るべきルール３つ 色数はできるだけ少なくする 文字の大きさにメリハリをつける 行頭・行末・行間など、余白を大事にする とりあえずこれだけでもかなり印象が変わり、読みやすいものになると思います。 今回の登壇資料の別デ

お久しぶりです、田中です。 先日、ハンガリーからITWare kft.社が来日されたこともあり、共同でセミナーを行いました。ITWare社とは一緒にプロジェクトを行ったり、エンジニア同士の交流もあったりと、長い付き合いをさせて頂いています。 さて、ITWare社ではCV＆Deep Learningを用いた自動化テストを検討されているという事で、私も実際に世の中に出ている「人工知能」を用いたテストソリューションをいくつか評価しました。 自動化テストとは？ 関数単位で実行するユニットテストや、WebDriverを用いたE2Eテスト、そしてSeleniumなど、Webアプリケーションをテストするための手法とツールには色々なものがあります。これらのテストツールは、人間がポチポチと手を動かして動作を確認するのではなく、あらかじめ作成したレシピに従って、ツールが自動的にテストを行っていきます。 また、

Vue のプラグインを作成する方法なんですが、 「install メソッドを持つオブジェクトを定義する」 ただこれだけなんです。 定義したプラグインはご存知のとおり、Vue.use メソッドで使用します。 Vue.use メソッドを使ってプラグインを使用すると、プラグインのinstall メソッドが呼ばれるって感じです。 install メソッドの第一引数は Vue コンストラクタ、第二引数はオプションのオブジェクトになります。 一番簡単なプラグインの例はこんな感じ。 const MyPlugin = { install(Vue, options) { console.log(`${options.hello}${options.world}!`) } } Vue.use(MyPlugin, { hello: 'こんにちは', world: '世界' }) // こんにちは世界! プラグイ

こんにちは、アシアルの塚田です。 1月31日に東京のITS山王健保会館にて アシアル技術セミナー これから始めるVue.js / Nuxt.jsとサーバレスアーキテクチャ を開催いたしました。 今回は、JavaScriptフレームワークのVue.js / Nuxt.jsとサーバレスアーキテクチャをテーマに掲げ、現場ですぐに使える技術選定ポイント、活用ノウハウ、などご紹介しました。 当日は60名を超える皆様にご参加いただき大変多くのご質問などもいただき、Vue.jsおよびサーバレスアーキテクチャに対する注目の高さをあらためて感じることができました。 日程や開催場所の都合で残念ながら当日ご参加いただけなかったという声もいただきましたので、セミナーの動画及び発表資料を公開いたします。 第1部では、「AWS環境を利用したサーバレス設計のイロハ」と題してアシアルの笹亀がサーバレス構成を採用するメリッ

無事に「スタッフ」となり、専用のSlackに招待され、軽く挨拶をしつつも、過去の会話なり今のやり取りを見て、何か違和感を感じました。 ….あ、もしかしてこれ、想像してた「スタッフ」と違うのでは…??? チャンネルも「core」って書いてある。。。 そうなんです。私、焦りすぎて気づかなかったんですね。 本当は1day-staff的な気持ちで応募したら、「コアスタッフ」だったんですね！！ 今改めて応募のTwitter見返したら「コアスタッフを若干名募集!!」って書いてありますね。。。 やっちゃいました。 でもいい機会だし、今抜ける方が迷惑なので、もう無心でやりきっちゃろ！と考えるようになりました。 Slackで流れを見る限り、自分が参加する前から、カンファレンス当日までの段取りやissuesもある程度固まっているようでした。 ではどこの馬の骨ともわからない自分が、イベント運営の勝手もわかってい

最初に制限事項 T2チップのせいだと思いますが、搭載されているデバイスのいくつかはLinuxインストール時にアクセスできないようです。 私が試した時に使えたデバイスは、 HDMI出力 有線LAN USB でした。 USB-C、内蔵SSDは使えませんでした。 ですので、USB接続したSSD(もしくはハードディスク)にLinuxをインストールすることにしました。 USB-Cについては、Linuxインストール時にUSB-Cで外付けSSDを接続したところ認識されませんでした。Linuxをインストール後にUSB接続していたSSDをUSB-C接続に変えて起動したところLinuxが起動できたので、USB-Cは使えるようです。 インストールの流れ 0. 事前に必要なものを準備 ・Linuxをインストールする外付けSSD(ハードディスク) ・起動用USBメディア ・LinuxのインストールCDとCD-ROM