ざっくりとこんな認識で問題ないかと思います。 書きながらなんとなくつかめていきたいと思います。 いざ開発開始！ というわけでそろそろ開発に移りたいと思います。 新しいPENを作成する codepenでは一つ一つのプロジェクトをpenと呼びます。 それを作っていきましょう。 をクリックして新しいPENを作ります。 (この記事の画像をクリックしても作成できます) 新しいPENに名前をつける 画面左上の「Untitled」の隣のアイコンをクリックして名前をつけます。 一度保存する ここで一度保存します。 このボタンをクリックして保存します。 と表示されたら自動保存が有効になっているので次からあまり気にしなくて済みますね。 文字を表示する とりあえず一番無難な文字の表示を行いたいと思います。 ただし、文字と言っても何種類もあるのでそれぞれ試していきたいと思います。 pタグ pタグは段落を示します。
ブラウザ上で、手軽にWebプログラミングを書いて実行できるコードエディタ「CodePen」をご存知の方は多いと思います。 使えば使うほど、このサービスが多機能であることに気付くわけですが、特に便利だと感じるちょっとマニアックな使い方だけをピックアップしてみました。 一応、公式のドキュメントには書いてあるのですが、「翻訳が面倒な人」や「そもそも知らない」…という人に向けて紹介しておきます。 「ソースコード」のホスティング機能！ 「CodePen」では、簡単に「HTML/CSS/JavaScript」を書いて「実行＆保存」できますが、書いたコードはどこからでも参照することができます。 例えば、何かコードを書いて保存すると専用の「プロジェクトURL」が自動的に発行されます。 このURLの末尾に、「.js」「.css」「.html」と追記するだけで参照できるようになります。 JavaScriptフ
CodePen 普段は愚直にHTMLやCSS、Javascriptを書いているわけですが、できることならもっとモダンな開発環境に慣れたいと思ってます。 しかし、習得コストというものはあるわけで……もっと、気軽に手を出せたらいいなーと思っていたところ、Web上でHTML+CSS+Javascript使って作品を作成できるCodePenでCoffeeScriptなどが使えること知りました（遅い） Githubのアカウントで利用できるので、興味あるかたは学習用に使ってみてはいかがでしょう。 CodePenエディタ画面 HTML編集タブ HTML以外の、Haml,Markdown,Slimなどのテンプレート言語使ってコードを記述できます。 CSS編集タブ LESS,SCSS,SassなどのCSSメタ言語を利用できます。 Javascript編集タブ CoffeeScriptが使えます。他、著名なラ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く