ビルドサイズ限界まで絞りたい人向け。 あらゆる環境で実践するものではないが、知ってたら簡単に避けることができるのもあるので知っておくと便利なTIPS書いていく。 基本ポリシー 未使用コードはビルド時に全部落とす。 何が未使用コードで、何が定数かわかるようなインターフェースを人間が心がける。 用語 Dead Code Ellimination(DCE) Rollup や Terser で、未使用コードを削除すること
JS のビルドサイズを極限まで絞るための TIPS 集
ビルドサイズ限界まで絞りたい人向け。 あらゆる環境で実践するものではないが、知ってたら簡単に避けることができるのもあるので知っておくと便利なTIPS書いていく。 基本ポリシー 未使用コードはビルド時に全部落とす。 何が未使用コードで、何が定数かわかるようなインターフェースを人間が心がける。 用語 Dead Code Ellimination(DCE) Rollup や Terser で、未使用コードを削除すること
jQueryを卒業したかった僕がReact StaticでReactをイチから学んでWebサイトを作った話 | 株式会社ヌーラボ(Nulab inc.)
Typetalk チームフロントエンドエンジニアの岡藤（@johnykei）です。先日 Typetalk Webサイトリニューアルに伴い、フロントエンドの技術を jQuery から React + styled-components に刷新しました。本記事では、React を用いた Web サイト制作についてお伝えします。 はじめに タイトルにもあるように、僕は今まで JavaScript を書く必要がある時は使い慣れた jQuery を使っていました。 フロントエンドエンジニアという肩書きではありますが、フロントエンドエンジニアという職種は幅広く、僕はどちらかというとページやUIのスタイリングが主な業務で、普段 JavaScript を書く頻度もそんなに高くありませんでした。 最近海外ではそのような業種の人をフロントエンドデザイナーと呼ぶ動きも出てきていますが、jQuery しか使ってい
【初心者〜中級者向け】【備忘】JavaScript入門(2) 文のルール、コメントの書き方 - 新人SEふにゅすけの自己啓発ブログ
どうも、ふにゅすけです。 今回は、JavaScriptの文のルール、コメントについてまとめます。まだプログラムっぽくなくて退屈かもしれませんが、基礎をしっかりと理解しておくことも大切だと思います。今回で言えば、文のルールを理解しておけば、思わぬバグを回避できるかもしれません。 文のルール (1)文の末尾にセミコロン(;)をつける (2)文の途中で空白や改行、タブを含めることも可能 (3)大文字、小文字は区別される コメントの記載方法 (1)単一行コメント (2)複数行コメント (3)ドキュメンテーションコメント まとめ 文のルール JavaScriptのコードは、1つ以上の文から構成されます。 (1)文の末尾にセミコロン(;)をつける セミコロンは省略可能ですが、文の区切りが不明確になるため、省略しないで記述すべきです。 下記はエラーにはなりませんが、非推奨です。 window.alert
【JavaScript】ぎゃぁぁぁできた！(*ﾟ∀ﾟ*) ページ上部に戻るボタン(解決・設置編) - がちゃまにあ日報
むしむしむしむし。 湿度80％の部屋で過ごしているがちゃまにあですどーもこんにちは。 今日は朝から町内会の草刈りに駆り出されてきました。 2時間くらいなんですけどね。ずっとしゃがんでたから腰が痛い。 ついでに足首と股関節も。 整体とか行ったほうがいいのかなー。うーむ。 今日は昨日投げた疑問の解決編です。 元ネタ↓ 【JavaScript】上部に戻るボタンを付けたい(疑問編) - がちゃまにあ日報 謎は全て(じゃないけど)解けた･･･！ 昨日の時点ではこんな感じ。 <a id="page-top" href="#blog-title">ページトップへ</a> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript"> $(
Web技術を使うということ - Nothing ventured, nothing gained.
私の高校の後輩（と言っても、だいぶ年齢は離れている）に心理学の研究者がいる。ひょんなことから知り合い、主にFacebookで交流を続けている。 あるとき、ブラウザの不具合を訴えていたので、つい「Chromeを使えばいいのに」と書き込んだら、本当にChromeをメインブラウザにするようになってくれ、それ以降、いろいろとアドバイスをしている。実験結果グラフの表示をどのようにすれば良いか悩んでいるようなことを書き込んでいたときには、Google Charts APIを紹介してあげたりもした*1。 すべてWebで その彼が最近、Web技術を研究に使うことの意味をブログで整理していた。この中でWeb技術を使う利点を以下の3つにまとめている。 １．オープンソース Javascriptのライブラリはおそらくほとんどのものがオープンソースです。そしてChromeやFirefoxなどのwebブラウザも無料で
All my artworks - Matteo Bicocchi
Per fornire le migliori esperienze, utilizziamo tecnologie come i cookie per memorizzare e/o accedere alle informazioni del dispositivo. Il consenso a queste tecnologie ci permetterà di elaborare dati come il comportamento di navigazione o ID unici su questo sito. Non acconsentire o ritirare il consenso può influire negativamente su alcune caratteristiche e funzioni. L'archiviazione tecnica o l'ac
2014年これからのウェブ制作業界の流れ、伸びる職種、ウェブデザインのトレンドなどのまとめ
数多くのブログで2014年のトレンドをさまざまな切り口でポストしているので、その中から特に印象的で共感がもてたものをまとめて紹介します。 キーワードとしては、スマフォ・タブレットなどの小さいサイズのタッチデバイス、レスポンシブ（特に画像）、HTML5/CSS3、ビッグデータ、リスク管理が注目されています。 2014年、ウェブ制作業界全体の流れ ウェブデザインの2014年のトレンド 2014年に大きく変化するウェブデザインの7つの傾向 2014年、注目度の高いIT系の職種・役割 2014年、ウェブ制作業界全体の流れ まずは、2012, 2013年と的確な予測をだしてきたsitepointの2014年のウェブ制作業界の全体の流れから。 10 Web Predictions for 2014 スマートフォン中心の年 最終的にはデスクトップからのアクセスをスマフォが超える HTML5のウェブアプリ
WebCamで撮影をHTML5で実現するデモ:phpspot開発日誌
Camera and Video Control with HTML5 WebCamで撮影をHTML5で実現するデモ。 対応ブラウザであれば、WebCamにアクセスし、その場で顔写真の撮影、なんてことが出来るようになります。 Flashであれば実現出来たこの機能、HTML5でも実現できるんですね。 Flashによるフェイルバックに対応したライブラリなんかがあれば嬉しいですね 関連エントリ ドラッグ＆ドロップでファイルをアップできるHTML5のデモ フリーでHTML5ベースのリッチな管理画面テンプレート iPhoneのON/OFFスイッチをHTML5/CSS3の形式でジェネレート これは必見のWEBデザインの近未来。HTML5で構築されたサイト45 PC・スマホ・タブレットで動くクールなHTML5スライドショー実装ができる「Juicebox」 Flash使ってなくてもHTML5でここまでクー
BootstrapのCSSを簡単にいい感じにカスタマイズできる厳選サービス２＋１つ紹介 | DevelopersIO
Bootstrapいいよね Bootstrapです。大人気の見た目系フレームワークですね。いろんなサイトで見かけます。 自分もそうなのですが、エンジニアでコードは書くけどデザインの事はよく知らない。だけど「使いやすくて、いい感じにしたい」という欲求を満たしてくれてます。ただ、デフォルトは見やすいんだけど、ちょっとカスタマイズしたいなとか、色指定があった場合など困りますね。例えばありそうなのが「コンテンツ管理画面を作りたい、デザインは特にこだわらない、けど使いやすいのがいいな。」とかさらに「イメージカラーが青だからそれベースで」とか。 そんなあなたにぴったりな厳選ツールを紹介しちゃいまっくすぅ〜！ Lavish 〜 画像から配色を生成してくれます 〜 このサービスは画像を解析してBootstrapの配色を捻り出します。 何処かの企業向けに作る場合に企業のロゴなどから配色してみるといい感じにな
JSエンジニアがアドビに聞く “iPhoneでFlashが動いたらアドビはFlashの開発を続けたか”
FlashとHTML5の関係が注目される今、アドビはHTML5をどのように見ているのか。 HTML5エンジニア向けサービス「jsdo.it」、Flashエンジニア向けサービス「wonderfl build Flash online」を運営するカヤックのフロントエンドエンジニアが、来日したアドビシステムズ Web Platformディベロッパー アドボカシー ディレクターマイク・チャンバーズ（Mike Chambers）氏に、Flashの今後や、ツールベンダとしてHTML5とどう関わっていくかを聞いた。 HTML5との関わりに関して ──まず、よく聞かれる質問だとは思いますが、アドビはHTML5で起こる技術的変化を歓迎するのでしょうか、それとも迎え撃とうとしているのでしょうか。 もちろん、歓迎します。基本的に、私たちは、どのような技術的変化も歓迎します。 ただ、これまでは私たちがHTML5に
サービス終了のお知らせ - NAVER まとめ
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
iPhoneやAndroid等のタッチデバイス向けイメージギャラリー用JSライブラリ・PhotoSwipeなかなか良いですぞ
PhotoSwipeはタッチデバイス専用のJSライブラリ。iOS(iPhone/iPad)は勿論、AndroidやBlackBerryにも対応出来るそうです。また、jQuery依存型も非依存型が用意されているのも自由さがあっていいかなと。 [note] jQuery Mobileは昨日、サンプル配布したので宜しければ合わせてどうぞ。[/note] PhotoSwipeサンプル with jQuery Mobile 以下、iPhoneとiPadでのキャプチャです。 iPhoneでのキャプチャです デフォルト サムネを幅に自動で合わせてくれます。 ランドスケープ ランドスケープ時でもサムネイルを自動で拡大し、幅を合わせてくれます。 画像の閲覧 単体表示はサムネイルをタップします。左右フリックで進んだり戻ったり。 ナビゲーションもある 単体、ランドスケープ。タップすると下部にナビゲーションバーが
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
インクリメンタルに新しい技術を取り入れる方法。TypeScriptへの移行を例にしたプロセス
社内でフロントエンドのパフォーマンスチューニングコンテストを開催した
知財教材「デザイナーが身につけておくべき知財の基本」 | 経済産業省 特許庁
いつも忘れちゃうjQueryの一致まとめ - Qiita
各ソーシャルサービスのシェアボタンをJavaScript無しのシンプルなコードで生成するジェネレーター
designers-hack.net
Web Design Tips To Help You Succeed - Web Design
https://design-spice.com/2012/06/13/responsive-web-design-image/