ARCHIVE  ENTRY  COMMENT  TRACKBACK  CATEGORY  RECOMMEND  LINK  PROFILE  OTHERS
<< March 2024 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 >>
2016.02.05 Friday

スポンサーサイト

一定期間更新がないため広告を表示しています

2014.05.30 Friday

【初心者歓迎】進化するWeb開発!!HTML5、最新技術YEOMANで一歩先の開発スタイルを!! html5jエンタープライズ部現役副部長が 業務アプリケーション開発の「いま」をとことん語ります!!

表題の勉強会に参加してきました。
YEOMAN目当てだったのだけれど、全体的に面白かった。

登壇は株式会社ゼノフィの佐川さん。
ゼノフィは以前、senchaの勉強会でもお世話になりました。
みなさん、積極的に勉強会を主催されていて、素晴らしいと思います。
今回もありがとうございました。

佐川さんのブログ
albatrosary's blog

YEOMANについて。
実際に動かすところも見せてもらったのですが、編集をリアルタイムにブラウザに反映してくれるのがすごかった。
htmlを修正して、保存して、ブラウザを更新ということをやらなくていいわけです。
これは快適!
grunt server:distだったかな。

で、yo, grunt, bowerというコマンドを使って開発を進めていきます。

yoはプロジェクトを管理するコマンド。
yoはプロジェクトの枠組みをつくります。

gruntはビルドコマンド。
改行、スペース、タブなどを除去して、モジュールの最適化を実施してくれます。

bowerはパッケージ管理をしてくれるコマンド。
bootstrapが使いたかったら、bootstrap本体と依存するjqueryを一緒にgetしてくれるみたいなことをしてくださる。

日本でも人気のあるフレームワークみたいで、調べると割とまとまった情報が検索できます。
いつか使ってみます。

今日の資料

佐川さんはコレ以外にたくさんのスライドを作っています。
2014.03.21 Friday

Sencha いろはの「ろ」

表題の勉強会に参加してきました。
前回、ハンズオンでメモ帳アプリを途中まで作ったのですが、そのソース解説でした。
が、よく分からんかった。。
フレームワークの構成を理解していないからですね。
コードと処理がぜんぜん結びつきません。
勉強不足でした。
勉強会に出るだけじゃダメなんだ。
自力で何か作らないといけない。
なんでもいいから手を動かすんだ。

前回のスライド

田中さんのブログ

 
2014.02.18 Tuesday

【初心者向け】Sencha いろはの「い」

表題の勉強会に参加してきました。
sencha touchのハンズオンで、メモ帳を作ります。

まずはsencha touchについて。
senchaはHTML5を使ったモバイルweb向けのフレームワーク。
jquery mobileもありますが、senchaのほうがだいぶ高機能そうです。
jquery mobileは主にタグで記述しますが、senchaは主にjsを使いますし、
いきなり、MVCフレームワークでクラスを構築していかないといけないですし、
ドキュメントをみると、大層な数のクラスがあり、サンプルも非常にリッチなのです。
cordovaとの連携あり、サポートあり、有償版あり、なんかすごいことになってるなという印象。

で、ハンズオンへ。
見慣れないルールで書いていくので、ついていくので精一杯。
ボタン、リスト、テキストエリアを使って、メモ一覧と書き込み画面までを作成しましたが、時間切れで終了。
よくわからないで作っているので、実行時はエラーしないかスリル。
ドキュメントは充実しているが、学習コストは高そうだ。

senchaはどれくらい使われているのでしょうか。
事例が気になったので、調べたけれど、わかりませんでした。
jsdo.itにもあるので、今度、なにか作ってみたいところ。

ハンズオンでは、chromeで動作確認をしたのですが、標準でiphoneエミュレータが備わっていることを教わりました。
chromeすげえ。今日、一番の衝撃。
やり方は、別エントリで書きます。
2013.12.01 Sunday

HTML5 CONFERENCE 2013

表題の勉強会に参加してきました。
1日かけて行われるweb技術者の勉強会です。
30セッションの講演と企業展示があります。
昨年に続いて2回目の開催のようです。
 勉強できて、おやつもらえて、プレゼントまでもらえて、駅からの送迎まであり、これで無料でいいの?っていう内容の充実度です。
スタッフ、スポンサーの方の尽力に感謝します。
私は、午前中、子守りをしていたので、途中から以下の講演を聞いてきました。

■次世代テレビを知る! ハイブリッドキャスト×HTML5
ハイブリッドキャストはテレビ番組とwebコンテンツを連動させるサービスで、HTML5が採用されているんですが、2013年9月からNHKがサービスインしていました。
もう始まってたのか。今日、知りました。
番組に関連する情報等を表示するのですが、現状では、データ放送と変わらない。
これから、双方向性を活かしたコンテンツを作っていくのでしょう。
対応テレビは東芝とPanasonicから発売されていて、どちらもハイスペックモデルのみ。
いま、テレビ売れていないみたいだし、ハイブリッドキャストが購買訴求するとは思えない。
まだまだこれから。

