VSCodeで生産性を上げる
はじめに こんなツイートを見て執筆をしようと思いました。 実際に、VSCodeは機能の追加や拡張機能の開発が活発に行われており、かつUIもユーザーフレンドリーであるため人気のエディターだと思います。VSCodeを使いこなせるのとそうでないのではエンジニアリングの生産性に大きな差が出てしまうと思います。 パンくずの設定 '>' を入力します。 '>' preferences: Open User Settings (JSON)を入力します。 僕のsettings.jsonは以下です。 { "workbench.colorTheme": "GitHub Dark", "terminal.integrated.fontFamily": "MesloLGM Nerd Font", "terminal.integrated.profiles.osx": { "fish": { "path": "/o
jsfiddleやCodepenのようにブラウザでJavaScriptを実行テストできるオープンソースのWebアプリ・「Editor」 - かちびと.net
EditorはjsfiddleやCodepenのようにブラウザでHTML/CSS/JSのコードを実行テストできるOSSです。emmetによるコード補完やLint機能、センターバーを動かす事でレスポンシブWebデザインの表示確認が可能であったり、エクスポート機能、cdn.jsへの検索と導入、ローカルストレージへの自動保存機能、など、あると嬉しい機能は一通りそろっている印象です。特にシェアしたりembedする予定が無いならクローズドな場所で動かしたほうが良いですね。リアルタイムに即反映されるので開発も捗りそうです。ライセンスはMITとのこと。欲を言えばググラビリティの低いネーミングだけは止めて欲しいかも。 Editor
BootstrapやAMPなどのテンプレートを簡単にカスタマイズできる無料の国産サービス -Framework Template Editor
Bootstrap, Foundation, Materializeなどのフレームワークは手軽に利用できるとは言え、それでも一から始めるのは面倒です。これらのフレームワークを簡単にカスタマイズして利用できる無料の国産サービスを紹介します。 ランディングページやブログをさくっと作りたい、ナビゲーションやカード型コンポーネントを利用したいなど、さまざまなテンプレートやテーマを利用できます。 Framework Template Editor Framework Template Editorの特徴 Framework Template Editorの機能 Framework Template Editorの使い方 Framework Template Editorの特徴 Framework Template Editorは、BootstrapやFoundationなどの人気が高いフレームワーク
5000兆円欲しい！.css
About HTML Preprocessors HTML preprocessors can make writing HTML more powerful or convenient. For instance, Markdown is designed to be easier to write and read for text documents and you could write a loop in Pug. Learn more · Versions Adding Classes In CodePen, whatever you write in the HTML editor is what goes within the <body> tags in a basic HTML5 template. So you don't have access to higher-
56歳からコードを書き始めて食べていく方法
私は56歳、最近プログラミングを始めたんだ。 なぜかって？やりたいからに決まっているじゃないか。ようやく最近コツをつかめてきてね。でもコツをつかめたからといって簡単にはいかない。正直なかなか手こずっている。でもいいんだ。 アルゴリズムに挑戦して我を忘れるのは楽しいし、まだテストしたい事があって「あと数分だけ」と繰り返し自分に言い聞かせるのもいい。「今度こそ上手くいったかも、、」とドキドキしてから「やったぞ！ついに動いた。」となる瞬間も大好きだ。 でもこんな私には今まで趣味と呼べるものが何ひとつなかった。自分に見返りがない事に時間を費やすのは嫌だったんだ。ただ楽しみのためだけに何かをするのが好きじゃなかったのさ。休みの日にやる事といったら、ちょっとした小遣い稼ぎになるような事ばかりだった。 オーケー。もちろんコーディングだって小遣い稼ぎさ。上手くやればかなり稼げる。これだってあなたから見れば
デザインのひきだし見せます！PhotoshopとIllustratorの代わりに使える無料アプリ6選|haconiwa
知ってると便利！困ったときのお助け無料アプリ！ こんにちは。Keinaです。 普段デザイン制作で、使用することの多いアプリケーションといえば、AdobeのPhotoshopとIllustrator。 目の前に自分のPCがあるときは、必ず使用しているんですが、ときどきノートPCを持ち歩いていない時に限って、急に必要になることがあります。そんなときにオススメなのが、PhotoshopとIllustratorの代わりに使える無料アプリ。本日は、本当に使える無料アプリを6つご紹介します。ブックマークしておくと、困ったときに見つけられるので便利ですよ。 Photoshopの代用アプリ PIXLR EDITOR PIXLR EDITORは、オンラインで画像編集が行える便利なWEBサービス。 インターネット環境さえあれば、すぐに使用できるのがいいところ。画像補正はもちろん、バナー制作くらいなら、問題なく
Bootstrapのテンプレートが簡単に作成・カスタマイズできる国産の無料ツール -Bootstrap Editor
Bootstrapはページ作成に役立つ機能がたくさん用意されており便利ですが、ファイルをダウンロードしたり、テンプレートを用意したりなど、始めるまでに少し手間がかかってしまいます。 そんな手間をすべて解消し、初心者の人でもプロの人でもすぐにBootstrapのテンプレートが簡単に作成・カスタマイズできる国産の無料オンラインツールを紹介します。 Bootstrap Editor Bootstrap Editorの特徴 Bootstrap Editorの機能 Bootstrap Editorの使い方 Bootstrap Editorの特徴 Bootstrapを初心者でも手軽に使えるよう開発された日本製のオンラインツールで、ダウンロードやインストールなどの準備は不要、すぐにBootstrapでさまざまなページを作成できます。 Emmetなどにも対応しているので、使い慣れた人にも便利です。 作者様
voxel.css
var scene = new voxelcss.Scene(); scene.rotate(-Math.PI / 8, Math.PI / 4, 0); scene.attach(document.body); var world = new voxelcss.World(scene); var editor = new voxelcss.Editor(world); editor.enableAutoSave(); if (editor.isSaved()) { editor.load(); } else { editor.add(new voxelcss.Voxel(0, 0, 0, 100, { mesh: voxelcss.Meshes.grass })); } View in JSFiddle var voxel = new voxelcss.Voxel(0, 0, 0, 10
FINDJOB!終了のお知らせ | FINDJOB!
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
Photoshopのレイヤーパネルでの面倒な作業をいろいろ便利にする機能拡張
複数のレイヤーの名前を同時に変更したり、空のレイヤーを1クリックで全て削除したり、スマートオブジェクトを一括でラスタライズしたりなど、Photoshopのレイヤーパネルでの面倒な作業をいろいろ便利にする機能拡張を紹介します。 機能拡張は無料で利用でき、Photoshop CC/CS6に対応しています。 Layrs Layrsの機能 Layrsのインストール Layrsの使い方 Layrsの機能 Layrsが備えている機能は、全部で5つ。 制作時に役立つものから、コーダーに渡すために仕上げる時にも役立つものが揃っています。 Layer Name Editor 複数のレイヤーの名前の先頭や末尾に文字を加えたり、置換します。 Remove Unused Effects 使用していないエフェクトを削除します。 Flatten All Layers Effects レイヤーのエフェクトをフラットにし
「いいね！」100超え＆反響の大きかった無料ウェブサービス10選
本連載「ウェブサービスレビュー」がこのたび連載200回を迎えた。足掛け4年にわたり、メジャーなものからマイナーなものまで、さまざまなウェブサービスを紹介してきたことになる。本連載をきっかけに便利なウェブサービスにひとつでも巡り合っていただいていれば、筆者としても喜びに耐えない。 今回は、過去2年、直近およそ100回分の連載の中で取り上げたウェブサービスのうち、Facebookの「いいね！」が100を超えたサービスと、はてなブックマークやTwitterなどでの反響が大きかったサービス、合わせて10個の無料サービスを紹介する。いずれも便利さはお墨付きということで、見逃していたものがあればぜひチェックしてみてほしい。 ◇市販ソフト顔負けの画像編集サービス「Pixlr Editor」 「Pixlr Editor」は、Photoshopのクローンとでも言うべきインターフェースを備えた、多彩な機能を備
Sublime Text2ってエディタがすごくイイ。
Macを使い始めて、いろいろ新しいソフトやアプリを探していたところ、同僚の方からいま人気のSublime Text 2というエディタを教えて頂きました。どうやら無料らしく(今後シェアウェアになるかも？)、初期設定や自分に合った環境に整えるのに少し手間取りましたが、なんとか実務で使えるレベルになってきたのでシェアします。 HTML5,CSS3,jsを書く事が多くて、Zen-CodingもSass+Compassも使うし、それにスマートフォンのマークアップ業務が多い！なんていう僕と同じような人がいるなら、このエディタはオススメですw 以下の設定通りにやれば、フロント寄りのエンジニアになら最低限は使えるものになると思います。 ダウンロード Sublime Text 2 – Dev Builds 初期設定 アプリを立ち上げて、Sublime text2 > Preference > Setting
リアルタイムにCSSを編集してサーバに保存できる「bluePen」:phpspot開発日誌
bluePen Editor | online visual CSS editor ? bluePen Editor リアルタイムにCSSを編集してサーバに保存できる「bluePen」 CSSを編集→サーバにアップ、という作業が通常ですが、このツールであれば、ブラウザ上で呼び出して編集→保存ボタンで即反映、なんていう事が可能になります PHPをサーバに設置してCSSを直接書き換えてしまうという方法で実現されています。WP、Drupalのプラグインの他、独自実装も可能。 ちょっと気が向いた時に編集ができる、というのは開発効率が上がりそうですね。 第三者につかわれてしまわないように注意が必要ではありますが、なかなかおもしろい仕組みです 関連エントリ JavaScriptオフ、CSSをのみで動くツールチップライブラリ「hint.css」
Photoshopの作業効率をアップする便利すぎるエクステンションのまとめ
最後の一つだけ有料ですが、あとは全部無料の便利すぎるPhotoshopのエクステンションを紹介します。 ガイドや角丸の作成もレイヤー管理・パーツ管理も今まで以上に楽になるはず！ ガイド引きの効率アップ -GuideGuide 角丸の作成も修正も簡単にできる -Corner Editor PhotoshopのレイヤースタイルをCSS3にする -CSS3Ps レイヤー周りの機能を強化する -12 Pro Photoshop Time Savers 複数の画像で雑誌風のレイアウトを作成 -Tych Panel よく使うパーツを格納できる -Pixel Dropr ガイド引きの効率アップ -GuideGuide レイアウト用のグリッドを設計したり、エレメントの中心をだしたり、余白を確保するのに便利なエクステンション。 GuideGuide（無料） 対応バージョン Photoshop 2.0.3(f
使ってわずか10分でメインエディタを変えてしまったSublime Text （ST2）がめちゃめちゃ使いやすい件 ｜https://wp.yat-net.com/name
2012年 11月 21日 使ってわずか10分でメインエディタを変えてしまったSublime Text （ST2）がめちゃめちゃ使いやすい件 カテゴリ： PCツール タグ：エディタ 最近流行ってるsublime textというエディタですが僕も試しに使って10分ぐらいでメインエディタにしてしまいました。なんせ使いやすいです。 個人的にショートカットで作業効率がガンガン上がっていくのが非常に嬉しいですね。ちょっとそのあたりを紹介したいなと思います。 1.sublime textとは 2.作業効率を上げる便利なショートカットキー 3.マウス操作との連携で入力を支援 4.カスタマイズで更に便利に！プラグインに関して 5.その他便利な機能 6.参考文献 7.追記 sublime textとは windows,mac,linuxで動作するエディタです。テキストの編集やコーディングを早くするショートカ
「Sublime Text」 完全入門ガイド！
こんにちは～ 仕事が恋人のデザイナー、王です φ(≖ω≖｡)♪。 最近海外でもてはやされまくりのテキストエディタ「Sublime Text」と恋に落ちたことをこの場で告白したい！ やっと出会えたぞ！僕が探し求めていた幻のエディタに！！ 昨今話題沸騰中の「Sublime Text」エディタについて、ご紹介しましょう！本記事を読んで、ぜひとも他のエディタからSublime Textに乗り換えていただきたいです！ 見た目的には、このように、優雅（Sublime）そのもの！ Mac、Windows、Linux 三大プラットフォームで動くのも嬉しいですな！ 公式サイトは下記リンクです。 https://www.sublimetext.com/ それでは、動画やキャプチャーを使ってSublime Textの素晴らしい魅力を伝えていきたいと思います。 Sublime Textのチャームポイント 特色機能
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Sublime Text 2, 3の使いやすいテーマのまとめ
BEITELとは - アウトラインエディタ BEITEL(バイト)