「HTMLのスーパーセット」Svelteはこんなに進化している — TechFeed Experts Night#27 〜 フロントエンドフレームワーク最前線本記事は、TechFeed Experts Night#27 〜 フロントエンドフレームワーク最前線のセッション書き起こし記事になります。 イベントページのタイムテーブルから、その他のセッションに関する記事もお読み頂けますので、一度アクセスしてみてください。 本セッションの登壇者 セッション動画 では始めさせていただきます。今日はSvelteのこの1年の最新情報をキャッチアップできるということをゴールに発表します。
オープンソースの開発に携われるエンジニアを大募集！
オープンソースの開発に携われるエンジニアを大募集！ シンキングリード株式会社 @thinkingreed JavaScript CSS HTML MySQL PHP I want to hear a detailed オープンソースの開発に興味のある方、シンキングリードでシステムエンジニアをやってみませんか？ シンキングリード株式会社は、「ビジネスをもっとスマートに」というミッションを掲げ、お客様の業務をスマートにしていくお手伝いをしています。その中でオープンソースのCRM（Customer Relationship Management：顧客接点管理）であるF-RevoCRMを開発して、サービスを展開しています。 オープンソースの開発に携わることの意味 オープンソースの開発に携わることは「知の共有」に参加していくということです。 私たちが開発したものが全世界に共有されて使われています。そ
jQueryにはもう頼らない！無限スクロールをネイティブで実装する最新テクニック
とても便利なJavaScript APIが登場しました。要素の表示状態を検出できるIntersectionObserver APIを使えば、無限スクロールを手軽に実装できます。 Webプラットホームに最近、注目の新しいクライアントサイドJavaScript API「IntersectionObserver API」が登場しました。 軽量でしかも使い勝手の良いこのAPIは、特定のDOM要素の表示状態、つまり要素が（ブラウザーウィンドウか要素の）ビューポートに入っているかどうかを効率的に監視する手段を提供しています。要素がビューポイントと重なり合う領域の割合を指定すれば、要素の表示状態を正確に定義できます。 この機能の一般的な用途としては、次のものが挙げられます。 コンテンツの遅延ロード 無限スクロール 広告表示 スクロールでトリガーされるアニメーション（注：用途としては本来おすすめできない。
HTML 5.1のsrcset・sizes属性とpicture要素の使い方 – レスポンシブイメージで画像表示を最適化 - ICS MEDIA
日本のウェブサイトにおけるスマートフォン・タブレットユーザーのシェアは約40%であり、ウェブデザインはレスポンシブ対応しモバイルを意識した設計が必須です（参照「StatCounter」)。 HTMLの「レスポンシブイメージ」を使えば、HTMLのタグだけで表示端末にあわせた画像を配信できます。 本記事では、サンプルを通してレスポンシブイメージの特徴と使い方について解説します。 この記事で学べること img要素のsrcset属性とsizes属性の使い方 picture要素の使い方 レスポンシブイメージとは一体何か？ レスポンシブイメージとは、レスポンシブなウェブサイトにおける画像の取り扱い方を定めたHTMLの技術。2016年勧告のHTML 5.1に追加された仕様です（現在のHTMLの仕様書）。主な特徴は次の通りです。 CSSやJavaScriptを使わず、HTMLのみでレスポンシブな画像を取り
もう迷わない！HTML5のもっとも基本的なテンプレートはこれだ！（2016年版）
HTMLを書くときのベースとなる「書き出し」。いまどきはエディターにプリセットされていますし、ネットにも山ほど転がっていますが、どうせならきちんと意味を理解して、自分だけのテンプレートを作っておくとカッコいい。 HTML5を習得していくうちに、HTML5のテクニックをまとめて使ったひな型を作っておきたいと考えることでしょう。もちろんお勧めしますし、開始点として便利な、オンラインソースの使用も検討してみるもいいでしょう（もっと詳しく知りたい場合は、html5boilerplate.comやhttps://github.com/murtaugh/HTML5-Resetも参照してください）。 ただし今回は、構築内容も含め、コードを一から説明していきます。なぜならHTML5とCSS3を使ったサイトやWebアプリを作る際、使えるオプションに詳しくなれるし、この記事をテクニックの手引きとして参照しやす
初めてHTMLドキュメントを書く人が「これだけは押さえておきたい」ポイント
※本稿は、秀和システム発行の書籍『JavaScript Web開発パーフェクトマスター（2015年6月27日発行）』の中から、特に＠IT読者に有用だと考えられる箇所を編集部が選び、著者及び出版社の許可を得て転載したものです。 ご注意：本稿は、タイトルを除き、書籍の内容を改変することなく、そのまま転載したものです。このため用字用語の統一ルールなどは＠ITのそれとは一致しません。あらかじめご了承ください。 Webページは、HTMLドキュメントのデータをWebブラウザーが読み込み、これを解析することで画面上に表示されます。そういうわけで、何はともあれWebページを表示するためには、HTMLドキュメントを作らなければなりません。 このセクションでは、HTMLドキュメントの基本的な構造と、ドキュメントの内部に記述するHTMLの要素について見ていきます。 Point HTMLドキュメントの中身を知って
Angular2入門 Component編 その1 | Webシステム開発／教育ソリューションのタイムインターメディア
Angular2は、コンポーネント志向なJavascriptフレームワークです。 画面一つ一つの要素を部品化しコンポーネントとして切り出すことで、保守のしやすいソースを記述することができます。 今回は、Angular2の基本的な機能であるComponentの使い方を説明いたします。 Angular2 新規プロジェクトの作成 前回、Angular2 開発環境構築編 を書いてから随分な時間が経過してしまいました。 2016/08/04 時点でAngular2 のバージョンは、 2.0.0-rc.4 です。 前回記事を書いた時点では Angular2.0.0-beta.0 を使っていましたが、 beta.0 からバージョンが上がるごとにびっくりするようなBreaking Changeが幾度と無く発生し、 前に書いたコードはDeprecateなコードとなってしまいました。 Angular2.0.0
ZabbxAPIとJavaScriptで独自UI作ってみた - mikedaの日記
ZabbixAPIとJavaScriptを使って簡単なグラフ表示UIを作ってみました。 『ホストグループ』→『ホスト』と選択すればいくつかのグラフが表示されます。 なぜこんなことをしてみたかというと、「Zabbixの標準UIはグラフの一覧性が低いと思うから」です。 ドロップダウンメニューで１つずつ進んでいくのではなく、チェックボックスや検索機能を使いたかった。 これに関してはぜんぜんいけそうだなという印象です。 グラフの描画にはGoogleChartAPIを使いました。 作っておいてなんですが、自分でグラフ書くのはやめておいたほうがいいです。 APIではヒストリ（短期間保存の詳細情報）は取れるがトレンド（長期間保存のサマリ情報）が取れないからです。 Zabbix本体のグラフ画像URLを動的に生成したほうがいいです。 このあたり踏まえてまた改良版を作ってみたいと思います。 今回の実装について
世の中のHTML5アプリケーションが糞だから、俺が「初期化」の作り方を教えてやんよ - mizchi's blog
2chまとめみたいなタイトルにしてみた。(してみたかった) HTML5のアーキテクチャと初期化とキャッシュの考え方が、「ウェブエンジニア」は本当に出来てない。 とくにソシャゲをウェブビューに貼ってスマホ対応しました系。本当にダメ。 じゃあどうするか？基本的に「初期化」の考え方を直せばどうにかなる。 (この記事はBackboneを使うときに考えてることだけど、他でも一緒だと思う) 前提 シングルページアプリケーション セマンティクスやSEOは考慮しない 基本哲学 共通モデルの初期化を徹底的に行う サーバーにリクエストを投げるのは最小限 クライアントでサーバーモデルのキャッシュを作り、更新が期待されるまで再取得しない 理由 いくらDOMの最適化したところでUXに影響が大きいのはサーバーリクエスト(200~2000ms)で、プログラミング段階で辛さがあつまるのは非同期処理の部分。 プログラマとし
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Flatis