ソースのストックするならこの中から!ソースコード管理・整理に便利なオンラインのスニペットツール7選

catch_snippet

HTMLコードやPHPソースなどを管理するオンラインのスニペットツールって最近は色々ありますよね。
そんなスニペットツールを7つほど見つけたので良かったら参考にしてみてください。

結構ソースとか書いているけどまとめるのめんどくさい~!
でもまとめておくと自分の引き出しが増やせて使いまわせたりするのでストックしておくと後々いいことあるのでスニペットを活用していきましょう!

Code Bank

codebank

http://programs.edchipman.ca/applications/code-bank/
HTML, CSS, JavaScriptをはじめ、XML, ActionScript, Flex, Java, Perl, PHP, SQL, Cなどさまざまな言語に対応したコードを手軽に管理できるAdobe AIR製のオープンソース・ソフトウェアのスニペット管理ツール

Snippely

snippery
https://code.google.com/p/snippely/
こちらはGoogleのAdobe AIR製のオープンソース・ソフトウェアのスニペット管理ツール。

Snippi

Snippi
http://snippi.com/
スニペットに対するタグ付けや言語別ソート、各スニペットにはコメントが可能で簡単な説明なんかすぐ可能。

CodePad

Code Pad
http://codepad.co/
コードを保存するには登録(招待制)が必要ですが、コードを見たりダウンロードするのは登録無しでできるオンラインのスニペットツールです。

CSSPop

CSSPop
http://www.csspop.com/
CSSスニペットのコレクションを閲覧、または自分自身で作成し公開することができます。
人気順での表示や、タイプ(ボタン、ヘッダーなどの要素)別で検索することもできるので便利。

Qiita – プログラマの技術情報共有サービス

Qiita
http://qiita.com/
スニペットを管理するのにも使えますしソースを公開してもっとこうした方がいいといった指摘などももらえることがあります。
またMac使いの方にはKobitoというスニペットツールを無料で公開しておりワンクリックでQiitaへ公開できるようです。

jsdo.it – Share JavaScript, HTML5 and CSS

jsdoit
http://jsdo.it/
ここもソースを管理してブログやjsdoサイト上で公開することもできます。非公開の設定もできるしエディタも使いやすくプレビューもあるのでjqueryのアニメーションの確認にも便利。
また他の公開されている方のアクセスランキングなどもあるので勉強になります。

以上7選でした。

色々とありますがもっと簡単に呼び出せて検索できるようなツールが出て来ればな~って感じてます。
何か他にこんなのあるよ~?っていうのがあれば是非教えてください~!!

  • Pocket
  • LINEで送る
  • このエントリーをはてなブックマークに追加

コメントを残す




関連記事

角丸・グラデーション・影・透過を表現するCSS3コードを自動生成してくれるジェネレータ「CSS3 Generator」
関西のWebデザイナー・クリエイター等のIT関係のセミナーをまとめてみました。
CSSのみで作られたシンプルなアイコンセットを公開している「icono」
デザインのためのインスピレーションの助けになるSNS風コミュニティサイト「Dribbble」
好きな色や大きさにカスタマイズしたアイコンを無料でダウンロードできる「PNGify Me」が便利!
初心者必見!PHPを勉強したい方へおすすめしたい学習サイト6選
Web制作に欠かせない各ブラウザのスタイルを初期化するCSSリセットを集めたWebサイト「css reset」
Webデザインの参考になるイケてるサイトを集めたギャラリーサイト「イケサイ」
サイトの配色に困った時に簡単にバランスの取れた色を選ぶことができる調和配色アプリ「HUE/360」
横並びのカラム計算に便利!ビジュアルで確認できるグリッドシステム計算ツールGridpx
顔バレを防げてSNSのアイコンにも使えるBrickapic。簡単にレゴ風自画像が作れて便利!
無料で使えるロゴをダウンロードできる素材集サイト「LogoInstant」
WEB制作で無料写真素材を探すならPixabay!高品質で素敵な画像が役立ち過ぎる!
プレビューを見ながら簡単にスタイリッシュなグラデーションを作成できるCSS3ジェネレーター「Ultimate CSS Gradient Generator」
作成したHTMLやCSS・JavaScriptコードを共有できる「jsdo.it」

Menu

HOME

 TOP