■ Spec EditorとContributorが語るWeb標準化と開発者への期待
仕様策定者と実装者がhtml5とかunicodeとか、web標準について話をしてくれました。
遠い世界ではないので、みなさんも貢献してくださいとのこと。
新しい技術仕様をサンプルや情報をブログ等でとりあげてもらえるだけで、すごくありがたいのだって。
あと、タイプミスの指摘とかも簡単に出来ることだということです。
賛辞に名前が載るらしい。

■スタートアップのススメ
スタートアップって、起業の話でした。
メッセージアプリundaを開発した徳井さんが、何をやるかより、誰とやるかが大事と云われていたのが、印象的だった。
パートナーの重要性。
あと、起業する人は、お金に対する感覚が違うなあと感じました。
HTML5とは関係なかった。

■通信キャリアプロフェッショナルが語るHTML5への期待
通信の話で、ぜんぜん理解できなかったのだけれど、WebSocket, WebRTC, SPDYなどの登場によって、いままでの通信はIPレイヤーだけを意識すればよかったのが、変わってくるとのこと。
 
素晴らしいイベントでした。
youtubeで今日のセッション動画が公開されています。
行けなかったセッションも見れる。
html5j
2013.11.09 Saturday

現役、Microsoft MVP受賞者の講師が登壇!!マルチデバイス時代のレスポンシブウェブデザイン!!流行に乗り遅れないWebデザイン制作手法をあなたに教えちゃいます!!

先日、表題の勉強会に参加してきました。
仕事が忙しかったので久しぶり。
渋谷ヒカリエ、レバレジーズ、内装が奇麗になってました。

普通の会社でシステム開発をしながら、専門学校や勉強会の講師をされている山崎大助さんの登壇。
レスポンシブウェブデザインについて。
本も出版されてる。
評価は高いです。面白そう。


PC、タブレット、スマートフォンにwebの見た目をあわせるレスポンシブウェブ。
まず、レスポンシブウェブは流行ではない!と。
一時的なものではなく、技術として定着していくであろうものであるとのこと。
近年、PCよりタブレットが売れていたり、サイトアクセスがPCよりもスマートフォンのほうが多いなどという話題を聞きますので納得のいくところです。
中高校生がスマートフォンを持っているような時代だから、スマートフォンからwebの世界に入っている人にとって、PCの必要性を感じない人も多いのではないのでしょうか。
PCよりもモバイルを優先する時代が来つつある。
だから、流行ではなく、必然。

かつてのモバイル対応といえば、URLを分けたり、ユーザエージェントで振り分けをするものでした。
モバイルごとのサイトを別個に用意していたので保守性が低い。
それが、css3のmedia queryという機能を使うことで、スクリーンサイズでスタイルシートを切り替えるということが実現できる。
それなりのデザイン設計が必要になってはくるが、1ソースマルチデバイスが可能。

スクリーンサイズの基準をブレークポイントという。
・スマートフォン 480px
・タブレット 768px
・パソコン 980px

■media queryの例
1.css
/* 480px以下 スマートフォン向け*/
body { ... }

/* 481px - 768px タブレット向け */
@media only screen and (min-width: 481px) {
    body { ... }
}

/* 769px - パソコン向け */
@media only screen and (min-width: 769px) {
    body { ... }
}

2.link
<link href="sp.css">
<link media="screen and (min-width:481px) href="tablet.css"> 
<link media="screen and (min-width:769px) href="desktop.css">

3.@import
@import url("sp.css");
@import url("tablet.css") only screen and (min-width: 481px);
@import url("desktop.css") only screen and (min-width: 769px);

山崎さんは1の手法がhttpリクエストを減らせるので、オススメだそう。
また、ie6-8はmedia queryに未対応なので、ライブラリを併用することで利用可能になる。
・css3-mediaqueries.js
・respond.js
ie使えねー。

■viewport
metaタグにviewportという属性がある。
・モバイル端末ブラウザの表示幅
・ピンチによる、拡大縮小可否
・拡大縮小の最大、最小倍率
など指定できる。


<meta name="viewport" content="width=1024">
⇒appleはPCもスマートフォンも同じ幅で見せる。

<meta name="viewport" content="device-width">
⇒端末画面の幅にあわせる

■imgの比率
比率を保つcssの記述
img {
    max-width: 100%;
    height: auto;
}

■参考サイト
microsoft
nathan sawaya
media queryies
adobe

■山崎さん
@_AIR_NOTE
デジタルハリウッド
執筆本のデモ

山崎さん、ありがとうございました。
勉強になりました。
2013.10.24 Thursday

lua

