タグ

JavaScriptに関するshowyouのブックマーク (19)

  • Line

    showyou
    showyou 2019/03/20
    あとで動かしてみる
  • 【保存版】言語別Youtubeおすすめチャンネル

    💡新記事の紹介 言語学習から一歩先に進んだ記事書きました →【保存版】個人開発の進め方 -全5ステップ- 良ければ見てみて下さい! はじめに 0からプログラミングが学べるおすすめのチャンネルまとめてみました。 IDEのショートカットやリファクタリングも学べます。 コメントを頂いたので、記事にしようと思いました。 → 新卒, Webサービスを作ってみた話 ---絶対に手を動かしながら、やってください!--- 動画を進めては止めて進めては止めて、です。 3倍以上時間はかかりますが、、 ディアルディスプレイ推奨です。 Android Android Instagram Clone App インスタグラム似のアプリを作ります。 1動画は短いのですが、100の超超大作です。 中盤くらいから勝手に手が動くようになります。 動画と同じくらいのスピードでコーディングできるようになるので、ある意味すごく

    【保存版】言語別Youtubeおすすめチャンネル
  • フロント未学習の大学生が1週間でVue.jsを使ったポートフォリオを作った話

    ポートフォリオサイト作りました Naoki Kishi's Portfolio Site Topページ Skillページ 今までPythonやCばかり書いていてフロントエンド技術を学んだことがなかったので、勉強を兼ねてポートフォリオサイトを作成しました。 レスポンシブ対応やSPA対応など初めてのことばかりでしたが、なんとか1週間で完成まで持っていくことができました。 この記事では完成までの道のりを時系列に沿って書いていきたいと思います。 動機 今回ポートフォリオの作ろうと思ったのは、エンジニアとして学生バイトやインターンに行きたいなと思ったからです。 今まで大したことをやってきていない僕にとって、エンジニアとして働きたいなら、何かしらアピールできるものが必要だと思いました。ポートフォリオサイトであれば、新しい知識を学べるのに加えて、自分のアピールにもつながると考えました。 ぜひ京都で学生

    フロント未学習の大学生が1週間でVue.jsを使ったポートフォリオを作った話
  • PWA入門!JavaScriptで簡単に高速化&オフライン対応のWebサイト制作チュートリアル! - paiza times

    どうも、まさとらん(@0310lan)です! 今回は、基的な機能を持った簡易的なPWA(Progressive Web Apps)対応サイトをフレームワークなどを使わず素のJavaScriptで作ってみたいと思います。 主に、スマホのホーム画面からアプリのように起動したり、サービスワーカーを使ってオフライン対応や表示の高速化などを試していきましょう。 誰でも今すぐ実践できる内容なので、PWAに興味がある方はぜひ参考にしてみてください! ■開発環境について 早速プログラミングを始めたいところなのですが、その前に1つ注意点があります。 オフライン対応やキャッシュによる高速化を実現するには「サービスワーカー」を利用するのですが、これにはSSL対応のサーバー環境が必要になります。 すでに環境が整っている方は問題ありませんが、そうでない方やサーバーを用意するのが面倒だという方はオンラインコードエデ

    PWA入門!JavaScriptで簡単に高速化&オフライン対応のWebサイト制作チュートリアル! - paiza times
  • 2017年、新規にJavaScriptを書くならどんな設計をするか|デロイト トーマツ ウェブサービス株式会社(DWS)公式ブログ

    この記事はJavaScript Advent Calendar 2016の記事です。 今回は、2017年、新規にJavaScriptを書くならどんな設計をするか、というテーマで書いてみようと思います。2017年といっても、しばらくはこんな感じのアーキテクチャでやってきましたので、どんな構成でJavaScriptを設計してきたかという方が正しいかもしれません。基的にはSPAをベースとしています。 また、最新のイケてる技術バリバリ使ってやるぜ、というよりは、堅牢で、はやりが変わってもメンテができるということを意識してみました。 DOMのレンダリング Virtual DOMを代表とした、DOMのレンダリングを行うライブラリをなにか採用します。特に理由がなければReactでいいと思います。Virtual DOMではありませんが、AngularでもDOM管理においてはさほど違いはありません。この2

  • 俺のReduxがフレームワークなわけがない - Qiita

    今回は、いかにReduxがフレームワークではなくライブラリであるか、 というのを感じてもらう内容になっています。 Reduxは大変? 皆さんReduxに興味はありますか? Reduxの記事を読んでみたり、実際に試したことがある人は 「たくさん覚えるものがある」 「結構難しい」 「React使わないといけないし使い方が限定される」 そんな印象を受けたんじゃないでしょうか。 私は仕事React+Reduxを使っているんですが、なかなか難しいなぁと感じています。 ES2015、ReactWebpack、Babel、そのほかのReduxをサポートする様々なライブラリ・・・ 多くのものが合わさった結果、「Reduxは大変だ」という印象を抱くに至りました。 Reduxはすごく小さい 余計なものが多くあるせいで複雑に感じるRedux。 ですが、Reduxだけでコードを書くと、こんな風になります。 b

    俺のReduxがフレームワークなわけがない - Qiita
  • React,Angularに挫折した人たちへ - Qiita

    概要 フロントエンド(CSSテク,DOMの概念など)にそこまで明るくない人向けに JSだけでWeb画面が作れるようにフレームワーク(mofron)を作成しました。 React,Angular的な話は出てきません。 経緯 jQueryプラグインしんどい 親切な誰かが作ってくれた様々なjQueryプラグインをありがたく活用しています。 CSSなどを知らなくても優れたデザインと機能を持ったUI部品を構築できて非常に助かっています。 ただ、セレクタ(id名やらclass名やら)がとても面倒くさいです。。 HTML側で定義したid名などをJS側で一致させるように指定する必要があります。 動的にタグを生成したりすると、もっとややこしくなってきて手に負えません。 じゃReact,Angularに乗り換えましょうか?? 専業タイプと兼業タイプ Web開発に携わる人には専業タイプと兼業タイプがいると思ってい

    React,Angularに挫折した人たちへ - Qiita
  • XMLHttpRequestオブジェクトを使った非同期通信を行う

    XMLHttpRequest オブジェクトを使用することで Ajax を使った非同期通信を行うことができます。ここでは Ajax による非同期通信を行うために XMLHttpRequest オブジェクトの作成し、サーバへリクエストを送信したあと、サーバからレスポンスを受信するまでの方法について解説します。

    XMLHttpRequestオブジェクトを使った非同期通信を行う
  • Jasmine: Javascript Testing Framework

    describe("Jasmine", function() { it("makes testing JavaScript awesome!", function() { expect(yourCode).toBeLotsBetter(); }); }); Documentation User Guide Release Notes API Documentation Contributor Guide Download For pure JavaScript projects: VersionSizeDateSHA1

  • サイボウズで学んだこと - IT戦記

    はじめに 2010 年 9 月 15 日を持ちまして、サイボウズ・ラボを退職いたしたました。 報告も兼ねて、久しぶりにブログを書いてみたいと思います。 (写真はゆうすけべーさんです) この会社に入って、たくさんの学びと思い出がありました。 その一つ一つをまとめていければ、素晴らしい記事になるのかもしれませんが、僕は文章が苦手です。 ですので、うまく退職のエントリを書き上げることができません。 言葉にできない。そんな感じです。 なので、このエントリはサイボウズ・ラボやサイボウズ社の仲間たちへのありがとうの気持ちをこめて、自分らしく最後まで JavaScript のことを書きたいと思います。 サイボウズでの最後の仕事 僕にとって、サイボウズでの最後の仕事は「JavaScript で新しいユーザーインタフェースを作ること」でした。 そして、その中で始めて複数人による大規模な JavaScrip

    サイボウズで学んだこと - IT戦記
  • JavaScript変態文法最速マスター - 葉っぱ日記

    Java変態文法最速マスター - プログラマーの脳みそをリスペクト。 JavaScriptの変態文法・技法一覧です。あんまり使わないけど、知ってるとXSSとか攻撃したいのにWAFに妨害されるなど、いろいろ制約があるという場合に便利。 文字列の生成 引用符を使わずにさくっと文字列を作る。fromCharCode とか使ってもいいけどめんどくさいので、正規表現やE4Xを利用。 alert( /string/.source ); alert( <>string</> ) 空白文字を使わず記述 文脈上、スペースを書きたいけれどいろいろ制約があって書けない場合にはコメントで代替。実行するコードを作り上げてevalしてもいいけど大袈裟なので。 var/**/x=1; */ を含むコードブロックをコメントアウト コードの塊りをコメントアウトしようと思って /* */ で囲むと、コード内に string.

    JavaScript変態文法最速マスター - 葉っぱ日記
  • JavaScript でくるくる CAPTCHA を実装してみる - IT戦記

    あっきーパパが Google の新しい CATCHA の論文を紹介してたので グルグル回すグーグルの新CAPTCHA特許 | 秋元@サイボウズラボ・プログラマー・ブログ 脊髄反射で作ってみた (UI の部分だけですが;;;) http://amachang.sakura.ne.jp/misc/kurukuru/(IE では動きません) jQuery UI と canvas を使ってます。初めて使いましたが、いいですね、 jQuery UI。 (追記)せっかくなのでソースコードの解説 // 初期値の設定 // prev_value は最後に設定された値の保持用 last_value のほうが良かったかも var start_value = Math.PI, prev_value = start_value; // 回転用イメージオブジェクト var img = new Image; // i

    JavaScript でくるくる CAPTCHA を実装してみる - IT戦記
  • S2ファクトリー | Web/アプリ/システム/デザイン/ディレクション

    S2ファクトリーは、様々な分野のスペシャリストが集まり、Webサイトやスマートフォンアプリの企画・設計から制作、システム開発、インフラ構築・運用、デザイン・ディレクションなど、様々な業務を行っています。制作・運用に必要なすべての工程をワンストップ・ワンチームで提供します。また、ご要望に応じて、システム開発やフロントエンドエンジニアリング、アートディレクション・デザイン、プロジェクトマネージメントのみのプロジェクト参加も行っています。

    S2ファクトリー | Web/アプリ/システム/デザイン/ディレクション
  • suggest.js - 入力補完ライブラリ

    Japanese / English JavaScriptで入力補完を手軽に行うためのライブラリです。 (【お知らせ】ver2.0からprototype.jsを必要としなくなりました) 下記のような機能を持っています。 入力内容をもとに検索を行い、補完候補を表示します。(Google Suggestぽく) Ajaxでは無く、初回画面表示時のみデータの読み込みを行い、それ以降は、クライアント側で対象データから検索します。したがって、入力内容に変化があってもサーバ側にアクセスすることはありません。 検索は、前方一致/部分一致、大文字と小文字の区別あり/なしといったように、オプションで簡単に指定できます。また、その他にも様々なオプションが指定可能です。 検索結果の表示上限を指定できます。(デフォルト上限20件) 補完候補はキーボードの上下と、マウスにて選択できます。また、キーボードで選択中にES

    showyou
    showyou 2009/01/04
    これはよさげ
  • jQueryサンプル集 | DesignWalker

    jQueryサンプル集 | DesignWalker
  • http://youmos.com/news/helpbaloon_js

  • Balloon Tooltip

    Licensing This script is distributed under the LGPL open source license. Commercial licenses are also available. Some of these licenses also includes personal e-mail support for up to 1 year. Download script You can download the script from this Zip file Implementation On the words that should have tooltip, insert a tag like this: <a href="#" onmousemove="showToolTip(event,'This is a simple, simpl

    showyou
    showyou 2009/01/01
    バルーン表示
  • はてなスターをブログに設置するには - はてなスター日記

    はてなスターは、はてなダイアリー、はてなグループでは自動的に表示されますが、それ以外のブログサービスでも、利用していただくことが可能です。ここでは、その方法と、はてなスターの仕組みについて解説します。 はてなスターでは、JavaScriptを利用しています。はてなスターの提供するJavaScriptファイルをご自分のブログのページ内で読み込むことで、ページの読み込み完了とともにそのJavaScriptが実行されます。JavaScriptでは、そのページに存在する記事とPermalink(記事ごとの固有のURL)を検出し、その記事につけられたスターの数をはてなスターのサーバに問い合わせます。そして、その結果と、星を追加する「Addボタン」ボタンをページ内に埋め込みます。 「Addボタン」が押された際にも、はてなスターのサーバに問い合わせが行われ、スターの情報が保存されます。 スターの数の表示

    はてなスターをブログに設置するには - はてなスター日記
  • Drag & Drop | Diaspar Journal

    丸亀製麺は、全国に820店舗以上を展開するうどんのチェーン店です。店内で製麺を行っているため、打ち立ての美味しいうどんをいただくことができます。 注文まで列に並んでいくスタイルですので、何を頼もうか考えている間に自分の番がきて焦っちゃうなんてことも・・ 別のせのてんぷらやおにぎりも美味しいですよね! 丸亀製麺で一番お得なクレジットカードは、dカード・dカード GOLDです。d払いを利用することで、ポイントの3重どりができ2.0%還元を実現できます。 丸亀製麺では、クレジットカードや、電子マネー、バーコード・QRコード決済など多くのキャッシュレス決済を支払いで利用することができます。クレジットカード キャンペーンも活用するとさらにお得になることもあります。 丸亀製麺の支払いで利用できる決済方法クレジットカードVISA・Mastercard・JCB・ダイナースクラブカード・AMEXバーコード

    Drag & Drop | Diaspar Journal
  • 1