JAMstackってなに？実践に学ぶ高速表示を実現するアーキテクチャの構成 - エンジニアHub｜Webエンジニアのキャリアを考える！
JAMstackってなに？実践に学ぶ高速表示を実現するアーキテクチャの構成 JAMstackは、「JavaScript」「APIs」「Markup」の3つの技術を組み合わせた、新しいWebアプリケーションアーキテクチャです。いち早くJAMstackを利用してWebサイトを作成した、寺川直宏さんと風間雅也さんにJAMstackについて聞きました。 JAMstackという言葉をご存知でしょうか。JAMstackは、「JavaScript」「APIs」「Markup」という3つの技術を組み合わせた、新しいWebアプリケーションアーキテクチャです。パフォーマンスの改善、セキュリティの担保、スケーラビリティの確保が見込めるため、フロントエンド界隈で、大きな注目を集めています。 しかしまだ登場したばかりの概念ゆえ、実例も少なく、理解しにくい面もあります。そこで、いち早くJAMstackでWebサイトを
【個人開発】 技術書籍のレビューや「読みたい」を記録するサービスを作った - Qiita
サービス紹介 今年はお正月休みに何かテーマを決めて開発しようと思い、技術書籍のレビューサイトを作りました。 とはいえ実際に開発を始めてみたら大幅にお休みの期間をはみ出してしまい、毎日仕事の後に少しずつ進めていってやっとリリース出来るところまでたどり着いた形です。 techbooks - 素晴らしい技術に、出会おう。 techbooksといって、人気の技術書籍を集めた一覧からタグで検索したり「読んだ」書籍の感想を書いたり「読みたい」書籍をまとめたりすることが出来ます。 また、タグや書籍は人気順にソートされているので人気のジャンルやその書籍が簡単にわかるようになっています。現在3000冊以上掲載中です。 読んだ技術書の記録を残しておけるようなサービスが欲しいと思っていたので作りました。 ここでは利用している技術スタックや開発中に感じたことなどまとめてみようと思います。 開発に要した期間 サービ
2018年のフロントエンドエンジニアならこの程度は知ってて当然だよな？ - Qiita
可及的速やかにReactが絶滅しますように。 以下はFront-End Developer Handbook 2018の第三部、Front-end Developer Toolsからリンクされているツールと、その簡単な紹介です。 ドキュメントツール 開発者向けドキュメント、APIリファレンス Dash 200以上のAPIリファレンス、100以上のチートシートを一括ダウンロードできる。有料、Mac用。 DevDocs 200以上のライブラリをオンラインで検索できる。無料。 Velocity 中身はDashと同じ。有料、Windows用。 Zeal Windows、Linux、MacOS用各種揃っている無料のオフラインドキュメント。 チートシート devhints.io JavaScript、CSS、Go、vim等のショートカット、書式などチートシート。字が薄くて見辛い。 SEOツール Key
ReduxでAPIから取得したデータを保持するのが嫌になったのでaxiosで保持してみた - Qiita
ReduxのGlobalStateでAPIのデータを保持するか否か Reduxではredux-thunkやredux-sagaを用いてaction内でAPIリクエストした結果をGlobalStateに保持するのがお約束になっていますが、そもそも action作成 ↓ reducerにcase追加 ↓ containerのmapStateToPropsで受け取る というプロセスが非常にめんどくさい。 しかもGlobalStateにAPIデータが保持されているかどうかで分岐もさせないといけない。 それならaxiosのPromiseをキャッシュしておいて、2度目以降同じaxios.getリクエストをした場合にそのキャッシュを返せばいんじゃね？ ということでaxios.getをキャッシュする仕組みを作ってみました。 注意点として、この中でキャッシュと呼んでいるものは永続的なものでなくリロードすると
Sign-in on the Web — Credential Management API and Best Practices
This is a recollection of my part of the talk at Chrome Dev Summit 2016 titled “Sign-in on the Web — Credential Management and Best Practices”. Check the video for my colleague Sabine Borsay taking the first half of the talk describing the unique challenges we face on the web when personalizing user’s experience through sign-ins. Unlike native apps, the web needs considerations for different attac
【GAS】Execution APIを使ってJavaScriptからGASにアクセスする - Qiita
GAS側のスクリプトを用意する https://script.google.com から独立したスクリプトファイルを新規作成します。ファイル名は何でもかまいません。 公式サイトで紹介されているコードをそのままコピペし、保存します。 function getFoldersUnderRoot() { var root = DriveApp.getRootFolder(); var folders = root.getFolders(); var folderSet = {}; while (folders.hasNext()) { var folder = folders.next(); folderSet[folder.getId()] = folder.getName(); } return folderSet; } グーグルドライブのルートディレクトリに作成されたフォルダ名をすべて返す関
フロントエンドエンジニアが暇なときにやると良いかもしれないこと - Qiita
（ゆるいスキルアップ的な意味で）フロントエンドエンジニアが暇なときにやると良いかもしれないこと。 主観です。「これが良いよ！」というのがありましたら、ぜひ教えて下さい🙇 W3Cを読む whatwgを眺める。 ↑のissueを見る MDNを読む JavaScript CSS Web API NodeのAPIを読む caniuseを見る npmパッケージを眺める starが多い順 パッケージ一覧 ↑で１位のexpressが使っているパッケージ スライドを読む node学園 React.js Meetup Mediumを読む JavaScriptタグの記事 FrontEndタグの記事 Twitterで著名人をフォローする TBD @addyosmani @LeaVerou @paul_irish @BrendanEich Podcastを聞く Mozaic.fm Front-end Five
web audio lesson
web audio lesson lessons lesson 01 lesson 02 lesson 03 lesson 04 lesson 05 lesson 06 quizzes lesson 01 / answer lesson 02 / answer lesson 03 / answer lesson 04 / answer lesson 05 / answer
覚えておきたいDevToolsのコマンドラインAPIまとめ - Qiita
DevTools、使ってますか？ もはやChromeじゃないと開発できないくらいに飼い慣らされています。 ブレークポイントやconsole.logなど基本的な使い方から、TimelineとAuditsを使ってのパフォーマンス計測などなど、DevToolsのポテンシャルは計り知れません。 個人的にはConsole APIが好きなんですが、今回はConsoleパネルで使える Command Line API の使い方についてまとめてみました。 $_ $_には最後に評価した式の結果が保存されています。 Console上で計算を行なった場合や、$セレクタなどでDOMを検索した結果など、最後の結果が常に保存されます。 $0 〜 $4 $0から$4にはElementsパネルで選択した要素が5つ保存されています。$0が最後に選択した要素で数字が増えるごとに過去に選択した要素になります。 $0は特に使いや
Railsアプリでリアルタイムアップデートをサポートするmessage_bus - ワザノバ | wazanova
http://samsaffron.com/archive/2014/01/15/vintage-javascript-begone1 comment | 0 pointsDiscourseのSam Saffronが、Railsでリアルタイムアップデートするためのmessage_bus gemを紹介しています。 The Problem ユーザが最新のバージョンにバンドルしているJavaScriptとCSSを読込んでなくて、古いバージョンいよる変なバグに遭遇する可能性がある。どうするか？ The message bus シングルページアプリでは、リアルタイムをサポートするなんらかのメッセージング busが求められるが、今回Rails向けに用意したmessage_busのコアは、クライアントでメッセージをpub/subできるシンプルなAPIを提供できることである。 # in ruby Mess
PeerJS - Simple peer-to-peer with WebRTC
The PeerJS library PeerJS simplifies WebRTC peer-to-peer data, video, and audio calls. PeerJS wraps the browser's WebRTC implementation to provide a complete, configurable, and easy-to-use peer-to-peer connection API. Equipped with nothing but an ID, a peer can create a P2P data or media stream connection to a remote peer. Downloads Setup Include the library with a script tag <script src="https://
#9 nodeのコンソールは便利なjsonビューア - KAYAC engineers' blog
クリスマスシーズンということでAdvent Calenderのシーズンですね。 唐突ですが、この時期カップルよりも「リア充爆発しろ」ってネガティブワードの方が、たとえそれが記号的に使われてたとしても、嫌やなーって思ってしまう@9reです。 お前のリアルは彼女つくることしかないんか。つまらんなぁって思いますし、やっぱり、 俺こないだこんなパッチ送ってん！とか、この技術凄いやろ！みたいな充実もあると思うねん(｀･ω･´)！ さて、変な前置きになりましたが、このエントリは tech.kayac.com Advent Calendar 2012 9日目の記事です(12/9 35時公開)。 テーマは「私の中のマイイノベーション 2012」 nodeのコンソールは便利なjsonビューア nodejsも普及したし、元々軽量なフォーマットっていうことでJSONのAPI結構多いですよね。 自分は普段Andr
SamurAI Codingのゲームルールを勝手に解説 - 西尾泰和のはてなダイアリー
SamurAI Codingは情報処理学会主催で行われる国際プログラミングコンテスト。9月28日にシンガポール予選、10月11日にシリコンバレー予選、24日に日本予選が行われる。 公式サイト: https://samuraicoding.org/ ゲームは簡潔に言えば「サムライと犬を動かして陣取りをするゲーム」で、その動かすアルゴリズムをGunbai Scriptっていうこのゲーム専用の言語で実装して提出する。だから「慣れた言語やライブラリが使えるかどうか」っていう点での有利不利はなく、同じスタートラインから「理解し、よいプログラムを作る」という力を競い合うことができる。 ちなみに10月22日がソースコードの提出期限。24日は対戦が行われる日なので勘違いしないように。 ゲームルール ここではざっくりとルールの概要を解説する。ざっくりとしか書かないので細かいことはオフィシャルのPDFを参考に
JSONP WebAPIを爆速で使いこなせるフレームワーク
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog Yahoo!デベロッパーネットワークの中野(@Hiraku)と申します。 「WebAPIの魅力を存分に宣伝せよ」という使命を受けまして、これから何度かTechblogを書くことになります。以後、お見知りおきを。 さて、Yahoo! JAPANが公開しているWeb APIはたくさんありますが、JSONPに対応しているものがいくつかあります。ショッピング、オークション、YOLP、震災関連情報などです。 JSONPについて詳しくは過去記事を見てください。 他の形式に比べると、サーバーを準備しなくてもブラウザーだけで動かすことができ、古いブラウザーでも動くという、JSONPにしかないメリットがあります。夢のような形式！なのです。 …そのは
jQAPI - Alternative jQuery Documentation Browser
This is a alternative interface to browse the Official jQuery Documentation. It was created to get out of your way of your development work - quickly find what you are looking for, easy on the eyes, and lightning fast. Just start typing and see for yourself! FeaturesContent is the same as in the Official jQuery DocumentationStatically rendered pages powered by Astro, so the initial loading time is
最速な JavaScript のリファレンスマニュアルサイトをつくった - tokuhirom's blog
JavaScript のリファレンスマニュアルといえば MDN(Mozilla Developers Network) が有名ですが、MDN の資料は探索がめんどくさいし、表示が遅いということで使い勝手がわるいという問題がありました。 そこで、jQuery のリファレンスマニュアルサイトとして有名な jqapi.com とおなじよような使い勝手のサイトがあったらいいのになーとおもいました。 なので、つくりました。 サイト自体はすべて static なデータで構成されているので、github からデータを取得すれば、イントラや自分のマシン内で閲覧することも可能となっています。 なお IE での動作確認はしていないので、うまくうごかない場合は pull-req してください。
YUI Doc: A New Tool for Generating JavaScript API Documentation
YUI Blog Development YUI Doc: A New Tool for Generating JavaScript API Documentation YUI Doc: A New Tool for Generating JavaScript API Documentation We're pleased today to release the first public version of YUI Doc, a python-based documentation tool that generates API documentation for JavaScript code. YUI Doc was developed by Adam Moore, one of the principal engineers on the YUI project since it
Developer's Guide - Google Chart API - Google Code
Discover the resources for adding interactive charts for browsers and mobile devices.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - paldepind/sync-promise: Compact synchronized promise implementation. Promises/A+ incompliant. Works inside IdexedDB transactions.
Secrets of Awesome JavaScript API Design