タグ

*javascriptに関するnao550のブックマーク (18)

  • Cheat sheet for moving from jQuery to vanilla JavaScript

  • 絶対つまづかないwebpack入門 - JavaScriptのモジュールバンドラ - ICS MEDIA

    webpack(ウェブパック)とはJSファイルをまとめる高機能なモジュールバンドラー。まとめることでウェブページのHTTPリクエストの数を減らしたり、高度なウェブアプリケーションの開発に役立ちます。 連載ではTypeScriptやBabelなどのES2015+の環境構築、ReactなどのJSライブラリの設定方法を網羅。サンプルファイルで詳しく解説します。 webpackの入門記事は他のサイトにもありますが、対象バージョンが古くて使えなかったりします。検索結果の上位の野良記事を参照にしたら古いバージョンの内容ばかり。解説記事通りにやったのにうまく動かない・・・なんて困った方も多いのではないでしょうか。記事は常に最新版に対応させているので、安心して読み進めてください。 ※記事では2025年5月現在のwebpack 5(2020年10月リリース)以上で解説しています。 記事で解説しているこ

    絶対つまづかないwebpack入門 - JavaScriptのモジュールバンドラ - ICS MEDIA
  • MathJax Sublime Text Markdown

    Consultancy MathJax is highly flexible and can be tailored to the needs of your institution by creating customized configurations and specialized software workflows. Content Transformation MathJax can help you with the conversion of math documents from legacy sources and print content as well as with the generation of novel content that is online ready and fully accessible for readers with special

    nao550
    nao550 2017/07/05
    javascriptで数式表現ができるライブラリ
  • JavaScriptで数値を桁区切り (カンマ区切り) にする方法

    1000 100000 1000000 のような数値に対して、 1,000 100,000 1,000,000 のように、3桁ごとにカンマを挿入する方法を解説します。 正規表現による方法 数値を文字列に変換し、正規表現で置換します。 var num = 1234; String( num ).replace( /(\d)(?=(\d\d\d)+(?!\d))/g, '$1,' ); // 1,234 Perlなどの後読みをサポートする正規表現ならば、 String( num ).replace( /(?<=\d)(?=(\d\d\d)+(?!\d))/g, ',' ); のようにも書けるのですが、JavaScriptは後読みをサポートしないため、前述のようにする必要があります。 whileループによる方法 whileループで置換をくり返す方法もあります。しかしグローバルマッチの置換で処理で

  • 超簡単!カレンダーから日付入力する方法:jQuery ui Datepicker

    2015.02.23 超簡単!カレンダーから日付入力する方法:jQuery ui Datepicker ツイート シェアする 共有する はてブ Pocket あなたのサイトの入力フォームは、日付入力が難しくなっていませんか?希望発送日時や納品日など日付に関する入力は意外と手間がかかるので、入力しやすいよう改善しましょう!フォームのユーザビリティ(使い勝手)は入力完了率やコンバージョン率に大きく影響からです。 ではどうすれば日付入力が簡単になるのでしょうか?答えは「カレンダー」を使用して日付入力をしてもらうのです。普段から見慣れているカレンダーを使用することで、直感的に日付を確認することができ、また1クリックするだけで選択出来ます。今回は「jQuery ui Datepicker」を使用して、カレンダーを簡単に実装する方法をご紹介します! ▼サンプルページ jQuery-ui-datepic

    超簡単!カレンダーから日付入力する方法:jQuery ui Datepicker
  • 【jsで作ってみよう!】続々:javascriptを勉強して恐怖感を取り除こう!~タイピングゲーム作ってみる編~ - Qiita

    ##概略 効能:実際にそれっぽいことができるようになる。 対象:JavaScriptがわかってきたけど、実際に作るとなると一体何をすればっ!という方。 注意:この記事は非常に長くなります。 初めまして || こんばんわ。 僕の務めている会社で採用イベントが有りまして、僕もそれに参加しました。 そこで短時間でなんか作ろうというハッカソンイベントを学生に混ざってJsを使ってタイピングゲームのようなものを作りましたので、せっかくなのでこの場をお借りしてご紹介を。 5ヶ月前は僕も学生でした。懐かしい。 前回のレシピはこちらになります。 出来栄えは少々悪いですが、お口に合えば幸いです。 javascriptを勉強して恐怖感を取り除こう! 続:javascriptを勉強して恐怖感を取り除こう!~外部化編~ ##まずは完成品はこちら。 こんなの作りました。 シンプルですねヽ(´エ`)ノ 実際やってみまし

    【jsで作ってみよう!】続々:javascriptを勉強して恐怖感を取り除こう!~タイピングゲーム作ってみる編~ - Qiita
    nao550
    nao550 2016/09/07
    JSでタイピングゲームを作る
  • Google JavaScript Style Guide 和訳 — Google JavaScript Style Guide 和訳 v0.1 documentation

    この和訳について¶ この文章は Google JavaScript Style Guide を非公式に和訳したものです. 内容の正確性は保証しません. ライセンスは原文と同じく CC-By 3.0 とします. フィードバックは Issue への登録 , あるいは Kosei Moriyama (@cou929 または cou929 at gmail.com) へ直接お願いします. この和訳のリポジトリは こちら です.

  • SPA Single Page Applicationを作る際のエトセトラ(入門的な取っ掛かり情報) - Qiita

    SPA(Single Page Application)を実現する技術は、昔だとFlash, さらに昔であればJavaアプレットやActiveX?とかもありそうだけど、まぁー、今ならJavaScriptでゴリゴリという感じなのかな... HTML5とか、CSS3なんかもわかっていないといけなさそうな... ということで、このエントリーでは、最近のトレンドを追いつつ、技術要素の下調べをして、採用する技術の目星をつけたいと考えています。 関連する書籍も、最近の技術を踏まえたものが幾つか出版されている模様 シングルページWebアプリケーション ―Node.js、MongoDBを活用したJavaScript SPA AngularJSリファレンス 直接は関係ないけれど、CSS周りの最近の考え方は押さえておきたい... 7,8年前のウェブ標準が流行っていた時に、かなり深堀して理解に努めたけど、HTM

    SPA Single Page Applicationを作る際のエトセトラ(入門的な取っ掛かり情報) - Qiita
  • What Are Chrome Apps?  |  Chrome for Developers

    Chrome Apps let you use HTML5, CSS, and JavaScript to deliver an experience comparable to a native application. Why build a Chrome App? By building a Chrome App, as opposed to going with a traditional web app or a native mobile app, you expand your potential audience and extend your development capability. Expand your potential audience When you write a Chrome App, as opposed to an app that runs n

  • クライアントからサーバに要求を出してみる

    ホーム < ゲームつくろー! < IKD備忘録 サーバ クライアントからサーバに要求を出してみる ここまでで、LAMP構成のゲームサーバは立てました。ローカルPCのブラウザから特定のURL(PHPファイルへのアドレス)を打ち込んでWebサーバ(apache)へ送信、apacheが解釈してPHPを動かし、ついでにMySQLから情報を拾って、HTMLを動的に作ってローカルPCに送信するのも出来ました。しかし、現状で出来ているのはクライアントの立場で言えば「新しいページを見せて下さい」という要求だけです。いつものホームページを閲覧するのと変わりません。つまり、ゲームサーバの「ゲーム」の所はまだ未開拓な訳です。 ゲームサーバと言うからには、ブラウザに開いたゲームクライアント上から非同期で何かサーバに要求を出して、それを受けて何らかのレスポンスを返す機能が必要です。これを実現するには、①クライアント

    クライアントからサーバに要求を出してみる
  • JavaScript初級者から中級者になろう — uhyohyo.net

    このページの最終更新日:2019年7月4日 JavaScript。主にWebページを作るのに使われるほか、現在ではさまざまなところで活躍しているプログラミング言語です。 このページはJavaScriptの中級講座です。最新鋭ではないかもしれませんが、読み進めれば大抵のものを自分で作れるようになることでしょう。 言い訳とJavaScript歴史 / 問い合わせ 最近の更新2017/10/05 全ページを手直ししました。十六章第六回を追加。2017/11/9 十六章第二十一回・十六章第二十二回を追加。2017/12/2 十七章第三回・十七章第四回を追加。2017/12/3 十七章第五回・十七章第六回・十七章第七回を追加。概要コンテンツは第一篇と第二篇に分かれています。 JavaScriptは昔からWebページに動きを与えるものとして用いられてきましたが、第一篇ではそのような、昔からあるJav

    JavaScript初級者から中級者になろう — uhyohyo.net
  • JavaScriptのコードエディタ「ACE 1.0」登場

    Cloud9 IDEの開発チームは17日(米国時間)、組み込み可能なコードエディタ「ACE 1.0」を公開した。ACEはJavaScriptで開発されているオープンソースのコードエディタ。JavaScriptで記述されているため、任意のWebページやJavaScriptアプリケーションなどに埋め込み可能で、Webブラウザで利用することができる。 ACE 1.0の主な特徴は次のとおり。 Vi及びEmacsキーバイドの採用 400万行のコード編集が可能 20以上のテーマをサポート 40言語以上のシンタックスハイライトに対応 自動インデント/アウトデント JavaScript/CoffeeScript/CSS/XQueryのライブシンタックスチェック 正規表現での検索及び置換 ACEはこれまでMPL/LGPL/GPLのトリプルライセンスを採用していたが、ACE 1.0の公開に合わせてBSDスタイ

  • JavaScriptテストの基礎知識と使えるフレームワーク6選

    JavaScriptテストの基礎知識と使えるフレームワーク6選:フレームワークで実践! JavaScriptテスト入門(1)(1/3 ページ) しっかりとJavaScriptの“テスト”を行うために、最近のJavaScript事情やテストを取り巻く環境、今注目のテストフレームワークを6つ紹介する JavaScriptでもテストを書こう @ITの読者の方たちのほとんどは、どのような言語を主に利用しているのかなどの違いはあるにせよ、日常的にプログラムを書いている方たちが多いかと思います。 アプリケーションを作る、ライブラリを作成する、オープンソースプロジェクトに貢献するなど、皆さんがプログラムを書く場面はそれぞれいくつかあるはずです。それらプログラムを書く場面に共通して大切な習慣の1つとして、「作成するプログラムに対しては必ずテストコードを書く」ことがあるのは、誰にでも同意してもらえることでし

    JavaScriptテストの基礎知識と使えるフレームワーク6選
  • サービス終了のお知らせ - NAVER まとめ

    サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。

  • How To Enable HTML5 In Chrome | Robots.net

    Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp

    How To Enable HTML5 In Chrome | Robots.net
  • Webデザイナーのためのjquery入門2(前編)

    82 views jQueryの社内勉強会用スライドです。だいたい1時間で終われるように、前編・後編に分けています。 後編は6月以降で公開を予定しています。 More… jQueryの社内勉強会用スライドです。だいたい1時間で終われるように、前編・後編に分けています。 後編は6月以降で公開を予定しています。 このスライドを作るにあたって、書籍「WebデザイナーのためのjQuery入門」をかなり参考にしています。 Webデザイナーのためのjquery入門2(前編) — Presentation Transcript Webデザイナーのための jQuery入門  -覚醒編(前編) -jQueryのコードを自分で考えて書けるようになろう! 目標 日々の業務にjQueryを取り入れて、 自分で何かを作れるようになる。 大まかな内容1. 何かを取ってくる 2. それに何かをする3. まとめ  1

  • 開発者が語る、Google+で使ったJavaScriptテクニック

    Google+チームに所属するエンジニアのMark Knichel氏が、Google+の高速性を実現するためにどのようなテクニックを使ったのかについて、Google+のページで解説しています。 (1) Mark Knichel - Google+ - Hi everyone! I’m an engineer on the Google+ infrastructure… 最新のWebサービスでどのようなJavaScriptのテクニックが使われているのかを垣間見ることができる説明になっていますので、見出しを中心に紹介しましょう。 1) We <3 Closure 私たちはClosureが大好きだ(<3は横向きのハートマーク) Closure(クロージャ)とは、オライリーの書籍「初めてのJavaScript」の解説を借りれば、関数の「入れ子(nesting)」です。(追記、このクロージャじゃなく

    開発者が語る、Google+で使ったJavaScriptテクニック
  • 魅力的なウェブサイトを作成するために知っておくと便利な9つのスクリプト - GIGAZINE

    個人的なウェブサイト作成や仕事としてウェブサイトを作成している人だけでなく、何かのサイトを発注して作ってもらう際などにこういうのを知っておくと、かなりはっきりと具体的なイメージを相手に伝えやすくなるので、スムーズにコミュニケーションできるはずです。あるいはクライアントにこれらのリソースの存在を認知してもらうことで、話が進めやすくなるかもしれません。 というわけで、魅力的なウェブサイトを作成するために知っておくと便利な無料の各種スクリプトは以下から。 Woork: Useful resources and tutorials for developing stunning web sites 1. ModalBox http://www.wildbit.com/labs/modalbox/ Web2.0スタイルのダイアログボックスなどを表示させることができます。Mac OS Xのダイアログボ

    魅力的なウェブサイトを作成するために知っておくと便利な9つのスクリプト - GIGAZINE
  • 1