Tutorial: Tic-Tac-Toe – React
You will build a small tic-tac-toe game during this tutorial. This tutorial does not assume any existing React knowledge. The techniques you’ll learn in the tutorial are fundamental to building any React app, and fully understanding it will give you a deep understanding of React. This tutorial is designed for people who prefer to learn by doing and want to quickly try making something tangible. If
Googleが推薦するHTMLとCSSのコーディング方法
2012年7月12日のGoogle ウェブマスター向け公式ブログの記事「HTML と CSS のコーディングガイドライン」で紹介されていた「Google HTML/CSS Style Guide」に書いてあるコーディング方法と感想を紹介します。 Google HTML/CSS Style Guideの日本語翻訳 Google HTML/CSS Style Guideは英語なのでGoogle Chromeで翻訳して確認していたんですが、すでに翻訳してあるサイトがあったのでこちらも参考に両方を見て確認していきました。 Google HTML/CSS Style Guideを翻訳してある記事「Google HTML/CSS Style Guide」を適当に和訳してみたは、かなり助かり参考になりました。 それではGoogle HTML/CSS Style Guideに書いてあるHTMLとCSSのコ
HTML講座（フレーム）
この章では、フレーム操作をおこないます。 フレームは、フレーム内に表示する複数のファイルと、フレーム操作をおこなうことを記述するファイルを用意する必要があります。今までに作成した、「welcome.html」と「greeting.html」をフレーム内に表示させてみましょう。 1.フレーム操作をおこなうファイルを作成する。 メモ帳で新しいHTML文書を作成し、「frame.html」という名前で保存します。 ■ HTMLの記述 「frame.html」 <html> <head> <title>CyberLibrarianトップページ</title> </head> <frameset rows="30%,*"> <frame src="welcome.html"> <frame src="greeting.html"> </frameset> </html>
float段組の基本
簡単なfloatの段組練習です。慣れて来たら、いろいろ応用してみて下さい。 注）floatを指定する場合はwidth指定で幅を指定するように心掛けましょう！ ボックスを並べる boxAとboxBを左右に並べます。形式上boxの幅と高さを指定しています。（本来の段組では、高さを指定する事はあまりありません。） パターン１ float:left;を指定してboxBを回り込ませます。 #boxA { width:200px;height:100px;float:left; } #boxB { width:200px;height:100px;float:left; } パターン２ boxAにfloat:left;を指定、boxBにfloat:right;を指定。 #boxA { width:200px;height:100px;float:left; } #boxB { width:200px;
今どきのJava Webフレームワークってどうなってるの？ - きしだのHatena
昨日のSeasar2のエントリについたコメントなどで、「とはいえ代わりに何つかうの？」みたいな話が出てたので、とりあえずJava EEのWebフレームワークについて簡単にまとめてみます。 Java SE 8+Java EE 7+lombokで書いていますが、基本的なところはJava SE 7+Java EE 6でも大丈夫です。 なので、今どきとは書いてますが、基本的には2009年12月のJava EE 6ということで、実はすでに4年近くたってます。 何も考えてない なんも難しいこと考えないなら、やっぱJSPが楽ですよね。 なんでも書けちゃう。 <%@page contentType="text/html" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content=
いまさらですが、増井雄一郎さんのメモ帳サービス「wri.pe」がすごい件 #HTML5 #プログラミング #wri.pe #markdown - CodeIQ Blog
CodeIQ中の人、babaQです。 ちょっと前になるのですが、コワーキングスペース茅場町 Co-Edo（コエド） で開催されたmasuidriveこと増井雄一郎さんのトークセッションに参加してきました。 HTML5を活用したメモ帳アプリ「wri.pe」誕生のきっかけ テーマは、増井さんが個人でつくった（とは思えない）メモ帳アプリ「wri.pe」 ゴールデンウィークを利用して、何かゴリゴリと作りたいと思い立ち、 1週間で「自分で使いたいものを作る！」と決めたのがきっかけなんだとか。 まず、浮かんだアイデアは2つ。 煩雑なメモをどうにかできるアプリと、未読のチャットを整理できるアプリ。 でも、1週間で開発するにはチャットはちょっと重い… ということで、メモアプリを作ることに決定。 まず最初に「メモアプリの課題」を整理したそうです。 - いつでも、どこでも使える（iPhone、iPadでも）
ヘッダは上部固定で、フッタは最下部にするスタイルシート、レスポンシブにも対応！ | コリス
ナビゲーションを配置したヘッダはスクロールしても常に上部に固定されており、フッタはコンテンツの量が少なくても最下部に配置されるページを実装するスタイルシートを紹介します。 Sticky footer with fixed navbar コンテンツが少なくてもフッタは最下部に、レスポンシブ対応で！ デモ Bootstrapに素晴らしいデモがあったので、そこからデモを紹介します。 デモでは、ナビゲーションがあるヘッダはスクロールしても常に上部に固定されています。 デモのコンテンツ量が少ないため、狭い表示エリアで。 デモページ：幅780pxで表示 実装 実装はデモを必要最小限にしたもので、紹介します。 HTML 上からナビゲーションのあるヘッダ、コンテンツ、フッタの順で、ヘッダとコンテンツはdivで内包し、終わりにコンテンツ量が少ない時用にpushのdivを配置します。 <body> <div
クリエイター向け、まとめのまとめ / Maka-Veli .com
機械的でごめんない。サイト名は割愛させていただきます。掲載内容・順番に深い意味は特にありません。 お金もらって書いて、とかそういうのでも無いっす。 デザイン / 参考 【クリエイター必見】創作意欲が湧くデザイン 参考になるWebデザインリンク集まとめ Webデザイナーなら押さえておきたい、今月の優れたWebデザイン（2012年7月）まとめ11個 ハイクオリティな最近のパララックスWebデザインまとめ13個 ポートフォリオ作ろうぜ！参考サイト、リンクまとめ9つ 『さすがデザイナー…！』と思わされるクリエイティブな名刺デザイン集 配色のセンスをゼロから習得するために役立つスライドまとめ5つ GIFアニメを効果的に使ったサイトまとめ4つ ここまでするのか！アイデア満載の採用サイト おしゃれでかわいいポスターデザイン集 【デザイン】面白いアイディアの広告ギャラリーまとめ HTML5で書かれたス
HTTP クライアントを作ってみよう(5) - Basic 認証編 -
Basic 認証において、ユーザ名とパスワードを送信する方法を説明します。 まずユーザ名とパスワードをコロンで結合します。 もしユーザ名「hoge」、パスワード「fuga」の場合、「hoge:fuga」という文字列を作るわけです。 それを BASE64 でエンコードします。 「hoge:fuga」を BASE64 エンコードすると「aG9nZTpmdWdh」となります。 UNIX のコマンドでは、以下のようにして確認できます。 % echo -n 'hoge:fuga' | base64 -e % echo -n 'hoge:fuga' | openssl enc -e -base64 % echo -n 'hoge:fuga' | nkf -MB % echo -n 'hoge:fuga' | perl -MMIME::Base64 -ne 'print encode_base64($_
telnetでブラウズ(HTTP)
このページでは、インターネットでホームページなどをブラウジングするときに利用するHTTPプロトコルについて説明しています。 概要 HTTPプロトコルとは、Hypertext Transfer Protocolの略で、インターネットでホームページなどをブラウジングするときに利用しているプロトコルです。 HTTPプロトコルは、TCP/IP上のプロトコルで、通常80番ポートを使ってアクセスします。 詳細な定義は、以下のRFCで定義されています。 RFC-1945 HTTP/1.0 RFC-2068 HTTP/1.1 基本的に、メッセージを要求(リクエスト)し、その応答結果(レスポンス)を表示するだけです。 HTTPのアクセスログ ApacheなどのWebサーバのログを見ると、リクエストとレスポンスが、以下の形式で出力されます。 アクセスログの書式 アクセス元 - - [アクセス時間] "メソッド
初心者さんのためのWebサイト制作に役立つリンク集
2017年6月29日 Webサイト制作 「Webサイト勉強するのにおすすめのサイトを教えてください！」との声が多いのですが、日本のWeb関連チュートリアルサイトをあまり見たことがなかったので、今までおすすめできませんでした…。ということでちょっとググって初心者さんによさそうなサイトをいくつか紹介します。小難しい単語が並んであるようなサイトは避けているつもりですが、わかりにくかったらすみません。他にもおすすめサイトがあればぜひコメント欄にて教えてください！ ↑私が10年以上利用している会計ソフト！ Webサイトを作る流れ まずはWebサイトを作る目的を考える 誰のため？何のため？Webサイトを作り始める前に。 サイトマップと呼ばれる構成図を作成 Webサイトの構成図を簡単に作れる便利ツール ワイヤーフレーム（Webサイトのレイアウト）を作成 Webサイトの骨組み: ワイヤーフレームを素早く・
swf、flv(Flash)などのHTML埋め込みタグをカンタンに発行できる「FreeVideoCoding」
About RSSで購読する swfやflvなどのファイルをHTMLに埋め込むタグは検索すれば出てくるようなものですが、たまにやろうとするときにサクッとタグを生成して埋め込めるのが良いですよね。 そんなときに役立ちそうな便利WEBツールをご紹介。 ※3月9日追記：WMVファイルの埋め込みタグはFirefoxで再生できないものになっているのでそれ以外のファイルでご利用ください。 momdoさん ご指摘ありがとうございます。確認不足で申し訳ございませんm (_ _)m ※8月16日追記：Firefoxがバージョンアップしたことで再生可能になったようです。coffeeさん、教えていただいてありがとうございます。 組織のマインドマップツールをマインドマイスターにすべき理由 伸びてる産業、会社、事業を紹介しまくるStrainerのニュースレターに登録!! FLVやSWFファイルの埋め込みタグをサクッ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
パパ活アプリ・サイトおすすめ人気ランキングをP活女子に取材❤️【安全・初心者向け】