ITエンジニア/デザイナ向けにオープンソースを毎日紹介

List

  • 2014/07/25

Filydoc – ローカルにたまったMarkdownファイルを公開しよう

自分で集積したメモを公開したいと考えることは多々あります。個人的にはDropboxでメモってあって、必要に応じてGistなどで公開しています。ただしこれではデータの一元管理上、都合が悪いこともあります。Filydocの作者も同じ思いがあったようで、ローカルで書いたMarkdownのメモを公開する手段としてFilydoc...

List

  • 2014/07/25

JSONMate - ビジュアル化が分かりやすいWebベースのJSONエディタ

世の中の流れとしてJSONが多く使われるようになっています。基本的にシステム同士でデータを授受されるものではあるのですが、開発者はその内容を見たり、編集したいと思うこともあります。手作業でJSONが作れるようになれば、ちょっとしたモックを渡したり外部のサーバにデータ提供しやすくなります。そこで使ってみたいのがJSONM...

List

  • 2014/07/25

hifive - HTML5で作るWeb業務システムフレームワーク

最近、Webフロントエンドフレームワークが増えています。jQueryもそうですし、Backbone.jsやAngularJSもあります。MVCフレームワークが多く、より効率的に大型なWebアプリケーション開発が行えるようになっています。今回はその一つ、hifiveを紹介したいと思います。特徴としては企業でWebシステム...

List

  • 2014/07/24

Blogist – コンテンツをGistで管理するブログエンジン

ブログエンジンと言えばWordPressやMovableTypeといったオープンソース、さらにTumblrやWordPress.com、livedoorブログ、はてなブログなど様々なASPがある中、なぜ自分でブログエンジンを作らなければならないのでしょうか。それはもちろんハッカーだからです。自分や最近の技術トレンドを活...

List

  • 2014/07/24

jQuery.overlay - テキストエリアのままで使えるWYSIWYG

テキストエリアでWYSIWYGな編集を可能にするものはどれも仰々しく感じられます。テキストエリアをiframeなどで置き換える形で提供されるのでAjaxなどとの相性が良くない場合もあります。ちょっとした文字装飾だけ行えればいいという場合にはjQuery.overlayを使ってみてはいかがでしょう。シンプルな文字装飾ライ...

List

  • 2014/07/23

The Markdown Resume – Markdownをベースにした履歴書

何でもMarkdownで文書を作っていると、他のフォーマットで記述しようと思うと途端に面倒くさくなりますよね。そういう問題は目的に合わせたMarkdownコンバータがあれば全て解決してしまいます。HTMLにするのはもちろんのこと、PDFにするのもMarkdownを使えば簡単です。The Markdown Resumeは...

List

  • 2014/07/23

Please JS - デザインのお供に。カラーリング自動生成ライブラリ

色を決めるのは大変な作業です。色の選び方次第で印象が全く変わってきます。基調を合わせて選択するのはもちろん、濃淡や強弱など使われる場面によって選択をしなければなりません。最もいいと思われるのは幾つものカラーパターンを作って実際に適用してみることです。そうすれば実際のイメージに合わせて良い配色ができあがるはずです。そこで...

List

  • 2014/07/22

Paletta – 選択した色に合わせたカラーリングを自動展開

Webサイトに限らずデザインをする際に大事なのは全体としての調和がとれていることです。それは色合いであったり、オブジェクトの形であったりします。そういった全体のパランスが保たれていることがまず基本でしょう。最近は多くのHTML5デザインフレームワークがありますので、そういったフレームワークとPalettaを組み合わせて...

List

  • 2014/07/22

Etch.js - コンテンツを見たままに編集するWYSIWYGエディタ

最近のCMSはユーザ画面と管理画面を分けるのではなく、ユーザが見ている画面上で直接コンテンツを編集できるようにしています。その方が実際に反映された時にどのように表示されるのかが分かりやすく、管理画面にログインして修正したいコンテンツを探す必要もありません。そんなCMSの機能を独自のWebシステムでも実装してみたいと思っ...

List

  • 2014/07/21

unfluff – メインコンテンツを取得するnode製コマンド

外部のWebサイトを集約して情報を提供する、いわゆるキュレーションサイトが増えています。そういったサイトを作る際に欲しくなるのはあるURLのタイトルとメインコンテンツを取得するという機能です。MOONGIFTでは独自に作っているのですが、そういった機能が欲しいと思ったらnodeで作られたunfluffを使ってみるのはい...

List

  • 2014/07/21

jQuery.GI.TheWall.js - Google画像検索ライクな表示/アニメーションライブラリ

Googleの画像検索をよく使うのですが、一覧に並んだ画像に加えて、それをクリックした時のアニメーションや説明表示など使い勝手がとてもいいです。さすがGoogleといった所ですが、そのUIを真似ると色々な場面で使えるかも知れません。そこで使ってみたいのがjQuery.GI.TheWall.jsです。jQueryベースで...

List

  • 2014/07/20

The Simpsons in CSS – なんと!CSS3を駆使して描かれたシンプソンズ一家+α

CSS3を駆使してどこまでのことができるのか、そんな腕試しが色々と行われています。アニメーションをしたり、パララックスエフェクトのような技術を披露したり、CSS3は大きな可能性を秘めています。そんな中、イラストを描く試みも幾つも行われています。日本では約4年前にドラえもんが描かれていました

List

  • 2014/07/20

End Credits - 感謝を込めて使いたい。Webサイトでのエンドクレジット表示

映画を観ると、最後には必ずエンドクレジットが流れますよね。そこでは出演者、映画を製作するのにあたったスタッフ、スポンサー、配給/協力会社など様々な情報が流れていきます。それは何も映画に限らずWebだって多数の人たちが関わって作られているはずで、そんな人たちに感謝を込めて使ってみたいのがEnd Creditsです。## ...

List

  • 2014/07/19

Bootstrap/386 – Bootstrapを使って昔懐かしいコンピュータ画面を再現

Bootstrapには様々なテーマが存在します。それこそ、いわゆるBootstrap臭など吹き飛んでしまうくらい全くイメージが変わるものまであります。実用性の高いテンプレートから、そうでないものまで多数あるテーマから選択できるでしょう。今回はその一つ、Bootstrap/386を紹介します。懐かしのコンピュータ画面を再...

List

  • 2014/07/19

2-plan Team - 中規模以上から使えそうなPHP製プロジェクト管理

企業内の開発においてプロジェクト管理を使わないケースは少ないと思います。その機能や規模、ソフトウェアは色々ですが、進捗や要求などを管理しなければ個々人によって色々な解釈がされた後、霧散してしまうでしょう。様々なプロジェクト管理ソフトウェアが存在しますが、今回はPHP製の2-plan Teamを紹介します。ガントチャート...