node.js - Node.js/JavaScript入門
概要 node.jsの基本 node.js node.jsのインストール node node.jsのHello world node.jsで外部ファイルのJavaScriptを呼び出す node.jsパッケージ管理ツールnpmの使い方 node.js foreverによるデーモン化 node.jsにおけるワンライナーの使い方 モジュールの作り方 node.jsでオブジェクトをexportする方法 node.jsで関数をexportする方法 node.jsでオブジェクトをexportする方法 node.jsで関数をexportする方法 node.jsとブラウザでコードを共有する方法 ファイルI/O node.jsでファイルを読む node.jsでファイルを書く HTTPサーバ/HTTPSサーバ node.jsによるHTTPサーバの作り方 node.jsによるHTTPSサーバの作り方 node
2022年副業におすすめのプログラミング言語TypeScriptとは？ | 財経新聞
プログラミングの副業を始める際には、需要の多さで言語を選択するのもひとつの判断である。中でも、2022年におすすめなのがTypeScriptだ。本記事では、副業にも最適なプログラミング言語TypeScriptについて紹介する。 【こちらも】プログラミングの副業 高単価案件を獲得する方法とは? ■TypeScriptを扱える副業人材は2021年度人気NO.1 TypeScriptとは、Windowsで知られるMicrosoftが開発したプログラミング言語である。2012年頃に登場したTypeScriptはまだ新しい言語だが、2017年にはGoogleの標準開発言語に採用されている。こうした背景から、TypeScriptはプログラマーからの関心も高く、世界中で普及する可能性が高い。 16日、overflowが運営する「Offersデジタル人材総研」は、デジタル人材副業・複業採用決定数レポートを
チュートリアル：React の導入 – React
この記事は古くなっており、今後更新されません。新しい React 日本語ドキュメントである ja.react.dev をご利用ください。 新しくなったチュートリアルでは最新の React の使い方がライブサンプル付きで学べます。 このチュートリアルは React の事前知識ゼロでも読み進められます。 チュートリアルを始める前に このチュートリアルでは小さなゲームを作成します。自分はゲームを作りたいのではないから、と飛ばしたくなるかもしれませんが、是非目を通してみてください。このチュートリアルで学ぶ技法はどのような React のアプリにおいても基本的なものであり、マスターすることで React への深い理解が得られます。 ヒント このチュートリアルは実際に手を動かして学びたい人向けに構成されています。コンセプトを順番に学んでいきたい人は一段階ずつ学べるガイドを参照してください。このチュート
insertAfter()メソッド →Nodeインタフェースに追加する - fisherの日記
W3C DOMではinsertBefore()は用意されているが、 insertAfter() が用意されていないみたい... 自分でmethodを作るなら、↓を参考〜〜 /** NodeインタフェースにinsertAfter()メソッドを追加 */ Node.prototype.insertAfter = function(node, referenceNode) { this.insertBefore(node, referenceNode.nextSibling); }; /** 使用例 */ /* 追加するノードを作成 */ var insertNode = document.createElement('li'); insertNode.textContent = '新しく追加された要素。'+(new Date()); insertNode.style.color = '#ff0
クロージャ - JavaScript | MDN
function init() { var name = "Mozilla"; // name は、init が作成するローカル変数 function displayName() { // displayName() は内部に閉じた関数 console.log(name); // 親関数で宣言された変数を使用 } displayName(); } init(); init() 関数はローカル変数 name を作成し、それから関数 displayName() を定義しています。displayName() は init() の中で定義されている内部関数で、その関数本体の内部でしか利用できません。displayName() 自体はローカル変数を持っていませんが、外側の関数で宣言された変数にアクセスできるので、displayName() では親関数 init() で宣言された変数 name を使用
今更だけどretina対応を考えてみた[簡単]
そろそろiPadminiのretina対応が発表されて意識の高い気分の人たちが、「うむ、やはり時代はretinaだな」とか言うんじゃないかと睨んでます。 PC版であまりretinaディスプレイを意識して作った事はないのですが、スマホは別ですね。 まだまだ通信量を下げておきたいところなので、コーディグ前にどのように画像を切り出すかが悩ましいところです。 高解像度用の画像に対応させる方法 1.読み込ませる画像の大きさを半分にする。 メリット：簡単 デメリット：画像修正の時はHTMLも触らないといけない場合がある。（管理がしにくい） 2.JavaScriptライブラリを使う（今回はRetina.js） メリット：高解像度用の画像を用意するだけで、勝手に読みこんでくれる（管理しやすい） デメリット：読み込む画像の数が増えるので、通信量が増える。 3.Media Queriesを使って高解像度用のデ
![今更だけどretina対応を考えてみた[簡単]](https://cdn-ak-scissors.b.st-hatena.com/image/square/5c2d915aad5d9cf326a23609f76e3bd321549b28/height=288;version=1;width=512/https%3A%2F%2Fblog.cntlog.net%2Fwordpress%2Fwp-content%2Fuploads%2Fcropped-01.jpg)
イベントハンドラの this と event.target, +α - hogehoge @teramako
[JavaScript]for 内でイベントリスナとか登録するときにやっちゃいがちな間違い. とその対処法を３つほど. | TM Life 対応その２: event.targetを使う と 対応その４ : this を使う について 上記サイトで書いてあることが間違っているというわけじゃないんだけど、少し補足したい。 event.target その Event オブジェクトには発火元となった要素を target プロパティとして保持しています. 合っています。 が、on* や addEventListener した要素と target は必ずしも一致しない点には注意した方が良いと思います。 <ul id="list"> <li>foo <b>hoge</b></li> <li>bar <b>hoge</b></li> </ul> var list = document.getElement
PCjs Machines
Welcome to PCjs PCjs uses JavaScript to emulate a small collection of hardware and software that I grew up with in the 1970s and 1980s, allowing you to experience their slow CPUs, low-resolution displays, and primitive sound effects, all in the comfort and safety of your desktop or mobile web browser. Over time, PCjs emulations have expanded to include selected IBM PC Compatibles and more classic
UIデザイナー募集で困ってること | F's Garage
トレタCOOのkengochi氏がUIデザイナーについての記事を書いてた。 UIデザインの価値 | Parallelminds BASEでも、ずっとこの辺の職種も募集していて、来月１人入るんだけど、実はUIデザイナーの募集はすごく困っている。 というのも、今、BASEでほしいUIデザイナーとは、 ・いわゆるWebデザイナーではないし、 ・いわゆるフロントエンドエンジニア（JavaScript実装特化型）の人でもない。 というところ。まさしくkengochi氏が書いてる「のりしろ」重要 じゃぁコアスキルって何？ってのを、経験者採用の理想を言えば、 １．D.A.ノーマンの本ぐらいは読んだことがあって、ユーザインターフェースを意識しながらユーザビリティの高い設計ができて ２．ビジュアルデザインのスキルもあって、カッコいサイト、サービスが作れて、 ３．ちゃんとユーザーさんのことを意識できて（つまり
Redmineのカスタムテーマの作成 - Redmineガイド
新しいテーマの作成 public/themes 以下にディレクトリを作成してください。ディレクトリ名はテーマの名称として使用されます。 例: public/themes/my_theme 独自の application.css を作成し、サブディレクトリ stylesheets 以下に保存してください: public/themes/my_theme/stylesheets/application.css 以下はデフォルトのスタイル定義の一部を上書きする例です: /* load the default Redmine stylesheet */ @import url(../../../stylesheets/application.css); /* add a logo in the header */ #header { background: #507AAA url(../images
)
付録 B : 自動プロキシ構成スクリプトの例
The following ten scripts provide JavaScript or Microsoft® JScript® examples of automatic proxy configuration (.pac) files. As described in Using Automatic Configuration, Automatic Proxy, and Automatic Detection, you can use a .pac file to configure proxies automatically, based on URL requests from your users' browsers. Each script consists of a function FindProxyForURL(<url>, <host*>), where <url
書籍「気づけばプロ並みPHP」にリモートスクリプト実行の脆弱性
書籍「気づけばプロ並みPHP」のサンプルスクリプトにリモートスクリプト実行の脆弱性があるので報告します。 はじめに Yahoo!知恵袋の質問を読んでいたら、以下の質問がありました。 気づけばプロ並みPHP （著）谷藤賢一 （発行）リックテレコムP１１２の画像をアップロードする機能でエラーがでます。 http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q11119835496 より引用 質問に対しては回答が既についてクローズされていましたが、引用されているソースを見て任意のファイルを任意のファイル名で、Web公開ディレクトリにアップロードできることに気づきました（下記）。 <?php // 略 $pro_gazou=$_FILES['gazou']; // 略 if($pro_gazou['size']>0) { if ($pro_
Leaflet — an open-source JavaScript library for interactive maps
an open-source JavaScript library for mobile-friendly interactive maps Leaflet is the leading open-source JavaScript library for mobile-friendly interactive maps. Weighing just about 42 KB of JS, it has all the mapping features most developers ever need. Leaflet is designed with simplicity, performance and usability in mind. It works efficiently across all major desktop and mobile platforms, can b
いやなブログ: 配列操作の比較表: Ruby, Python, JavaScript, Perl, C++
配列操作の比較表: Ruby, Python, JavaScript, Perl, C++ プログラムを書いていると、他のプログラミング言語の記憶とごっちゃになって、「配列の後ろに要素を追加するのは push だっけ、 append だっけ」などと混乱することがあります。特に Ruby, Python, JavaScript はコードの書き方が似ているので、この問題が起きがちです。 そこで、備忘録として、 Ruby, Python, JavaScript, Perl, C++ の配列操作の比較表を作りました。一番慣れている Ruby を基準にしています。間違いなどがあったらご指摘いただけると助かります。他の言語のもあるといいなあ。 Ruby (Array) Python (list) JavaScript (Array) Perl (@) C++ (std::vector)
JavaScriptで型が書けるDSLを提供するdeftypes.js作った - mizchi log
こじらせJavaScriptシリーズです。 mizchi/deftypes.js https://github.com/mizchi/deftypes.js 主にcoffee-script用のDSLです。以下すべてcoffee。 ブラウザ <script src="https://raw.github.com/mizchi/deftypes.js/master/deftypes.js"></script> Deftypes(); //provide DSLNode npm install deftypes 概要 型が書けます。残念ながら動的チェックです。 Point = {x: Number, y: Number} p1 = def Point, {x:1, y:2} #=> {x: 1, y:2} p2 = def Point, {x:1, z:2} #=> type error def
CSS3を使わずjQueryで、テキストボックスの初期値の文字をフォーカスした時に消えるようにするやり方（IEもいけるよ！）
jQuery 完成サンプルです 試しにクリックしたり、文字を入れてみてください。入力しようとすると、ちゃんと文字が消えて空っぽになります。 また、元々の文字は薄いグレーなのに、入力するときには濃い色の文字になってます。 何をどうしているのか まずはテキストボックスの初期値です。初めからテキストボックスに文字を入れておくには value を使います。 [html] <ul> <li><input type="text" value="ユーザー名" /></li> <li><input type="text" value="メールアドレス" /></li> </ul> [/html] そしてこのままだと、他の文字と同じように 濃い色の文字色のままです。とりあえずCSSでうすくしておきます。 [css] input[type="text"] { color: #ccc; } [/css] これで
jQuery を使ってHTMLタグをエスケープする
Javascript ネタです。 ユーザーがテキストボックスに入力した文字を、そのままその画面上に表示するような処理を、Javascriptで作成する際に、エスケープする処理が必要な場合があります。 AJAX でサーバー側から取得した値を表示する場合もそうですね。 今回は、そんなときのエスケープする処理を jQuery を使ってプラグイン形式で紹介したいと思います。 そもそもなぜエスケープする必要があるのか？ 知ってる人は知ってると思いますが、そもそもなぜエスケープする必要があるのか？というところから説明します。 PHPやPerlなどのプログラムを勉強された方はよく知ってると思いますが、ユーザーがテキストボックスに入力した文字をそのまま表示する場合、もしその中にHTMLタグが入っていたとします。 そうすると、（あたりまえですが）ブラウザはその文字をちゃんとしたHTMLタグだと認識してしまう
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://b.hatena.ne.jp/js/Hatena/Bookmark/LetLoader.js?v=1.0
https://www.hatena.ne.jp/js/Ten/Ten.js
rsyncの使い方（オプション SSH） - omnioo lab. record | オムニオ・ラボ 画家とハッカー