Intelligent docs that sell, support and scale your product
「Front-End Developer Handbook 2017」がGitBookで無償公開。フロントエンドデベロッパーに求められるさまざまなスキル、要素技術、ツールなどを幅広く紹介する一冊 WebサイトやWebアプリケーションにおいて、ユーザーが操作する部分の開発を担う「フロントエンドデベロッパー」が扱う技術は急速に広がっています。 もちろんその基盤はHTML/CSS/JavaScriptにありますが、より高度で快適なユーザー体験を実現するにはその基盤となるHTTPやDNSといった下位レイヤの技術やSEOやUIデザイン、フォントといった細分化された専門性、そしてもちろんJavaScriptプログラミングやjQuery、React、Angularといったフレームワーク、JSONやAPIやパッケージマネージャ、ビルドツール、エディタやデバッガなどの周辺ツールとそのトレンドなど、とても一人
2016年も進化し続けたフロントエンド開発ツール。Web Tools Weeklyのキュレーター・Louisが1年を振り返り、お気に入りのツールを紹介します。 1年が過ぎ、Webプラットホームでは予想どおり革新、いらだち、疲れとともに、開発者を支援する新しいツールやテクノロジーの大量リリースが爆発的に勢いを増しています。 ReactやAngularといったおなじみのツールがアップデートされた一方、Vue.jsなどの新しいツールも登場し、あっという間に大きな関心を集めました。 私はツールに焦点を当てたウィークリーニュースレターのキュレーションをしているので、調査中に途方もない量のツールに出会います。もちろん人気のツールにはある程度注意を向けますが、あまり注目されていないツールで興味深くかつ実用的なものも評価しています。 そこで昨年と同様、この記事でフロントエンド技術者向けツール分野の2016
Electronとは? Electronは JavaScript、HTML、CSS を使ってデスクトップアプリケーションを作ることができる ライブラリ です。作ったアプリケーションはMac、Windows、Linuxで動かせます。 次は: なぜ重要? 定義: JavaScript、HTML、CSS はWeb用の言語で、Webサイトの基本的な構成要素です。Chromeなどのブラウザは、コードをふだん目にするグラフィックに変えて表示します。 Electronはライブラリです Electronはコードですが、再利用でき、自分で書き起こす必要がありません。ユーザはその上にプロジェクトを構成します。 参考資料 Apps built on Electron Electron API Demos (Electronで何ができるかをみてください) なぜ重要? 一般に、デスクトップアプリケーションは各オペレ
日本では、2016年1月13日でIE8の正式サポートが終了しました。 それでも、まだIE8でもちゃんと閲覧できるサイトを作って欲しいと言われることがあります。 正式なサポートが終了したブラウザを使うリスクや対応工数を考えると、 クライアントには「IE8は対応外です」としっかり説得すべきです。 でも、大人の事情で対応することになった際に、気をつけるべきことをまとめました。 2016年以降に「IE8に対応して」といわれたとき思い出したい六項目 1. IE8は対応外と突っぱねるべし 一番良いIE8対策は、動作確認対応外にすることだと思います。 公式サポートが止まったことで予期せぬ攻撃を受け、そのリスクを誰が負うのかクライアントさんにも説明してください。 ブラウザシェアなどをお見せして、そろそろ推奨環境をアップデートしませんかと説得してみてください。 古いユーザーさんに支えられているサービスは…頑
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
Firebugというブラウザのアドオンで、主にWeb制作者が使うツールの話。 以前はFirefoxブラウザだけでしたが、何年か前にGoogle Chromeブラウザにもアドオンが加わったので、デベロッパーツールと併用して使っています。 (対象が狭くてすみません) 今朝、JavascriptでDivタグの高さを指定しているソースをFirebugで見ると、ソースにない指定が見えました。 こんな感じ。 <div class=”XXXX” style=”height: 173px;”> ん? style=”height: 173px;“なんて書いた覚えはないぞ? と思い、Firebugのcssの欄を見ると element.style { height: 173px; } とあります。 しかしCSSファイルやヘッダーにもそんな記述はした覚えがないのですが、いったいこれはなに? まあ結論から言えば、私
Timesheet.jsVisualize your data and events with sexy HTML5 and CSS3. Create simple time sheets with sneaky JavaScript. Style them with CSS and have mobile fun as well … Just include Timesheet.js and configure your data. No external dependencies, no jQuery needed and of course no Angular.JS! Just a few lines JavaScript to generate a beautiful HTML5 layout and some really delicious CSS to be customi
アクセシビリティを考えたドロップダウンメニューを実装する多くのWebサイトに設置されているドロップダウンメニュー。うまくカテゴリー分けされていれば非常にわかりやすく、スペースも取らないので制作側からも愛されていますね。しかしアクセシビリティの観点から考えると、ちょっとやっかいな存在ではあります。マウスがうまく利用できないユーザーはキーボードを使ってページやリンクを移動しますが、ドロップダウンメニューは `tab` キーを使ってもサブメニューが表示されないのです。今回はこの問題を解決しようと思います! こちらの Gif 画像のように、カーソルではなくキーボードの tab キーを使ってリンクを推移できるようにします。通常の HTML と CSS を使った設置方法だと隠されている子メニューが表示されないので、キーボード操作でもうまく表示するのが今回の目標です。ちなみにこのブログのナビゲーションメ
TOPICS Web , HTML/CSS , JavaScript 発行年月日 2014年09月10日 PRINT LENGTH 284 ISBN 978-4-87311-692-1 原書 The Modern Web FORMAT 誕生から四半世紀を経てWebはその姿を大きく変えています。かつてのWebは単に科学技術文書を公開するためだけの仕組みでしたが、現在ではマルチメディア、ショッピング、アプリケーション、ひいてはオペレーティングシステムさえも包含する技術へと成長しています。このようなWebの最新技術動向を鋭く切り取り、わかりやすく解説したのが本書です。近年脚光を浴びているレスポンシブWebのためのCSSをはじめ、位置情報やバッテリーの状態を取得するためのAPI、プラグインに頼らないマルチメディア再生などを紹介します。さらに、近い将来に普及するであろう注目のWebコンポーネント技術
Web制作時に備えておくと便利なチートシートのまとめ(iOS, Android, Bootstrap, WordPress, Git, Sublime Text, Emmetなどいろいろ) iOS/Androidの各デバイスやエレメントの規格、BootstrapやFoundationなど人気のフレームワーク、WordPressのテーマファイル、Git/GitHubの便利な機能、Sublime TextやEmmetの使い方をまとめたチートシートなど、フロントエンドのWeb制作者に役立つチートシートをまとめました。 Web制作時によく使うサイズとかスニペットとかショートカットとか、チートシートを印刷してすぐに見られるようにしておくと便利ですよね。 チートシートの目次 iOS デザイン チートシート Swift チートシート Android チートシート Android デザイン チートシート
7月19日. 久しぶりの3連休. 予定はぎっしりだった. だが神からのお告げがあった. なんか作れと. 気づいたらオレの指は Macbook Air の薄いキーボードの上だった. ってことで連休中にちょっとしたツール作りました. 気軽にプログラミングを始められるWebエディタです. 名前は runstant. run + instant の略で, インスタントラーメンのように一瞬で気軽に実行できるよって意味です. ログイン不要, サーバー通信なしで一瞬で プログラミングを始めることができます!! 一応, tmlib.js 公式エディタ的な 位置づけなのでデフォルトで tmlib.js のサンプルが入ってます. とりあえず触ってみてください -> こちら 特徴 ログインの必要ないよ 状態を hash で保存するのでサーバー通信しないよ html/css/javascript が書けるよ ちょ
JavaScriptでフレームワークを書くのはもうやめましょう。 JavaScriptフレームワークというものは、あたかも避けられない死と税金のようなもの、絶対にぶちあたる避けられないものといわれています。こっそり聞いてみましょう、新しいウェブプロジェクトが始まるとき、一番初めに聞かれる質問は?十中八九は「どのJSフレームワーク使っているの?」でしょうね。昨今の業界においてJSフレームワークというものは本当に根深く浸透しているのです。でも、だから必須だというものではないのです。実際、もう使うべきではないのです。 どうしてこういった結論に至ったのか、振り返ってみましょう。 AngularにBackbone、Ember・・・ ここのところ長い間、 ウェブプラットフォーム とはHTML+CSS+JS、と簡潔に技術用語の羅列でまとめられてしまっていましたが、そこにはもっとぴったり表す用語“大混乱”
手が空いた時にやってた作業が一段落したので、ペライチというかHTMLとCSSとJavaScriptを普通に書きたくなった。ので、vim-jp.orgにあったVimユーザーの一覧ページのカラフルな奴を作った。カラフル。 オリジナルのVimmersが密度が高かったので、ゆとりを持ってそれぞれをカードっぽくなるようにした。この時点で既にコンセプトを誤解してて駄目な感じだった……。 フォントはLatoを使った。x-heightが高く、ディセンダが小さめで、開きが大きいので、余白の多いカード的なものにはおさまりが良い。ウェイトも豊富なので使いやすいけど、WindowsのChromeだと一部サイズでまだガタつきがあるかも。 カラーは当初Pantoneから幾つか選定してたんだけど、青と橙がFlat UI Colorsとほぼ同じものになってしまったので、こちらをそのまま利用させてもらうことにした。赤緑橙青
昨日のVieraのリモコン、リモコンを作りたかったのもあるけど、svgとJavaScriptを組み合わせた簡単なプログラムを試しに書いてみたかったというのがあります。 html5ではsvgをhtml中に埋め込んで、更にそのsvgにcssでスタイルを当てたり、JavaScriptでいろいろやったり出来ます。 この時、要素のクリック領域は要素の形そのままなので、昨日のリモコンのような変な形のクリック領域を簡単に作ることが出来ます。 以下の画像の色のついた箇所にマウスを乗せたりクリックをしたりしてみてください。 100km 画像はWikipediaより。 上記の画像は、クリックできる箇所に .svg-area というクラス名と、data-name属性に市町村の文字列が入っており、以下の様なcss/jsによって動作を実現しています。 path.svg-area { cursor: pointer;
RawGit has reached the end of its useful life October 8, 2018 RawGit is now in a sunset phase and will soon shut down. It's been a fun five years, but all things must end. GitHub repositories that served content through RawGit within the last month will continue to be served until at least October of 2019. URLs for other repositories are no longer being served. If you're currently using RawGit, pl
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く