EC2 に構築したサーバーから Github にアクセスしてデプロイをする少し前から node.js とか socket.io を使ったアプリケーションのテスト作成をしています。 これまでは、ローカル環境に docker コンテナを作成して、localホストに向けて実装とテストを行っていたのですが、コードが少しまとまってきたので外部に立てたサーバー上にデプロイしたくなりました。
Google Maps API: たくさんの経由地点を含めてルート検索する - Qiita
Google Maps APIにはDirectionsServiceというルート検索用のオブジェクトが用意されていて、出発地と目的地を指定してルート検索を行うことができます。 この文書では、途中の経由地点(中継地点)を指定してルート検索する簡単な方法と、たくさんの経由地点が必要な場合の方法を説明します。 簡単な方法 (経由地点の数が8以下の場合) DirectionsServiceのルート検索では、途中の経由地点(中継地点)を「waypoints」として指定することができます。 (下記では出発地(origin), 目的地(destination), 経由地点(waypoints)とも緯度経度(LatLng)で指定していますが、「東京駅」などの文字列でも指定できます) <!DOCTYPE html> <html> <head><style>html, body, #map { width:
Canvasで描画した画像を送信してサーバに保存する - Qiita
タイトルどおりのことをやった際の実装時メモ。 Canvasから画像を取得 2通りの方法が見つかった。 Base64への変換 Blobへの変換 Base64への変換 canvas.toDataURL()を呼び出すだけで取得可能であるが、 画像サイズに比例した巨大な文字列となり、変換によって元サイズより33%データ量が増える。 取得したBase64を<image>のsrcに指定すれば画像表示され、 <a>のhrefに指定すればリンククリックでダウンロードできてこれはこれで便利。 Blobへの変換 canvas.toBlob()を呼び出すだけで取得可能。 Blob形式で表現すれば、createObjectURL(blob)によりURL参照が取得できるので、 画像サイズに依存せずメモリ使用量を抑えられるらしい。（未確認) これは便利と思いきやcanvas.toBlob()はFirefoxでのみサポ
Lighthouse - Chrome Web Store
Lighthouse is an open-source, automated tool for improving the performance, quality, and correctness of your web apps. Lighthouse is an open-source, automated tool for improving the performance, quality, and correctness of your web apps. When auditing a page, Lighthouse runs a barrage of tests against the page, and then generates a report on how well the page did. From here you can use the failing
無料で試せるフォーム作成ツールならformrun(フォームラン)
フォームの作りやすさはもちろんのこと、ステータスの管理画面が使いやすいのがformrunにした決め手です。
PWA入門！JavaScriptで簡単に高速化＆オフライン対応のWebサイト制作チュートリアル！ - paiza times
どうも、まさとらん（@0310lan）です！ 今回は、基本的な機能を持った簡易的なPWA（Progressive Web Apps）対応サイトをフレームワークなどを使わず素のJavaScriptで作ってみたいと思います。 主に、スマホのホーム画面からアプリのように起動したり、サービスワーカーを使ってオフライン対応や表示の高速化などを試していきましょう。 誰でも今すぐ実践できる内容なので、PWAに興味がある方はぜひ参考にしてみてください！ ■開発環境について 早速プログラミングを始めたいところなのですが、その前に1つ注意点があります。 オフライン対応やキャッシュによる高速化を実現するには「サービスワーカー」を利用するのですが、これにはSSL対応のサーバー環境が必要になります。 すでに環境が整っている方は問題ありませんが、そうでない方やサーバーを用意するのが面倒だという方はオンラインコードエデ
某サイトに見る狂ったjQueryのソースと高速化・改善方法
自宅の光回線が遅すぎて乗り換えを検討していた矢先、Ymobileのキャンペーンページがやけにもっさりしているので、思わずソースを覗いてしまった。一流企業のソースはさぞかしモダンなのだろうと思ったら、jQueryで鬼のDOMいじり。思わず閉口してしまったので同じ轍を踏まないために改善方法を考えます。 経緯 我が家で契約しているSo-net光という回線が常時1Mbps/s以下という稀に見るクソっぷりなので、違約金を払ってでも回線を変更したいと考えていました。 まずなぜSo-net光にしたかと言うと、全ての業者と契約パターンの中で、最も運用費が安かったからです。キャッシュバックが56,000円・月額費用が2,800円・初月無料だったので21ヶ月使ってようやく料金が発生し始めるという計算です。ちなみに違約金は3万円ほどになる予定です。 そこで乗り換え違約金全額キャッシュバックのSoftBank光に
Webサイト・PDF内全文検索システム｜Quick Search
Quick Searchの全てのサービスを 2023年10月15日 をもって終了することとなりました。 長い間ご利用いただき、誠にありがとうございました。お客様のご愛顧に心より感謝いたします。 せっかくホームページに訪問してくれたのにコンテンツが多く、なかなか欲しい情報がみつけにくい。添付資料としてPDFをウェブに掲載する事が多いが、PDF内を検索できないので困っている。さらに、WordPress等のCMSに標準搭載されているキーワード検索ではPDF内のテキスト情報を検索する事ができません。Quick SearchはPDF内の文字列を検索できます。しかもデータベースを別途用意する必要はありません。
Digital Engagement | Twilio Flex
Products Communications Messaging Send and receive multichannel text and media messages in 180+ countries
【AMP】Googleが推進するAMPとは？概要と対応方法まとめ
突然ですが、最近スマホで検索をした時にたまにカミナリ⚡マークが付いたページが表示されるのをご存知でしょうか？ 赤い枠で囲っているリンクにはカミナリのマークがついています。このようなリンクはAMP HTMLで構築されたWebページに遷移します。 リンクをタップして見てみると、非常にシンプルな見た目のコンテンツが表示されます。 これらは「AMP(Accelerated Mobile Pages)」という、Googleが推進しているモバイルページを高速に表示させるための手法によって作成されているコンテンツです。 「最近よく聞くけど、AMPってなんなの？」と疑問をお持ちの方も多いのではないかと思います。 SEO界隈で何かと話題のAMPについて、概要から対応方法までまとめてみました。 AMPのメリットや設定方法について、こちらの動画でもわかりやすく解説しています。 記事とあわせてぜひご覧ください。
WebAPIを叩く(curl) - Qiita
概要 WebApiをcurlを利用して実行する方法をまとめてみました。 Qiita Api v2を利用します。 認証しないと実行できない機能があるので、ユーザの管理画面から個人用AccessTokenを発行してtokenを取得しといてください。 やることは、WebAPIを叩く(file_get_contents)と同じです Getメソッドの実行 GETメソッドで、データを取得 指定した、タグに紐づいた投稿を取得するsample <?php $base_url = 'https://qiita.com'; $tag = 'PHP'; $curl = curl_init(); curl_setopt($curl, CURLOPT_URL, $base_url.'/api/v2/tags/'.$tag.'/items'); curl_setopt($curl, CURLOPT_CUSTOMREQ
PHPのcurlでPOST - Qiita
$POST_DATA = array( 'foo' => 'bar' ); $curl=curl_init("URL"); curl_setopt($curl,CURLOPT_POST, TRUE); // ↓はmultipartリクエストを許可していないサーバの場合はダメっぽいです // @DrunkenDad_KOBAさん、Thanks //curl_setopt($curl,CURLOPT_POSTFIELDS, $POST_DATA); curl_setopt($curl, CURLOPT_POSTFIELDS, http_build_query($POST_DATA)); curl_setopt($curl,CURLOPT_SSL_VERIFYPEER, FALSE); // オレオレ証明書対策 curl_setopt($curl,CURLOPT_SSL_VERIFYHOST,
【jQuery】追加した文字列にWebフォントを適用する
JSで追加した文字列にはWebフォントが効かない JSONから呼出したテキストを表示させたら、フォントがおかしくなってしまいました。 ページ読み込み時に存在している文字列だけ、フォントを取得する仕組みのためです。 解決するためにはWebフォントサービスが提供しているAPIを利用します。 今回はFONTPLUSを利用していたので下記のようにしました。 サンプル $.ajax({ url: 'sample.json', }) .done(function (data) { // JSON整形処理 FONTPLUS.reload(); //フォントの再読込み }); TypeSquareの場合は7行目を Ts.reload(); で出来るようです。 Typekitは未確認ですが Typekit.load(); で出来そうです。
box-shadowはもう古い？CSS新時代の「影の落とし方」
長い間Webデザイナーが愛してやまないものの1つに*「box-shadow（ボックスシャドウ）」*があります。 Photoshopのような特殊なソフトウェアを使わなくとも、コードだけで影を落とすことができるという点で、Webデザイナーの中で大変重宝されていたプロパティです。 box-shadowの歴史は長く、2005年時点でW3C内でbox-shadowの草案が発表されました。影を落とす時に、影の長さや角度、色や透明度まで指定することができるので、この技術が登場した当初は感動した方も多いのではないのでしょうか。 しかしながら、box-shadowを使った影の落とし方は、登場から10年以上経過した現在、その使い所を考えていく必要があります。それはブラウザが様々なプロパティをサポートしたことが理由であり、影の落とし方を再考してみるのも大切です。 そこで本稿では、CSS新時代の影の落とし方につい
mailコマンドでメールを読む
linxを操作していれば必ず発生しているのが You have mail in /var/spool/mail/root です。 メッセージの通り/var/spool/mail/root とにあり、アカウント毎にファイルが作成されています。 たまりすぎたメールを削除するのはそのファイルを削除すればOKです。 新たにメールを受信すれば、新しくファイルが作成されます。 今回は中身を簡単に確認するmailコマンドの使用方法です。 ## テストメールを送信 [root@localhost neko]# echo "body" | mail -s subject root ## mailを起動 [root@localhost neko]# mail Heirloom Mail version 12.4 7/29/08. Type ? for help. "/var/spool/mail/root":
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Convert HTML to PDF online with PDFShift's lightning-fast and powerful API
Healthpoint • Find up-to-date information about providers, referral expectations, services offered and common treatments
AI search that understands
apacheユーザーが git clone をするまでの手順 - Qiita
Bitbucket