luaの勉強会に参加してきました。
luaはプログラミング言語。
仕事でお客様がmomentumというメールサーバを利用しているんですが、momentumをコントロールする言語にluaが採用されていて、luaを使う仕事を発注するかもしれないという展望で声がかかった次第。
勉強会はアメリカからの通訳でmomentumとluaの触りを紹介しただけなので、概要のみ。

■momentumについて
message systems社が提供するメールサーバ。
設定を記述する言語にluaを採用。

■luaについて
lua(wikipedia)
インタプリタだが、処理が非常に高速。
ゲーム作成によく利用される。
world warcraftが有名。
スマートフォンアプリケーションの1ソースマルチデバイスフレームワークcorona-sdkの言語に採用されている。
関数型言語の要素を持つ。

さくらでレンタルしているサーバをみたら、luaがすでにインストールされていたので、とりあえず、hello worldはやってみました。
日本ではまだ知名度が低いみたい。
2013.08.14 Wednesday

21cafe

IT系のイベントスペースとして、無料で貸し出してくれるカフェです。
場所は渋谷、道玄坂。
なんで無料なんだろう。
すごいサービスです。

関連リンク

2013.08.02 Friday

amazon redshift

amazon redshiftセミナーに参加してきました。
仕事で使うかもということで調べています。

amazon web servicesの提供するsaasである。
dwhである。
いわゆるビッグデータを扱うデータベース。
テラバイト〜ペタバイトデータを格納可能。
従量課金制で、従来型の1/10程度の価格。
バックアップ設定、チューニングなどが自動化されている。
カラムナ型データベースである。
postgresqlのクエリが使える。
従来型dwhと比較して、10倍程度の性能が向上。
各種BIツールもある。(データ分析をするためのツール)

設定が簡単で、性能が優れ、価格も安価なdwh。
いいことばかり云ってましたケド、amazonのサービスなので信頼できることでしょう。

実際にhadoopとの比較をされた方のスライドがありました。
みんなhadoopから乗り替えるかな。
2013.07.26 Friday

第40回HTML5とか勉強会

表題の勉強会に参加してきました。
もう動画も公開されています。ライブ配信していたようです。

今回のテーマは「これからのWeb制作で大切なこと」
女性も参加できる優しい勉強会を目指すということで、女性優先の抽選制で、女性の参加率が高かったです。

「見た目以上に大事なこれからのデザイン」
秋葉秀樹さん:株式会社ツクロア
・ダミーテキストは撲滅
ホームページサンプルにTEXTとかダミーテキストをいれてレイアウトを組むと、実データを表示したときの印象に乖離が出てしまうので、ダミーテキストはやめようと。


「HTML5マークアップ ビギナーの良くある質問にズバリ答えます」
羽田野太巳さん:有限会社futomi/株式会社ニューフォリア
・articleタグはどんな単位で使うの?
フィードの記事の単位で使う。
フィードがピンとこない人には、ニュース記事、ブログ記事、報道発表の単位。
それ以外はsection。

・要素を覚えたほうがいいの?
html5のタグは108コある。
覚えて概要をおさえる。

・最短マークアップはカッコいいの?
<!DOCTYPE html>
<title>タイトル</title>
<body>

↑htmlタグ、headタグ、閉じタグがないが、文法バリデーションではok
HTML5は場合によってはタグの省略を許可している。
他人から見たときに混乱を招くので、普通の書き方をしましょう。

・div厨カッコわるい
これは極端な例だけれど、なんでもdivを使うのは違う。

・セマンティクス症候群
セマンティクスに神経質になる人たち。
精神衛生上よくないので、凝りすぎない。

■LT勉強会紹介
・HTML5とか勉強会 for ビギナー

羽田野さんの話が面白かった。(特にdiv厨)
セマンティクスって、みんなやり始めてるのだろうか。
まだあまり見ない気がする。
2013.07.03 Wednesday

AngularJS 勉強会 1周年記念!

表題の勉強会に参加してきました。

angularJSの1.0.0が公開されて1年になったことを記念した勉強会です。
おめでとうございます!
現在のバージョンは1.0.7。

■北村さんの登壇
北村さんの資料

初心者向けにバインディング。
これは最初にやるね。

AngularJSのデバッグができるchrome extension

自分で機能を拡張することもできるらしい。

1000人でできるボンバーマン
angularJSで作成

(作成中)

cssのflexboxを生成


■モバイル対応について

重いと思われがちだけど、極端に無茶しなければいける。

■typescriptとangularJS
わかめさんの資料

macユーザにおすすめの開発ツール

typescriptをリアルタイムでプレビューするサイト


■ちょっと先のangularJS
・ng-mobile
モバイル向け(開発中)
タッチやスワイプのイベント

アニメーション(開発中)

angularJSはわかりやすいフレームワークだと思う。
みんなどう使っているのだろう。
angularJSの機能を駆使したサイトを探してみたい。
Powered by
30days Album
PR