10年のツケを支払ったフロント界隈におけるJavaScript開発環境（2016年4月現在）。 - 日々、とんは語る。
2015年はCSSが普及した以来となる10年に1度のフロントエンド大変革期で、それまでのツケが一気に回ってきたと個人的に感じていました。目まぐるしく状況が変化していきましたが、2016年になり、個人的にだいぶ落ち着いてきたと感じているので、ここらへんでまとめておきたい思います。 最初に結論を書いておくと、 『React + Redux + react-router + material-ui + axios + ES2015 + Babel + webpack + ESLint + Airbnb JavaScript Style Guide』 という組み合わせが、いま僕の採用しているJavaScriptの環境です。 主要ライブラリは React A JavaScript library for building user interfaces | React 去年、一気に普及したReact
2015年、Web制作者が押さえておきたいCSSの各種リセット、アニメーション、フレームワーク、アイコンのまとめ
制作時に欠かせないリセット用のCSS、ページのグリッドやレイアウト・コンポーネントが用意されたフレームワーク、クリック・タップやホバーやスクロールを楽しませるアニメーション、モバイルにもフレンドリーなCSSでつくられたアイコンなど、ゼロから用意するのはかなり大変なCSSの便利なフレームワークを紹介します。 リセット用のCSSはこの3種類 レスポンシブ対応の定番フレームワーク Material Designに対応したフレームワーク さまざまなアニメーションが簡単に実装できるCSS かわいいアニメーションを使ったローダー 使いやすいアイコンフォント・Pure CSSのアイコン リセット用のCSSはこの3種類 HTMLの各要素のブラウザごとに異なる差異をなくし、意図した通りに実装できるようスタイルをリセットするスタイルシート。 Reset CSS 2.0 HTMLの各要素のmarginやpadd
Primer - GitHub製。みんなで使えるデザインフレームワーク MOONGIFT
企業やプロジェクトによってデザインガイドラインは自ずと必要になってきます。それが社で働くデザイナーの共通認識になる訳ですが、例えばFacebookアプリを作る際にはボタンやデザインをFacebookっぽくしたくなるのではないでしょうか。つまりデザインガイドラインは社内だけでなく社外の人にとっても有益なのです。 そこで登場したのがPrimerです。PrimerはGitHubが作り、使っているデザインガイドラインになります。 Primerの使い方 スクリーンショットを多めで紹介します。まずはグリッド。 ヘッダー。h1〜6まで対応。 テキスト。若干小さめ？ インラインテキストの装飾。 ボタン。ここはGitHubっぽいですね。 ボタングループ。こういうのもGitHubで使われていますよね。 フォーム。シンプルです。 フォームグループ。縦に並べる時に使えます。 メニュー。アイコンはオプションです。
[JS]高速で軽量なJavaScriptのフレームワーク -RightJS
RightJS RightJSと他ライブラリとの比較 IE, Fx, Op, Safari, Chromeの各ブラウザでのパフォーマンスは、jQuery、Prototype、Mootoolsなどの主要なJavaScriptのライブラリと比較して、概ね高速なパフォーマンス結果となっています。 デモではモーフィング、ハイライト、フェード、スライドなどのビジュアルエフェクトを楽しめます。 demo RightJSのライセンスは、MIT licenseとのことです。
第11回 自由なWebフレームワーク、Ramaze | gihyo.jp
はじめに 第9回はSinatraで作った掲示板アプリを通して、SequelとHamlという2つのライブラリを紹介しました。今回はまた別のフレームワーク「Ramaze」について紹介します。 Ramaze Ramaze（「ラマゼ」と読みます）はシンプルで、自由度の高いWebアプリケーションフレームワークです。 シンプルなフレームワークといえば、第7回・第9回で紹介したSinatraもそうでした。SinatraはDSLを駆使して独自の世界を作っていましたが、RamazeはRubyのやり方をできるだけ踏襲します。実際のアプリケーションの例を見てみましょう。 リスト1 RamazeによるHello Worldアプリケーション require 'rubygems' require 'ramaze' class MainController < Ramaze::Controller map '/'
FFRKを支えるWebアプリケーションフレームワークの技術
1. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. FINAL FANTASY Record Keeperを⽀支える Webアプリケーションフレームワークの技術 株式会社ディー・エヌ・エー Japanリージョン ゲーム事業本部 技術・編成部 開発基盤グループ 越智 琢正 takumasa.ochi@dena.com 2. Copyright (C) DeNA Co.,Ltd. All Rights Reserved. ⾃自⼰己紹介 ! 越智琢正（おち たくまさ） ! お仕事 ⁃ Webアプリケーションフレームワーク（GunyaSiF）のメンテナ ⁃ Game⽤用 BaaS の開発 ⁃ 某開発中タイトルの エンジニア リーダー ! 略略歴 ⁃ 〜～2013: 超⼩小型⼈人⼯工衛星（50cm級）の研究開発 • 主に姿勢制御系を
第2回 高機能WebフレームワークPlone | gihyo.jp
Ploneや、PloneのベースになっているZopeは、Python製のオープンソースプロダクトとしてとても有名です。とくにPloneは「オープンソースのCMS」と紹介されることが多いのですが、私はこのキャッチフレーズはPloneの特徴や強みをよく表現していないのではないかと常々思っています。 もちろん、PloneはCMSとしてもよく作られています。私自身、業務としてPloneを使っていて、Ploneを使った大規模なCMSの構築経験もあります。しかし、CMSとしての利用はPloneの活用方法のうちでもかなり初歩的な分野に属します。PloneをCMSと言い切ってしまう人は、「Ploneの本質」をよく理解していないのではないかと私は思っています。 導入、運用のしやすさがPloneの特徴 Ploneは、よくXOOPS Cubeと比較されます。海外だとTYPO3やMidgard CMSといったオ
新規サイトを構築するリソースがパッケージになった -Easy front-end framework
HTMLをはじめ、CSSやJavaScriptなどで実装するフロントエンドの主要な機能が一つのパッケージになった「Easy front-end framework」を紹介します。
第3回 Restlet 1.0.1―RESTアプリケーションを手軽に実現するフレームワーク｜gihyo.jp
Restletとは？ Restlet(http://www.restlet.org/)は、Web APIなどで主流となっているREST(REpresentational State Transfer)型の通信を行うアプリケーションを構築する「軽量な(Lightweight)」Javaフレームワークです。CDDL1.0とGPL2.0のデュアルライセンスの下で配布されています。開発はフランスのNoelios Consulting社(http://www.noelios.com/：フランス語)が主体となって行っています。バージョン1.0.1がリリースされたのは2007年5月3日です。 JavaのREST APIといえば、JAX-RS(JSR 311)の仕様をJCPで詰めている最中ですが、Restletではバージョン2.0のAPIをJCPに提出することを計画しています(2007年4月25日付のNo
px指定の次はコレ！フォントサイズやブレイクポイントに「rem」を使ったレスポンシブ対応のフレームワーク -Schema UI Framework | コリス
Webページでよく使用するさまざまなコンポーネントが簡単に利用できるフロントエンド用のフレームワークを紹介します。 最近は、フォントサイズやMedia Queriesのブレイクポイントなどの単位に「rem」を使用しているサイトが増えてきましたね。 Schema UI Framework Schema UI Framework -GitHub 「rem」の詳しい説明は、以前の記事をご覧ください。 フォントのサイズ指定はpx？ em？ 既存の再検討とこれからのテクニック Schemaの特徴 Schemaのデモ Schemaの特徴 Schema UI Frameworkの特徴 SchemaはMITライセンスのオープンソースのプロジェクトで、軽量でクリーンなフロントエンド用のフレームワークです。 セマンティックなマークアップ Web標準で、きれいなマークアップが使用されています。 LESSベース
第3回 Express.jsを使ったWebアプリケーションを構築 | gihyo.jp
はじめに 前回までは、Node.jsについての基礎的な説明からnpmによるパッケージ管理まで、紹介してきました。今回から、いよいよNode.jsを使ったWebアプリケーションを実装していきます。前々回に単純なHTTPサーバの実装についてコードとともに紹介しました。あれをみるとわかるとおり、nodeが提供するHTTPサーバの機能はプロトコルに沿ったローレベルなものになっています。例えば、リクエストが来たら、そのURLパスに従った処理を実行するために、リクエストURIの解析から実装していかなくてはなりません。そういったことが簡単に定義して処理を書けるWebアプリケーションフレームワークがnodeにも存在します。本連載では、その代表格のExpressを使って実装してみたいと思います。 Expressのインストール Express（Express.jsと表記されることが多い）は、非常に手軽にnod
WordPressによるWebアプリケーション開発
WordPressはCMSプラットフォームとして不動の地位を確立していますが、本書では、このWordPressをWebアプリケーションの開発フレームワークとして活用し、Webアプリケーション開発に必要な知識とテクニックについて詳しく解説しています。ユーザー管理、URLルーティング、データベース設計、再利用性を重視したプラグイン設計、メディアアップローダーを用いたファイル処理、管理画面の実装とカスタマイズ、ウィジェットの効果的な利用方法、OAuthログイン、Web APIサービスの提供、Ajax、Backbone.jsを用いたクライアントサイドの構造化など、Webアプリケーションに要求される処理の多くをWordPressで実現する方法を提示。WordPressの持つ威力と可能性を体感できる一冊です。WordPress 4.x対応。 監訳者まえがき 序文 1章 Webアプリケーションフレームワ
Meteor
Why Meteor.js?Stop fighting with frameworks and ship real products to production. Front-end Agnostic Choose your preferred front-end framework like React, VueJS, Blaze, Svelte, or Solid. Apps for Any Device Create apps for Mobile with React Native or Cordova, or Desktop with Electron with the same code base.
もっと知りたいPython：第3回 WebフレームワークTurboGears, Django, Pylons｜gihyo.jp … 技術評論社
LLベースのWeb開発フレームワークは、Ruby on Railsをきっかけに大きく認知を広げました。PythonとWeb開発の歴史はとても長く、実に成熟しています。前回紹介したPloneのベースになっているZopeは著名なLLベースのWebフレームワークのひとつです。当時Boboと呼ばれていたZopeの開発が始まったのは1996年のことでした。10年以上前に、すでにオブジェクト指向Web開発を実践していたPythonistaの有能さには本当にびっくりさせられます。 Python製Webフレームワークの新時代 Zope以外にも、Pythonには多くのWeb開発用のフレームワークが存在します。どのフレームワークも素晴らしいのですが、Zopeの存在が大きすぎたせいか、多くの開発者の支持を得ることはできなかったようです。 Zopeを筆頭にいくつものフレームワークが群雄割拠していた状況も、数年前か
Goji - A web microframework for Golang
What is Goji? Goji is a HTTP request multiplexer, similar to net/http.ServeMux. It compares incoming requests to a list of registered Patterns, and dispatches to the Handler that corresponds to the first matching Pattern. Goji also supports Middleware (composable shared functionality applied to every request) and uses the standard context to store request-scoped values. Quick Start Install Goji by
webgo.io - Domain Name For Sale | Dan.com
Buyer Protection Program When you buy a domain name at Dan.com, you’re automatically covered by our unique Buyer Protection Program. Read more about how we keep you safe on our Trust and Security page. Next to our secure domain ownership transfer process, we strictly monitor all transactions. If anything looks weird, we take immediate action. And if the seller doesn't deliver on their part of the
Big Sky :: golang で最近お気に入りの WAF「Goji」
Web アプリケーションを書くときは今までずっと 小さい物は web.go 大きい物は net/http というスタンスを何故か貫いて来たんだけど、最近ようやく web.go をやめて goji を使う様になった。 Goji A web microframework for Golang https://goji.io/ 理由としては Sinatra ライクでありながら高度な正規表現マッチも使えるルータ それでいて net/http コンパチ 簡単に実装出来るミドルウェアスタック グレースフルシャットダウン そして何と言っても速い ミドルウェアも一般的な Web アプリケーションを作るには十分な物が既に揃ってます。 それでもやっぱり大きめな物は net/http で書くんだけど、小規模から中規模な物を一気にゴリゴリっと書く場合には goji は便利です。もちろん Windows でも動きま
モバゲータウンのノウハウ満載！ フレームワークMobaSiFを使おう！：第1回 ケータイ向けWebアプリケーション開発特有の技術要素｜gihyo.jp … 技術評論社
はじめに iモード／EZweb／Yahoo!ケータイなどで利用されるケータイブラウザは、極端な言い方をするとPCブラウザやフルブラウザとは「まったくの別物」です。今回はまず、ケータイブラウザ向けWebアプリケーションを開発する際に考慮すべき技術要素の説明を行います。次回以降は、そういった技術要素を共通的に処理できるフレームワークとして、筆者たちの所属する株式会社ディー・エヌ・エー（DeNA）がオープンソースソフトウェアとして2008年5月に公開したMobaSiF（Moba Simple Framework）を解説していきます。 本特集は、WEB+DB PRESS Vol.45の特集1「[イマドキ]ケータイ開発実践入門」の第2章、第3章を再構成したものです。なお、紙面の都合上で省略した説明も補っています。 各キャリア端末の世代分類 NTTドコモのiモードが開始されたのは1999年2月で、すで
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Normalize.css: Make browsers render all elements more consistently.
Webページでよく使うさまざまなコンポーネントが簡単に利用できるCSSベースのフレームワーク -Materialize
