Tagbangers Blog

Frontend

NativeScriptのAndroidエミュレータ導入でコケたお話

こんにちは、UIチームの楠です。 弊社では現在のNativeScriptを使用したネイティブアプリの作成に取り組んでいますが、導入の際、コケた部分についてお話したいと思います。 前提として、NativeScriptオフィシャルのドキュメントに従って必要なもののインストールを進めました。 難なく全てインストールされたように見えた後、確認のために tns doctor してみたところ、 You need to have Android SDK 22 or later and the latest Android Support Repository installed on your system...

Maiden Work

こんにちは、藤岡です。 先週は期末テストがあってお休みさせていただいたので、ブログをかけませんでした。 楽しみにしてくださった皆様方、申し訳ありません。 さて、今週はというと、いよいよアプリの開発に携わることになりました。 具体的に何をするかというと、モックアップという作業で、リニューアルするアプリの模型を作ります。 以前の記事で紹介したNativeScriptで書いていくので、iOSとAndroid版を同時に作ることができます。 まずはurlの名前をつけました。 最初はたかが名前だと思っていましたが、最近はプログラム開発においてどういった名前をつけるかということは、かなり大事なことなんだと考...

NativeScript 触ってみたよ

こんにちは、藤岡です。 Angularを使ってNativeScriptでアプリを作りました。 まずはNativeScriptのホームページを参考に環境構築をし、チュートリアルに沿ってアプリを作ってみました。 完成したものは、このようになりました。 機能としては「ログインしてページを遷移させ、リストを追加し表示させる」だけのものですが、多くの要素が詰まっています。 ちなみに、実機にインストールして起動してみましたが、うまく動いていました。 ソースコード: https://github.com/hiroki0976/NativeScriptTutorial NativeScriptの最大の魅力は、...

templateタグについて

結構昔からあったようなのですが知らなかったので、、 templateタグというものがありまして、素敵だったのでご紹介 templateタグ ページがロードされるときはレンダリングされず、javascriptでアクティベートする必要があるタグ。 テキストではなく、HTML要素として存在しています。 document.importNode() を使って.content のクローンを作ることで、アクティベートできます。(importNodeはデフォルトはシャロークローン) .content プロパティはテンプレートの中身を持つ読み込み専用の DocumentFragment のため、ブラウザでこのプ...

JS、Javaでサンプルプログラムを作ってみる

こんにちは、藤岡です。 今週も、先週に引き続きJavaとJavaScriptの勉強を進めました。 今週の課題として出していただいたのは、以下の3つです。 JSで四則演算を行うプログラムを作る JSで電卓を作る Javaで誕生日を入力し、年齢を算出させるプログラムを作る それぞれ、説明していきます。 四則演算プログラム(JS) このプログラムは、単純に「掛け算」、「足し算」、「引き算」、「割り算」を計算させるものです。 注意しなければならないのは、足し算を行う時です。というのも「+」を用いて計算させているため、数値が文字列として扱われてしまう危険性があるということです。そのため、「parseIn...

Thymeleafでpomのversionを利用する

お久しぶりです。奥村です。 GWを明日に控えたこのタイミングで連休ボケする前に小ネタを1つ投稿しておきます。 pomのversion値を利用して、各バージョンごとでcssファイルなどのキャッシュをリセットさせたい!っといった要望があった際に利用する小ネタです。 pom.xml     4.0.0     com.example     sample     1.0.0.RELEASE application.properties pom.version=@project.version@ index.html 1.0.0.RELEASE -1138007634 ...

JavaScriptの基礎学習

初めまして、藤岡です。 先週の木曜日から、タグバンガーズでインターン生として勤務することになりました。 というものの、プログラミング歴はほとんどないため、学びながらお仕事をさせてもらっています。 そこで、学んだことを備忘録も兼ねてこのブログに書き留めることにしました。 学ぶときに役立つサイト 今週は、主にJavaScriptについて学びました。 勉強するにあたって、参考になるサイトは MDN jsfiddle CodeAcademy です。 まず、MDNは初級者から上級者まで幅広く読まれているJavaScriptの定番リファレンスです。このサイトの読み方をマスターして、使いこなせるようになれば...

Chrome DevTools 小ネタ 〜shadowをつける〜

Hello web developer :) Web屋さん御用達のChrome DevTools小ネタを紹介。第1弾。(シリーズ化する風) 要素にshadowを追加する時に便利なTipsです。 まずいつも通りDev Toolsを開きます。( Macは command + option + i ) 今回使うのは一番馴染みがあるであろう、ElementsのStylesタブです。 好きな要素のStylesにマウスカーソルを載せると5つアイコンが出てきます。左から2つめがshadowです。 吹き出しの中の青いトグルを動かすと直感的に影の向きと大きさ、影のぼやけ方、影の距離を変更できます。便利! こんな...

Bootstrap3でテーブルをつくってみる

初めまして、篠原です。 社内では平野ノラとも呼ばれています。 どうぞ宜しくお願いします。 Bootstrap3で表を作るときに便利なclassを使ってみました。 基本のテーブル 順位 名前 県名 票数 1位 奈良県 せんとくん 60票 2位 愛知県 ひでっち 45票 3位 神奈川県 ヤマトン 44票 4位 新潟県 レルヒさん 43票 5位 兵庫県 はばタン 37票 ちなみにこちらは、地域マスコットの見た目ダサくね!?と思う都道府県ランキングです。 私はヤマトンが好きなので少々悲しかったです。 参考にしたランキングサイトはこちら → goo ランキング さて続いて、便利なクラスをみてい...

Riot.jsのRoutingについて

SPAをとりあえず味わってみたいけどどこからはじめればいいか。 まずはやさしく始められるRiotでやってみよう。 ということでRiotのRoutingについてドキュメント引きながらやってみました。 Riot Routerの機能 いわゆるRouting、URLを判断してどのビューを表示させるか決めるというのが大きな仕事 Setup Routingの書き方は大きく2つ riot.route(callback) URLが変化したらcallbackを返します。 *「URLが変化」するというイベントが発生するタイミング とは以下の4つのパターンのとき 新しい#(URL)がアドレスバーに入力されたとき。 ...