Premium Bootstrap Themes and Templates
Creative Tim Club 🔥 Access to all our current and future products Fully Coded UI Tools to create web and mobile apps UI Kits, Templates and Dashboards built on top of Tailwind CSS, Bootstrap, Vue.js, React, Angular, Node.js and Laravel. Join over 2,533,653 creatives to access all our products! Welcome to Creative Tim Club! Take your workflow to new heights by joining our exclusive club for access
クックパッドにおける最近のActiveRecord運用事情 - クックパッド開発者ブログ
インフラストラクチャー部の成田（@mirakui）です。 Rails の OR マッパーである ActiveRecord ですが、みなさんどのように運用していますか？ ActiveRecord を使うと、 SQL を直接扱うことなく、抽象化された表現で RDB にアクセスできるので、アプリケーションの開発効率という観点ではメリットが大きいです。 一方で、 ActiveRecord が駆使されているアプリケーションをサーバに配置してプロダクションとして運用する立場からすると、いくつかの問題に突き当たります。 まずはクックパッド本体アプリケーションにおける、最新の rake stats をご覧ください。 +----------------------+-------+-------+---------+---------+-----+-------+ | Name | Lines | LOC
Dockerで非エンジニアでも開発環境を上げ下げできる、mirageというツールを作りました - KAYAC engineers' blog
いやー今年もISUCONの予選参加募集がはじまりましたね! 昨年は出題側だったので胃が痛かったですが、今年は参加側ですので大変楽しみにしております。@acidlemonです。 Docker使ってますか? さてみなさん、Docker使ってますか? 使ってる? 使ってない? ぼくは使ってませんでした。えー今どきBlue-Green Deploymentやってないの? Immutable Infrastuctureじゃないの? と言われそうですが、世の中にはいろんなしがらみとかもあってなかなか簡単にエイヤーでコンテナに移行できるわけでもないのは皆さんなんとなく感じているのではないでしょうか。 とはいえ、最近これだけ話題になっているDockerですので、そろそろ使ってみたいなぁ…ということで、まずは開発環境をDockerで上げられるようにしました。 Dockerでコンテナを作るときには2つのアプロ
SCSSとCompassでおしゃれなCSSパーティクルを作ってみた - ICS MEDIA
Webサイトを構築する際、角丸、グラデーション、アニメーション等、従来では画像やプログラミング言語を使わないと不可能だったデザイン表現が、CSS3を使うことで可能となりました。さらに、CSSの拡張言語であるSCSSや、SCSSのフレームワークであるCompassと組み合わせると、CSSによる表現の幅が広がります。今回は、CSSのみでのデザイン表現をテーマとし、SCSSやCompassの便利な機能を活用した幾何学模様の作り方をご紹介します。 別画面でデモを再生する ソースコード(SCSS) なぜSCSSやCompassを使うのか プログラミングを使って図形を描く場合、基本的な四則演算や三角関数といった数学的な処理や、繰り返し文（for文）、条件分岐（if文）等が扱えると便利です。しかし、CSSではcalc()メソッドを使った簡易な計算しかできず、繰り返し文や条件分岐等は実装されておりません。
node-webkitで最前面に置けるMarkdownメモアプリを作った
floating-memo.app 名前の通り最前面に表示されてる事を前提にした簡易なメモアプリです。 node-webkitで最前面なアプリが書けることに気づいたので簡単に作りました。 今のところMacのみのサポートとしています(DayOneに依存してるので)、別の所に保存する実装等があれば他のプラットフォームでも動かせるようになると思います。 以下から、ダウンロードすることが出来ます。 https://github.com/azu/floating-memo/releases/latest 仕組み floating-memo.appはnode-webkitで書かれています。 node-webkitはnode-webkitとは何かでも書いていましたが、ブラウザのcontextとnode.jsのcontextの2つを持っています。 このアプリでは、表示やエディタ部分はブラウザのcontex
Virtual DOMを持つMV*ライブラリのmercuryについて
最近node-webkitアプリを書く時、何かしらのMV*やデータバインディングライブラリと言われるものを試しているのですが、floating-memo.appではRaynos/mercuryを使いました。 mercury は小さなモジュールを組み合わせたライブラリとも言えますが色々特徴的です。 完全にモジューラーな実装 Virtual DOM FRP ファイルサイズが小さめ モジューラーな実装とは何かというとmercuryのindex.jsを見ると面白い事が書かれています。 /* Pro tip: Don't require `mercury` itself. require and depend on all these modules directly! */ require("mercury") しないで、直接それぞれのモジュールを読み込んで使えるという事が書かれています。 (これ
Learn web development | web.dev
Stay organized with collections Save and categorize content based on your preferences. Explore our growing collection of courses on key web design and development subjects. An industry expert has written each course, helped by members of the Chrome team. Follow the modules sequentially, or dip into the topics you most want to learn about.
爆速HTML – Elmでの仮想DOM | POSTD
新たな elm-html ライブラリでは、HTMLとCSSをElmで直接使用できます。FlexBoxも使ってみたいし、既存のスタイルシートも使い続けたいですか？ Elmは使いやすくなり、処理が 速く なりました。例えば、 TodoMVC アプリを再作成する場合、Elmの コード はとても単純で、 事前のベンチマーク でも、他の人気ライブラリに比べ処理速度が極端に速いという結果が出ています。 elm-html とMercuryは、どちらも virtual-dom プロジェクトを基にしているので、パフォーマンスが優れています。この記事では、前半で“仮想DOM”とは何か、 純粋性 と 不変性 によっていかに処理速度が上がるかということについて詳しく検証します。この検証によって、なぜOm、Mercury、Elmがベンチマークでこのような素晴らしい数字を出したかが分かるでしょう。 パフォーマンスは人
JavaScriptの基礎 - 第1章 JavaScript言語仕様 - [SMART]
式 プログラミング言語には様々な種類の式があります。例えば、前節でコンソールに入力した「1 + 1」は算術式です。算術式は + や - といった演算子と呼ばれる記号を使い、加算や減算などの演算を行います。 上記は数学の式と同じで、10に20を加算しています。 コンソールで確認しよう 10 + 20 出力結果 30 代入式 次に紹介するのは代入式です。代入式は代入演算子（ = ）を使い、左辺の変数に右辺の値を代入します。 上の式を実行すると、valの値は10になります。 コンソールで確認しよう val = 10 出力結果 10 代入式は文字列も使えます。 コンソールで確認しよう s1 = "Hello world" 式は代入の際に計算することもできます。次の式では、xに5を代入し、100にxを足し、その結果をyに代入しています。xは5になっているので、yには「100 + 5」の結果の値105
![JavaScriptの基礎 - 第1章 JavaScript言語仕様 - [SMART]](https://cdn-ak-scissors.b.st-hatena.com/image/square/efeb6493234f33406d242c048873a805fca99c63/height=288;version=1;width=512/https%3A%2F%2Frfs.jp%2Fwp-content%2Fthemes%2Fsmart%2Fogpimage.png)
[JS]フラットなデザインで映える！美しく広がる波紋のエフェクトを簡単に実装できるスクリプト -jQuery.twinkle
ダウンロードファイルに含まれているデモ jQuery.twinkleの使い方 Step 1: 外部ファイル 当スクリプトとjquery.jsを外部ファイルとして記述します。 <body> ... <script src="jquery-1.10.2.min.js"></script> <script src="../jquery.twinkle-0.7.1.js"></script> </body> Step 2: HTML アニメーションを適用する要素にclassやidを加えます。 <div id="twinkle1">click !</div> Step 3: JavaScript jQueryのセレクタで要素を指定し、スクリプトを実行します。 $(selector).twinkle(); アニメーションやエフェクトはオプションで設定します。 var options = { "effe
![[JS]フラットなデザインで映える！美しく広がる波紋のエフェクトを簡単に実装できるスクリプト -jQuery.twinkle](https://cdn-ak-scissors.b.st-hatena.com/image/square/1664f643712bb7cebf68cc882a1117f2f93e0a5a/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201403%2F2014082802.gif)
フリーフォントKendoScore:Geekなぺーじ
数値文字参照は、英語入力のみのシステムで日本語表記スコアを表示するときなどに便利です。 KendoScore.ttfのライセンス KendoScore.ttfは、IPA Minchoをベースに作成されており、IPAフォントの派生プログラムです。そのため、KendoScore.ttfのライセンスはIPAフォントライセンスv1.0に準じます。 http://ipafont.ipa.go.jp/ipa_font_license_v1.html Webフォントとして利用する方法 CSS3で新たに追加された@font-faceを利用することにより、Webサーバに保存されたフォントをユーザのWebブラウザに表示させることができます。これにより、ユーザのパソコンなどにインストールされていない文字を表示させられます。 KendoScoreをWebサーバに設置したうえでCSS3の@font-faceを利用す
pre-commit
pre-commit A framework for managing and maintaining multi-language pre-commit hooks. Git hook scripts are useful for identifying simple issues before submission to code review. We run our hooks on every commit to automatically point out issues in code such as missing semicolons, trailing whitespace, and debug statements. By pointing these issues out before code review, this allows a code reviewer
Yelp: git hookのためのマルチ言語対応パッケージマネジャ - ワザノバ | wazanova
http://engineeringblog.yelp.com/2014/08/announcing-pre-commit-yelps-multi-language-package-manager-for-pre-commit-hooks.html 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約2時間前 Yelpでは、コードレビュー前にgit hookを利用してコードのチェックをしていますが、 プロジェクトごとにhookのbashスクリプトをコピペ/修正するのが面倒。 lintツールなどを利用するには、プロジェクトで使っている開発言語以外の言語用のパッケージマネジャーでインストールしなくてはいけないケースがある。 nodeのプロジェクトで scss-lint（Rubyで書かれている。）を利用する際、プロジェク
enterprise agile lean modeling
「エンタープライズアジャイル開発のリーンモデリング」 by 山岸理事 on 5/28, 2014 要求開発アライアンス定例
「これだけ」モデリング - Qiita
これだけモデリングとは 「これだけモデリング」とは、メソドロジックの山岸さんが提唱されている「軽い」モデリング手法です（山岸さんはリーンモデリングとも呼んでいたがぼくはベタにこれだけモデリング、という日本語が好き）。 デベロッパーでなく情報システム部門目線で見て、どんどん複雑になる企業アプリケーションの要求や設計を見通しよく「共通合意」を作るための、「軽い」モデリングの必要性がテーマです。 そうなんです、従来は、「全部書かなきゃだめ」とか「全部メンテしないといけない」とか、「下流を触ったら上流までさかのぼって修正しなきゃ」とか足かせが多かったので、なかなか実装から遠いモデリングがペイしなかったのですね。だから、「これだけ」モデリングを提案したい、という訳です。 エンタープライズアジャイル時代のリーンモデリング（slideshare） これだけモデリングとは、 誰が？ ー 情報システム部門の
Yet another use of Phalcon
5. 導⼊入の経緯 2013年年初頃 AWSをソーシャルゲームに導⼊入をはじめた ソーシャルゲームを AWS:c1.mediam で運⽤用開始 CPU使⽤用率率率低いのに なんか レスポンス遅くなる Apacheの並列列数増やしたいけどメモリ⾜足りない 1プロセス100MB以上使ってる CPU使い切切ってないのに m1.large に移⾏行行 最低コストが上がる EC2を使い切切りたい！！ 6. 導⼊入後 • メモリに起因したパフォーマンス劣劣化は発⽣生し てない • CPUがボトルネックになる（健全） – もしくは外部リソースがボトルネック • プロセスあたり30MBになった • EC2: t1.micro/m1.small でもそこそこの性能 が出る、最近は t2 系に移⾏行行中 何よりフレームワークのパフォーマンス改善が必 要なくなった 7. サーバ構成について App
Welcome! - Bootstrapper
Bootstrapper for Laravel This site uses a design similar to Twitter Bootstrap to allow you to refer back and forth between the two sites if needed. View the install docs to enable Bootstrapper in your Laravel project. View project on GitHub Need the old docs? Build them from GitHub here Back to top Created by Patrick Talmadge @patricktalmadge. Maintained by Patrick Rose @DrugCrazed. Package for L
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
crocos.jp
JavaScript Memory Management Masterclass
Modeling in the Agile Age - JP