タグ

ブックマーク / blog.asial.co.jp (11)

  • TypeScript + Vue.js の始め方

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

    TypeScript + Vue.js の始め方
    atomicmap
    atomicmap 2019/05/07
  • Visual Studio Code ではじめるシーケンス図

    テキストでUMLやシーケンス図、クラス図などを作成できる言語です。 ダイアグラムをテキストで記述できるため、Gitで管理することもできます。 Visual Studio Codeでは、次のようにPlantUMLプレビューでダイアグラムを確認しながら作成できます。 まず、Visual Studio Codeが端末にない人はインストールをしてください。 Visual Studio Code – Code Editing. Redefined また、Javaもインストールが必要となります。 無料Javaソフトウェアをダウンロード インストールが完了したら、Visual Studio Codeで拡張機能としてPlant UMLを追加します。 Marketplaceから「plantuml」と検索してインストールします。 下のリンクからでもインストールできます。 marketplace.visuals

    Visual Studio Code ではじめるシーケンス図
  • 【Vue.js】ざっくり紹介、Vueプラグインの書き方

    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: '世界' }) // こんにちは世界! プラグイ

    【Vue.js】ざっくり紹介、Vueプラグインの書き方
    atomicmap
    atomicmap 2019/03/08
  • 社内Vue.jsプロジェクトユーザーインタビュー - アシアルブログ

    こんにちは、WEB開発チームの斉藤です。 弊社では3-4人のチームでプロジェクトを運営するのですが、隣のプロジェクトではどうなっているのかを知れることが少ないです。 そこでVue.jsに関するブログを書いて欲しいと当番が回ってきたのですが、Vue.jsを引っくるめた話を伺うチャンスとして、インタビューしてみようと思い立ちました。 やってみたところ、Vue.js単体ではなく周辺技術を交えた総合的な内容が、回答として上がってきました。 Vue.jsをメインに据えたJSアプリの開発体験に言及されている、という前提でお読みください。 (なお、できるだけVue.js万歳という言い方や、他のフレームワークの良さを下げる言い方は避けるようにしています。) 長くなったので、読みたいところだけ読めるよう、目次を置いておきました。 主な質問内容 Sさん:入社二年目、フロントエンド構築を担当 Q: 略歴と仕事

    社内Vue.jsプロジェクトユーザーインタビュー - アシアルブログ
    atomicmap
    atomicmap 2018/12/01
  • Chrome Dev Summitで披露された高速化のテクニックの数々(所感を含む) - アシアルブログ

    こちらのブログではご無沙汰しています。田中です。今週はサンフランシスコにて開催されたChrome Dev Summitに参加させていただいていました。今年はweb.devの発表や新しいPageSpeed Insightsなど、例年にも増して盛りだくさんの発表が行われましたが、特に「スピードの改善テクニック」が数多く披露されたように思います。 Chrome Dev Summitのプレゼンテーションはすべて濃厚で、しかも多くの内容は「web.dev」に詳しく説明されています。ここでは、2日間にわたって行われたセッションを振り返りながら、高速化に関する内容をざっくりと追っていきたいと思います。 以前と比べて、WebサイトのJavaScriptコード量は8倍に膨れ上がっている V8の言語機能を今後も最適化していく:Promise、Async & await、フレームワーク対応等 ReactのHoo

    Chrome Dev Summitで披露された高速化のテクニックの数々(所感を含む) - アシアルブログ
    atomicmap
    atomicmap 2018/11/19
  • Vue.jsの生みの親 Evan氏が箱根でみんなの質問に答えてくれた【動画有り】 - アシアルブログ

    こんにちは、生形です。 先般開催されましたVue Fes Japan 2018のために、JavaScriptフレームワーク「Vue.js」の生みの親であるEvan Youさんが来日されました。 この機会を逃す手はない!ということで、Evanさんへの質問をTwitterで公募し、インタビューした様子をライブ配信しました。インタビュアー兼通訳を担当したのは、Vue Fes Japanのスタッフでもある、弊社代表の田中です。 左:Evan Youさん/右:アシアル 田中正裕 当日、Evanさんは温泉で日を堪能していたようです。なんとライブ配信は箱根の旅館から!浴衣がお似合いですね。 はじめはSublime Textをずっと使っていて、次にAtomに切り替えましたが最近はもっぱらVS Codeを使っています。 VS CodeはTypeScriptのサポートが強力なので便利ですね。ちなみに、VS

    Vue.jsの生みの親 Evan氏が箱根でみんなの質問に答えてくれた【動画有り】 - アシアルブログ
    atomicmap
    atomicmap 2018/11/09
  • サーバサイドでCanvasを利用する(node.js)

    // sample.js var Canvas = require('canvas') , http = require('http'); http.createServer(function (req, res) { var canvas = new Canvas(200,200); var ctx = canvas.getContext('2d'); // 四角形描画 ctx.fillStyle = 'rgba(0, 0, 255, 0.5)'; ctx.fillRect(10, 10, 190, 190); // テキスト描画 var text = "Canvas Test"; ctx.font = '30px Impact'; ctx.rotate(.1); ctx.fillStyle = 'rgba(0, 0, 0, 1.0)'; ctx.fillText(text, 10, 1

    サーバサイドでCanvasを利用する(node.js)
  • node.jsの開発時に役立つモジュール

    こんにちは、中川です。 今回もPHPには一切触れないで、node.jsについて書いていこうと思います。 主に開発時に便利なモジュールを紹介いたします。 ■今回紹介するもの ・nvm ・node-dev ・node-inspector ■nvm ・https://github.com/creationix/nvm node.jsはまだまだ開発途上ということもあり、頻繁にバージョンアップが行われています。 現在では0.2系のstableバージョンと、0.3系の開発バージョンがあります。 複数のバージョンをインストールして、簡単に切り替えられるようにするために、 開発環境では、nvmを使っています。 セットアップは非常に簡単で、 $ git clone git://github.com/creationix/nvm.git ~/.nvm $ . ~/.nvm/nvm.sh

    node.jsの開発時に役立つモジュール
  • Google MapsとMySQLの連携

    こんにちは、アシアルの中川です。 Google Mapsに表示する情報をMySQLのgeometry型で扱う方法を試してみました。 Google Mapsのある地点にマーカーを表示したりすることがある場合、 緯度・経度の情報で地点に表示させることができますが、 データベースにこの情報を保存する場合、lat(float), lng(float)とそれぞれカラムに保存する方法もあるのですが、この方法では各データの位置の関係が非常に扱いにくくなります。 Google Mapsで表示されている範囲内のデータのみ取得したい場合や、 ある地点から近い順に取得する場合などに面倒なことになります。 そこで、MySQL4.1以降で用意されている空間情報を扱う機能の「geometry」型を使用します。 「MySQL 4.1 リファレンスマニュアル :: 10 MySQL における空間情報の機能(日語)」 「

    Google MapsとMySQLの連携
  • 座標から地名を取得する逆GeocodingAPIのまとめ + サンプル

    こんちは。松田です。 トレイン・トレインで使用しているGoogleMapをいじっている時に座標(緯度・経度)から地名を取得する必要が出てきたので、その際に調べた逆Geocoding機能を実装したAPIをまとめてみました。 GoogleMapsAPIなど地図を使ったシステムを使用していると、住所から緯度経度などの情報を取得する方法が必要になります。これはGeocodingと呼ばれる技術で、GoogleMapsAPIではすでに公式なAPIが存在しています。 これとは逆に、ユーザーに登録させたスポットの地名を自動入力させたりする場合など、座標から地名情報を取得したい場合があります。これらは「逆Geocoding」や、「Reverse Geocoding」などと呼ばれていますが、現在のところGoogleMapsのAPIは提供されていません。 この逆Geocoding機能が使えるサービスをいくつか紹

    座標から地名を取得する逆GeocodingAPIのまとめ + サンプル
  • 携帯でGoogleMapを手軽に表示するPHPクラス : アシアルブログ

    <?php //携帯でGoogleMapの画像をプリントするクラス class GoogleMobileMapView{ //取得URLとクエリを保持する変数 private $geturl = 'http://maps.google.com/mapprint?tstyp=4'; private $query = ""; private $image_format = "1"; private $type = array("1"=>"gif","2"=>"png","3"=>"jpeg"); //画像を取得するためのURLをセットするメソッド public function setUrl($latitude,$longitude,$settings,$points = null) { //中心の位置がない場合はfalseを返す if( $latitude == "" || $longitu

    携帯でGoogleMapを手軽に表示するPHPクラス : アシアルブログ
  • 1