最近のWebページで人気のある縦長ページ、繊細なインタラクション、大きい写真画像を使ったヘッダ、カード型コンポーネントなど、UIデザインのトレンドが取り入られたHTML5/CSS3で作成された商用利用無料のテンプレートを紹介します。 各デバイスごとのレイアウト、気持ちいいアニメーションなどの勉強にもいいですね。 Synthetica デモページ 最近のトレンドでもあるビジュアルのセクションを広く確保し、洗練されたアニメーションを備えたインタラクションが気持ちいいテンプレート。個人のポートフォリオからプロダクトのランディングページまで、何かを見せることに適しています。

WEB制作で必ずと言っていいほど登場するものの１つに「見出し」があります。 そこで今回は、CSSだけで作られている見出しの中でも、実用性が高いものやCSSの最新要素を使ったものを厳選してご紹介します。コピペで簡単に実装できるので、是非使ってみてください。 飾り付きの見出し 擬似要素before、afterを使って飾りをつける見出しです。beforeとafterのcontentプロパティを変更すれば、☆や♡にすることもできます。 同じくbefore、afterを使うパターンです。transformプロパティで斜めにした長方形と長方形を重ねることで三角形を作っています。 beforeとafterを使ったシンプルな見出しです。ボーダーを指定した擬似要素の位置をpositionプロパティで指定しています。 ボーダーがある見出し キャプション付きの見出しです。シンプルなので使いやすいですが、レスポン

ツイート ブックマーク 最近すっかり触っていなかったCapistranoですが、久しぶりに設定する機会に恵まれたのでいろいろと調べてみました。 Capistranoは非常に便利なデプロイツールです。しかしいくつか面倒くさい設定が必要な場合もあります。 とくに僕が一番面倒くさいと感じたのは、githubのプライベートなリポジトリをデプロイする場合。 SSH Agent Forwardingの設定すればいいのですが・・・面倒くさいですよね。 そこで、今回は簡単にGithubのPrivate Repositoryからデプロイする方法をご紹介します。 手順 Personal API tokenの作成 deploy.rbにリポジトリのURLを設定 Personal API tokenの作成 https://github.com/settings/tokensにアクセスして、まずはトークンを作成します

先日公開されたAngular2 rc.6から、RouterのLazy Module Loading機能が強化されています。 AngularJS 1.xでは、oc-lazy-loadなどの3rd Party製の仕組みはあったものの、公式なLazy Load機能は用意されていなかったため、個人的には期待度の高い機能でした。 そこで今日はwebpack環境でのAngular2 のLazy Loadingについて書いてみようと思います。 ちまちま書いたので若干長くなってしまったので、先にレポジトリのURL貼っておきます。 Quramy/ng2-lazy-load-demo なお、上記のレポジトリではwebpackは1.xではなく、2.x(2016.09.03現在beta版)を利用しています。AoTを使わないのであれば、1.xでも問題ありません。 Lazy Loadingって？ webpackに限ら

先日社内でRailsをものすごい速さで習得しようよ合宿が開催された。 自分はRailsを少しだけかじったことがあったためまだ見ぬAPIモードを果敢に攻めてみたのでメモ。 ruby ： 2.2.4 Rails ： 5.0.0.1 Angular： 1.5.8（だってAngular2はずっと-rc.~なんだもの） Webpack： 1.13.2 AngularMaterial：1.1.1 ソースも置いとくので参考にどうぞ。 Railsの環境は出来ているものとして話を進めていくよ 1.RailsAPI 【参考】 Rails による API 専用アプリ 大事なことは全てRailsGuidesに（ちゃんと日本語で）書いてあるのでここでは端折ります。 API専用アプリを作るためにはいつものrails newコマンドに--apiオプションをつけるだけになります。 db使う場合は後から設定いじるのは手間な

2018年4月25日をもちまして、 『CodeIQ』のプログラミング腕試しサービス、年収確約スカウトサービスは、 ITエンジニアのための年収確約スカウトサービス『moffers by CodeIQ』https://moffers.jp/ へ一本化いたしました。 これまで多くのITエンジニアの方に『CodeIQ』をご利用いただきまして、 改めて心より深く御礼申し上げます。 また、エンジニアのためのWebマガジン「CodeIQ MAGAZINE」は、 リクナビNEXTジャーナル( https://next.rikunabi.com/journal/ )に一部の記事の移行を予定しております。 今後は『moffers by CodeIQ』にて、 ITエンジニアの皆様のより良い転職をサポートするために、より一層努めてまいりますので、 引き続きご愛顧のほど何卒よろしくお願い申し上げます。 また、Cod

Speee Cafe Meetup #02, 2016/09/01

Inc.：マルコム・グラッドウェル氏が提唱した「何でも1万時間練習すればプロになれる」という「1万時間ルール」は、後の研究により「世界レベルになるために必要な練習量は分野によって異なる」と修正されました。 1万時間ルールがどんな分野でも通用するわけではないとしたら、仕事の世界で世界的なレベルになるには何が必要なのでしょうか？ 私は過去数年にわたり、起業家であるイーロン・マスク氏、テレビ司会者であるオプラ・ウィンフリー氏、Microsoft創業者のビル・ゲイツ氏、Facebook創業者のマーク・ザッカーバーグ氏など、多くの人から称賛されるビジネス・リーダーの経歴を調べてみました。 その結果、「彼らはどんなに多忙であっても、自分の練習あるいは学習に1日最低1時間は充てており、キャリアを歩み始めてから現在までそれを絶え間なく続けている」ということが明らかになりました。 私はこの習慣を「5時間ルー

指数関数って、高校数学で習う時、何やら突然出てきた気がしませんか？ 私はそんな風に思ってました。 そして、ちゃっかり初等関数の一員として、対数関数と共に並んでいます。 何が気になるって、必然性が感じられないのです。指数関数じゃなきゃいけない理由が分からない。もちろん、よく使われる基本的な関数であることは確かなのですが、「初等関数」という括りには、もう少し必然性がほしいです。それなら「特殊関数」のベータ関数やガンマ関数、ゼータ関数、ベッセル関数などは、「ある意味では」よく使われる関数です。なぜ、彼らは特殊なのでしょう。 今回の記事では、本来の定義に立ち返って指数関数を導出することで、指数関数が初等関数である理由を与えることを目標としましょう。 1. 指数関数の定義 任意の実数 に対して、次の等式を満たす、無限回微分可能な関数 を指数関数と定義する。 そして、このような を と表記します。 「