02_フロントエンド

JavaScriptの非同期処理Promise・async awaitを学んでみた

こんにちは、サーバーサイドエンジニアの菅原です。

今回はJavaScriptの非同期処理について今更ながら学んでみました。昔ながらのCallback、ES6から追加されたPromise、ES7から追加されたasync await、さらにはRxJsについても調べてみました。

背景

昨今はUXの需要の高まりから非同期処理を書くことが多くなり、リアルタイム性やチャット機能、パフォーマンス改善のためにも非同期処理のコードを書くことが増えています。ただ非同期処理のJavaScriptのコードは処理が増えるごとにコールバック地獄と呼ばれる可読性が損なわれる危険性があることも事実です。

今回は以下のプログラミング条件から非同期処理について簡単なコードを用いての紹介と補足でRxJsを用いた非同期処理を紹介していきます。

続きを読む

swift3でニュース配信アプリを作ってみる #2 (実装編)

こんにちは、サーバーサイドエンジニアの菅原です。
今回は前回の続き「swift3でニュース配信アプリを作ってみる #1 (storyboard編)」
で実装のソースをベースにみていきたいと思います。

URLSessionを使ってHTTP通信する

  • urlRequestに取得したいapiのリクエストURLを設定する
  • URLSessionを使ってタスクを作る
  • Jsonの結果データを取得する
  • 返って来たデータを整形し、Article.swiftのオブジェクトの中に入れていく。
  • task.resume()でタスクを開始する

続きを読む

DRESPIC開発の裏側 ~技術選定~

はじめまして!システムエンジニアの谷渕です。

今日は、DRESPIC( https://drespic.net )についてお話ししようと思います。

DRESPICとは…?

top

DRESPICは、2017年1月11日にオープンした、ウエディングドレスのクチコミサイトです。私はこのサイトの立ち上げエンジニアとして、昨年からDRESPICに関わっています。サイトを0から立ち上げるという、わくわくと不安といろいろな気持ちを抱えて、事業責任者の、「ドレス業界に革命を起こしたい!」という夢に乗っかって、一緒に叶えよう!と決意し、DRESPICをつくってきました。
続きを読む

ブラウザのウォーターフォール図でサイトのパフォーマンスを知る

 こんにちは。初めまして!メディア開発本部 エンジニアの東です。2年目のサーバサイドのエンジニアで、サイトのパフォーマンスチューニングをやっています。本日はWebページのパフォーマンスを知る一つの手段である、ページの表示完了までのウォーターフォール図についてその見方を紹介したいと思います。

続きを読む

もう迷わない!CSS3のFlexboxで手軽にレイアウト

みなさま、こんにちは!エンジニアの東です。

フロントエンドの開発は不慣れな私はCSSの扱いもまだまだ未熟です。

というのも、私は、自身の業務では、CSSはなかなか触る機会がないです。

それもあって、私はCSSには苦手意識がありまして・・・特にfloatの扱いがうまくできないんですよね・・・!floatを使ってコンテンツを配置しようとすると大体レイアウトが崩れて、混乱します。

そんな私でも、floatの代替として使える非常に便利なものがありましたのでそちらを紹介したいと思います。

それは、CSS3 Flexbox

今回、こちらについて紹介したいと思います。

続きを読む

Phaserではじめるカジュアルゲーム開発 – PART 1

はじめまして。メディア開発本部の榎本です。

近年、HTML5のCanvas, WebGLなどのWeb技術でのゲーム開発に向いた技術が増えて、Webブラウザ向けのゲーム開発が盛り上がりを見せています。
しかし、それに合わせて、JavaScriptによるゲーム開発フレームワークも乱立し、正直どれを選べばいいか迷ってしまうほどです。

今回はそのたくさんあるJavaScriptのゲーム開発フレームワークから Phaser(フェイザー)というフレームワークを使ってゲーム開発の基礎を学んでいきたいと思います。

Phaserとは

Phaserとは何か

Phaserとは、Pixi.jsをコアにして、サウンドや衝突判定や物理演算などを追加した2Dゲーム開発フレームワークです。

続きを読む